[EventManager] updated EventManager sources

Change-Id: I3e4be39c922f151a87c2d3a6d80c6ef2bb81f5c0
author: Piotr Dabrowski <p.dabrowski2@samsung.com> 2013-07-11 10:18:31 +0200
committer: Piotr Dabrowski <p.dabrowski2@samsung.com> 2013-07-11 10:18:31 +0200
commit: f4cfd407be3512ece64e11d29b595349e912991c (patch)
tree: 74bb037014f2de6138f102f9c377c05dcdfdadf1
parent: 18bd6028e7fba887b83c4ff10dce9670d6e0a584 (diff)
download: EventManager-f4cfd407be3512ece64e11d29b595349e912991c.tar.gz
EventManager-f4cfd407be3512ece64e11d29b595349e912991c.tar.bz2
EventManager-f4cfd407be3512ece64e11d29b595349e912991c.zip
7 files changed, 167 insertions, 127 deletions
diff --git a/css/style.css b/css/style.css
index 3934f96..8a1592d 100644
--- a/css/style.css
+++ b/css/style.css
@@ -99,3 +99,8 @@ li.event .ui-li-aside {
 .ui-btn-back {
 	visibility:hidden;
 }
+
+label.ui-input-text.customDuration,
+input.ui-input-text.customDuration {
+	display: inline;
+}
diff --git a/index.html b/index.html
index 617895f..0e2370e 100644
--- a/index.html
+++ b/index.html
@@ -12,8 +12,8 @@
 	<script src="/usr/share/tizen-web-ui-fw/latest/js/tizen-web-ui-fw.min.js"
 		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"/>
+	<script type="text/javascript" src="js/main.js"></script>
+	<link rel="stylesheet" type="text/css" href="css/style.css"/>
 </head>
 <body>
 	<div data-role="page" id="mock" data-title="mock" data-add-back-btn="false"></div>
diff --git a/js/app.js b/js/app.js
index ec0f46c..6c2f77f 100644
--- a/js/app.js
+++ b/js/app.js
@@ -51,6 +51,8 @@ var App = null;
 		 */
 		eventId: 0,
 
+		homeDateFilter: new Date(),
+
 		/**
 		 * Initialisation function
 		 */
@@ -88,8 +90,7 @@ var App = null;
 		 */
 		switchAlarm: function switchAlarm() {
 			var duration = -1;
-			duration = this.ui.alarm.getDuration();
-			this.ui.alarm.updateDurationLabel(true);
+			duration = this.ui.alarm.getValue();
 
 			if (duration != -1) {
 				this.alarmN = this.model.getCalendarAlarm(duration, "EventManager Reminder");
@@ -157,6 +158,8 @@ var App = null;
 			} catch (ex) {
 				console.error(ex.message);
 			}
+
+			this.changeHomeDateFilter(new Date(selectedDate));
 			this.loadEvents(eventDate);
 			if (typeof callback === 'function'){
 				callback();
@@ -174,6 +177,7 @@ var App = null;
 				this.ui.home.getEndDate(),
 				fullDay
 			);
+
 			new_values = {
 				startDate: this.createTZDateFromString(selectedDate),
 				duration: duration,
@@ -186,12 +190,19 @@ var App = null;
 				new_values.alarms = [this.alarmN];
 			}
 			this.model.updateEvent(app.eventId, new_values);
+
+			this.changeHomeDateFilter(new Date(selectedDate));
 			this.loadEvents();
 			if (typeof callback === 'function'){
 				callback();
 			}
 		},
 
+		changeHomeDateFilter: function (date) {
+			this.homeDateFilter = date;
+			app.ui.home.updateHomeDateFilter();
+		},
+
 		/**
 		 * Calculates time duration
 		 *
diff --git a/js/app.model.js b/js/app.model.js
index e8cf4c5..b657866 100644
--- a/js/app.model.js
+++ b/js/app.model.js
@@ -83,7 +83,7 @@ var Model = function Model() {
 			calendar = this.getCalendar();
 
 			// show all events
-			//filter = this.getStartDateFilter(new Date(), true);
+			filter = this.getStartDateFilter(app.homeDateFilter);
 
 			calendar.find(onSuccess, onError, filter);
 		},
@@ -108,6 +108,7 @@ var Model = function Model() {
 			} else {
 				endTzDate = tzDate.addDuration(new tizen.TimeDuration("1", "DAYS")); // calculate end date
 			}
+			//filter = new tizen.AttributeRangeFilter("startDate", tzDate, endTzDate);
 			filter = new tizen.AttributeRangeFilter("startDate", tzDate, endTzDate);
 			return filter;
 		},
diff --git a/js/app.ui.js b/js/app.ui.js
index b5a2faf..c9bcdea 100644
--- a/js/app.ui.js
+++ b/js/app.ui.js
@@ -71,6 +71,21 @@ function Ui() {
 				$(".ui-popupwindow").hide();
 			});
 
+			$(document).ready(function () {
+				if ($('input[type=radio]:checked').val() !== 'Yes') {
+					$("#customDuration").addClass('ui-disabled');
+				}
+
+				$('input[type=radio]').change( function () {
+					$("#customDuration").blur();
+					if ($(this).val() === 'Yes') {
+						$("#customDuration").removeClass('ui-disabled');
+					} else {
+						$("#customDuration").addClass('ui-disabled');
+					}
+				});
+			});
+
 			document.addEventListener('webkitvisibilitychange', function (event) {
 				$(".ui-popup").popup('close');
 				app.ui.new_event.updateDateFormat();
@@ -86,35 +101,21 @@ function Ui() {
 				}
 			});
 
-			$("input.customDuration").on("input", function(e) {
-				var val = parseInt($(this).val().replace(/[^0-9]*/, ''), 10),
+			$("input.customDuration").on("input keypress keyup", function (e) {
+				var val = parseInt($(this).val(), 10),
 					max = parseInt($(this).attr("max"), 10),
-					min = parseInt($(this).attr("min"), 10);
+					min = 0;
 
-				if (isNaN(val)) {
-					this.value = 0;
-					return;
-				}
-
-				val = parseInt($(this).val(), 10)
 				if (val > max){
 					alert('Alarm can not be set above '+ max +' minutes');
 					$(this).val(max);
 					app.ui.alarm.updateDurationLabel();
 				} else if (val < min) {
-					alert('Alarm can not be set below ' + min +
-					' minute (Off)');
+					alert('Alarm can not be set below 0 minutes (Off)');
 					$(this).val(min);
 				}
 			});
 
