[EventManager]update EventManager(tizen_2.1)

Change-Id: Iced9d4257f4a429547aaa81f39098552f59cc1f1

9 files changed, 149 insertions, 35 deletions

diff --git a/css/style.css b/css/style.css
index f1714a7..0be56d0 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,4 +1,9 @@
+html.ui-mobile, html {
+	overflow: hidden;
+}
+
 body {
+	overflow: hidden;
 }
 
 #new_event label {
@@ -76,4 +81,4 @@ li.event .ui-li-aside {
 /** workaround to prevent hiding footer caused by broken softkeyboardupdate event**/
 [data-role="footer"] {
 	display: block !important;
-}
\ No newline at end of file
+}
diff --git a/icon.png b/icon.png
index 33fbb63..9765b1b 100644
--- a/icon.png
+++ b/icon.png
diff --git a/index.html b/index.html
index beab5ff..837733e 100644
--- a/index.html
+++ b/index.html
@@ -10,7 +10,7 @@
 	<script src="/usr/share/tizen-web-ui-fw/latest/js/jquery.min.js"></script>
 	<script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
 	<script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.min.js"
-		data-framework-theme="tizen-white" data-framework-viewport-scale="false"></script>
+		data-framework-theme="tizen-white"></script>
 
 	<script type="text/javascript" src="./js/main.js"></script>
 	<link rel="stylesheet" type="text/css" href="./css/style.css"/>
diff --git a/js/app.js b/js/app.js
index 8f6834c..883f6f6 100644
--- a/js/app.js
+++ b/js/app.js
@@ -17,7 +17,7 @@ var App = null;
 		/**
 		 * @type Array
 		 */
-		requires: ['js/app.config.js', 'js/app.model.js', 'js/app.ui.js', 'js/app.ui.templateManager.js'],
+		requires: ['js/app.config.js', 'js/app.model.js', 'js/app.ui.js', 'js/app.ui.templateManager.js', 'js/app.ui.templateManager.modifiers.js'],
 		/**
 		 * @type Config
 		 */
@@ -158,7 +158,7 @@ var App = null;
 				startDate: this.createTZDateFromString(selectedDate),
 				duration: duration,
 				summary: this.ui.home.getTitle(),
