Browse Source

Merge pull request #491 from twbs/js-fixes

JS fixes
pull/606/merge
XhmikosR 10 years ago
parent
commit
1fcd66348f
  1. 62
      dist/js/ratchet.js
  2. 2
      dist/js/ratchet.min.js
  3. 62
      docs/dist/js/ratchet.js
  4. 2
      docs/dist/js/ratchet.min.js
  5. 4
      js/push.js
  6. 33
      js/sliders.js
  7. 25
      js/toggles.js

62
dist/js/ratchet.js vendored

@ -198,7 +198,9 @@
delete cacheMapping[cacheBackStack.shift()]; delete cacheMapping[cacheBackStack.shift()];
} }
window.history.pushState(null, '', getCached(PUSH.id).url); if (getCached(PUSH.id).url) {
window.history.pushState(null, '', getCached(PUSH.id).url);
}
cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack); cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack);
cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack); cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack);
@ -740,6 +742,23 @@
var scrollableArea; var scrollableArea;
var startedMoving; var startedMoving;
// Original script from http://davidwalsh.name/vendor-prefix
var getBrowserCapabilities = (function () {
var styles = window.getComputedStyle(document.documentElement, '');
var pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1];
return {
prefix: '-' + pre + '-',
transform: pre[0].toUpperCase() + pre.substr(1) + 'Transform'
};
})();
var transformPrefix = getBrowserCapabilities.prefix;
var transformProperty = getBrowserCapabilities.transform;
var getSlider = function (target) { var getSlider = function (target) {
var i; var i;
var sliders = document.querySelectorAll('.slider > .slide-group'); var sliders = document.querySelectorAll('.slider > .slide-group');
@ -754,11 +773,9 @@
}; };
var getScroll = function () { var getScroll = function () {
if ('webkitTransform' in slider.style) { var translate3d = slider.style[transformProperty].match(/translate3d\(([^,]*)/);
var translate3d = slider.style.webkitTransform.match(/translate3d\(([^,]*)/); var ret = translate3d ? translate3d[1] : 0;
var ret = translate3d ? translate3d[1] : 0; return parseInt(ret, 10);
return parseInt(ret, 10);
}
}; };
var setSlideNumber = function (offset) { var setSlideNumber = function (offset) {
@ -791,7 +808,7 @@
setSlideNumber(0); setSlideNumber(0);
slider.style['-webkit-transition-duration'] = 0; slider.style[transformPrefix + 'transition-duration'] = 0;
}; };
var onTouchMove = function (e) { var onTouchMove = function (e) {
@ -824,7 +841,7 @@
resistance = slideNumber === 0 && deltaX > 0 ? (pageX / sliderWidth) + 1.25 : resistance = slideNumber === 0 && deltaX > 0 ? (pageX / sliderWidth) + 1.25 :
slideNumber === lastSlide && deltaX < 0 ? (Math.abs(pageX) / sliderWidth) + 1.25 : 1; slideNumber === lastSlide && deltaX < 0 ? (Math.abs(pageX) / sliderWidth) + 1.25 : 1;
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)'; slider.style[transformProperty] = 'translate3d(' + offsetX + 'px,0,0)';
// started moving // started moving
startedMoving = true; startedMoving = true;
@ -842,8 +859,8 @@
offsetX = slideNumber * sliderWidth; offsetX = slideNumber * sliderWidth;
slider.style['-webkit-transition-duration'] = '.2s'; slider.style[transformPrefix + 'transition-duration'] = '.2s';
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)'; slider.style[transformProperty] = 'translate3d(' + offsetX + 'px,0,0)';
e = new CustomEvent('slide', { e = new CustomEvent('slide', {
detail: { slideNumber: Math.abs(slideNumber) }, detail: { slideNumber: Math.abs(slideNumber) },
@ -877,6 +894,21 @@
var distanceX = false; var distanceX = false;
var toggle = false; var toggle = false;
// Original script from http://davidwalsh.name/vendor-prefix
var getBrowserCapabilities = (function () {
var styles = window.getComputedStyle(document.documentElement, '');
var pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1];
return {
transform: pre[0].toUpperCase() + pre.substr(1) + 'Transform'
};
})();
var transformProperty = getBrowserCapabilities.transform;
var findToggle = function (target) { var findToggle = function (target) {
var i; var i;
var toggles = document.querySelectorAll('.toggle'); var toggles = document.querySelectorAll('.toggle');
@ -935,13 +967,13 @@
e.preventDefault(); e.preventDefault();
if (distanceX < 0) { if (distanceX < 0) {
return (handle.style.webkitTransform = 'translate3d(0,0,0)'); return (handle.style[transformProperty] = 'translate3d(0,0,0)');
} }
if (distanceX > offset) { if (distanceX > offset) {
return (handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)'); return (handle.style[transformProperty] = 'translate3d(' + offset + 'px,0,0)');
} }
handle.style.webkitTransform = 'translate3d(' + distanceX + 'px,0,0)'; handle.style[transformProperty] = 'translate3d(' + distanceX + 'px,0,0)';
toggle.classList[(distanceX > (toggleWidth / 2 - handleWidth / 2)) ? 'add' : 'remove']('active'); toggle.classList[(distanceX > (toggleWidth / 2 - handleWidth / 2)) ? 'add' : 'remove']('active');
}); });
@ -958,9 +990,9 @@
var slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2))); var slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2)));
if (slideOn) { if (slideOn) {
handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)'; handle.style[transformProperty] = 'translate3d(' + offset + 'px,0,0)';
} else { } else {
handle.style.webkitTransform = 'translate3d(0,0,0)'; handle.style[transformProperty] = 'translate3d(0,0,0)';
} }
toggle.classList[slideOn ? 'add' : 'remove']('active'); toggle.classList[slideOn ? 'add' : 'remove']('active');