-			$(window).on('softkeyboardchange', function (e) {
-				app.ui.alarm.selectOption(parseInt($("input.customDuration").val(), 10));
-				if (e.originalEvent.state === "off") {
-					$("input:radio").checkboxradio("refresh");
-				}
-			});
-
 			window.addEventListener('tizenhwkey', function(e) {
 				if (e.keyName == "back") {
 					if ($.mobile.activePage.attr('id') === 'home') {
@@ -143,7 +144,8 @@ function Ui() {
 
 				$('#exit_btn').on('tap', app.exit.bind(app));
 				$("input:radio").checkboxradio();
-				alarm.selectOption();
+				alarm.setValue();
+				alarm.updateDurationLabel();
 
 				// buttons in the events list
 				$('#events_list').on('tap', '.remove_event_btn', function () {
@@ -185,7 +187,8 @@ function Ui() {
 					if(typeof duration == "undefined") {
 						duration = -1;
 					}
-					alarm.selectOption(alarm.getValue(duration || 0));
+					alarm.setValue(duration);
+					alarm.updateDurationLabel();
 
 					$.mobile.changePage("#new_event");
 					// set select allDay property
@@ -200,7 +203,14 @@ function Ui() {
 					$('#title').val('');
 					app.ui.new_event.setSelectAllDay(false);
 					app.ui.new_event.updateDateFormat();
-					alarm.selectOption();
+					alarm.setValue(0);
+					alarm.updateDurationLabel();
+				});
+
+				$("#homeDateFilter").change(function () {
+					app.homeDateFilter =
+						app.ui.new_event.getDateFromPicker($(this));
+					app.loadEvents();
 				});
 
 				this.loadEvents();
@@ -378,30 +388,44 @@ function Ui() {
 
 				// content
 				str = '';
+				if (events.length !== 0) {
+					for (i = 0; i < events.length; i += 1) {
+						event = events[i];
 
-				for (i = 0; i < events.length; i += 1) {
-					event = events[i];
+						dividerText = this.getSeparatorText(event);
 
-					dividerText = this.getSeparatorText(event);
+						if (dividerText) {
+							str += '<li data-role="list-divider">'
+								+ dividerText + '</li>';
+						}
 
-					if (dividerText) {
-						str += '<li data-role="list-divider">' + dividerText + '</li>';
+						alarm = this.getAlarmsHtml(event.alarms);
+
+						templateParameters = {
+							uid: event.id.uid,
+							startDate: this.formatHour(event.startDate),
+							endDate: this.formatHour(event.endDate),
+							summary: event.summary || '[No title]',
+							location: event.location,
+							description: event.description,
+							alarm: alarm
+						};
+
+						tmplName = event.isAllDay ? 'all_day_event' : 'event';
+						str += this.context.templateManager.get(tmplName,
+							templateParameters);
 					}
+				} else {
+					dividerText = this.getSeparatorText({
+						startDate: app.homeDateFilter
+					});
 
-					alarm = this.getAlarmsHtml(event.alarms);
-
-					templateParameters = {
-						uid: event.id.uid,
-						startDate: this.formatHour(event.startDate),
-						endDate: this.formatHour(event.endDate),
-						summary: event.summary || '[No title]',
-						location: event.location,
-						description: event.description,
-						alarm: alarm
-					};
+					if (dividerText) {
+						str += '<li data-role="list-divider">'
+							+ dividerText + '</li>';
+					}
 
-					tmplName = event.isAllDay ? 'all_day_event' : 'event';
-					str += this.context.templateManager.get(tmplName, templateParameters);
+					str += '<li>No events found</li>';
 				}
 				this.getSeparatorText(); // clear the separator state
 
@@ -417,6 +441,11 @@ function Ui() {
 			 */
 			onEventSearchError: function UI_home_onEventSearchError() {
 				console.error("event search error");
+			},
+
+			updateHomeDateFilter: function () {
+				$("#homeDateFilter")
+					.datetimepicker("value", app.homeDateFilter);
 			}
 		},
 
@@ -426,57 +455,34 @@ function Ui() {
 		 */
 		alarm: {
 			init: function UI_alarm_init() {
-				var self = this;
-
-				$("input.customDuration").on('change', function () {
-					var tmpChecked,
-					val = $("input.customDuration").val() || 0;
-					$.each($('#new_alarm input:radio'), function () {
-						tmpChecked = $(this).val();
-						if ( tmpChecked === val) {
-							$(this).attr('checked', true).checkboxradio('refresh');
-						} else {
-							$(this).attr('checked', false).checkboxradio('refresh');
-						}
-					});
-					self.getValue(val);
-					self.updateDurationLabel();
-				});
-				$('#new_alarm input:radio').on('change', function () {
-					$("input.customDuration").val($(this).val());
-					self.getValue($(this).val());
-					self.updateDurationLabel();
-				});
+				$("#customDuration").val(0);
 			},
-			/**
-			 * Read alarm duration from the UI
-			 *
-			 * @returns {int} Alarm duration in minutes
-			 */
-			selectOption: function (val) {
-				if(typeof val == "undefined") {
-					val = 0;
+			setValue: function (duration) {
+				if(typeof duration == "undefined") {
+					duration = 0;
 				}
+
 				$.each($('#new_alarm input:radio'), function () {
-					$(this).attr('checked', parseInt($(this).val(), 10) === val)
+					$(this).attr('checked', parseInt($(this).val(), 10) === duration)
 						.checkboxradio('refresh');
 				});
-				this.getValue(val);
-				app.switchAlarm();
-				this.updateDurationLabel();
-			},
-
-			getDuration: function UI_alarm_getDuration() {
-				var self = this;
-				var radiobutton = null,
-					inputValue = $("input.customDuration").val();
-				radiobutton = $('#new_alarm :jqmData(role=controlgroup) input:radio[checked]');
-				return inputValue;
+				
+				if (!$("#new_alarm input[type=radio]:checked").val()) {
+					$('#yes_1').attr('checked', true).checkboxradio('refresh');
+					$("#customDuration").val(duration).removeClass('ui-disabled');
+				}
+				return duration;
 			},
 
-			getValue: function (duration) {
-				$("input.customDuration").val(parseInt(duration, 10));
-				return duration;
+			getValue: function () {
+				var value = parseInt($("#new_alarm input[type=radio]:checked").val(), 10);
+				if(isNaN(value))
+				{
+					value = parseInt($("#customDuration").val(), 10);
+				}else{
+					$("#customDuration").val(0).addClass('ui-disabled');
+				}
+				return value;
 			},
 
 			/**
@@ -485,17 +491,13 @@ function Ui() {
 			 * @returns {string} Label
 			 */
 			updateDurationLabel: function (eventAndAlarm) {
-				var label = parseInt($("input.customDuration").val(), 10);
+				var label = this.getValue();
 				if (label === -1) {
 					label = "Off";
 				} else {
-					label += " minutes before";
-				}
-				$("label.customDuration span.customDurationSpan").text(label);
-				if (eventAndAlarm === true) {
-					$('#alarm').text(label);
+					label += " minute(s) before";
 				}
-				$("input:radio").checkboxradio("refresh");
+				$('#alarm').text(label);
 				return label;
 			}
 		},
@@ -506,6 +508,7 @@ function Ui() {
 		 */
 		new_event: {
 			initialized: false,
+			animateStatus: false,
 
 			init: function () {
 				this.assignFields();
@@ -523,6 +526,10 @@ function Ui() {
 				this.start.change(this.validStart.bind(this));
 				this.end.change(this.validEnd.bind(this));
 
+				$("#new_event").on('pageshow', function () {
+					self.animateStatusChange.bind(self)();
+				});
+
 				/* old events */
 				$('#add-event-btn').on('tap', this.addEvent.bind(this));
 				$('#add-event-cancel-btn').on('tap', this.cancel.bind(this));
@@ -535,6 +542,16 @@ function Ui() {
 				});
 			},
 
+			animateStatusChange: function () {
+				var self = this;
+				this.end.next().find('span').not('.ui-datefield-seperator')
+					.off('tap')
+					.on('tap', function (e) {
+						self.animateStatus =
+							$(e.target).hasClass('ui-btn-picker');
+				});
+			},
+
 			validStart: function () {
 				this.setStartDate();
 				if (this.startDate > this.endDate) {
@@ -599,12 +616,14 @@ function Ui() {
 			setDateValue: function (field, date) {
 				var sp = field.next().find('span').not('.ui-datefield-seperator');
 				field.datetimepicker("value", date);
-				sp.animationComplete(function () {
-					setTimeout(function () {
-						field.datetimepicker("value", date);
-					}, 700);
-					sp.off('animationComplete');
-				});
+				if (this.animateStatus) {
+					sp.animationComplete(function () {
+						setTimeout(function () {
+							field.datetimepicker("value", date);
+						}, 700);
+						sp.off('animationComplete');
+					});
+				}
 			},
 
 			setStartDate: function () {
@@ -661,4 +680,4 @@ function Ui() {
 		}
 	};
 
-}());
+}());
+\ No newline at end of file
diff --git a/templates/alarm.tpl b/templates/alarm.tpl
index ce54bf1..2697b48 100644
--- a/templates/alarm.tpl
+++ b/templates/alarm.tpl
@@ -1,34 +1,33 @@
-    <!-- Start of second page: #alarm -->
-    <div data-role="page" id="new_alarm" data-add-back-btn="true">
+<!-- Start of second page: #alarm -->
+<div data-role="page" id="new_alarm" data-add-back-btn="true">
 
-        <div data-role="header" data-position="fixed">
-        <h1>Set alarm</h1>
-        </div><!-- /header -->
+	<div data-role="header" data-position="fixed">
+		<h1>Set alarm</h1>
+	</div><!-- /header -->
 
-        <div data-role="content">
-            <fieldset data-role="controlgroup">
-                 <input type="radio" name="radio-choice" id="radio-choice-0" value="-1" checked="checked" />
-                 <label for="radio-choice-0">(Off)</label>
+	<div data-role="content">
+		<input type="radio" name="radio-choice" id="radio-choice-0" value="-1" />
+		<label for="radio-choice-0">(Off)</label>
 
-                 <input type="radio" name="radio-choice" id="radio-choice-1" value="0" />
-                 <label for="radio-choice-1">On time</label>
+		<input type="radio" name="radio-choice" id="radio-choice-1" value="0" checked />
+		<label for="radio-choice-1">On time</label>
 
-                 <input type="radio" name="radio-choice" id="radio-choice-2" value="5" />
-                 <label for="radio-choice-2">5 minutes before</label>
+		<input type="radio" name="radio-choice" id="radio-choice-2" value="5" />
+		<label for="radio-choice-2">5 minutes before</label>
 
-                 <input type="radio" name="radio-choice" id="radio-choice-3" value="30" />
-                 <label for="radio-choice-3">30 minutes before</label>
+		<input type="radio" name="radio-choice" id="radio-choice-3" value="30" />
+		<label for="radio-choice-3">30 minutes before</label>
 
-                 <input type="radio" name="radio-choice" id="radio-choice-4" value="60" />
-                 <label for="radio-choice-4">1 hour before</label>
+		<input type="radio" name="radio-choice" id="radio-choice-4" value="60" />
+		<label for="radio-choice-4">1 hour before</label>
 
-                 <input class="customDuration" type="number" name="radio-choice" value="0" min="-1" id="radio-choice-5" max="999"/>
-                 <label class="customDuration" for="radio-choice-5"><span class="customDurationSpan">Off</span></label>
+		<input type="radio" class="customDuration" name="radio-choice" id="yes_1" value="Yes" >
 
-            </fieldset>
-            <a href="#new_event" id="add-alarm" data-role="button">Save</a>
-        </div><!-- /content -->
+		<input placeholder="00" class="customDuration" type="number" name="radio-choice" value="0" min="0" max="99" id="customDuration"/>
+		<label class="customDuration" for="customDuration">minute(s) before</label>
+		<a href="#new_event" id="add-alarm" data-role="button">Save</a>
+	</div><!-- /content -->
 
-    <div data-role="footer" data-position ="fixed">
-    </div><!-- /footer -->
-    </div><!-- /page alarm -->
+	<div data-role="footer" data-position ="fixed">
+	</div><!-- /footer -->
+</div><!-- /page alarm -->
+\ No newline at end of file
diff --git a/templates/home.tpl b/templates/home.tpl
index 4154616..028a12d 100644
--- a/templates/home.tpl
+++ b/templates/home.tpl
@@ -4,6 +4,11 @@
 			<h1>Event manager</h1>
 		</div>
 		<div data-role="content">
+			<div>
+				<center>
+					<input type="date" id="homeDateFilter"/>
+				</center>
+			</div>
 			<div id="events_list">
 				<ul data-role="listview" data-inset="true">
 				</ul>
author	Piotr Dabrowski <p.dabrowski2@samsung.com>	2013-07-11 10:18:31 +0200
committer	Piotr Dabrowski <p.dabrowski2@samsung.com>	2013-07-11 10:18:31 +0200
commit	f4cfd407be3512ece64e11d29b595349e912991c (patch)
tree	74bb037014f2de6138f102f9c377c05dcdfdadf1
parent	18bd6028e7fba887b83c4ff10dce9670d6e0a584 (diff)
download	EventManager-f4cfd407be3512ece64e11d29b595349e912991c.tar.gz EventManager-f4cfd407be3512ece64e11d29b595349e912991c.tar.bz2 EventManager-f4cfd407be3512ece64e11d29b595349e912991c.zip