1 From 74d2890f4532f8525448fb53d8e648d86f41cd36 Mon Sep 17 00:00:00 2001
2 From: "hjnim.kim" <hjnim.kim@samsung.com>
3 Date: Wed, 20 Mar 2013 21:21:51 +0900
4 Subject: [PATCH] JQM Apply tizen style popup
8 Change-Id: I8c55f10921053f2adbe230b772a3b9a5ad73a232
9 Signed-off-by: hyunjung kim<hjnim.kim@samsung.com>
11 libs/js/jquery-mobile-1.2.0/js/widgets/popup.js | 108 ++++++++++++++++++++--
12 1 files changed, 98 insertions(+), 10 deletions(-)
14 diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js b/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js
15 index 8174055..32726bc 100644
16 --- a/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js
17 +++ b/libs/js/jquery-mobile-1.2.0/js/widgets/popup.js
18 @@ -58,7 +58,7 @@ define( [ "jquery",
19 // https://github.com/jquery/jquery-mobile/issues/4784
21 // NOTE this option is modified in _create!
22 - history: !$.mobile.browser.ie
26 _eatEventAndClose: function( e ) {
27 @@ -109,7 +109,7 @@ define( [ "jquery",
30 _resizeTimeout: function() {
31 - if ( !this._maybeRefreshTimeout() ) {
32 + if ( !this._maybeRefreshTimeout() && this.positionTo === "window" ) {
33 // effectively rapid-open the popup while leaving the screen intact
34 this._trigger( "beforeposition" );
36 @@ -144,7 +144,8 @@ define( [ "jquery",
38 screen: $( "<div class='ui-screen-hidden ui-popup-screen'></div>" ),
39 placeholder: $( "<div style='display: none;'><!-- placeholder --></div>" ),
40 - container: $( "<div class='ui-popup-container ui-selectmenu-hidden'></div>" )
41 + container: $( "<div class='ui-popup-container ui-selectmenu-hidden'></div>" ),
42 + arrow : $("<div class='ui-arrow'></div>")
44 thisPage = this.element.closest( ".ui-page" ),
45 myId = this.element.attr( "id" ),
46 @@ -174,7 +175,7 @@ define( [ "jquery",
47 ui.placeholder.html( "<!-- placeholder for " + myId + " -->" );
49 ui.container.append( this.element );
51 + ui.container.append( ui.arrow );
52 // Add class to popup element
53 this.element.addClass( "ui-popup" );
55 @@ -276,7 +277,7 @@ define( [ "jquery",
58 _setTolerance: function( value ) {
59 - var tol = { t: 30, r: 15, b: 30, l: 15 };
60 + var tol = { t: 5, r: 5, b: 5, l: 5 };
63 var ar = String( value ).split( "," );
64 @@ -361,7 +362,11 @@ define( [ "jquery",
65 cx: winCoords.cx - this._tolerance.l - this._tolerance.r,
66 cy: winCoords.cy - this._tolerance.t - this._tolerance.b
70 + linkOffset = $(this.link).offset(),
71 + positionOffsets = [],
72 + correctionValue = [0,0],
75 // Clamp the width of the menu before grabbing its size
76 this._ui.container.css( "max-width", rc.cx );
77 @@ -389,7 +394,50 @@ define( [ "jquery",
79 ret.y -= Math.min( ret.y, Math.max( 0, ret.y + menuSize.cy - docHeight ) );
81 - return { left: ret.x, top: ret.y };
82 + if ( this.positionTo !== "origin" )
84 + return { left: ret.x, top: ret.y , arrowleft: 0 , arrowtop: 0};
87 + positionOffsets = [ linkOffset.left,
89 + docEl.clientHeight - ( linkOffset.top + $(this.link).height() ),
90 + docEl.clientWidth - ( linkOffset.left + $(this.link).width() )];
91 + arrayIdx = positionOffsets.indexOf(Math.max.apply(window,positionOffsets));
96 + correctionValue = [ -$(this.link).width() , 0];
97 + arrowtop = ( linkOffset.top - ret.y ) + ( $(this.link).height() / 2 ) - parseInt( $(this._ui.arrow).css("border-width") ) ;
98 + arrowleft = menuSize.cx;
99 + $(this._ui.arrow).attr( "class", "" )
100 + .addClass( "ui-arrow left" )
103 + correctionValue = [ 0 , -(ret.y + menuSize.cy - linkOffset.top)];
104 + arrowtop = menuSize.cy - 2;
105 + arrowleft = (linkOffset.left - ret.x + correctionValue[0]) + ( $(this.link).width() / 2 ) - parseInt( $(this._ui.arrow).css("border-width") ) / 2;
106 + $(this._ui.arrow).attr( "class", "" )
107 + .addClass( "ui-arrow bottom" );
110 + correctionValue = [ 0 , ( linkOffset.top + $(this.link).height() - ret.y ) ];
111 + arrowtop = - parseInt( $(this._ui.arrow).css("border-width") ) * 2 + 1;
112 + arrowleft = (linkOffset.left - ret.x + correctionValue[0]) + ( $(this.link).width() / 2 ) - parseInt( $(this._ui.arrow).css("border-width") ) / 2;
113 + $(this._ui.arrow).attr( "class", "" )
114 + .addClass("ui-arrow top");
117 + correctionValue = [ ( menuSize.cx < $(this.link).width() ) ? ( $(this.link).width() / 2 ) + ( menuSize.cx / 2) : $(this.link).width() , 0];
118 + arrowtop = ( linkOffset.top - ret.y ) + ( $(this.link).height() / 2 ) - parseInt( $(this._ui.arrow).css("border-width") ) ;
119 + arrowleft = - parseInt( $(this._ui.arrow).css("border-width") ) * 2;
120 + $(this._ui.arrow).attr( "class", "" )
121 + .addClass("ui-arrow right");
125 + return { left: ret.x + correctionValue[0], top: ret.y + correctionValue[1] , arrowleft: arrowleft , arrowtop: arrowtop };
128 _createPrereqs: function( screenPrereq, containerPrereq, whenDone ) {
129 @@ -569,7 +617,7 @@ define( [ "jquery",
131 .removeClass( "ui-selectmenu-hidden" )
134 + this._ui.arrow.css( { top : coords.arrowtop, left : coords.arrowleft } );
135 if ( this.options.overlayTheme && androidBlacklist ) {
137 The native browser on Android 4.0.X ("Ice Cream Sandwich") suffers from an issue where the popup overlay appears to be z-indexed
138 @@ -694,15 +742,55 @@ define( [ "jquery",
139 // what should be in _open. Seems to be "visual" vs "history" for now
140 open: function( options ) {
141 var self = this, opts = this.options, url, hashkey, activePage, currentIsDialog, hasHash, urlHistory;
143 + // self.link = ( $(event.target).attr('data-role') === 'button') ? event.target : $(event.target).closest('[data-role="button"]')[0];
144 // make sure open is idempotent
145 if( $.mobile.popup.active ) {
149 // set the global popup mutex
150 $.mobile.popup.active = this;
155 + if ( !options.link ) {
157 + self.positionTo = "window";
159 + self.link = ( $(event.target).closest('a')[0] || $(event.target).closest('div')[0] );
162 + self.link = options.link;
165 + self.positionTo = ( options != null && options.positionTo != null ) ? options.positionTo : "origin";
168 + if ( $(self.link).jqmData("position-to") !== "window"
169 + && self.positionTo !== "window" ) {
171 + $(self.element).addClass("ui-ctxpopup");
172 + $(self._ui.container).removeClass("ui-popup-container")
173 + .addClass("ui-ctxpopup-container");
175 + if( self.positionTo !== "origin" ) {
176 + $(self._ui.arrow).hide();
178 + $(self._ui.arrow).show();
181 + $(self._ui.arrow).hide();
182 + // apply opacity back screen
183 + this._setOverlayTheme( "dim" );
186 + && self.positionTo === "origin" ) {
187 + options.x = $(self.link).offset().left + $(self.link).outerWidth() / 2;
190 + && self.positionTo === "origin" ) {
191 + options.y = $(self.link).offset().top + $(self.link).outerHeight() / 2;
193 // if history alteration is disabled close on navigate events
194 // and leave the url as is
195 if( !( opts.history ) ) {