2
dist/js/ratchet.min.js vendored

File diff suppressed because one or more lines are too long

62
docs/dist/js/ratchet.js vendored

@ -198,7 +198,9 @@
delete cacheMapping[cacheBackStack.shift()]; delete cacheMapping[cacheBackStack.shift()];
} }
window.history.pushState(null, '', getCached(PUSH.id).url); if (getCached(PUSH.id).url) {
window.history.pushState(null, '', getCached(PUSH.id).url);
}
cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack); cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack);
cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack); cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack);
@ -740,6 +742,23 @@
var scrollableArea; var scrollableArea;
var startedMoving; var startedMoving;
// Original script from http://davidwalsh.name/vendor-prefix
var getBrowserCapabilities = (function () {
var styles = window.getComputedStyle(document.documentElement, '');
var pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1];
return {
prefix: '-' + pre + '-',
transform: pre[0].toUpperCase() + pre.substr(1) + 'Transform'
};
})();
var transformPrefix = getBrowserCapabilities.prefix;
var transformProperty = getBrowserCapabilities.transform;
var getSlider = function (target) { var getSlider = function (target) {
var i; var i;
var sliders = document.querySelectorAll('.slider > .slide-group'); var sliders = document.querySelectorAll('.slider > .slide-group');
@ -754,11 +773,9 @@
}; };
var getScroll = function () { var getScroll = function () {
if ('webkitTransform' in slider.style) { var translate3d = slider.style[transformProperty].match(/translate3d\(([^,]*)/);
var translate3d = slider.style.webkitTransform.match(/translate3d\(([^,]*)/); var ret = translate3d ? translate3d[1] : 0;
var ret = translate3d ? translate3d[1] : 0; return parseInt(ret, 10);
return parseInt(ret, 10);
}
}; };
var setSlideNumber = function (offset) { var setSlideNumber = function (offset) {
@ -791,7 +808,7 @@
setSlideNumber(0); setSlideNumber(0);
slider.style['-webkit-transition-duration'] = 0; slider.style[transformPrefix + 'transition-duration'] = 0;
}; };
var onTouchMove = function (e) { var onTouchMove = function (e) {
@ -824,7 +841,7 @@
resistance = slideNumber === 0 && deltaX > 0 ? (pageX / sliderWidth) + 1.25 : resistance = slideNumber === 0 && deltaX > 0 ? (pageX / sliderWidth) + 1.25 :
slideNumber === lastSlide && deltaX < 0 ? (Math.abs(pageX) / sliderWidth) + 1.25 : 1; slideNumber === lastSlide && deltaX < 0 ? (Math.abs(pageX) / sliderWidth) + 1.25 : 1;
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)'; slider.style[transformProperty] = 'translate3d(' + offsetX + 'px,0,0)';
// started moving // started moving
startedMoving = true; startedMoving = true;
@ -842,8 +859,8 @@
offsetX = slideNumber * sliderWidth; offsetX = slideNumber * sliderWidth;
slider.style['-webkit-transition-duration'] = '.2s'; slider.style[transformPrefix + 'transition-duration'] = '.2s';
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)'; slider.style[transformProperty] = 'translate3d(' + offsetX + 'px,0,0)';
e = new CustomEvent('slide', { e = new CustomEvent('slide', {
detail: { slideNumber: Math.abs(slideNumber) }, detail: { slideNumber: Math.abs(slideNumber) },
@ -877,6 +894,21 @@
var distanceX = false; var distanceX = false;
var toggle = false; var toggle = false;
// Original script from http://davidwalsh.name/vendor-prefix
var getBrowserCapabilities = (function () {
var styles = window.getComputedStyle(document.documentElement, '');
var pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1];
return {
transform: pre[0].toUpperCase() + pre.substr(1) + 'Transform'
};
})();
var transformProperty = getBrowserCapabilities.transform;
var findToggle = function (target) { var findToggle = function (target) {
var i; var i;
var toggles = document.querySelectorAll('.toggle'); var toggles = document.querySelectorAll('.toggle');
@ -935,13 +967,13 @@
e.preventDefault(); e.preventDefault();
if (distanceX < 0) { if (distanceX < 0) {
return (handle.style.webkitTransform = 'translate3d(0,0,0)'); return (handle.style[transformProperty] = 'translate3d(0,0,0)');
} }
if (distanceX > offset) { if (distanceX > offset) {
return (handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)'); return (handle.style[transformProperty] = 'translate3d(' + offset + 'px,0,0)');
} }
handle.style.webkitTransform = 'translate3d(' + distanceX + 'px,0,0)'; handle.style[transformProperty] = 'translate3d(' + distanceX + 'px,0,0)';
toggle.classList[(distanceX > (toggleWidth / 2 - handleWidth / 2)) ? 'add' : 'remove']('active'); toggle.classList[(distanceX > (toggleWidth / 2 - handleWidth / 2)) ? 'add' : 'remove']('active');
}); });
@ -958,9 +990,9 @@
var slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2))); var slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2)));
if (slideOn) { if (slideOn) {
handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)'; handle.style[transformProperty] = 'translate3d(' + offset + 'px,0,0)';
} else { } else {
handle.style.webkitTransform = 'translate3d(0,0,0)'; handle.style[transformProperty] = 'translate3d(0,0,0)';
} }
toggle.classList[slideOn ? 'add' : 'remove']('active'); toggle.classList[slideOn ? 'add' : 'remove']('active');

