Added guard to prevent multiple edit dialogs for the same event.

geekbrit · geekbrit · commit 979bba1b1931 · 2013-08-15T14:47:00.000-04:00
Added event lock capability.
Moved Resource test data to the &lt;resource&gt; declarations
BugFix: Events were losing date on drag.
diff --git a/css/test.css b/css/test.css
@@ -38,10 +38,18 @@
   font-size: 50%;
   color: #A00;
   border: 1px solid #aa0000;
+  border-radius: 12px;
+  -moz-border-radius: 12px;
   text-align: center;
   padding: 1px 3px;
   margin: 2px; }
 
+.lockedevent {
+  clear: both;
+  float: right;
+  width: 1em;
+  height: auto; }
+
 .calimg {
   height: 1em;
   width: auto;
diff --git a/img/padlock.png b/img/padlock.png
diff --git a/js/rc_calendar.js b/js/rc_calendar.js
@@ -180,7 +180,7 @@ function Calendar( element, options )
                             t.resources[resource_id],
                             {
                                 start    : start_time,
-                                date     : date,
+                                date     : date.valueOf(),
                             }
                         ) ) {
                         // was able to render in the new position, delete the original
@@ -234,29 +234,36 @@ function Calendar( element, options )
                      t.eventmanager.deleteEvent, evt.attr.id );
         });
 
