1 /* ***************************************************************************
2 * Copyright (c) 2000 - 2011 Samsung Electronics Co., Ltd.
4 * Permission is hereby granted, free of charge, to any person obtaining a
5 * copy of this software and associated documentation files (the "Software"),
6 * to deal in the Software without restriction, including without limitation
7 * the rights to use, copy, modify, merge, publish, distribute, sublicense,
8 * and/or sell copies of the Software, and to permit persons to whom the
9 * Software is furnished to do so, subject to the following conditions:
11 * The above copyright notice and this permission notice shall be included in
12 * all copies or substantial portions of the Software.
14 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
15 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
16 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
17 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
18 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
19 * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
20 * DEALINGS IN THE SOFTWARE.
21 * ***************************************************************************
23 * Author: Minkyu Kang <mk7.kang@samsung.com>
31 * data-role: set to 'notification'.
32 * data-type: 'ticker' or 'popup'.
33 * data-interval: time to showing. If don't set, will show infinitely.
37 * open(): open the notification.
38 * close(): close the notification.
39 * text(text0, text1): set texts or get texts
40 * icon(src): set the icon (tickernoti only)
49 * <div data-role="notification" id="notification" data-type="ticker" data-interval="3000">
50 * <img src="icon01.png">
56 * <div data-role="notification" id="notification" data-type="popup" data-interval="3000">
62 (function ( $, window ) {
63 $.widget( "tizen.notification", $.mobile.widget, {
71 _get_text: function () {
72 var text = new Array( 2 );
74 if ( this.type === 'ticker' ) {
75 text[0] = $( this.text_bg[0] ).text();
76 text[1] = $( this.text_bg[1] ).text();
78 text[0] = $( this.text_bg[0] ).text();
84 _set_text: function ( text0, text1 ) {
85 var _set = function ( elem, text ) {
92 if ( this.type === 'ticker' ) {
93 _set( $( this.text_bg[0] ), text0 );
94 _set( $( this.text_bg[1] ), text1 );
96 _set( $( this.text_bg[0] ), text0 );
100 text: function ( text0, text1 ) {
101 if ( text0 === undefined && text1 === undefined ) {
102 return this._get_text();
105 this._set_text( text0, text1 );
108 icon: function ( src ) {
109 if ( src === undefined ) {
113 this.icon_img.detach();
114 this.icon_img = $( "<img src='" + src + "' class='ui-ticker-icon'>" );
115 $( this.element ).find(".ui-ticker").append( this.icon_img );
118 _refresh: function () {
119 var container = this._get_container();
121 $( container ).addClass("fix")
123 .removeClass("hide");
125 this._set_interval();
129 var container = this._get_container();
131 if ( this.running ) {
136 $( container ).addClass("show")
142 if ( this.type === 'popup' ) {
143 this._set_position();
146 this._set_interval();
150 var container = this._get_container();
152 if ( !this.running ) {
156 $( container ).addClass("hide")
160 this.running = false;
161 clearInterval( this.interval );
164 destroy: function () {
165 var container = this._get_container();
167 $( container ).removeClass("show")
173 this.running = false;
176 _get_container: function () {
177 if ( this.type === 'ticker' ) {
178 return $( this.element ).find(".ui-ticker");
181 return $( this.element ).find(".ui-smallpopup");
184 _set_interval: function () {
187 clearInterval( this.interval );
189 if ( this.seconds !== undefined && this.second !== 0 ) {
190 this.interval = setInterval( function () {
196 _add_event: function () {
198 container = this._get_container();
200 if ( this.type === 'ticker' ) {
201 container.find(".ui-ticker-btn").append( this.btn ).trigger("create");
203 this.btn.bind( "vmouseup", function () {
208 container.bind( 'vmouseup', function () {
213 _del_event: function () {
214 var container = this._get_container();
216 if ( this.type === 'ticker' ) {
217 this.btn.unbind("vmouseup");
219 container.unbind('vmouseup');
220 clearInterval( this.interval );
223 _set_position: function () {
224 var container = this._get_container(),
225 $footer = $('.ui-page-active').children('.ui-footer'),
226 footer_h = $footer.outerHeight() || 0;
228 container.css( 'bottom', footer_h);
231 _create: function () {
233 elem = $( this.element ),
236 this.btn = $('<div data-role="button" data-inline="true">Close</div>');
238 this.seconds = elem.jqmData('interval');
239 this.type = elem.jqmData('type') || 'popup';
241 if ( this.type === 'ticker' ) {
242 elem.wrapInner("<div class='ui-ticker'></div>");
243 elem.find(".ui-ticker").append("<div class='ui-ticker-body'></div>" +
244 "<div class='ui-ticker-btn'></div>");
245 this.text_bg = elem.find("p");
247 if ( this.text_bg.length < 2 ) {
248 elem.find(".ui-ticker").append("<p></p><p></p>");
249 this.text_bg = elem.find("p");
250 } else if ( this.text_bg.length > 2 ) {
251 for ( i = 2; i < this.text_bg.length; i++ ) {
252 $( this.text_bg[i] ).css( "display", "none" );
256 $( this.text_bg[0] ).addClass("ui-ticker-text1-bg");
257 $( this.text_bg[1] ).addClass("ui-ticker-text2-bg");
259 this.icon_img = elem.find("img");
261 if ( this.icon_img.length ) {
262 $( this.icon_img ).addClass("ui-ticker-icon");
264 for ( i = 1; i < this.icon_img.length; i++ ) {
265 $( this.icon_img[i] ).css( "display", "none" );
269 elem.wrapInner("<div class='ui-smallpopup'></div>");
270 this.text_bg = elem.find("p").addClass("ui-smallpopup-text-bg");
272 if ( this.text_bg.length < 1 ) {
273 elem.find(".ui-smallpopup")
274 .append("<p class='ui-smallpopup-text-bg'></p>");
275 this.text_bg = elem.find("p");
276 } else if ( this.text_bg.length > 1 ) {
277 for ( i = 1; i < this.text_bg.length; i++ ) {
278 $( this.text_bg[i] ).css( "display", "none" );
282 this._set_position();
287 $( window ).bind( "resize", function () {
288 if ( !self.running ) {
294 if ( self.type === 'popup' ) {
295 self._set_position();
301 // auto self-init widgets
302 $( document ).bind( "pagecreate create", function ( e ) {
303 $( e.target ).find(":jqmData(role='notification')").notification();
306 $( document ).bind( "pagebeforehide", function ( e ) {
307 $( e.target ).find(":jqmData(role='notification')").notification('destroy');