Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

added RTL support #149

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,3 +4,4 @@ components/
bower_components/
node_modules/
test.html
yarn.lock
2 changes: 2 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,7 @@ defaults = {
, disabledOpacity : 0.5
, speed : '0.4s'
, size : 'default'
, rtl : false
};
```

Expand All @@ -89,6 +90,7 @@ defaults = {
- `disabledOpacity` : opacity of the switch when it's disabled (0 to 1)
- `speed` : length of time that the transition will take, ex. '0.4s', '1s', '2.2s' (Note: transition speed of the handle is twice shorter)
- `size` : size of the switch element (small or large)
- `rtl` : flip the switch direction

## API

Expand Down
81 changes: 52 additions & 29 deletions dist/switchery.js
Original file line number Diff line number Diff line change
Expand Up @@ -56,11 +56,11 @@ require.helper.semVerSort = function(a, b) {

/**
* Find and require a module which name starts with the provided name.
* If multiple modules exists, the highest semver is used.
* If multiple modules exists, the highest semver is used.
* This function can only be used for remote dependencies.

* @param {String} name - module name: `user~repo`
* @param {Boolean} returnPath - returns the canonical require path if true,
* @param {Boolean} returnPath - returns the canonical require path if true,
* otherwise it returns the epxorted module
*/
require.latest = function (name, returnPath) {
Expand All @@ -83,7 +83,7 @@ require.latest = function (name, returnPath) {
semVerCandidates.push({version: version, name: moduleName});
} else {
otherCandidates.push({version: version, name: moduleName});
}
}
}
}
if (semVerCandidates.concat(otherCandidates).length === 0) {
Expand Down Expand Up @@ -141,7 +141,7 @@ require.define = function (name, exports) {
require.register("abpetkov~transitionize@0.0.3", function (exports, module) {

/**
* Transitionize 0.0.2
* Transitionize 0.0.3
* https://github.com/abpetkov/transitionize
*
* Authored by Alexander Petkov
Expand Down Expand Up @@ -943,7 +943,7 @@ FastClick.notNeeded = function(layer) {

if (FastClick.prototype.deviceIsAndroid) {
metaViewport = document.querySelector('meta[name=viewport]');

if (metaViewport) {
// Chrome on Android with user-scalable="no" doesn't need FastClick (issue #89)
if (metaViewport.content.indexOf('user-scalable=no') !== -1) {
Expand Down Expand Up @@ -1258,12 +1258,16 @@ exports.engine = function(obj){

});

require.register("component~matches-selector@0.1.5", function (exports, module) {
require.register("component~matches-selector@0.1.6", function (exports, module) {
/**
* Module dependencies.
*/

var query = require('component~query@0.0.3');
try {
var query = require('component~query@0.0.3');
} catch (err) {
var query = require('component~query@0.0.3');
}

/**
* Element prototype.
Expand Down Expand Up @@ -1308,25 +1312,42 @@ function match(el, selector) {

});

require.register("component~closest@0.1.4", function (exports, module) {
var matches = require('component~matches-selector@0.1.5')
require.register("component~closest@1.0.1", function (exports, module) {
/**
* Module Dependencies
*/

module.exports = function (element, selector, checkYoSelf, root) {
element = checkYoSelf ? {parentNode: element} : element
try {
var matches = require('component~matches-selector@0.1.6')
} catch (err) {
var matches = require('component~matches-selector@0.1.6')
}

root = root || document
/**
* Export `closest`
*/

// Make sure `element !== document` and `element != null`
// otherwise we get an illegal invocation
while ((element = element.parentNode) && element !== document) {
if (matches(element, selector))
return element
// After `matches` on the edge case that
// the selector matches the root
// (when the root is not the document)
if (element === root)
return
module.exports = closest

/**
* Closest
*
* @param {Element} el
* @param {String} selector
* @param {Element} scope (optional)
*/

function closest (el, selector, scope) {
scope = scope || document.documentElement;

// walk up the dom
while (el && el !== scope) {
if (matches(el, selector)) return el;
el = el.parentNode;
}

// check scope for match
return matches(el, selector) ? el : null;
}

});
Expand All @@ -1336,7 +1357,7 @@ require.register("component~delegate@0.2.3", function (exports, module) {
* Module dependencies.
*/

var closest = require('component~closest@0.1.4')
var closest = require('component~closest@1.0.1')
, event = require('component~event@0.1.4');

/**
Expand Down Expand Up @@ -1559,7 +1580,7 @@ function parse(event) {

require.register("switchery", function (exports, module) {
/**
* Switchery 0.8.1
* Switchery 0.8.2
* http://abpetkov.github.io/switchery/
*
* Authored by Alexander Petkov
Expand Down Expand Up @@ -1602,6 +1623,7 @@ var defaults = {
, disabledOpacity : 0.5
, speed : '0.4s'
, size : 'default'
, rtl : false
};

/**
Expand Down Expand Up @@ -1696,13 +1718,13 @@ Switchery.prototype.setPosition = function (clicked) {
if (checked === true) {
this.element.checked = true;

if (window.getComputedStyle) jack.style.left = parseInt(window.getComputedStyle(switcher).width) - parseInt(window.getComputedStyle(jack).width) + 'px';
else jack.style.left = parseInt(switcher.currentStyle['width']) - parseInt(jack.currentStyle['width']) + 'px';
if (window.getComputedStyle) jack.style[this.options.rtl ? 'right' : 'left' ] = parseInt(window.getComputedStyle(switcher).width) - parseInt(window.getComputedStyle(jack).width) + 'px';
else jack.style[this.options.rtl ? 'right' : 'left' ] = parseInt(switcher.currentStyle['width']) - parseInt(jack.currentStyle['width']) + 'px';

if (this.options.color) this.colorize();
this.setSpeed();
} else {
jack.style.left = 0;
jack.style[this.options.rtl ? 'right' : 'left' ] = 0;
this.element.checked = false;
this.switcher.style.boxShadow = 'inset 0 0 0 0 ' + this.options.secondaryColor;
this.switcher.style.borderColor = this.options.secondaryColor;
Expand All @@ -1722,9 +1744,10 @@ Switchery.prototype.setSpeed = function() {
var switcherProp = {}
, jackProp = {
'background-color': this.options.speed
, 'left': this.options.speed.replace(/[a-z]/, '') / 2 + 's'
};

jackProp[this.options.rtl ? 'right' : 'left' ] = this.options.speed.replace(/[a-z]/, '') / 2 + 's';

if (this.isChecked()) {
switcherProp = {
'border': this.options.speed
Expand Down Expand Up @@ -1954,4 +1977,4 @@ if (typeof exports == "object") {
} else {
(this || window)["Switchery"] = require("switchery");
}
})();
})()
2 changes: 1 addition & 1 deletion dist/switchery.min.js

Large diffs are not rendered by default.

10 changes: 6 additions & 4 deletions switchery.js
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ var defaults = {
, disabledOpacity : 0.5
, speed : '0.4s'
, size : 'default'
, rtl : false
};

/**
Expand Down Expand Up @@ -136,13 +137,13 @@ Switchery.prototype.setPosition = function (clicked) {
if (checked === true) {
this.element.checked = true;

if (window.getComputedStyle) jack.style.left = parseInt(window.getComputedStyle(switcher).width) - parseInt(window.getComputedStyle(jack).width) + 'px';
else jack.style.left = parseInt(switcher.currentStyle['width']) - parseInt(jack.currentStyle['width']) + 'px';
if (window.getComputedStyle) jack.style[this.options.rtl ? 'right' : 'left' ] = parseInt(window.getComputedStyle(switcher).width) - parseInt(window.getComputedStyle(jack).width) + 'px';
else jack.style[this.options.rtl ? 'right' : 'left' ] = parseInt(switcher.currentStyle['width']) - parseInt(jack.currentStyle['width']) + 'px';

if (this.options.color) this.colorize();
this.setSpeed();
} else {
jack.style.left = 0;
jack.style[this.options.rtl ? 'right' : 'left' ] = 0;
this.element.checked = false;
this.switcher.style.boxShadow = 'inset 0 0 0 0 ' + this.options.secondaryColor;
this.switcher.style.borderColor = this.options.secondaryColor;
Expand All @@ -162,9 +163,10 @@ Switchery.prototype.setSpeed = function() {
var switcherProp = {}
, jackProp = {
'background-color': this.options.speed
, 'left': this.options.speed.replace(/[a-z]/, '') / 2 + 's'
};

jackProp[this.options.rtl ? 'right' : 'left' ] = this.options.speed.replace(/[a-z]/, '') / 2 + 's';

if (this.isChecked()) {
switcherProp = {
'border': this.options.speed
Expand Down