2 Author: Minkyu Kang <mk7.kang@samsung.com>
10 * data-role: set to 'nocontents'.
11 * data-text1: top message.
12 * data-text2: bottom message.
13 * data-type: type of nocontents. You can set text, picture, multimedia and unnamed.
26 * <div data-role="nocontents" id="nocontents" data-text1="Text1" data-text2="Text2" data-type="text"></div>
29 * <div data-role="nocontents" id="nocontents" data-text1="Text1" data-text2="Text2" data-type="picture"></div>
32 * <div data-role="nocontents" id="nocontents" data-text1="Text1" data-text2="Text2" data-type="multimedia"></div>
35 * <div data-role="nocontents" id="nocontents" data-text1="Text1" data-text2="Text2"></div>
37 * <div data-role="nocontents" id="nocontents" data-text1="Text1" data-text2="Text2" data-type="unnamed"></div>
41 (function ( $, window, undefined ) {
42 $.widget( "tizen.nocontents", $.mobile.widget, {
50 _get_height: function () {
51 var $page = $('.ui-page'),
52 $content = $page.children('.ui-content'),
53 $header = $page.children('.ui-header'),
54 $footer = $page.children('.ui-footer'),
56 header_h = $header.outerHeight() || 0,
57 footer_h = $footer.outerHeight() || 0,
58 padding_t = parseFloat( $content.css('padding-top') ) || 0,
59 padding_b = parseFloat( $content.css('padding-bottom') ) || 0;
61 content_h = window.innerHeight - header_h - footer_h -
62 (padding_t + padding_b) * 2;
64 var container_h = this.container.height();
66 return ( content_h < container_h ? container_h : content_h );
70 var content_height = this._get_height(),
71 icon_height = this.icon_img.height(),
72 icon_width = this.icon_img.width(),
74 text0_height = this.text0_bg.height() || 0,
75 text1_height = this.text1_bg.height() || 0,
76 icon_top = (content_height -
77 (icon_height + content_gap +
78 text0_height + text1_height)) / 2;
80 if ( icon_top < content_gap ) {
81 icon_top = content_gap;
84 this.container.height( content_height );
86 this.icon_img.css( 'left',
87 (window.innerWidth - icon_width) / 2 );
88 this.icon_img.css( 'top', icon_top );
90 var text_top = icon_top + icon_height + content_gap;
92 this.text0_bg.css( 'top', text_top );
93 this.text1_bg.css( 'top', text_top + text0_height );
96 _create: function () {
97 var icon_type = $( this.element ).attr('data-type');
99 if ( icon_type === undefined ||
100 (icon_type !== "picture" &&
101 icon_type !== "multimedia" &&
102 icon_type !== "text") ) {
103 icon_type = "unnamed";
106 var text = new Array(2);
108 text[0] = $( this.element ).attr('data-text1');
109 text[1] = $( this.element ).attr('data-text2');
111 if ( text[0] === undefined ) {
115 if ( text[1] === undefined ) {
119 this.container = $('<div class="ui-nocontents"/>');
120 this.icon_img = $('<div class="ui-nocontents-icon-' +
123 this.text0_bg = $('<div class="ui-nocontents-text">' +
125 this.text1_bg = $('<div class="ui-nocontents-text">' +
128 this.container.append( this.icon_img );
129 this.container.append( this.text0_bg );
130 this.container.append( this.text1_bg );
132 $( this.element ).append( this.container );
138 $( document ).bind( "pagecreate create", function ( e ) {
139 $( e.target ).find(":jqmData(role='nocontents')").nocontents();