Add Modello Common libraries to web-ui-fw; version up
[profile/ivi/sdk/web-ide-resources.git] / web-ui-fw / 0.0.2 / 0.0.2_Common / original / css / car / components / dateTime / dateTime.js
1 /**
2  * Provides functions for displaying and updating date/time element.
3  * Use following snippet to include component in your `index.html` file:
4  *
5  *     <script type='text/javascript' src='./css/car/components/dateTime/dateTime.js'></script>
6  *     <link rel="stylesheet" href="./css/car/components/dateTime/dateTime.css" />
7  *
8  * and following code to initialize:
9  *
10  *     $("#clockElement").ClockPlugin('init',5);  // initialize clockElement, timer interval is set as 5 seconds
11  *     $("#clockElement").ClockPlugin('startTimer');  // start timer
12  *
13  * @class Clock
14  * @module CarTheme
15  * @constructor
16  *
17  **/
18 function Clock() {
19 }
20 /**
21  * Contains actual time and date strings.
22  * @property status
23  * @type Object
24  * @param {string} timeStr Holds actual time string.
25  * @param {string} dateStr Holds actual date string.
26  * @param {string} dayStr Holds actual day string.
27  **/
28 Clock.prototype.status = {
29         timeStr: null,
30         dateStr: null,
31         dayStr: null
32 };
33
34 /**
35  * Listener for timer events.
36  * @method handleTimerEv
37  * @param clockSelector {string} Define clock selector in document.
38  * @param dateSelector {string} Define date selector in document.
39  **/
40 Clock.prototype.handleTimerEv = function (clockSelector, dateSelector) {
41         "use strict";
42         var monthsShort = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
43         var date = new Date();
44         var hour = date.getHours();
45         var minute = date.getMinutes();
46         var ampm = hour >= 12 ? 'PM' : 'AM';
47         hour = hour % 12;
48         if (hour === 0) {
49                 hour = 12; // the hour '0' should be '12'
50         }
51         minute = minute < 10 ? '0' + minute : minute;
52         hour = hour < 10 ? '0' + hour : hour;
53         this.status.timeStr = hour + ":" + minute + " " + ampm;
54         this.status.dateStr = monthsShort[date.getMonth().toString()].toUpperCase() + " " + date.getDate().toString();
55         if (clockSelector !== null) {
56                 $(clockSelector).empty();
57                 $(clockSelector).append(this.status.timeStr);
58         }
59         if (dateSelector !== null) {
60                 $(dateSelector).empty();
61                 $(dateSelector).append(this.status.dateStr);
62         }
63 };
64
65 (function ($) {
66         "use strict";
67         /**
68          * Provides functions for dateTime JQuery Plugin panel.
69          * @class ClockPlugin
70          * @static
71          **/
72         var ClockPlugin = {
73                         /**
74                          * Holds ID for clock document element.
75                          * @property clockDiv
76                          * @type string
77                          * @default null
78                          **/
79                         clockDiv: null,
80                         /**
81                          * Holds ID for date document element.
82                          * @property dateDiv
83                          * @type string
84                          * @default null
85                          **/
86                         dateDiv: null,
87                         /**
88                          * Holds timer for clock actualization interval.
89                          * @property timer
90                          * @type timer
91                          * @default null
92                          **/
93                         timer: null,
94                         /**
95                          * Holds clock actualization interval in miliseconds.
96                          * @property miliSeconds
97                          * @type int
98                          * @default 0
99                          **/
100                         miliSeconds: 0,
101                         /**
102                          * Holds Clock object after initialization.
103                          * @property clockObj
104                          * @type Object
105                          * @default null
106                          **/
107                         clockObj: null,
108                         /**
109                          * Provides initialization of dateTime plugin.
110                          * @method init
111                          * @param seconds {int} Define clock actualization interval in seconds.
112                          **/
113                         init: function (seconds) {
114                                 this.empty();
115                                 var appendText = '<div id="clock" class="clockElemnt fontSizeXXLarge  fontColorDark fontWeightBold">TIME</div>';
116                                 appendText += '<div id="date" class="dateElemnt fontSizeXXLarge fontColorDark fontWeightBold">DATE</div>';
117                                 this.append(appendText);
118                                 ClockPlugin.clockDiv = "#clock";
119                                 ClockPlugin.dateDiv = "#date";
120                                 ClockPlugin.miliSeconds = seconds * 1000;
121                                 ClockPlugin.clockObj = new Clock();
122                                 ClockPlugin.clockObj.handleTimerEv(ClockPlugin.clockDiv, ClockPlugin.dateDiv);
123                         },
124                         /**
125                          * Provides initialization of clock actualization timer.
126                          * @method startTimer
127                          **/
128                         startTimer: function () {
129                                 ClockPlugin.timer = setInterval(function () {
130                                         ClockPlugin.clockObj.handleTimerEv(ClockPlugin.clockDiv, ClockPlugin.dateDiv);
131                                 }, ClockPlugin.miliSeconds);
132                         },
133                         /**
134                          * Provides clearing of clock actualization timer.
135                          * @method startTimer
136                          **/
137                         stopTimer: function () {
138                                 clearInterval(ClockPlugin.timer);
139                         }
140                 };
141         /**
142          * jQuery extension method for {{#crossLink "ClockPlugin"}}{{/crossLink}} plugin.
143          * @param method {Object|jQuery selector} Identificator (name) of method or jQuery selector.
144          * @method ClockPlugin
145          * @for jQuery
146          * @return Result of called method.
147          */
148         $.fn.ClockPlugin = function (method) {
149                 // Method calling logic
150                 if (ClockPlugin[method]) {
151                         return ClockPlugin[method].apply(this, Array.prototype.slice.call(arguments, 1));
152                 } else if (typeof method === 'object' || !method) {
153                         return ClockPlugin.init.apply(this, arguments);
154                 } else {
155                         $.error('Method ' + method + ' does not exist on jQuery.ClockPlugin');
156                 }
157         };
158 }(jQuery));