-        newev.draggable({
-            appendTo : 'body',
-            helper   : 'clone',
-            zIndex   : 9999,
-/*          drag     : function( event, ui ){
-                        var time_offset = t.options.get_time_offset( event, ui );
-                        var start_time  = nearest_time( time_offset );
-                        ui.helper.find(".rc_event_head").text(start_time);
-                       }
-*/
-        }).resizable({
-            handles: 's',
-
-            stop: function( event, ui ){
-                var snapheight = ~~(ui.size.height/t.options.intervalpixels);
-                var total_mins = snapheight*t.options.interval;
-
-                evt.attr.duration = total_mins - (evt.attr.prep_time + evt.attr.cleanup_time);
-                ui.helper.css('height',snapheight * t.options.intervalpixels -2 + 'px');
-            }
+        if( !evt.attr.locked ){
+            newev.draggable({
+                appendTo : 'body',
+                helper   : 'clone',
+                zIndex   : 9999,
+    /*          drag     : function( event, ui ){
+                            var time_offset = t.options.get_time_offset( event, ui );
+                            var start_time  = nearest_time( time_offset );
+                            ui.helper.find(".rc_event_head").text(start_time);
+                           }
+    */
+            }).resizable({
+                handles: 's',
+
+                stop: function( event, ui ){
+                    var snapheight = ~~(ui.size.height/t.options.intervalpixels);
+                    var total_mins = snapheight*t.options.interval;
+
+                    evt.attr.duration = total_mins - (evt.attr.prep_time + evt.attr.cleanup_time);
+                    ui.helper.css('height',snapheight * t.options.intervalpixels -2 + 'px');
+                }
+            })
+        }
 
-        }).click( function(){
-            rc_event_edit( evt, t.view_week_render_event );
+        newev.click( function(){
+            rc_event_edit( evt, function(evt){
+                t.view_week_render_event(evt);
+                t.options.persist(evt);
+                return false;
+            });
         });
 
         return false;   // this is a fix for form submit callback
@@ -281,7 +288,7 @@ function Calendar( element, options )
     {
         return addMinutes_timeOfDay(
             t.options.min_time,
-            ~~(offset / t.options.intervalpixels) * t.options.interval,
+            ~~((offset + t.options.intervalpixels/2) / t.options.intervalpixels) * t.options.interval,
             t.options.max_time
         ).newtime;
     }
@@ -378,7 +385,8 @@ function rc_Event( options )
         prep_time   : 0,                // pre-event room preparation time
         cleanup_time: 0,                // post-event room
         resource    : 'none',           // remove from this resource when added to another
-        written_to_server : false 
+        locked      : false,            // when locked, can not be dragged, resized, or bumped
+        written_to_server : false
     };
 
     t.attr = $.extend( true, {}, defaults, options );
@@ -440,7 +448,7 @@ function rc_EventManager( retrieve_events, save_event, delete_event, resources,
         var stash = evt.attr;
 
         evt.attr.start   = options.start;
-        evt.attr.date    = options.date.valueOf;      
+        evt.attr.date    = options.date;
         evt.attr.t_offset= options.t_offset;
 
 
@@ -490,15 +498,6 @@ function rc_EventManager( retrieve_events, save_event, delete_event, resources,
 //      3: live Ajax + localStorage for offline working
 
 
-//--- TEST DATA -------------------------------------------------------
-var init_resource = {
-    Room1:{title:"Orca",capacity:250,location:"Rochester North"},
-    Room2:{title:"Narwhal",capacity:50,location:"Rochester North"},
-    Room3:{title:"Walrus",capacity:500,location:"Rochester East"},
-};
-
-//--- END TEST DATA ---------------------------------------------------
-
 
 function Resource( resource_element, init_mode ) {
     var t = this;
@@ -509,18 +508,8 @@ function Resource( resource_element, init_mode ) {
     //
     t.eventpool = {};
 
-    t.id = resource_element.attr('id');
-
-    // initialization
-    switch( init_mode )
-    {
-        case 'localtest': {
-            t.attr = init_resource[t.id];
-            break;
-        }
-
-        default: alert("unrecognized Resource initialization mode");
-    }
+    t.id   = resource_element.attr('id');
+    t.attr = $.parseJSON(resource_element.attr('data-attr'));
 
     //
     // Set up automated event acceptance test (application-level function)
diff --git a/js/rc_utilities.js b/js/rc_utilities.js
@@ -30,6 +30,11 @@ function rc_notify( title, text, type ) {
 
 function rc_event_edit( evt, callback ) {
 
+    // check for guard element
+    if( $('#nodupe-'+evt.attr.id).length ){
+        return false;
+    }
+
     var notice = $.pnotify({
         text: $('#form_event_edit').html(),
         icon: false,
@@ -46,9 +51,16 @@ function rc_event_edit( evt, callback ) {
         var t = $(this);
         if( t.attr('id') in evt.attr ) {
             t.val(evt.attr[t.attr('id')]);
+            // handle checkboxes
+            if( t.attr('type') == 'checkbox' ) {
+                t.prop("checked", evt.attr[t.attr('id')] );
+            }
         }
     });
 
+    // Add guard element
+    notice.append("<input type='hidden' id='nodupe-"+evt.attr.id+"'>");
+
     notice.find('form.pf-form').submit(function() {
         
 
@@ -66,7 +78,10 @@ function rc_event_edit( evt, callback ) {
         notice.find('.pf-field').each( function(){
             var t = $(this);
             if( t.attr('id') in evt.attr ) {
-                if(typeof(evt.attr[t.attr('id')]) == 'number' ) {
+                if( t.attr('type') == 'checkbox' ) {
+                    evt.attr[t.attr('id')] = t.prop("checked");
+                }
+                else if(typeof(evt.attr[t.attr('id')]) == 'number' ) {
                     evt.attr[t.attr('id')] = parseInt(t.val(),10);
                 }
                 else {
diff --git a/sass/rc_calendar.scss b/sass/rc_calendar.scss
@@ -51,6 +51,7 @@ $col_7days_width : 595/7 - 1px;
 		left:0;
 		bottom:0;
 	}
+
 	#sgrip{
 		width:20px;
 		height:10px;
diff --git a/sass/test.scss b/sass/test.scss
@@ -45,11 +45,20 @@
   font-size:50%;
   color: #A00;
   border:1px solid #A00;
+  border-radius: 12px;
+    -moz-border-radius: 12px;
   text-align:center;
   padding:1px 3px;
   margin:2px;
 }
 
+.lockedevent{
+	clear:both;
+	float:right;
+	width:1em;
+	height:auto;
+}
+
 .calimg{
 	height:1em;
 	width:auto;
diff --git a/templates/week.template.js b/templates/week.template.js
@@ -71,7 +71,9 @@ var render_week_event = doT.template((function(){/*
      id="{{=it.attr.id}}">
   <div class="rc_event_prepad" style="height:{{=it.attr.t_prepad}}px;"></div>
   <div class="rc_event_head">{{=it.attr.start}} - {{=it.attr.end}}<div class='deleteevent'>X</div></div>
-  <div class="rc_event_body">{{=it.attr.ev_text}}</div>
+  <div class="rc_event_body">{{=it.attr.ev_text}}
+    {{? it.attr.locked }}<img class='lockedevent' alt='locked' src='img/padlock.png'></img>{{?}}
+  </div>
   <div class="rc_event_postpad" style="height:{{=it.attr.t_postpad}}px;"></div>
 </div>
 */}).heredoc());
diff --git a/test.html b/test.html
@@ -18,9 +18,25 @@
 	<!-- This is a container class that will hold a calendar for each of the resources defined within it -->
 	<div class='calendar'>
 	    <!-- Declare resources, set up validation function and parameters-->
-		<resource id='Room1' data-validate='validateEvent' data-params='{"capacity":["LE",30], "campus":["EQ","N"]}'></resource>
-		<resource id='Room2' data-validate='validateEvent' data-params='{"capacity":["LE",50], "campus":["EQ","N"]}'></resource>
-		<resource id='Room3' data-validate='validateEvent' data-params='{"capacity":["LE",120],"campus":["EQ","E"]}'></resource>
+		<resource id='Room1'
+				  data-validate	='validateEvent'
+				  data-params  	='{"capacity":["LE",30], "campus":["EQ","N"]}'
+				  data-attr    	='{"title":"Orca","capacity":250,"location":"Rochester North"}';
+				  >
+		</resource>
+		<resource id='Room2'
+				  data-validate	='validateEvent'
+				  data-params	='{"capacity":["LE",50], "campus":["EQ","N"]}'
+				  data-attr		='{"title":"Narwhal","capacity":50,"location":"Rochester North"}'
+				  >
+		</resource>
+		<resource id='Room3'
+				  data-validate	='validateEvent'
+				  data-params	='{"capacity":["LE",120], "campus":["EQ","E"]}'
+				  data-attr		='{"title":"Walrus","capacity":500,"location":"Rochester East"}'
+				  >
+		</resource>
+
 	</div>
 
 	<!-- This form is displayed by Pine Notify when editing Event details -->
@@ -56,35 +72,29 @@ <h3>Resource Calendar</h3>
 			</div>
 			<div class="pf-element">
 				<label>
-					<span class="pf-label">Day</span>
-					<input class="pf-field" type="text" name="meeting_day" id="date" />
-				</label>
-			</div>
-			<div class="pf-element">
-				<label>
-					<span class="pf-label">Start</span>
-					<input class="pf-field" type="text" name="meeting_start" id="start" />
+					<span class="pf-label">Duration (minutes)</span>
+					<input class="pf-field" type="text" name="meeting_duration" id="duration" />
 				</label>
 			</div>
 			<div class="pf-element">
 				<label>
-					<span class="pf-label">Duration</span>
-					<input class="pf-field" type="text" name="meeting_duration" id="duration" />
+					<span class="pf-label">Preparation Time (minutes)</span>
+					<input class="pf-field" type="text" name="meeting_prep" id="prep_time" />
 				</label>
 			</div>
 			<div class="pf-element">
 				<label>
-					<span class="pf-label">Preparation Time</span>
-					<input class="pf-field" type="text" name="meeting_prep" id="prep_time" />
+					<span class="pf-label">Cleanup Time (minutes)</span>
+					<input class="pf-field" type="text" name="meeting_clean" id="cleanup_time" />
 				</label>
 			</div>
 			<div class="pf-element">
 				<label>
-					<span class="pf-label">Cleanup Time</span>
-					<input class="pf-field" type="text" name="meeting_clean" id="cleanup_time" />
+					<span class="pf-label">Lock Meeting</span>
+					<span class="pf-label">Locked meetings can not be dragged or resized</span>
+					<input class="pf-field" type="checkbox" name="meeting_locked" id="locked" />
 				</label>
 			</div>
-
 			<div class="pf-element pf-buttons pf-centered">
 				<input class="pf-button btn btn-primary" type="submit" name="submit" value="Submit" />
 			</div>

Original file line number	Diff line number	Diff line change
`@@ -51,6 +51,7 @@ $col_7days_width : 595/7 - 1px;`
`51`	`51`	`left:0;`
`52`	`52`	`bottom:0;`
`53`	`53`	`}`
	`54`	`+`
`54`	`55`	`#sgrip{`
`55`	`56`	`width:20px;`
`56`	`57`	`height:10px;`