Congegni
/
libretime
mirror of https://github.com/libretime/libretime.git
7
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

CC-5765 : Fixing up history page to match UI/UX 

removing bootstrap datetimepicker, with better jQuery datetimepicker that matches UI.
This commit is contained in:
Naomi 2014-04-01 14:12:01 -04:00
parent 059c0d8507
commit 5a17294811
8 changed files with 20 additions and 1463 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
airtime_mvc/application/controllers/PlayouthistoryController.php
View File

@ -91,14 +91,11 @@ class PlayouthistoryController extends Zend_Controller_Action
$this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/TableTools-2.1.5/js/TableTools.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/TableTools-2.1.5/js/TableTools.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/timepicker/jquery.ui.timepicker.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $this->view->headScript()->appendFile($baseUrl.'js/timepicker/jquery.ui.timepicker.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/bootstrap-datetime/bootstrap-datetimepicker.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/airtime/buttons/buttons.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $this->view->headScript()->appendFile($baseUrl.'js/airtime/buttons/buttons.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/airtime/utilities/utilities.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $this->view->headScript()->appendFile($baseUrl.'js/airtime/utilities/utilities.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/airtime/playouthistory/historytable.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $this->view->headScript()->appendFile($baseUrl.'js/airtime/playouthistory/historytable.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headLink()->appendStylesheet($baseUrl.'css/bootstrap-datetimepicker.min.css?'.$CC_CONFIG['airtime_version']);
$this->view->headLink()->appendStylesheet($baseUrl.'js/datatables/plugin/TableTools-2.1.5/css/TableTools.css?'.$CC_CONFIG['airtime_version']); $this->view->headLink()->appendStylesheet($baseUrl.'js/datatables/plugin/TableTools-2.1.5/css/TableTools.css?'.$CC_CONFIG['airtime_version']);
$this->view->headLink()->appendStylesheet($baseUrl.'css/jquery.ui.timepicker.css?'.$CC_CONFIG['airtime_version']);
$this->view->headLink()->appendStylesheet($baseUrl.'css/playouthistory.css?'.$CC_CONFIG['airtime_version']); $this->view->headLink()->appendStylesheet($baseUrl.'css/playouthistory.css?'.$CC_CONFIG['airtime_version']);
$this->view->headLink()->appendStylesheet($baseUrl.'css/history_styles.css?'.$CC_CONFIG['airtime_version']); $this->view->headLink()->appendStylesheet($baseUrl.'css/history_styles.css?'.$CC_CONFIG['airtime_version']);
$this->view->headLink()->appendStylesheet($baseUrl.'css/jquery.contextMenu.css?'.$CC_CONFIG['airtime_version']); $this->view->headLink()->appendStylesheet($baseUrl.'css/jquery.contextMenu.css?'.$CC_CONFIG['airtime_version']);

3
airtime_mvc/application/forms/EditHistory.php
View File

@ -3,9 +3,6 @@
class Application_Form_EditHistory extends Zend_Form class Application_Form_EditHistory extends Zend_Form
{ {
const VALIDATE_DATETIME_FORMAT = 'yyyy-MM-dd HH:mm:ss'; const VALIDATE_DATETIME_FORMAT = 'yyyy-MM-dd HH:mm:ss';
//this is used by the javascript widget, unfortunately h/H is opposite from Zend.
const TIMEPICKER_DATETIME_FORMAT = 'yyyy-MM-dd hh:mm:ss';
const VALIDATE_DATE_FORMAT = 'yyyy-MM-dd'; const VALIDATE_DATE_FORMAT = 'yyyy-MM-dd';
const VALIDATE_TIME_FORMAT = 'HH:mm:ss'; const VALIDATE_TIME_FORMAT = 'HH:mm:ss';

8
airtime_mvc/application/forms/EditHistoryItem.php
View File

@ -26,8 +26,8 @@ class Application_Form_EditHistoryItem extends Application_Form_EditHistory
$starts->setValidators(array( $starts->setValidators(array(
new Zend_Validate_Date(self::VALIDATE_DATETIME_FORMAT) new Zend_Validate_Date(self::VALIDATE_DATETIME_FORMAT)
)); ));
$starts->setAttrib('class', self::TEXT_INPUT_CLASS." datepicker"); $starts->setAttrib('class', self::TEXT_INPUT_CLASS);
$starts->setAttrib('data-format', self::TIMEPICKER_DATETIME_FORMAT); //$starts->setAttrib('data-format', self::TIMEPICKER_DATETIME_FORMAT);
$starts->addFilter('StringTrim'); $starts->addFilter('StringTrim');
$starts->setLabel(_('Start Time')); $starts->setLabel(_('Start Time'));
$starts->setDecorators(array('ViewHelper')); $starts->setDecorators(array('ViewHelper'));
@ -38,8 +38,8 @@ class Application_Form_EditHistoryItem extends Application_Form_EditHistory
$ends->setValidators(array( $ends->setValidators(array(
new Zend_Validate_Date(self::VALIDATE_DATETIME_FORMAT) new Zend_Validate_Date(self::VALIDATE_DATETIME_FORMAT)
)); ));
$ends->setAttrib('class', self::TEXT_INPUT_CLASS." datepicker"); $ends->setAttrib('class', self::TEXT_INPUT_CLASS);
$ends->setAttrib('data-format', self::TIMEPICKER_DATETIME_FORMAT); //$ends->setAttrib('data-format', self::TIMEPICKER_DATETIME_FORMAT);
$ends->addFilter('StringTrim'); $ends->addFilter('StringTrim');
$ends->setLabel(_('End Time')); $ends->setLabel(_('End Time'));
$ends->setDecorators(array('ViewHelper')); $ends->setDecorators(array('ViewHelper'));

9
airtime_mvc/application/views/scripts/form/edit-history-item.phtml
View File

@ -22,14 +22,7 @@
<label for="<?php echo $name;?>"><?php echo $form->getElement($name)->getLabel() ?></label> <label for="<?php echo $name;?>"><?php echo $form->getElement($name)->getLabel() ?></label>
</dt> </dt>
<dd id="<?php echo $name;?>-element"> <dd id="<?php echo $name;?>-element">
<div class="well"> <?php echo $form->getElement($name) ?>
<div id="<?php echo $name;?>_datetimepicker" class="input-append date">
<?php echo $form->getElement($name) ?>
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
</span>
</div>
</div>
<?php if ($form->getElement($name)->hasErrors()) : ?> <?php if ($form->getElement($name)->hasErrors()) : ?>
<ul class='errors'> <ul class='errors'>
<?php foreach ($form->getElement($name)->getMessages() as $error): ?> <?php foreach ($form->getElement($name)->getMessages() as $error): ?>

8
airtime_mvc/public/css/bootstrap-datetimepicker.min.css vendored
View File

File diff suppressed because one or more lines are too long

72
airtime_mvc/public/css/jquery.ui.timepicker.css vendored
View File

@ -1,72 +0,0 @@
/*
* Timepicker stylesheet
* Highly inspired from datepicker
* FG - Nov 2010 - Web3R
*
* version 0.0.3 : Fixed some settings, more dynamic
* version 0.0.4 : Removed width:100% on tables
* version 0.1.1 : set width 0 on tables to fix an ie6 bug
*/
.ui-timepicker-inline { display: inline; }
#ui-timepicker-div {
padding: 0.2em;
z-index: 1000;
}
.ui-timepicker-table { display: inline-table; width: 0; }
.ui-timepicker-table table { margin:0.15em 0 0 0; border-collapse: collapse; }
.ui-timepicker-hours, .ui-timepicker-minutes { padding: 0.2em; }
.ui-timepicker-table .ui-timepicker-title { line-height: 1.8em; text-align: center; }
.ui-timepicker-table td { padding: 0.1em; width: 2.2em; }
.ui-timepicker-table th.periods { padding: 0.1em; width: 2.2em; }
/* span for disabled cells */
.ui-timepicker-table td span {
display:block;
padding:0.2em 0.3em 0.2em 0.5em;
width: 1.2em;
text-align:right;
text-decoration:none;
}
/* anchors for clickable cells */
.ui-timepicker-table td a {
display:block;
padding:0.2em 0.3em 0.2em 0.5em;
width: 1.2em;
cursor: pointer;
text-align:right;
text-decoration:none;
}
/* buttons and button pane styling */
.ui-timepicker .ui-timepicker-buttonpane {
background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0;
}
.ui-timepicker .ui-timepicker-buttonpane button { margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
/* The close button */
.ui-timepicker .ui-timepicker-close { float: right }
/* the now button */
.ui-timepicker .ui-timepicker-now { float: left; }
/* the deselect button */
.ui-timepicker .ui-timepicker-deselect { float: left; }
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-timepicker-cover {
display: none; /*sorry for IE5*/
display/**/: block; /*sorry for IE5*/
position: absolute; /*must have*/
z-index: -1; /*must have*/
filter: mask(); /*must have*/
top: -4px; /*must have*/
left: -4px; /*must have*/
width: 200px; /*must have*/
height: 200px; /*must have*/
}

35
airtime_mvc/public/js/airtime/playouthistory/historytable.js
View File

@ -8,8 +8,8 @@ var AIRTIME = (function(AIRTIME) {
var $historyContentDiv; var $historyContentDiv;
var historyStartsDatetimeId = "his_item_HISTORY_ITEM_STARTS_datetimepicker"; var historyStartsDatetimeId = "his_item_HISTORY_ITEM_STARTS";
var historyEndsDatetimeId = "his_item_HISTORY_ITEM_ENDS_datetimepicker"; var historyEndsDatetimeId = "his_item_HISTORY_ITEM_ENDS";
var oTableTools = { var oTableTools = {
"sSwfPath": baseUrl+"js/datatables/plugin/TableTools-2.1.5/swf/copy_csv_xls_pdf.swf", "sSwfPath": baseUrl+"js/datatables/plugin/TableTools-2.1.5/swf/copy_csv_xls_pdf.swf",
@ -285,7 +285,6 @@ var AIRTIME = (function(AIRTIME) {
createShowTable($div); createShowTable($div);
selectedLogItems = {}; selectedLogItems = {};
} }
//changestart: function( event, ui ) {}
}); });
} }
@ -353,7 +352,6 @@ var AIRTIME = (function(AIRTIME) {
"sDom": sDom, "sDom": sDom,
"oTableTools": oTableTools "oTableTools": oTableTools
}); });
oTable.fnSetFilteringDelay(350);
return oTable; return oTable;
} }
@ -420,7 +418,6 @@ var AIRTIME = (function(AIRTIME) {
"sDom": sDom, "sDom": sDom,
"oTableTools": oTableTools "oTableTools": oTableTools
}); });
oTable.fnSetFilteringDelay(350);
$toolbar = $historyTableDiv.parents(".dataTables_wrapper").find(".fg-toolbar:first"); $toolbar = $historyTableDiv.parents(".dataTables_wrapper").find(".fg-toolbar:first");
createToolbarButtons($toolbar); createToolbarButtons($toolbar);
@ -494,14 +491,6 @@ var AIRTIME = (function(AIRTIME) {
} }
]; ];
//set the locale names for the bootstrap calendar.
$.fn.datetimepicker.dates = {
daysMin: i18n_days_short,
months: i18n_months,
monthsShort: i18n_months_short
};
$historyContentDiv = $("#history_content"); $historyContentDiv = $("#history_content");
function redrawTables() { function redrawTables() {
@ -519,15 +508,21 @@ var AIRTIME = (function(AIRTIME) {
var $startPicker = $hisDialogEl.find('#'+historyStartsDatetimeId), var $startPicker = $hisDialogEl.find('#'+historyStartsDatetimeId),
$endPicker = $hisDialogEl.find('#'+historyEndsDatetimeId); $endPicker = $hisDialogEl.find('#'+historyEndsDatetimeId);
$startPicker.datetimepicker(); $startPicker.datetimepicker({
onSelect: function (selectedDateTime){
$endPicker.datetimepicker({ $endPicker.datetimepicker('option', 'minDate', $startPicker.datetimepicker('getDate') );
showTimeFirst: true $endPicker.val(selectedDateTime);
}
}); });
$startPicker.on('changeDate', function(e) { $endPicker.datetimepicker({
$endPicker.data('datetimepicker').setLocalDate(e.localDate); onSelect: function (selectedDateTime){
}); $startPicker.datetimepicker('option', 'maxDate', $endPicker.datetimepicker('getDate') );
}
});
//problem with date picker opening if it's already focused on opening.
$startPicker.blur();
} }
function processDialogHtml($el) { function processDialogHtml($el) {

1345
airtime_mvc/public/js/timepicker/jquery.ui.timepicker.js vendored
View File

File diff suppressed because it is too large Load Diff