From: hc7.choi <hc7choi@hc7.choi>
Date: Wed, 3 Jul 2013 02:17:04 +0000 (+0900)
Subject: JQM patch : Improve toggleswitch ux.
X-Git-Tag: submit/tizen_2.2/20130714.154816~2^2~14
X-Git-Url: http://review.tizen.org/git/?a=commitdiff_plain;h=90f9b7ed4e49d5224330f0e4f3e496bfdafddf40;p=framework%2Fweb%2Fweb-ui-fw.git

JQM patch : Improve toggleswitch ux.

Add class(ui-toggle-on and ui-toggle-off) in toggleswitch and modify toggleswitch css.

Change-Id: Ib1115cb50aebc7d432f9636ec4672900e496065d
---

diff --git a/libs/patch/0053-JQM-improve-toggleswitch-ux.patch b/libs/patch/0053-JQM-improve-toggleswitch-ux.patch
new file mode 100644
index 0000000..6c5fd52
--- /dev/null
+++ b/libs/patch/0053-JQM-improve-toggleswitch-ux.patch
@@ -0,0 +1,44 @@
+From 6b2dd832ab185ad44018951a61d325ceff4e29a1 Mon Sep 17 00:00:00 2001
+From: "hc7.choi" <hc7choi@hc7.choi>
+Date: Wed, 3 Jul 2013 11:05:54 +0900
+Subject: [PATCH] JQM improve toggleswitch ux
+
+Change-Id: I1de483c52ec7a6a569d618f4f88d0bcdefb57bd0
+---
+ .../jquery-mobile-1.2.0/js/widgets/forms/slider.js |   13 +++++++++++++
+ 1 file changed, 13 insertions(+)
+
+diff --git a/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js b/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js
+index bd75f59..35f1772 100644
+--- a/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js
++++ b/libs/js/jquery-mobile-1.2.0/js/widgets/forms/slider.js
+@@ -83,6 +83,11 @@ $.widget( "mobile.slider", $.mobile.widget, {
+ 		if ( $( control ).find( "option" ).length && $( control ).find( "option" ).text() === "" ) {
+ 			$( domSlider ).addClass( "ui-toggle-switch" );
+ 		}
++		if( val() === "1" ) {
++			$( domHandle ).addClass( "ui-toggle-on" );
++		} else {
++			$( domHandle ).addClass( "ui-toggle-off" );
++		}
+ 		handle.buttonMarkup({ corners: true, theme: theme, shadow: true })
+ 				.attr({
+ 					"role": "slider",
+@@ -401,6 +406,14 @@ $.widget( "mobile.slider", $.mobile.widget, {
+ 				title: cType === "input" ? newval : control.find( "option" ).eq( newval ).getEncodedText()
+ 			});
+ 
++		if( percent === 100 && this.handle.hasClass( "ui-slider-handle-snapping" ) ) {
++			this.handle.removeClass( "ui-toggle-off" );
++			this.handle.addClass( "ui-toggle-on" );
++		} else if ( percent === 0 && this.handle.hasClass( "ui-slider-handle-snapping" ) ) {
++			this.handle.removeClass( "ui-toggle-on" );
++			this.handle.addClass( "ui-toggle-off" );
++		}
++
+ 		if ( this.valuebg ) {
+ 			this.valuebg.css( "width", percent + "%" );
+ 		}
+-- 
+1.7.9.5
+
diff --git a/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less b/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less
index 7a840e7..36f17cb 100644
--- a/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less
+++ b/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less
@@ -26,11 +26,11 @@ div.ui-slider.ui-toggle-switch {
 		height : 32 * @unit_base;
 		-webkit-background-size: 100% 100%;
 		margin-top: 0 * @unit_base;
-		&[aria-valuenow="on"] {
+		&.ui-toggle-on {
 			background-image: url(images/00_button_on_handler.png);
 			padding-right : 0;
 		}
-		&[aria-valuenow="off"] {
+		&.ui-toggle-off {
 			background-image: url(images/00_button_off_handler.png);
 			padding-right : 0;
 		}