From 2c9539a694d8b724fddfac1214c701f13eebe795 Mon Sep 17 00:00:00 2001
From: AhmedMustafa
Date: Fri, 4 Mar 2016 14:46:10 +0200
Subject: [PATCH 01/18] Accordion: Adding RTL support
---
demos/accordion/default-rtl.html | 76 ++++++++++++++++++++++++++++++++
demos/accordion/index.html | 1 +
themes/base/accordion.css | 11 +++++
ui/widget.js | 4 ++
ui/widgets/accordion.js | 6 +++
5 files changed, 98 insertions(+)
create mode 100644 demos/accordion/default-rtl.html
diff --git a/demos/accordion/default-rtl.html b/demos/accordion/default-rtl.html
new file mode 100644
index 00000000000..2a2c9ad9efc
--- /dev/null
+++ b/demos/accordion/default-rtl.html
@@ -0,0 +1,76 @@
+
+
+
+
+
+ jQuery UI Accordion - Default functionality
+
+
+
+
+
+
+
+
+
Section 1
+
+
+ Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
+ ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
+ amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
+ odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
+
+
+
Section 2
+
+
+ Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
+ purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
+ velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
+ suscipit faucibus urna.
+
+
+
Section 3
+
+
+ Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
+ Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
+ ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
+ lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
+
+
+ List item one
+ List item two
+ List item three
+
+
+
Section 4
+
+
+ Cras dictum. Pellentesque habitant morbi tristique senectus et netus
+ et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
+ faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
+ mauris vel est.
+
+
+ Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
+ Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
+ inceptos himenaeos.
+
+
+
+
+
+
+Click headers to expand/collapse content that is broken into logical sections, much like tabs.
+Optionally, toggle sections open/closed on mouseover.
+
+
+The underlying HTML markup is a series of headers (H3 tags) and content divs so the content is
+usable without JavaScript.
+
+
+
+
diff --git a/demos/accordion/index.html b/demos/accordion/index.html
index 4f364a299ab..abf6102095a 100644
--- a/demos/accordion/index.html
+++ b/demos/accordion/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(RTL)
Fill space
No auto height
Collapse content
diff --git a/themes/base/accordion.css b/themes/base/accordion.css
index baffce488b1..06048e792f2 100644
--- a/themes/base/accordion.css
+++ b/themes/base/accordion.css
@@ -21,3 +21,14 @@
border-top: 0;
overflow: auto;
}
+
+/* RTL support */
+.ui-accordion-rtl {
+ direction: rtl;
+}
+.ui-accordion-rtl .ui-accordion .ui-accordion-header {
+ padding: .5em .7em .5em .5em;
+}
+.ui-accordion-header-iconRtl.ui-icon {
+ transform: scaleX(-1);
+}
\ No newline at end of file
diff --git a/ui/widget.js b/ui/widget.js
index e38c0c87176..52c8daacb55 100644
--- a/ui/widget.js
+++ b/ui/widget.js
@@ -331,6 +331,10 @@ $.Widget.prototype = {
return {};
},
+ isRtl: function() {
+ return this.element.css( "direction" ) === "rtl";
+ },
+
_getCreateEventData: $.noop,
_create: $.noop,
diff --git a/ui/widgets/accordion.js b/ui/widgets/accordion.js
index 359b4c46f62..fef766c6896 100644
--- a/ui/widgets/accordion.js
+++ b/ui/widgets/accordion.js
@@ -78,6 +78,9 @@ return $.widget( "ui.accordion", {
var options = this.options;
this.prevShow = this.prevHide = $();
+ if ( this.isRtl() ) {
+ this._addClass( ".ui-accordion-rtl" );
+ }
this._addClass( "ui-accordion", "ui-widget ui-helper-reset" );
this.element.attr( "role", "tablist" );
@@ -108,6 +111,9 @@ return $.widget( "ui.accordion", {
if ( icons ) {
icon = $( "" );
+ if ( this.isRtl() ) {
+ this._addClass( icon, "ui-accordion-header-iconRtl" );
+ }
this._addClass( icon, "ui-accordion-header-icon", "ui-icon " + icons.header );
icon.prependTo( this.headers );
children = this.active.children( ".ui-accordion-header-icon" );
From 34004ae668fd0d032eccd2e3b4dd52289d4f4193 Mon Sep 17 00:00:00 2001
From: AhmedMustafa
Date: Sun, 6 Mar 2016 20:35:35 +0200
Subject: [PATCH 02/18] Accordion: updating rtl support in ui.accordion
---
demos/accordion/default-rtl.html | 7 ++++++-
themes/base/accordion.css | 13 +------------
ui/widgets/accordion.js | 6 ------
3 files changed, 7 insertions(+), 19 deletions(-)
diff --git a/demos/accordion/default-rtl.html b/demos/accordion/default-rtl.html
index 2a2c9ad9efc..cb6ff6035fa 100644
--- a/demos/accordion/default-rtl.html
+++ b/demos/accordion/default-rtl.html
@@ -8,7 +8,12 @@
diff --git a/themes/base/accordion.css b/themes/base/accordion.css
index 06048e792f2..6854be509b2 100644
--- a/themes/base/accordion.css
+++ b/themes/base/accordion.css
@@ -13,7 +13,7 @@
cursor: pointer;
position: relative;
margin: 2px 0 0 0;
- padding: .5em .5em .5em .7em;
+ padding: .5em;
font-size: 100%;
}
.ui-accordion .ui-accordion-content {
@@ -21,14 +21,3 @@
border-top: 0;
overflow: auto;
}
-
-/* RTL support */
-.ui-accordion-rtl {
- direction: rtl;
-}
-.ui-accordion-rtl .ui-accordion .ui-accordion-header {
- padding: .5em .7em .5em .5em;
-}
-.ui-accordion-header-iconRtl.ui-icon {
- transform: scaleX(-1);
-}
\ No newline at end of file
diff --git a/ui/widgets/accordion.js b/ui/widgets/accordion.js
index fef766c6896..359b4c46f62 100644
--- a/ui/widgets/accordion.js
+++ b/ui/widgets/accordion.js
@@ -78,9 +78,6 @@ return $.widget( "ui.accordion", {
var options = this.options;
this.prevShow = this.prevHide = $();
- if ( this.isRtl() ) {
- this._addClass( ".ui-accordion-rtl" );
- }
this._addClass( "ui-accordion", "ui-widget ui-helper-reset" );
this.element.attr( "role", "tablist" );
@@ -111,9 +108,6 @@ return $.widget( "ui.accordion", {
if ( icons ) {
icon = $( "" );
- if ( this.isRtl() ) {
- this._addClass( icon, "ui-accordion-header-iconRtl" );
- }
this._addClass( icon, "ui-accordion-header-icon", "ui-icon " + icons.header );
icon.prependTo( this.headers );
children = this.active.children( ".ui-accordion-header-icon" );
From 8f8652756ae9dd9cfef6dbcb11c3515dc92e6686 Mon Sep 17 00:00:00 2001
From: AhmedMustafa
Date: Mon, 7 Mar 2016 10:28:56 +0200
Subject: [PATCH 03/18] Autocomplete: Adding ui-mirroring support
---
demos/autocomplete/default-rtl.html | 52 +++++++++++++++++++++++++++++
demos/autocomplete/index.html | 1 +
themes/base/autocomplete.css | 3 ++
ui/widgets/autocomplete.js | 6 +++-
4 files changed, 61 insertions(+), 1 deletion(-)
create mode 100644 demos/autocomplete/default-rtl.html
diff --git a/demos/autocomplete/default-rtl.html b/demos/autocomplete/default-rtl.html
new file mode 100644
index 00000000000..f9c10aecdf0
--- /dev/null
+++ b/demos/autocomplete/default-rtl.html
@@ -0,0 +1,52 @@
+
+
+
+
+
+ jQuery UI Autocomplete - Default functionality
+
+
+
+
+
+
+
+
+ Tags:
+
+
+
+
+
The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.
+
The datasource is a simple JavaScript array, provided to the widget using the source-option.
+
+
+
diff --git a/demos/autocomplete/index.html b/demos/autocomplete/index.html
index 03f80c8fa79..7f6c49a3069 100644
--- a/demos/autocomplete/index.html
+++ b/demos/autocomplete/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(rtl)
Remote datasource
Remote with caching
Remote JSONP datasource
diff --git a/themes/base/autocomplete.css b/themes/base/autocomplete.css
index 7fcb2829ef4..0f19a2319df 100644
--- a/themes/base/autocomplete.css
+++ b/themes/base/autocomplete.css
@@ -14,3 +14,6 @@
left: 0;
cursor: default;
}
+.ui-autocomplete-menu-rtl {
+ direction: rtl;
+}
diff --git a/ui/widgets/autocomplete.js b/ui/widgets/autocomplete.js
index 079b0dab07b..15301886c3a 100644
--- a/ui/widgets/autocomplete.js
+++ b/ui/widgets/autocomplete.js
@@ -223,6 +223,9 @@ $.widget( "ui.autocomplete", {
.menu( "instance" );
this._addClass( this.menu.element, "ui-autocomplete", "ui-front" );
+ if ( this.isRtl() ) {
+ this._addClass( this.menu.element, "ui-autocomplete-menu-rtl" );
+ }
this._on( this.menu.element, {
mousedown: function( event ) {
@@ -539,9 +542,10 @@ $.widget( "ui.autocomplete", {
// Size and position menu
ul.show();
this._resizeMenu();
+ var pos = this.isRtl() ? { my: "right top", at: "right bottom", collision: "none" } : this.options.position;
ul.position( $.extend( {
of: this.element
- }, this.options.position ) );
+ }, pos ) );
if ( this.options.autoFocus ) {
this.menu.next();
From 8ba121032fad43db77a68977cbdb626916d28205 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Tue, 15 Mar 2016 15:39:35 +0200
Subject: [PATCH 04/18] Autocomplete: ui mirroring support
---
demos/autocomplete/default-rtl.html | 7 +++++++
themes/base/autocomplete.css | 2 +-
ui/widgets/autocomplete.js | 6 ++----
3 files changed, 10 insertions(+), 5 deletions(-)
diff --git a/demos/autocomplete/default-rtl.html b/demos/autocomplete/default-rtl.html
index f9c10aecdf0..6dc22b2afcf 100644
--- a/demos/autocomplete/default-rtl.html
+++ b/demos/autocomplete/default-rtl.html
@@ -24,6 +24,7 @@
"Haskell",
"Java",
"JavaScript",
+ "J too loooooooooooooooooooooooong item",
"Lisp",
"Perl",
"PHP",
@@ -35,6 +36,12 @@
$( "#tags" ).autocomplete({
source: availableTags
});
+ var instance = $( "#tags" ).autocomplete("instance");
+ var pos = { my: "left top", at: "left bottom", collision: "none" };
+ if(instance.isRtl()){
+ pos = { my: "right top", at: "right bottom", collision: "none" };
+ }
+ instance.option("position", pos);
diff --git a/themes/base/autocomplete.css b/themes/base/autocomplete.css
index 0f19a2319df..6182d047b2a 100644
--- a/themes/base/autocomplete.css
+++ b/themes/base/autocomplete.css
@@ -14,6 +14,6 @@
left: 0;
cursor: default;
}
-.ui-autocomplete-menu-rtl {
+.ui-rtl {
direction: rtl;
}
diff --git a/ui/widgets/autocomplete.js b/ui/widgets/autocomplete.js
index 15301886c3a..f4cb76f30d3 100644
--- a/ui/widgets/autocomplete.js
+++ b/ui/widgets/autocomplete.js
@@ -224,7 +224,7 @@ $.widget( "ui.autocomplete", {
this._addClass( this.menu.element, "ui-autocomplete", "ui-front" );
if ( this.isRtl() ) {
- this._addClass( this.menu.element, "ui-autocomplete-menu-rtl" );
+ this._addClass( this.menu.element, "ui-rtl" );
}
this._on( this.menu.element, {
mousedown: function( event ) {
@@ -542,10 +542,9 @@ $.widget( "ui.autocomplete", {
// Size and position menu
ul.show();
this._resizeMenu();
- var pos = this.isRtl() ? { my: "right top", at: "right bottom", collision: "none" } : this.options.position;
ul.position( $.extend( {
of: this.element
- }, pos ) );
+ }, this.options.position ) );
if ( this.options.autoFocus ) {
this.menu.next();
@@ -556,7 +555,6 @@ $.widget( "ui.autocomplete", {
mousedown: "_closeOnClickOutside"
} );
},
-
_resizeMenu: function() {
var ul = this.menu.element;
ul.outerWidth( Math.max(
From 1946111329cac90ffb97f30437bdf160885df3a7 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Tue, 15 Mar 2016 23:33:39 +0200
Subject: [PATCH 05/18] Button: Adding ui mirroring support
---
demos/button/icons-rtl.html | 65 +++++++++++++++++++++++++++++++++++++
demos/button/index.html | 1 +
themes/base/core.css | 7 ++++
ui/widgets/button.js | 3 ++
4 files changed, 76 insertions(+)
create mode 100644 demos/button/icons-rtl.html
diff --git a/demos/button/icons-rtl.html b/demos/button/icons-rtl.html
new file mode 100644
index 00000000000..3c076f9a823
--- /dev/null
+++ b/demos/button/icons-rtl.html
@@ -0,0 +1,65 @@
+
+
+
+
+
+ jQuery UI Button - Icons
+
+
+
+
+
+
+
+
Widget
+ Button with only text
+ Button with icon only
+ Button with icon on the left
+ Button with icon on the right
+ Button with icon on the top
+ Button with icon on the bottom
+
+
+
CSS
+
+ Button with only text
+
+
+ Button with icon only
+
+
+ Button with icon on the left
+
+
+ Button with icon on the right
+
+
+ Button with icon on the top
+
+
+ Button with icon on the bottom
+
+
+
+
Some buttons with various combinations of text and icons.
+
+
+
diff --git a/demos/button/index.html b/demos/button/index.html
index 55eacffd811..bd7021b2b27 100644
--- a/demos/button/index.html
+++ b/demos/button/index.html
@@ -10,6 +10,7 @@
diff --git a/themes/base/core.css b/themes/base/core.css
index 2ff5d2da433..02b55311535 100644
--- a/themes/base/core.css
+++ b/themes/base/core.css
@@ -95,3 +95,10 @@
width: 100%;
height: 100%;
}
+/* Rtl support*/
+.ui-rtl.ui-widget-icon-block {
+ left: auto;
+ right: 50%;
+ margin-left: 0;
+ margin-right: -8px;
+}
\ No newline at end of file
diff --git a/ui/widgets/button.js b/ui/widgets/button.js
index 50da9f9e22e..52d22cb5ba2 100644
--- a/ui/widgets/button.js
+++ b/ui/widgets/button.js
@@ -169,6 +169,9 @@ $.widget( "ui.button", {
// If the icon is on top or bottom we need to add the ui-widget-icon-block class and remove
// the iconSpace if there is one.
if ( displayBlock ) {
+ if ( this.isRtl() ) {
+ this._addClass( this.icon, null, "ui-rtl" );
+ }
this._addClass( this.icon, null, "ui-widget-icon-block" );
if ( this.iconSpace ) {
this.iconSpace.remove();
From 1a478215c6cfb8aaaa6781650f0bd22b077dc6bc Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Wed, 16 Mar 2016 20:01:05 +0200
Subject: [PATCH 06/18] Controlgroup: Adding ui mirroring support
---
demos/controlgroup/default-rtl.html | 86 +++++++++++++++++++++++++++++
demos/controlgroup/index.html | 1 +
themes/base/controlgroup.css | 16 ++++++
ui/widgets/controlgroup.js | 3 +
4 files changed, 106 insertions(+)
create mode 100644 demos/controlgroup/default-rtl.html
diff --git a/demos/controlgroup/default-rtl.html b/demos/controlgroup/default-rtl.html
new file mode 100644
index 00000000000..db5173e14fb
--- /dev/null
+++ b/demos/controlgroup/default-rtl.html
@@ -0,0 +1,86 @@
+
+
+
+
+ jQuery UI Controlgroup - Default Functionality
+
+
+
+
+
+
+
+
+
+
A controlgroup featuring various form controls. The first features a horizontal toolbar like orientation, the second is in a space saving vertical orientation for usages like mobile devices and panels.
+
+
+
diff --git a/demos/controlgroup/index.html b/demos/controlgroup/index.html
index 5aa4f5fd6a0..efb1f8306ce 100644
--- a/demos/controlgroup/index.html
+++ b/demos/controlgroup/index.html
@@ -9,6 +9,7 @@
diff --git a/themes/base/controlgroup.css b/themes/base/controlgroup.css
index 35e442e174b..ff08d9c38a6 100644
--- a/themes/base/controlgroup.css
+++ b/themes/base/controlgroup.css
@@ -63,3 +63,19 @@
border-top-style: solid;
}
+/* Rtl support*/
+.ui-controlgroup-rtl.ui-controlgroup > .ui-controlgroup-item {
+ float: right;
+}
+.ui-controlgroup-rtl.ui-controlgroup-vertical > .ui-controlgroup-item {
+ float: none;
+ text-align: right;
+}
+.ui-controlgroup-rtl.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item {
+ border-left: none;
+ border-right: none;
+}
+.ui-controlgroup-rtl.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
+ border-right: none;
+ border-left: none;
+}
diff --git a/ui/widgets/controlgroup.js b/ui/widgets/controlgroup.js
index ceb78c7c335..be540c8c262 100644
--- a/ui/widgets/controlgroup.js
+++ b/ui/widgets/controlgroup.js
@@ -213,6 +213,9 @@ return $.widget( "ui.controlgroup", {
var children,
that = this;
+ if ( this.isRtl() ) {
+ this._addClass( "ui-controlgroup-rtl" );
+ }
this._addClass( "ui-controlgroup ui-controlgroup-" + this.options.direction );
if ( this.options.direction === "horizontal" ) {
From 6a00fb0b465880bbe6117e390c72e4e55e275b31 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Wed, 16 Mar 2016 20:06:34 +0200
Subject: [PATCH 07/18] Checkboxradio: Adding rtl demo
---
demos/checkboxradio/default-rtl.html | 63 ++++++++++++++++++++++++++++
demos/checkboxradio/index.html | 1 +
2 files changed, 64 insertions(+)
create mode 100644 demos/checkboxradio/default-rtl.html
diff --git a/demos/checkboxradio/default-rtl.html b/demos/checkboxradio/default-rtl.html
new file mode 100644
index 00000000000..f228f66ea4b
--- /dev/null
+++ b/demos/checkboxradio/default-rtl.html
@@ -0,0 +1,63 @@
+
+
+
+
+ jQuery UI Checkboxradio - Default functionality
+
+
+
+
+
+
+
+
Checkbox and radio button widgets
+
+ Radio Group
+
+ Select a Location:
+ New York
+
+ Paris
+
+ London
+
+
+
+ Checkbox
+
+ Hotel Ratings:
+ 2 Star
+
+ 3 Star
+
+ 4 Star
+
+ 5 Star
+
+
+
+ Checkbox nested in label
+
+ Bed Type:
+ 2 Double
+
+
+ 2 Queen
+
+
+ 1 Queen
+
+
+ 1 King
+
+
+
+
+
+
+
Examples of the markup that can be used with checkboxes and radio buttons.
+
+
+
diff --git a/demos/checkboxradio/index.html b/demos/checkboxradio/index.html
index 08e598dbc82..3c00228d91f 100644
--- a/demos/checkboxradio/index.html
+++ b/demos/checkboxradio/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(rtl)
No icons
Radiogroup
Product Selector
From 23cc69362fe73cdcc38d70e23606c443bc1f3486 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Thu, 17 Mar 2016 21:44:14 +0200
Subject: [PATCH 08/18] Dialog: Adding ui mirroring support
---
demos/dialog/index.html | 1 +
demos/dialog/modal-message-rtl.html | 39 +++++++++++++++++++++++++++++
themes/base/dialog.css | 18 +++++++++++++
ui/widgets/dialog.js | 3 +++
4 files changed, 61 insertions(+)
create mode 100644 demos/dialog/modal-message-rtl.html
diff --git a/demos/dialog/index.html b/demos/dialog/index.html
index 5ba8452d57c..a70d7b2ec2d 100644
--- a/demos/dialog/index.html
+++ b/demos/dialog/index.html
@@ -10,6 +10,7 @@
Default functionality
Modal message
+ Modal message(rtl)
Modal confirmation
Modal form
Animated dialog
diff --git a/demos/dialog/modal-message-rtl.html b/demos/dialog/modal-message-rtl.html
new file mode 100644
index 00000000000..fd926a2d742
--- /dev/null
+++ b/demos/dialog/modal-message-rtl.html
@@ -0,0 +1,39 @@
+
+
+
+
+
+ jQuery UI Dialog - Modal message
+
+
+
+
+
+
+
+
+
+
+ Your files have downloaded successfully into the My Downloads folder.
+
+
+ Currently using 36% of your storage space .
+
+
+
+Sed vel diam id libero rutrum convallis . Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.
+
+
+
Use a modal dialog to explicitly acknowledge information or an action before continuing their work. Set the modal
option to true, and specify a primary action (Ok) with the buttons
option.
+
+
+
diff --git a/themes/base/dialog.css b/themes/base/dialog.css
index 7146fe95364..023634a4e7b 100644
--- a/themes/base/dialog.css
+++ b/themes/base/dialog.css
@@ -99,3 +99,21 @@
.ui-draggable .ui-dialog-titlebar {
cursor: move;
}
+/* Rtl Support */
+.ui-dialog-rtl.ui-dialog .ui-dialog-titlebar-close {
+ right: auto;
+ left: .3em;
+}
+.ui-dialog-rtl.ui-dialog .ui-dialog-title {
+ float: right;
+}
+.ui-dialog-rtl.ui-dialog .ui-dialog-buttonpane {
+ text-align: right;
+ padding: .3em .4em .5em 1em;
+}
+.ui-dialog-rtl.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
+ float: left;
+}
+.ui-dialog-rtl.ui-dialog .ui-dialog-buttonpane button {
+ margin: .5em 0 .5em .4em;
+}
diff --git a/ui/widgets/dialog.js b/ui/widgets/dialog.js
index c3ca95ed390..faaa9631b7a 100644
--- a/ui/widgets/dialog.js
+++ b/ui/widgets/dialog.js
@@ -354,6 +354,9 @@ $.widget( "ui.dialog", {
} )
.appendTo( this._appendTo() );
+ if ( this.isRtl() ) {
+ this._addClass( this.uiDialog, "ui-dialog-rtl" );
+ }
this._addClass( this.uiDialog, "ui-dialog", "ui-widget ui-widget-content ui-front" );
this._on( this.uiDialog, {
keydown: function( event ) {
From 543aaea9a4df6b0a31c0d7345bd62bb257cb0a40 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Thu, 17 Mar 2016 21:51:36 +0200
Subject: [PATCH 09/18] Draggable: Adding ui mirroring demo
---
demos/draggable/default-rtl.html | 27 +++++++++++++++++++++++++++
demos/draggable/index.html | 1 +
2 files changed, 28 insertions(+)
create mode 100644 demos/draggable/default-rtl.html
diff --git a/demos/draggable/default-rtl.html b/demos/draggable/default-rtl.html
new file mode 100644
index 00000000000..00c2f3eec9a
--- /dev/null
+++ b/demos/draggable/default-rtl.html
@@ -0,0 +1,27 @@
+
+
+
+
+
+ jQuery UI Draggable - Default functionality
+
+
+
+
+
+
+
+
+
+
+
+
Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.
+
+
+
diff --git a/demos/draggable/index.html b/demos/draggable/index.html
index ceffb9b72d4..18777d08e8d 100644
--- a/demos/draggable/index.html
+++ b/demos/draggable/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(rtl)
Events
Constrain movement
Snap to element or grid
From e3581d0cfae61ab459e4f88a386a0f0d90106c7b Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Thu, 17 Mar 2016 21:59:19 +0200
Subject: [PATCH 10/18] Droppable: Adding ui mirroring demo
---
demos/droppable/default-rtl.html | 40 ++++++++++++++++++++++++++++++++
demos/droppable/index.html | 1 +
2 files changed, 41 insertions(+)
create mode 100644 demos/droppable/default-rtl.html
diff --git a/demos/droppable/default-rtl.html b/demos/droppable/default-rtl.html
new file mode 100644
index 00000000000..7326c4791ee
--- /dev/null
+++ b/demos/droppable/default-rtl.html
@@ -0,0 +1,40 @@
+
+
+
+
+
+ jQuery UI Droppable - Default functionality
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Enable any DOM element to be droppable, a target for draggable elements.
+
+
+
diff --git a/demos/droppable/index.html b/demos/droppable/index.html
index c3317f6c4a5..6b00e93e02e 100644
--- a/demos/droppable/index.html
+++ b/demos/droppable/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(rtl)
Accepted elements
Prevent propagation
Visual feedback
From fc01eb6cade8cfc0ca7ce257fc22ea3feda7c50c Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Sat, 19 Mar 2016 19:58:34 +0200
Subject: [PATCH 11/18] Menu: Adding ui mirroring support
---
demos/menu/icons-rtl.html | 60 +++++++++++++++++++++++++++++++++++++++
demos/menu/index.html | 1 +
themes/base/menu.css | 17 +++++++++++
ui/widgets/menu.js | 3 ++
4 files changed, 81 insertions(+)
create mode 100644 demos/menu/icons-rtl.html
diff --git a/demos/menu/icons-rtl.html b/demos/menu/icons-rtl.html
new file mode 100644
index 00000000000..4ac1b5fd1ab
--- /dev/null
+++ b/demos/menu/icons-rtl.html
@@ -0,0 +1,60 @@
+
+
+
+
+
+ jQuery UI Menu - Icons
+
+
+
+
+
+
+
+
+
+
+
+
A menu with the default configuration, showing how to use a menu with icons.
+
+
+
diff --git a/demos/menu/index.html b/demos/menu/index.html
index 431926d357f..3266588eaed 100644
--- a/demos/menu/index.html
+++ b/demos/menu/index.html
@@ -10,6 +10,7 @@
diff --git a/themes/base/menu.css b/themes/base/menu.css
index afd933586ff..8465daae802 100644
--- a/themes/base/menu.css
+++ b/themes/base/menu.css
@@ -62,3 +62,20 @@
left: auto;
right: 0;
}
+/* Rtl Support*/
+
+.ui-menu-rtl.ui-menu .ui-menu-item-wrapper {
+ padding: 3px .4em 3px 1em;
+}
+.ui-menu-rtl.ui-menu-icons .ui-menu-item-wrapper {
+ padding-left: 0;
+ padding-right: 2em;
+}
+.ui-menu-rtl.ui-menu .ui-icon {
+ left: auto;
+ right: .2em;
+}
+.ui-menu-rtl.ui-menu .ui-menu-icon {
+ left: 0;
+ right: auto;
+}
diff --git a/ui/widgets/menu.js b/ui/widgets/menu.js
index e7b13e7c958..3c531dc0130 100644
--- a/ui/widgets/menu.js
+++ b/ui/widgets/menu.js
@@ -71,6 +71,9 @@ return $.widget( "ui.menu", {
tabIndex: 0
} );
+ if ( this.isRtl() ) {
+ this._addClass( "ui-menu-rtl" );
+ }
this._addClass( "ui-menu", "ui-widget ui-widget-content" );
this._on( {
From 43b3c2f833d4d634972434fe779d8fa8cca3cbe7 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Sat, 19 Mar 2016 20:12:03 +0200
Subject: [PATCH 12/18] Progressbar: Adding ui mirroring demo
---
demos/progressbar/default-rtl.html | 24 ++++++++++++++++++++++++
demos/progressbar/index.html | 1 +
2 files changed, 25 insertions(+)
create mode 100644 demos/progressbar/default-rtl.html
diff --git a/demos/progressbar/default-rtl.html b/demos/progressbar/default-rtl.html
new file mode 100644
index 00000000000..3fb2ef1f482
--- /dev/null
+++ b/demos/progressbar/default-rtl.html
@@ -0,0 +1,24 @@
+
+
+
+
+
+ jQuery UI Progressbar - Default functionality
+
+
+
+
+
+
+
+
+
+
+
Default determinate progress bar.
+
+
+
diff --git a/demos/progressbar/index.html b/demos/progressbar/index.html
index 1a9e9c9216b..e5b7aebc454 100644
--- a/demos/progressbar/index.html
+++ b/demos/progressbar/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(rtl)
Indeterminate
Custom Labels
Download Dialog
From d1f0301092966fc59973524c43635d3e6e61bae7 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Sat, 19 Mar 2016 20:58:27 +0200
Subject: [PATCH 13/18] Selectable: Adding ui mirroring demo
---
demos/selectable/default-rtl.html | 38 +++++++++++++++++++++++++++++++
demos/selectable/index.html | 1 +
2 files changed, 39 insertions(+)
create mode 100644 demos/selectable/default-rtl.html
diff --git a/demos/selectable/default-rtl.html b/demos/selectable/default-rtl.html
new file mode 100644
index 00000000000..7528f9b839d
--- /dev/null
+++ b/demos/selectable/default-rtl.html
@@ -0,0 +1,38 @@
+
+
+
+
+
+ jQuery UI Selectable - Default functionality
+
+
+
+
+
+
+
+
+
+
+ Item 1
+ Item 2
+ Item 3
+ Item 4
+ Item 5
+ Item 6
+ Item 7
+
+
+
+
Enable a DOM element (or group of elements) to be selectable. Draw a box with your cursor to select items. Hold down the Ctrl key to make multiple non-adjacent selections.
+
+
+
diff --git a/demos/selectable/index.html b/demos/selectable/index.html
index 1933fdf9a77..1c61c1fddbd 100644
--- a/demos/selectable/index.html
+++ b/demos/selectable/index.html
@@ -9,6 +9,7 @@
From 10deed01cc080996cb17dd1b990c7c3c7953a0a8 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Sat, 19 Mar 2016 22:01:36 +0200
Subject: [PATCH 14/18] Selectmenu: Adding ui mirroring support
---
demos/selectmenu/custom_render-rtl.html | 131 ++++++++++++++++++++++++
demos/selectmenu/index.html | 1 +
themes/base/selectmenu.css | 7 ++
ui/widgets/selectmenu.js | 6 ++
4 files changed, 145 insertions(+)
create mode 100644 demos/selectmenu/custom_render-rtl.html
diff --git a/demos/selectmenu/custom_render-rtl.html b/demos/selectmenu/custom_render-rtl.html
new file mode 100644
index 00000000000..2828e497a2e
--- /dev/null
+++ b/demos/selectmenu/custom_render-rtl.html
@@ -0,0 +1,131 @@
+
+
+
+
+
+ jQuery UI Selectmenu - Custom Rendering
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
The whole rendering process is extendable to make custom styling as easy as possible.
+
+
+
diff --git a/demos/selectmenu/index.html b/demos/selectmenu/index.html
index 4b83f727f9d..c4891009bb0 100644
--- a/demos/selectmenu/index.html
+++ b/demos/selectmenu/index.html
@@ -10,6 +10,7 @@
diff --git a/themes/base/selectmenu.css b/themes/base/selectmenu.css
index 3449c19b599..6dc9af3e0d7 100644
--- a/themes/base/selectmenu.css
+++ b/themes/base/selectmenu.css
@@ -40,3 +40,10 @@
white-space: nowrap;
width: 14em;
}
+/* Rtl Support */
+.ui-selectmenu-rtl {
+ direction: rtl;
+}
+.ui-selectmenu-rtl.ui-selectmenu-button.ui-button {
+ text-align: right;
+}
diff --git a/ui/widgets/selectmenu.js b/ui/widgets/selectmenu.js
index b251f04f118..ef57b114e18 100644
--- a/ui/widgets/selectmenu.js
+++ b/ui/widgets/selectmenu.js
@@ -116,6 +116,9 @@ return $.widget( "ui.selectmenu", [ $.ui.formResetMixin, {
} )
.insertAfter( this.element );
+ if ( this.isRtl() ) {
+ this._addClass( this.button, "ui-selectmenu-rtl" );
+ }
this._addClass( this.button, "ui-selectmenu-button ui-selectmenu-button-closed",
"ui-button ui-widget" );
@@ -155,6 +158,9 @@ return $.widget( "ui.selectmenu", [ $.ui.formResetMixin, {
// Wrap menu
this.menuWrap = $( "" ).append( this.menu );
+ if ( this.isRtl() ) {
+ this._addClass( this.menuWrap, "ui-selectmenu-rtl" );
+ }
this._addClass( this.menuWrap, "ui-selectmenu-menu", "ui-front" );
this.menuWrap.appendTo( this._appendTo() );
From 6999e350b4798aa7a59b86bd7074b47363c0afe4 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Sat, 19 Mar 2016 22:28:37 +0200
Subject: [PATCH 15/18] Spinner: Adding ui mirroring support
---
demos/spinner/default-rtl.html | 58 ++++++++++++++++++++++++++++++++++
demos/spinner/index.html | 1 +
themes/base/spinner.css | 14 ++++++++
ui/widgets/spinner.js | 3 ++
4 files changed, 76 insertions(+)
create mode 100644 demos/spinner/default-rtl.html
diff --git a/demos/spinner/default-rtl.html b/demos/spinner/default-rtl.html
new file mode 100644
index 00000000000..71659618f78
--- /dev/null
+++ b/demos/spinner/default-rtl.html
@@ -0,0 +1,58 @@
+
+
+
+
+
+ jQuery UI Spinner - Default functionality
+
+
+
+
+
+
+
+
+ Select a value:
+
+
+
+
+ Toggle disable/enable
+ Toggle widget
+
+
+
+ Get value
+ Set value to 5
+
+
+
+
+
diff --git a/demos/spinner/index.html b/demos/spinner/index.html
index e61d0ddcaad..60746aa1fad 100644
--- a/demos/spinner/index.html
+++ b/demos/spinner/index.html
@@ -9,6 +9,7 @@
Default functionality
+ Default functionality(rtl)
Decimal
Currency
Map
diff --git a/themes/base/spinner.css b/themes/base/spinner.css
index c3908106fa3..bbecaf0a9d8 100644
--- a/themes/base/spinner.css
+++ b/themes/base/spinner.css
@@ -50,3 +50,17 @@
.ui-spinner-down {
bottom: 0;
}
+/* Rtl Support*/
+.ui-spinner-rtl .ui-spinner-input {
+ margin-left: 2em;
+ margin-right: .4em;
+}
+.ui-spinner-rtl .ui-spinner-button {
+ right: auto;
+ left: 0;
+}
+.ui-spinner-rtl.ui-spinner a.ui-spinner-button {
+ border-right-style: inherit;
+ border-left-style: none;
+}
+
diff --git a/ui/widgets/spinner.js b/ui/widgets/spinner.js
index e875f10adb2..92633eb6b88 100644
--- a/ui/widgets/spinner.js
+++ b/ui/widgets/spinner.js
@@ -237,6 +237,9 @@ $.widget( "ui.spinner", {
_draw: function() {
this._enhance();
+ if ( this.isRtl() ) {
+ this._addClass( this.uiSpinner, "ui-spinner-rtl" );
+ }
this._addClass( this.uiSpinner, "ui-spinner", "ui-widget ui-widget-content" );
this._addClass( "ui-spinner-input" );
From 0a71279c75a6ea40a48806e2a71bff7cfb81ebc2 Mon Sep 17 00:00:00 2001
From: Ahmed Mohamed Mustafa
Date: Sat, 19 Mar 2016 22:47:53 +0200
Subject: [PATCH 16/18] Tabs: Adding ui mirroring support
---
demos/tabs/index.html | 1 +
demos/tabs/manipulation-rtl.html | 115 +++++++++++++++++++++++++++++++
themes/base/tabs.css | 8 +++
ui/widgets/tabs.js | 3 +
4 files changed, 127 insertions(+)
create mode 100644 demos/tabs/manipulation-rtl.html
diff --git a/demos/tabs/index.html b/demos/tabs/index.html
index 11d0b46b360..4c8bebe8948 100644
--- a/demos/tabs/index.html
+++ b/demos/tabs/index.html
@@ -14,6 +14,7 @@
Collapse content
Sortable
Simple manipulation
+ Simple manipulation(rtl)
+
+
+
+
+
+Add Tab
+
+
+
+
+
Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.
+
+
+
+
+
Simple tabs adding and removing.
+
+
diff --git a/demos/tabs/manipulation-rtl.html b/demos/tabs/manipulation-rtl.html
new file mode 100644
index 00000000000..c89daccc9c2
--- /dev/null
+++ b/demos/tabs/manipulation-rtl.html
@@ -0,0 +1,115 @@
+
+
+