Update for styles to use foundation to help align things better.
*/
public function toHtml($registry)
{
+ $GLOBALS['topScripts'][]
+ = MEDIA_BASE_URL . 'libjs/vendor/modernizr.js';
+ $GLOBALS['styleSheets'][]
+ = MEDIA_BASE_URL . 'css/foundation.css';
+ $GLOBALS['bottomScripts'][]
+ = MEDIA_BASE_URL . 'libjs/foundation.min.js';
$GLOBALS['styleSheets'][]
= GLM_APP_BASE_URL .
'libjs/jqueryui/1.8.13/development-bundle/themes/cupertino/jquery.ui.all.css';
{
/**
* toHtml
- *
+ *
* output the html for listing schedules
- *
+ *
* @param type $registry
- * @return type
+ * @return type
*/
public function toHtml($registry)
{
$GLOBALS['bottomScripts'][]
- = BASE_URL . 'Toolkit/Schedule/js/listSchedule.js';
+ = MEDIA_BASE_URL . 'Toolkit/Schedule/js/listSchedule.js';
+ $GLOBALS['topScripts'][]
+ = MEDIA_BASE_URL . 'libjs/vendor/modernizr.js';
+ $GLOBALS['styleSheets'][]
+ = MEDIA_BASE_URL . 'css/foundation.css';
+ $GLOBALS['bottomScripts'][]
+ = MEDIA_BASE_URL . 'libjs/foundation.min.js';
$tpl = new HTML_Template_Flexy($registry->flexyOptions);
$page = new stdClass();
$page->baseUrl = BASE_URL;
$page->editLinkUrlBase
- = BASE_URL . 'admin/schedules.php?rt=Edit&id=';
+ = MEDIA_BASE_URL . 'admin/schedules.php?rt=Edit&id=';
$whichActiveSql = "
SELECT id
FROM schedules
; the ending month to use in the multiple date picker
months.end = 12
; controls the width of the dialog box for the multiple date picker
-months.width = 500
+months.width = 540
; controls the height of the dialog box for the multiple date picker
months.height = 580
EditSchedule.setupDepartureById(departureId);
}
});
+ return false;
});
// set up removedepartureSet click event
$('.removeDepartureSet').live('click', function(){
var go = confirm('This will delete the entire Set!\nAre you sure?');
if (go) {
- $(this).parent().remove();
+ $(this).parent().parent().parent().parent().parent().remove();
$.ajax({
cache: false,
url: glm_baseUrl + "schedules/Edit/removeDepartureSet/",
$('.commentSave').live('click', function(){
var departureId = $(this).attr('rel');
var comments = $('#comments' + departureId).val();
-
+
$.ajax({
cache: false,
url: glm_baseUrl + "schedules/Edit/updateComment/",
$('.nameSave').live('click', function(){
var scheduleId = $(this).attr('rel');
var name = $('#scheduleNameText').val();
-
+
$.ajax({
cache: false,
url: glm_baseUrl + "schedules/Edit/updateName/",
"Edit Time": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
-
+
bValid = bValid && checkLength( depart_time, "Time", 4);
-
+
if (depart_time.val()) {
bValid = bValid && checkRegexp( depart_time, /([0-9]{1,2}:[0-9]{2} [APMapm]{2})$/i, "time in HH:MM AM or PM" );
}
$('.chxTime.addTime[rel="'+data.departure_id+'"]').before(
'<label class="timeLabel">' +
'<span rel="'+data.id+'" class="form-element">'+ data.time + '</span>' +
- '<span rel="'+data.id+'" class="ui-icon ui-icon-circle-minus"></span>' +
+ '<span rel="'+data.id+'" class="ui-icon ui-icon-circle-minus"></span>' +
'</label>'
);
} else if (data.dock == 2) {
$('.bviTime.addTime[rel="'+data.departure_id+'"]').before(
'<label class="timeLabel">' +
'<span rel="'+data.id+'" class="form-element">'+ data.time + '</span>' +
- '<span rel="'+data.id+'" class="ui-icon ui-icon-circle-minus"></span>' +
+ '<span rel="'+data.id+'" class="ui-icon ui-icon-circle-minus"></span>' +
'</label>'
);
}
}
});
}
-
+
$( this ).dialog( "close" );
}
},
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
-
+
},
// setup the departures by id
setupDepartureById: function(id){
}
});
});
-
+
$('#departureCal' + id).click(function(){
var ajaxUrl = glm_baseUrl + "schedules/Edit/getCalendarYear/";
var departureId = $(this).attr('rel');
var timeDate = new Date();
- ajaxUrl += "?id=" + glm_scheduleId
- + "&departId=" + id
+ ajaxUrl += "?id=" + glm_scheduleId
+ + "&departId=" + id
+ "&year=" + glm_scheduleYear
+ "&_=" + timeDate.getTime();
$('#departure' + departureId).load(ajaxUrl).dialog({
-<div class="row" flexy:foreach="departures,depart">
- <div class="colorDiv">
- <input id="color{depart[id]}" rel="{depart[id]}" name="color{depart[id]}" value="{depart[color]:h}" />
+<div class="row depSet" flexy:foreach="departures,depart">
+ <div class="row">
+ <div class="large-12 columns">
+ <div class="row collapse">
+ <div class="small-10 columns">
+ <div class="colorDiv">
+ <input id="color{depart[id]}"
+ rel="{depart[id]}"
+ name="color{depart[id]}"
+ value="{depart[color]:h}" />
+ </div>
+ <div class="departD">
+ Calendar Dates
+ <img id="departureCal{depart[id]}"
+ rel="{depart[id]}"
+ src="{appBase:h}assets/icons/calendar.png" />
+ <div id="departure{depart[id]}"
+ style="display:none;">loading...</div>
+ </div>
+ <div class="comments">
+ <label>
+ <textarea
+ id="comments{depart[id]}"
+ name="comments{depart[id]}"
+ flexy:ignore="yes">{depart[comments]:h}</textarea>
+ </label>
+ </div>
+ <span class="removeDepartureSet ui-icon ui-icon-circle-minus"
+ rel="{depart[id]}"></span>
+ </div>
+ <div class="small-2 columns">
+ <a rel="{depart[id]}"
+ class="button postfix commentSave">
+ <span class="ui-button-text">Save</span>
+ </a>
+ </div>
+ </div>
+ </div>
</div>
- <div class="departD">
- Calendar Dates
- <img id="departureCal{depart[id]}" rel="{depart[id]}" src="{appBase:h}assets/icons/calendar.png" />
- <div id="departure{depart[id]}" style="display:none;">loading...</div>
- </div>
- <div class="comments">
- <textarea id="comments{depart[id]}" name="comments{depart[id]}" flexy:ignore="yes">{depart[comments]:h}</textarea>
- <button rel="{depart[id]}" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only commentSave">
- <span class="ui-button-text">Save</span>
- </button>
- </div>
- <span class="removeDepartureSet ui-icon ui-icon-circle-minus" rel="{depart[id]}"></span>
+
+
</div>
\ No newline at end of file
<style>
#loading {position: absolute; top: 50%; left: 50%;}
- .row {clear:both;width: 650px;height:100px;border-top: 1px solid black;}
+ .depSet {clear:both;width: 650px;height:100px;border-top: 1px solid black;}
.colorDiv {width:100px;float:left;}
.departB {width:200px;float:left;}
.departC {width:200px;float:left;}
.simpleColorContainer {z-index: 1;float:left;position:relative;top:0;left: 0;background-color: white;}
</style>
<flexy:toJavascript
- flexy:prefix="glm_"
- appBase="appBase"
- baseUrl="baseUrl"
- scheduleYear="year"
- scheduleId="scheduleId"
- departures="colors"
- timesChx="timesChx"
- timesBvi="timesBvi"
- dates="dates"
- monthsWidth="monthsWidth"
- monthsHeight="monthsHeight"
-/>
-<div id="breadcrumbs"><a href="{backUrl:h}">Schedules</a> > {name:h} </div>
-<div id="scheduleName" class="edit-field">
- <input id="scheduleNameText" name="scheduleName" value="{name:h}" >
- <button rel="{scheduleId}" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only nameSave">
- <span class="ui-button-text">Save</span>
- </button>
-</div>
-<div id="schedulePage" class="edit-field">
- {pageSelect:h}
- <button rel="{scheduleId}" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only pageSave">
- <span class="ui-button-text">Save</span>
- </button>
-</div>
-<button id="addDepartureSet" rel="{scheduleId}" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only">
- <span class="ui-button-text">Add a new Departure Set</span>
-</button>
-<div id="header">
- <div class="colorDiv">
- Color
- </div>
- <div class="departD">
- Departure Dates
- </div>
- <div class="comments">
- Comments
- </div>
-</div>
-<flexy:include src="departureRow.html" />
-<div id="loading" style="display:none;"><img src="{appBase:h}/gallery/colorbox/images/loading.gif" /></div>
-<div id="dialog-form" title="Edit Time">
- <p class="validateTips">Must enter in date format. hh:mm AM or PM</p>
- <form>
- <fieldset>
- <input type="hidden" name="id" id="id" value="" />
- <input type="hidden" name="dock" id="dock" value="" />
- <input type="hidden" name="departure_id" id="departure_id" value="" />
- <label for="depart_time">Time</label>
- <input type="text" name="depart_time" id="depart_time"
- class="text ui-widget-content ui-corner-all noEnterSubmit" />
- </fieldset>
- </form>
+ flexy:prefix="glm_"
+ appBase="appBase"
+ baseUrl="baseUrl"
+ scheduleYear="year"
+ scheduleId="scheduleId"
+ departures="colors"
+ timesChx="timesChx"
+ timesBvi="timesBvi"
+ dates="dates"
+ monthsWidth="monthsWidth"
+ monthsHeight="monthsHeight"
+ />
+<form>
+ <div class="row">
+ <ul id="breadcrumbs" class="breadcrumbs">
+ <li><a href="{backUrl:h}">Schedules</a> > {name:h}</li>
+ </ul>
+ <div class="row">
+ <div id="scheduleName" class="edit-field large-12 columns">
+ <div class="row collapse">
+ <div class="small-10 columns">
+ <label>
+ <input type="text" id="scheduleNameText" name="scheduleName" value="{name:h}" >
+ </label>
+ </div>
+ <div class="small-2 columns">
+ <a rel="{scheduleId}"
+ class="button postfix nameSave">
+ <span class="ui-button-text">Save</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="row">
+ <div id="schedulePage" class="edit-field large-12 columns">
+ <div class="row collapse">
+ <div class="small-10 columns">
+ <label>
+ {pageSelect:h}
+ </label>
+ </div>
+ <div class="small-2 columns">
+ <a rel="{scheduleId}" class="button postfix pageSave">
+ <span class="ui-button-text">Save</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ <button id="addDepartureSet" rel="{scheduleId}"
+ class="button">
+ <span class="ui-button-text">Add a new Departure Set</span>
+ </button>
+ <div id="header">
+ <div class="colorDiv">
+ Color
+ </div>
+ <div class="departD">
+ Departure Dates
+ </div>
+ <div class="comments">
+ Comments
+ </div>
+ </div>
+ <flexy:include src="departureRow.html" />
+ <div id="loading" style="display:none;"><img src="{appBase:h}/gallery/colorbox/images/loading.gif" /></div>
+ <div id="dialog-form" title="Edit Time">
+ <p class="validateTips">Must enter in date format. hh:mm AM or PM</p>
+ <form>
+ <fieldset>
+ <input type="hidden" name="id" id="id" value="" />
+ <input type="hidden" name="dock" id="dock" value="" />
+ <input type="hidden" name="departure_id" id="departure_id" value="" />
+ <label for="depart_time">Time</label>
+ <input type="text" name="depart_time" id="depart_time"
+ class="text ui-widget-content ui-corner-all noEnterSubmit" />
+ </fieldset>
+ </form>
+ </div>
+</form>
</div>
\ No newline at end of file
<button class="add" id="addSchedule">Create New Schedule</button>
<fieldset>
<legend>Boat Schedules</legend>
- <div>
+ <div flexy:foreach="schedules,schedule" class="panel">
<label>
- <input type="radio" name="active" value="0">
- No Active Schedule
+ {schedule[name]:h}<a class="edit tiny button right" href="{baseUrl:h}admin/schedules.php?ac=Edit&id={schedule[id]:h}">Edit</a>
</label>
+
</div>
- <div flexy:foreach="schedules,schedule">
- <label>
- <input type="radio" name="active" value="{schedule[id]:h}">
- {schedule[name]:h}
- </label>
- <a class="edit" href="{baseUrl:h}admin/schedules.php?ac=Edit&id={schedule[id]:h}">Edit</a>
- </div>
-</fieldset>
\ No newline at end of file
+</fieldset>
$.ajax({
cache: false,
url: glm_baseUrl + "schedules/Edit/updateDates/",
- data: "id=" + scheduleId
+ data: "id=" + scheduleId
+ "&departId=" + departureId
+ "&date=" + dateSelected,
success: function(className){
.selected {position:relative;top:0;left:0;padding:0;margin:0;background-color:lightgreen;width:10px;height:10px;}
{style:h}
</style>
+<ul class="medium-block-grid-3">
{calendarsHtml:h}
+</ul>
<a class="exit-off-canvas"></a>
</div>
</div>
-<script src="{mediaBaseURL:h}libjs/vendor/jquery.js"></script>
<script src="{mediaBaseURL:h}libjs/foundation.min.js"></script>
<script src="{mediaBaseURL:h}libjs/foundation/foundation.equalizer.js"></script>
<script src="{mediaBaseURL:h}libjs/foundation/foundation.offcanvas.js"></script>