Update Cruise Schedule app
authorSteve Sutton <steve@gaslightmedia.com>
Fri, 20 Jun 2014 16:12:52 +0000 (12:12 -0400)
committerSteve Sutton <steve@gaslightmedia.com>
Fri, 20 Jun 2014 16:12:52 +0000 (12:12 -0400)
Update for styles to use foundation to help align things better.

Toolkit/Schedule/EditSchedule.php
Toolkit/Schedule/ListSchedules.php
Toolkit/Schedule/application.ini
Toolkit/Schedule/js/editSchedule.js
Toolkit/Schedule/templates/departureRow.html
Toolkit/Schedule/templates/editSchedule.html
Toolkit/Schedule/templates/listSchedules.html
Toolkit/Schedule/templates/scheduleCalendar.html
templates/template.html

index 3a35135..96d7454 100644 (file)
@@ -469,6 +469,12 @@ class Toolkit_Schedule_EditSchedule
      */
     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';
index f9bd659..4dfceff 100644 (file)
@@ -4,21 +4,27 @@ class Toolkit_Schedule_ListSchedules
 {
     /**
      * 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
index a18c7f2..2db38a8 100644 (file)
@@ -13,7 +13,7 @@ months.start = 4
 ; 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
 
index 6d73926..9417b8a 100644 (file)
@@ -81,12 +81,13 @@ var EditSchedule =
                     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/",
@@ -121,7 +122,7 @@ var EditSchedule =
         $('.commentSave').live('click', function(){
             var departureId = $(this).attr('rel');
             var comments = $('#comments' + departureId).val();
-                
+
             $.ajax({
                 cache: false,
                 url: glm_baseUrl + "schedules/Edit/updateComment/",
@@ -141,7 +142,7 @@ var EditSchedule =
         $('.nameSave').live('click', function(){
             var scheduleId = $(this).attr('rel');
             var name = $('#scheduleNameText').val();
-                
+
             $.ajax({
                 cache: false,
                 url: glm_baseUrl + "schedules/Edit/updateName/",
@@ -247,9 +248,9 @@ var EditSchedule =
                 "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" );
                     }
@@ -286,14 +287,14 @@ var EditSchedule =
                                         $('.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>'
                                         );
                                     }
@@ -305,7 +306,7 @@ var EditSchedule =
                                 }
                             });
                         }
-                        
+
                         $( this ).dialog( "close" );
                     }
                 },
@@ -317,7 +318,7 @@ var EditSchedule =
                 allFields.val( "" ).removeClass( "ui-state-error" );
             }
         });
-        
+
     },
     // setup the departures by id
     setupDepartureById: function(id){
@@ -336,13 +337,13 @@ var EditSchedule =
                 }
             });
         });
-        
+
         $('#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({
index 5ddda04..d878ab7 100644 (file)
@@ -1,17 +1,42 @@
-<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
index 4d5394f..0d7cd4e 100644 (file)
@@ -1,6 +1,6 @@
 <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
index 153ece7..821c7e1 100644 (file)
@@ -6,17 +6,10 @@
 <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>
index a0c30d9..d17afcb 100644 (file)
@@ -13,7 +13,7 @@ $(document).ready(function(){
         $.ajax({
             cache: false,
             url: glm_baseUrl + "schedules/Edit/updateDates/",
-            data: "id=" + scheduleId 
+            data: "id=" + scheduleId
                 + "&departId=" + departureId
                 + "&date=" + dateSelected,
             success: function(className){
@@ -33,4 +33,6 @@ table.cals td {border:solid 1px black;width:5px;height:5px;text-align:center;}
 .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>
index da9b6ae..d3426e8 100644 (file)
         <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>