Congegni
/
sintonia
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Some big performance optimizations to Now Playing JavaScript. 

* Big decrease in page load time
* Big decrease in load time during schedule operations (drag and drop)
This commit is contained in:
Albert Santoni 2015-04-10 22:53:39 -04:00
parent b11e98ea24
commit 1194a0f959
4 changed files with 79 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
airtime_mvc/application/controllers/PlaylistController.php
View File

@ -31,6 +31,8 @@ class PlaylistController extends Zend_Controller_Action
->addActionContext('empty-content', 'json') ->addActionContext('empty-content', 'json')
->initContext(); ->initContext();
//This controller writes to the session all over the place, so we're going to reopen it for writing here.
session_start(); //Reopen the session for writing
} }
private function getPlaylist($p_type) private function getPlaylist($p_type)

6
airtime_mvc/application/controllers/ShowbuilderController.php
View File

@ -158,7 +158,7 @@ class ShowbuilderController extends Zend_Controller_Action
//populate date range form for show builder. //populate date range form for show builder.
$now = time(); $now = time();
$from = $request->getParam("from", $now); $from = $request->getParam("from", $now);
$to = $request->getParam("to", $now + (24*60*60)); $to = $request->getParam("to", $now + (3*60*60));
$utcTimezone = new DateTimeZone("UTC"); $utcTimezone = new DateTimeZone("UTC");
$displayTimeZone = new DateTimeZone(Application_Model_Preference::GetTimezone()); $displayTimeZone = new DateTimeZone(Application_Model_Preference::GetTimezone());
@ -343,7 +343,8 @@ class ShowbuilderController extends Zend_Controller_Action
$request = $this->getRequest(); $request = $this->getRequest();
$selectedItems = $request->getParam("selectedItem"); $selectedItems = $request->getParam("selectedItem");
$afterItem = $request->getParam("afterItem"); $afterItem = $request->getParam("afterItem");
/*
$log_vars = array(); $log_vars = array();
$log_vars["url"] = $_SERVER['HTTP_HOST']; $log_vars["url"] = $_SERVER['HTTP_HOST'];
$log_vars["action"] = "showbuilder/schedule-move"; $log_vars["action"] = "showbuilder/schedule-move";
@ -351,6 +352,7 @@ class ShowbuilderController extends Zend_Controller_Action
$log_vars["params"]["selected_items"] = $selectedItems; $log_vars["params"]["selected_items"] = $selectedItems;
$log_vars["params"]["destination_after_item"] = $afterItem; $log_vars["params"]["destination_after_item"] = $afterItem;
Logging::info($log_vars); Logging::info($log_vars);
*/
try { try {
$scheduler = new Application_Model_Scheduler(); $scheduler = new Application_Model_Scheduler();

24
airtime_mvc/application/models/Scheduler.php
View File

@ -1011,10 +1011,10 @@ class Application_Model_Scheduler
*/ */
public function moveItem($selectedItems, $afterItems, $adjustSched = true) public function moveItem($selectedItems, $afterItems, $adjustSched = true)
{ {
$startProfile = microtime(true); //$startProfile = microtime(true);
$this->con->beginTransaction(); $this->con->beginTransaction();
$this->con->useDebug(true); //$this->con->useDebug(true);
try { try {
@ -1023,8 +1023,8 @@ class Application_Model_Scheduler
$this->validateRequest($afterItems); $this->validateRequest($afterItems);
$endProfile = microtime(true); $endProfile = microtime(true);
Logging::debug("validating move request took:"); //Logging::debug("validating move request took:");
Logging::debug(floatval($endProfile) - floatval($startProfile)); //Logging::debug(floatval($endProfile) - floatval($startProfile));
$afterInstance = CcShowInstancesQuery::create()->findPK($afterItems[0]["instance"], $this->con); $afterInstance = CcShowInstancesQuery::create()->findPK($afterItems[0]["instance"], $this->con);
@ -1065,18 +1065,18 @@ class Application_Model_Scheduler
$this->removeGaps($instance, $schedIds); $this->removeGaps($instance, $schedIds);
$endProfile = microtime(true); //$endProfile = microtime(true);
Logging::debug("removing gaps from instance $instance:"); //Logging::debug("removing gaps from instance $instance:");
Logging::debug(floatval($endProfile) - floatval($startProfile)); //Logging::debug(floatval($endProfile) - floatval($startProfile));
} }
$startProfile = microtime(true); //$startProfile = microtime(true);
$this->insertAfter($afterItems, null, $movedData, $adjustSched, true); $this->insertAfter($afterItems, null, $movedData, $adjustSched, true);
$endProfile = microtime(true); //$endProfile = microtime(true);
Logging::debug("inserting after removing gaps."); //Logging::debug("inserting after removing gaps.");
Logging::debug(floatval($endProfile) - floatval($startProfile)); //Logging::debug(floatval($endProfile) - floatval($startProfile));
$modified = array_keys($modifiedMap); $modified = array_keys($modifiedMap);
//need to adjust shows we have moved items from. //need to adjust shows we have moved items from.
@ -1086,7 +1086,7 @@ class Application_Model_Scheduler
$instance->updateScheduleStatus($this->con); $instance->updateScheduleStatus($this->con);
} }
$this->con->useDebug(false); //$this->con->useDebug(false);
$this->con->commit(); $this->con->commit();
Application_Model_RabbitMq::PushSchedule(); Application_Model_RabbitMq::PushSchedule();

95
airtime_mvc/public/js/airtime/showbuilder/builder.js
View File

@ -278,7 +278,8 @@ var AIRTIME = (function(AIRTIME){
oSchedTable.fnDraw(); oSchedTable.fnDraw();
mod.enableUI(); mod.enableUI();
$("#library_content").find("#library_display").dataTable().fnStandingRedraw(); //Unneccessary reload of the library pane after moving tracks in the showbuilder pane.
//$("#library_content").find("#library_display").dataTable().fnStandingRedraw();
}; };
mod.getSelectedCursors = function() { mod.getSelectedCursors = function() {
@ -319,7 +320,7 @@ var AIRTIME = (function(AIRTIME){
mod.fnMove = function(aSelect, aAfter) { mod.fnMove = function(aSelect, aAfter) {
mod.disableUI(); //mod.disableUI();
$.post(baseUrl+"showbuilder/schedule-move", $.post(baseUrl+"showbuilder/schedule-move",
{"format": "json", "selectedItem": aSelect, "afterItem": aAfter}, {"format": "json", "selectedItem": aSelect, "afterItem": aAfter},
@ -398,13 +399,20 @@ var AIRTIME = (function(AIRTIME){
$scroll.scrollTop(currentTop - scrollingTop + scrolled); $scroll.scrollTop(currentTop - scrollingTop + scrolled);
} }
mod.builderDataTable = function() { mod.builderDataTable = function() {
$sbContent = $('#show_builder'); $sbContent = $('#show_builder');
$lib = $("#library_content"), $lib = $("#library_content"),
$sbTable = $sbContent.find('table'); $sbTable = $sbContent.find('table');
var isInitialized = false; var isInitialized = false;
var emptyNode = document.createElement('div');
var lockedPreviewIcon = document.createElement('span');
lockedPreviewIcon.setAttribute('class', 'ui-icon ui-icon-locked');
var previewIcon = document.createElement('img');
previewIcon.setAttribute('src', baseUrl+'css/images/icon_audioclip.png');
previewIcon.setAttribute('title', $.i18n._("Track preview"));
oSchedTable = $sbTable.dataTable( { oSchedTable = $sbTable.dataTable( {
"aoColumns": [ "aoColumns": [
/* checkbox */ {"mDataProp": "allowed", "sTitle": "", "sWidth": "15px", "sClass": "sb-checkbox"}, /* checkbox */ {"mDataProp": "allowed", "sTitle": "", "sWidth": "15px", "sClass": "sb-checkbox"},
@ -429,6 +437,7 @@ var AIRTIME = (function(AIRTIME){
"bServerSide": true, "bServerSide": true,
"bInfo": false, "bInfo": false,
"bAutoWidth": false, "bAutoWidth": false,
"bDeferRender": true,
"bStateSave": true, "bStateSave": true,
"fnStateSaveParams": function (oSettings, oData) { "fnStateSaveParams": function (oSettings, oData) {
@ -494,8 +503,13 @@ var AIRTIME = (function(AIRTIME){
headerIcon; headerIcon;
fnPrepareSeparatorRow = function fnPrepareSeparatorRow(sRowContent, sClass, iNodeIndex) { fnPrepareSeparatorRow = function fnPrepareSeparatorRow(sRowContent, sClass, iNodeIndex) {
//Albert:
//$(nRow.children[iNodeIndex]).replaceWith(emptyNode);
$node = $(nRow.children[iNodeIndex]); $node = $(nRow.children[iNodeIndex]);
$node.html(sRowContent); $node.html(sRowContent);
$node.attr('colspan',100); $node.attr('colspan',100);
for (i = iNodeIndex + 1, length = nRow.children.length; i < length; i = i+1) { for (i = iNodeIndex + 1, length = nRow.children.length; i < length; i = i+1) {
$node = $(nRow.children[i]); $node = $(nRow.children[i]);
@ -504,6 +518,7 @@ var AIRTIME = (function(AIRTIME){
} }
$nRow.addClass(sClass); $nRow.addClass(sClass);
}; };
if (aData.header === true) { if (aData.header === true) {
@ -575,8 +590,9 @@ var AIRTIME = (function(AIRTIME){
//remove the column classes from all tds. //remove the column classes from all tds.
$nRow.find('td').removeClass(); $nRow.find('td').removeClass();
$node = $(nRow.children[0]); //$node = $(nRow.children[0]).replaceWith(emptyNode);;
$node.html(''); //$node.html('');
$node.empty();
sSeparatorHTML = '<span>'+$.i18n._("Show Empty")+'</span>'; sSeparatorHTML = '<span>'+$.i18n._("Show Empty")+'</span>';
cl = cl + " sb-empty odd"; cl = cl + " sb-empty odd";
@ -592,24 +608,32 @@ var AIRTIME = (function(AIRTIME){
sSeparatorHTML = '<span>'+$.i18n._("Recording From Line In")+'</span>'; sSeparatorHTML = '<span>'+$.i18n._("Recording From Line In")+'</span>';
cl = cl + " sb-record odd"; cl = cl + " sb-record odd";
fnPrepareSeparatorRow(sSeparatorHTML, cl, 1); fnPrepareSeparatorRow(sSeparatorHTML, cl, 1);
} }
else { else {
//add the play function if the file exists on disk. //add the play function if the file exists on disk.
$image = $nRow.find('td.sb-image'); $image = $nRow.find('td.sb-image');
$image.empty();
//check if the file exists. //check if the file exists.
if (aData.image === true) { if (aData.image === true) {
$nRow.addClass("lib-audio"); $nRow.addClass("lib-audio");
if (!isAudioSupported(aData.mime)) { if (!isAudioSupported(aData.mime)) {
$image.html('<span class="ui-icon ui-icon-locked"></span>'); //$image.html('<span class="ui-icon ui-icon-locked"></span>');
$image.append(lockedPreviewIcon);
} else { } else {
/*
$image.html('<img title="'+$.i18n._("Track preview")+'" src="'+baseUrl+'css/images/icon_audioclip.png"></img>') $image.html('<img title="'+$.i18n._("Track preview")+'" src="'+baseUrl+'css/images/icon_audioclip.png"></img>')
.click(function() { .click(function() {
open_show_preview(aData.instance, aData.pos); open_show_preview(aData.instance, aData.pos);
return false; return false;
});*/
$image.append(previewIcon.cloneNode(false));
$image.click(function() {
open_show_preview(aData.instance, aData.pos);
return false;
}); });
} }
} }
else { else {
@ -625,13 +649,13 @@ var AIRTIME = (function(AIRTIME){
hide: 'mouseout' hide: 'mouseout'
}); });
} }
$node = $(nRow.children[0]); $node = $(nRow.children[0]);
if (aData.allowed === true && aData.scheduled >= 1 && aData.linked_allowed) { if (aData.allowed === true && aData.scheduled >= 1 && aData.linked_allowed) {
$node.html('<input type="checkbox" name="'+aData.id+'"></input>'); $node.html('<input type="checkbox" name="'+aData.id+'"></input>');
} }
else { else {
$node.html(''); $node.empty();
} }
} }
@ -705,7 +729,6 @@ var AIRTIME = (function(AIRTIME){
$("#draggingContainer").remove(); $("#draggingContainer").remove();
}, },
"fnDrawCallback": function fnBuilderDrawCallback(oSettings, json) { "fnDrawCallback": function fnBuilderDrawCallback(oSettings, json) {
var isInitialized = false;
if (!isInitialized) { if (!isInitialized) {
//when coming to 'Now Playing' page we want the page //when coming to 'Now Playing' page we want the page
@ -730,7 +753,8 @@ var AIRTIME = (function(AIRTIME){
heights = []; heights = [];
clearTimeout(mod.timeout); clearTimeout(mod.timeout);
/*
//only create the cursor arrows if the library is on the page. //only create the cursor arrows if the library is on the page.
if ($lib.length > 0 && $lib.filter(":visible").length > 0) { if ($lib.length > 0 && $lib.filter(":visible").length > 0) {
@ -775,18 +799,18 @@ var AIRTIME = (function(AIRTIME){
$tr = $table.find("tr[id="+cursorIds[i]+"][si_id="+showInstanceIds[i]+"]"); $tr = $table.find("tr[id="+cursorIds[i]+"][si_id="+showInstanceIds[i]+"]");
} }
/* If the currently playing track's cursor is selected, //If the currently playing track's cursor is selected,
* and that track is deleted, the cursor position becomes //and that track is deleted, the cursor position becomes
* unavailble. We have to check the position is available //unavailble. We have to check the position is available
* before re-highlighting it. // before re-highlighting it.
*/ //
if ($tr.find(".sb-checkbox").children().hasClass("innerWrapper")) { if ($tr.find(".sb-checkbox").children().hasClass("innerWrapper")) {
mod.selectCursor($tr); mod.selectCursor($tr);
/* If the selected cursor is the footer row we need to // If the selected cursor is the footer row we need to
* explicitly select it because that row does not have //explicitly select it because that row does not have
* innerWrapper class // innerWrapper class
*/ //
} else if ($tr.hasClass("sb-footer")) { } else if ($tr.hasClass("sb-footer")) {
mod.selectCursor($tr); mod.selectCursor($tr);
} }
@ -801,6 +825,7 @@ var AIRTIME = (function(AIRTIME){
} }
$parent.append($table); $parent.append($table);
} }
//order of importance of elements for setting the next timeout. //order of importance of elements for setting the next timeout.
@ -825,7 +850,7 @@ var AIRTIME = (function(AIRTIME){
mod.timeout = setTimeout(function() {mod.refresh(aData.id)}, refreshInterval); //need refresh in milliseconds mod.timeout = setTimeout(function() {mod.refresh(aData.id)}, refreshInterval); //need refresh in milliseconds
break; break;
} }
} }*/
mod.checkToolBarIcons(); mod.checkToolBarIcons();
}, },
@ -957,9 +982,9 @@ var AIRTIME = (function(AIRTIME){
//item was reordered. //item was reordered.
else { else {
ui.item //ui.item
.empty() // .empty()
.after(draggingContainer.html()); // .after(draggingContainer.html());
aItemData.push(ui.item.data("aData")); aItemData.push(ui.item.data("aData"));
fnMove(); fnMove();
@ -968,9 +993,10 @@ var AIRTIME = (function(AIRTIME){
return { return {
placeholder: "sb-placeholder ui-state-highlight", placeholder: "sb-placeholder ui-state-highlight",
forcePlaceholderSize: true, //forcePlaceholderSize: true,
distance: 10, distance: 10,
helper: function(event, item) { helper:
function(event, item) {
var selected = mod.getSelectedData(NOW_PLAYING_CLASS), var selected = mod.getSelectedData(NOW_PLAYING_CLASS),
thead = $("#show_builder_table thead"), thead = $("#show_builder_table thead"),
colspan = thead.find("th").length, colspan = thead.find("th").length,
@ -985,23 +1011,24 @@ var AIRTIME = (function(AIRTIME){
} }
if (selected.length === 1) { if (selected.length === 1) {
message = $.i18n._("Moving 1 Item"); //message = $.i18n._("Moving 1 Item");
draggingContainer = item;
} }
else { else {
message = sprintf($.i18n._("Moving %s Items"), selected.length); message = sprintf($.i18n._("Moving %s Items"), selected.length);
} draggingContainer = $('<tr/>')
.addClass('sb-helper')
draggingContainer = $('<tr/>') .append('<td/>')
.addClass('sb-helper') .find("td")
.append('<td/>')
.find("td")
.attr("colspan", colspan) .attr("colspan", colspan)
.width(width) .width(width)
.height(height) .height(height)
.addClass("ui-state-highlight") .addClass("ui-state-highlight")
.append(message) .append(message)
.end(); .end();
}
helperData = selected; helperData = selected;
return draggingContainer; return draggingContainer;