-				alarms: [],
+				alarms: []
 			};
 
 			if (this.alarmN) {
diff --git a/js/app.ui.js b/js/app.ui.js
index a74e746..c940657 100644
--- a/js/app.ui.js
+++ b/js/app.ui.js
@@ -54,6 +54,12 @@ function Ui() {
 			this.alarm.init();
 			this.new_event.init();
 
+			document.addEventListener('webkitvisibilitychange', function (event) {
+				if (document.webkitVisibilityState === 'visible') {
+					app.loadEvents();
+				}
+			});
+
 			$.mobile.changePage('#home', 'pop', false, true);
 		},
 
@@ -89,15 +95,17 @@ function Ui() {
 					app.ui.new_event.dateResetLock(true);
 					app.eventId = eventId;
 					for (key in properties) {
-						prop = properties[key];
-						if (event.hasOwnProperty(prop)) {
-							field = $('#new_event input[name="' + prop + '"]');
-							if (field.length !== 0) {
-								if (field.attr('type') === 'datetime') {
-									date = self.TZD2Date(event[prop]);
-									field.datetimepicker('value', date);
-								} else {
-									field.val(event[prop]);
+						if (properties.hasOwnProperty(key)) {
+							prop = properties[key];
+							if (event.hasOwnProperty(prop)) {
+								field = $('#new_event input[name="' + prop + '"]');
+								if (field.length !== 0) {
+									if (field.attr('type') === 'datetime') {
+										date = self.TZD2Date(event[prop]);
+										field.datetimepicker('value', date);
+									} else {
+										field.val(event[prop]);
+									}
 								}
 							}
 						}
@@ -368,12 +376,21 @@ function Ui() {
 					return 60;
 				default:
 					console.warn('Unexpected duration value');
-					return 0;
+					return radioValue;
 				}
 			},
 			getValue: function (duration) {
-				var table = {0: 1, 5: 2, 30: 3, 60: 4};
-				return table[duration];
+				var outDuration, table = {0: 1, 5: 2, 30: 3, 60: 4};
+				if (table[duration]) {
+					$(".customDuration").hide();
+					outDuration = table[duration];
+				} else {
+					$("input.customDuration").val(duration);
+					$("label.customDuration span.customDurationSpan").text(duration);
+					$(".customDuration").show();
+					outDuration = duration;
+				}
+				return outDuration;
 			},
 
 			/**
@@ -399,11 +416,15 @@ function Ui() {
 				$("#demo-date-1, #demo-date-2").datetimepicker();
 				$("#demo-date-1").bind("date-changed", function UI_newEvent_onDateChanged(e, newStartDate) {
 					var startOptions = $(this).data('datetimepicker').options,
+						that = $(this),
 						endData = $("#demo-date-2").data('datetimepicker'),
 						endOptions = typeof endData === 'object' ? endData.options : null,
 						oldStartDate,
 						diff,
-						endDate;
+						endDate,
+						today = new Date(),
+						endDateTemp,
+						newStartDateTemp;
 					// get the old date
 					oldStartDate = startOptions.oldDate;
 					startOptions.oldDate = newStartDate;
@@ -411,36 +432,62 @@ function Ui() {
 					if (!oldStartDate) {
 						console.warn('date-changed handler: old date empty');
 						return;
+					} else if (newStartDate - today < 0) {
+						$("#date-1 .ui-datefield span").animationComplete(function () {
+							newStartDate = today;
+							that.datetimepicker('value', today);
+							that.datetimepicker();
+						});
 					}
 
+					endDate = endOptions.date;
+
 					// calculate time difference in minutes
 					diff = (newStartDate.getTime() - oldStartDate.getTime()) / 1000 / 60;
 
-					endDate = endOptions.date;
-
 					// move the end date by 'diff'
 					endDate.setMinutes(endDate.getMinutes() + diff);
 
 					$("#demo-date-2").datetimepicker('value', endDate);
+					$(".customDuration").hide();
 				});
 
 				$("#demo-date-2").bind("date-changed", function (e, newEndDate) {
 					var endOptions = $(this).data('datetimepicker').options,
-						self = $(this),
-						stardDate = $("#demo-date-1").data('datetimepicker').options.date,
-						oldEndDate;
+						that = $(this),
+						startDate = $("#demo-date-1").data('datetimepicker').options.date,
+						oldEndDate,
+						startDateTemp,
+						newEndDateTemp,
+						diff;
 
 					oldEndDate = endOptions.oldDate;
 
-					if (newEndDate - stardDate < 0) {
+					if (newEndDate - startDate < 0) {
 						$("#date-2 .ui-datefield span").animationComplete(function () {
 							alert('End date cannot be earlier than initial date');
-							self.datetimepicker('value', oldEndDate);
-							self.datetimepicker();
+							that.datetimepicker('value', oldEndDate);
+							that.datetimepicker();
 						});
 					} else {
 						endOptions.oldDate = newEndDate;
 					}
+
+					// calculate time difference in years (4 years delay)
+					startDateTemp = startDate;
+					startDateTemp.setSeconds(0);
+					startDateTemp.setMilliseconds(0);
+					newEndDateTemp = newEndDate;
+					newEndDateTemp.setSeconds(0);
+					newEndDateTemp.setMilliseconds(0);
+					diff = (newEndDateTemp.getTime() - startDateTemp.getTime()) / 1000 / 60 / 60 / 24 / 1461;
+					if (diff >= 1) {
+						$("#date-2 .ui-datefield span").animationComplete(function () {
+							alert('The difference between start and end date must be less than 4 years.');
+							that.datetimepicker('value', oldEndDate);
+							that.datetimepicker();
+						});
+					}
 				});
 
 				$('#new_event').on('pageshow', function UI_newEvent_onPageShow(event) {
@@ -468,17 +515,18 @@ function Ui() {
 					$('#add-event-btn').removeClass('disabled');
 				});
 
-				$('#switch-1').bind('changed', app.switchFullDay.bind(app));
+				$('#switch-1').on('changed', app.switchFullDay.bind(app));
 
-				$('#add-event-btn').bind('vmouseup', this.addEvent.bind(this));
+				$('#add-event-btn').on('tap', this.addEvent.bind(this));
 
-				$('#add-event-cancel-btn').bind('vmouseup', this.cancel.bind(this));
+				$('#add-event-cancel-btn').on('tap', this.cancel.bind(this));
 
 				//alarm selection confirm
-				$('#add-alarm').bind('tap', app.switchAlarm.bind(app));
+				$('#add-alarm').on('tap', app.switchAlarm.bind(app));
 
 				// go to alarm selection
-				$('#add_alarm').bind('tap', function () {
+				$('#add_alarm').on('tap', function (e) {
+					e.preventDefault();
 					self.dateResetLock(true);
 					$.mobile.changePage('#new_alarm');
 				});
diff --git a/js/app.ui.templateManager.js b/js/app.ui.templateManager.js
index 68c6678..c1db140 100644
--- a/js/app.ui.templateManager.js
+++ b/js/app.ui.templateManager.js
@@ -1,4 +1,4 @@
-/*global tizen, $, app */
+/*global tizen, $, app, ModifierManager */
 /**
  * @class TemplateManager
  */
@@ -20,6 +20,7 @@ function TemplateManager() {
 		 * UI module initialisation
 		 */
 		init: function init() {
+			this.modifiers = new ModifierManager().getAll();
 		},
 
 		/**
@@ -95,16 +96,36 @@ function TemplateManager() {
 		* @param {string} tplParams
 		 */
 		getCompleted: function TemplateManager_getCompleted(tplHtml, tplParams) {
-			var tplParam, replaceRegExp;
+			var tplParam;
 
 			for (tplParam in tplParams) {
 				if (tplParams.hasOwnProperty(tplParam)) {
-					replaceRegExp = new RegExp(['%', tplParam, '%'].join(''), 'g');
-					tplHtml = tplHtml.replace(replaceRegExp, tplParams[tplParam]);
+					tplHtml = this.passThruModifiers(tplHtml, tplParam, tplParams[tplParam]);
 				}
 			}
 
 			return tplHtml;
+		},
+
+		passThruModifiers: function (tplHtml, tplParam, content) {
+			var regModOn = new RegExp('%' + tplParam + '\\|([a-zA-Z]){1,}%', 'g'),
+				regModOff = new RegExp(['%', tplParam, '%'].join(''), 'g'),
+				regModGet = new RegExp('%' + tplParam + '\\|(.+?)%'),
+				modifier;
+
+			if (regModOn.test(tplHtml)) {
+				modifier = tplHtml.match(regModGet)[1];
+				try {
+					content = this.modifiers[modifier](content);
+				} catch (error) {
+					console.error('unknown modifier: ' + modifier);
+				}
+				tplHtml = tplHtml.replace(regModOn, content);
+			} else {
+				tplHtml = tplHtml.replace(regModOff, content);
+			}
+
+			return tplHtml;
 		}
 	};
 
diff --git a/js/app.ui.templateManager.modifiers.js b/js/app.ui.templateManager.modifiers.js
new file mode 100644
index 0000000..483faa7
--- /dev/null
+++ b/js/app.ui.templateManager.modifiers.js
@@ -0,0 +1,36 @@
+/*global $*/
+/**
+ * @class ModifierManager
+ */
+function ModifierManager() {
+	'use strict';
+	this.init();
+}
+
+(function () {
+	'use strict';
+	ModifierManager.prototype = {
+
+		/**
+		 * UI module initialisation
+		 */
+		init: function () {
+		},
+
+		/**
+		 * @return modifiers object
+		 */
+		getAll: function () {
+			return this.modifiers;
+		},
+
+		/**
+		 * modifiers definitions
+		 */
+		modifiers: {
+			escape: function (str) {
+				return $('<span>').text(str).html();
+			}
+		}
+	};
+}());
\ No newline at end of file
diff --git a/templates/alarm.tpl b/templates/alarm.tpl
index 6529fe5..059bf1f 100644
--- a/templates/alarm.tpl
+++ b/templates/alarm.tpl
@@ -18,6 +18,10 @@
 
                  <input type="radio" name="radio-choice" id="radio-choice-4" value=4 />
                  <label for="radio-choice-4">1 hour before</label>
+
+                 <input class="customDuration" type="radio" name="radio-choice" id="radio-choice-5" value=0 />
+                 <label class="customDuration" for="radio-choice-5"><span class="customDurationSpan">0</span> minutes before</label>
+
             </fieldset>
             <a href="#new_event" id="add-alarm" data-role="button">Save</a>
         </div><!-- /content -->
diff --git a/templates/event.tpl b/templates/event.tpl
index 4838344..a46c5c7 100644
--- a/templates/event.tpl
+++ b/templates/event.tpl
@@ -3,7 +3,7 @@
 		<div class="green_dot"></div>%startDate%<br/>
 		<div class="red_dot"></div>%endDate%<br/>
 	</div>
-	<div class="ul-li-desc"><span class="description">%summary%</span></div>
+	<div class="ul-li-desc"><span class="description">%summary|escape%</span></div>
 	<div class="editEvent"><form><input type="button" class="edit_event_btn" data-inline="true" value="edit"/></form></div>
 	<div class="deleteEvent"><form><input type="button" class="remove_event_btn" data-inline="true" value="delete"/></form></div>
 </li>