2
docs/dist/js/ratchet.min.js vendored

File diff suppressed because one or more lines are too long

4
js/push.js

@ -60,7 +60,9 @@
delete cacheMapping[cacheBackStack.shift()]; delete cacheMapping[cacheBackStack.shift()];
} }
window.history.pushState(null, '', getCached(PUSH.id).url); if (getCached(PUSH.id).url) {
window.history.pushState(null, '', getCached(PUSH.id).url);
}
cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack); cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack);
cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack); cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack);

33
js/sliders.js

@ -25,6 +25,23 @@
var scrollableArea; var scrollableArea;
var startedMoving; var startedMoving;
// Original script from http://davidwalsh.name/vendor-prefix
var getBrowserCapabilities = (function () {
var styles = window.getComputedStyle(document.documentElement, '');
var pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1];
return {
prefix: '-' + pre + '-',
transform: pre[0].toUpperCase() + pre.substr(1) + 'Transform'
};
})();
var transformPrefix = getBrowserCapabilities.prefix;
var transformProperty = getBrowserCapabilities.transform;
var getSlider = function (target) { var getSlider = function (target) {
var i; var i;
var sliders = document.querySelectorAll('.slider > .slide-group'); var sliders = document.querySelectorAll('.slider > .slide-group');
@ -39,11 +56,9 @@
}; };
var getScroll = function () { var getScroll = function () {
if ('webkitTransform' in slider.style) { var translate3d = slider.style[transformProperty].match(/translate3d\(([^,]*)/);
var translate3d = slider.style.webkitTransform.match(/translate3d\(([^,]*)/); var ret = translate3d ? translate3d[1] : 0;
var ret = translate3d ? translate3d[1] : 0; return parseInt(ret, 10);
return parseInt(ret, 10);
}
}; };
var setSlideNumber = function (offset) { var setSlideNumber = function (offset) {
@ -76,7 +91,7 @@
setSlideNumber(0); setSlideNumber(0);
slider.style['-webkit-transition-duration'] = 0; slider.style[transformPrefix + 'transition-duration'] = 0;
}; };
var onTouchMove = function (e) { var onTouchMove = function (e) {
@ -109,7 +124,7 @@
resistance = slideNumber === 0 && deltaX > 0 ? (pageX / sliderWidth) + 1.25 : resistance = slideNumber === 0 && deltaX > 0 ? (pageX / sliderWidth) + 1.25 :
slideNumber === lastSlide && deltaX < 0 ? (Math.abs(pageX) / sliderWidth) + 1.25 : 1; slideNumber === lastSlide && deltaX < 0 ? (Math.abs(pageX) / sliderWidth) + 1.25 : 1;
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)'; slider.style[transformProperty] = 'translate3d(' + offsetX + 'px,0,0)';
// started moving // started moving
startedMoving = true; startedMoving = true;
@ -127,8 +142,8 @@
offsetX = slideNumber * sliderWidth; offsetX = slideNumber * sliderWidth;
slider.style['-webkit-transition-duration'] = '.2s'; slider.style[transformPrefix + 'transition-duration'] = '.2s';
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)'; slider.style[transformProperty] = 'translate3d(' + offsetX + 'px,0,0)';
e = new CustomEvent('slide', { e = new CustomEvent('slide', {
detail: { slideNumber: Math.abs(slideNumber) }, detail: { slideNumber: Math.abs(slideNumber) },

25
js/toggles.js

@ -15,6 +15,21 @@
var distanceX = false; var distanceX = false;
var toggle = false; var toggle = false;
// Original script from http://davidwalsh.name/vendor-prefix
var getBrowserCapabilities = (function () {
var styles = window.getComputedStyle(document.documentElement, '');
var pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1];
return {
transform: pre[0].toUpperCase() + pre.substr(1) + 'Transform'
};
})();
var transformProperty = getBrowserCapabilities.transform;
var findToggle = function (target) { var findToggle = function (target) {
var i; var i;
var toggles = document.querySelectorAll('.toggle'); var toggles = document.querySelectorAll('.toggle');
@ -73,13 +88,13 @@
e.preventDefault(); e.preventDefault();
if (distanceX < 0) { if (distanceX < 0) {
return (handle.style.webkitTransform = 'translate3d(0,0,0)'); return (handle.style[transformProperty] = 'translate3d(0,0,0)');
} }
if (distanceX > offset) { if (distanceX > offset) {
return (handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)'); return (handle.style[transformProperty] = 'translate3d(' + offset + 'px,0,0)');
} }
handle.style.webkitTransform = 'translate3d(' + distanceX + 'px,0,0)'; handle.style[transformProperty] = 'translate3d(' + distanceX + 'px,0,0)';
toggle.classList[(distanceX > (toggleWidth / 2 - handleWidth / 2)) ? 'add' : 'remove']('active'); toggle.classList[(distanceX > (toggleWidth / 2 - handleWidth / 2)) ? 'add' : 'remove']('active');
}); });
@ -96,9 +111,9 @@
var slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2))); var slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2)));
if (slideOn) { if (slideOn) {
handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)'; handle.style[transformProperty] = 'translate3d(' + offset + 'px,0,0)';
} else { } else {
handle.style.webkitTransform = 'translate3d(0,0,0)'; handle.style[transformProperty] = 'translate3d(0,0,0)';
} }
toggle.classList[slideOn ? 'add' : 'remove']('active'); toggle.classList[slideOn ? 'add' : 'remove']('active');

Loading…
Cancel
Save