playground
/
ratchet
mirror of https://github.com/twbs/ratchet.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

beautified js code

pull/179/head
Simon Waldherr 12 years ago
parent
c0d00ce2ca
commit
fdabe57db6
7 changed files with 345 additions and 286 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 136
      dist/ratchet.js
  2. 93
      lib/js/push.js
  3. 8
      lib/js/segmented-controllers.js
  4. 13
      lib/js/sliders.js
  5. 19
      lib/js/toggles.js

136
dist/ratchet.js vendored
Unescape View File

@ -136,15 +136,15 @@
cacheMapping = sessionStorage,
domCache = {},
transitionMap = {
'slide-in' : 'slide-out',
'slide-out' : 'slide-in',
'fade' : 'fade'
'slide-in': 'slide-out',
'slide-out': 'slide-in',
'fade': 'fade'
},
bars = {
bartab : '.bar-tab',
bartitle : '.bar-title',
barfooter : '.bar-footer',
barheadersecondary : '.bar-header-secondary'
bartab: '.bar-tab',
bartitle: '.bar-title',
barfooter: '.bar-footer',
barheadersecondary: '.bar-header-secondary'
};
var cacheReplace = function (data, updates) {
@ -221,10 +221,10 @@
e.preventDefault();
PUSH({
url : target.href,
hash : target.hash,
timeout : target.getAttribute('data-timeout'),
transition : target.getAttribute('data-transition')
url: target.href,
hash: target.hash,
timeout: target.getAttribute('data-timeout'),
transition: target.getAttribute('data-transition')
});
};
@ -269,12 +269,12 @@
if (!activeDom) {
return PUSH({
id : activeObj.id,
url : activeObj.url,
title : activeObj.title,
timeout : activeObj.timeout,
transition : transition,
ignorePush : true
id: activeObj.id,
url: activeObj.url,
title: activeObj.title,
timeout: activeObj.timeout,
transition: transition,
ignorePush: true
});
}
@ -284,8 +284,7 @@
barElement = document.querySelector(bars[key]);
if (activeObj[key]) {
swapContent(activeObj[key], barElement);
}
else if (barElement) {
} else if (barElement) {
barElement.parentNode.removeChild(barElement);
}
}
@ -294,8 +293,7 @@
swapContent(
(activeObj.contents || activeDom).cloneNode(true),
document.querySelector('.content'),
transition
);
transition);
PUSH.id = id;
@ -335,16 +333,18 @@
if (!PUSH.id) {
cacheReplace({
id : +new Date,
url : window.location.href,
title : document.title,
timeout : options.timeout,
transition : null
id: +new Date,
url: window.location.href,
title: document.title,
timeout: options.timeout,
transition: null
});
}
if (options.timeout) {
options._timeout = setTimeout(function () { xhr.abort('timeout'); }, options.timeout);
options._timeout = setTimeout(function () {
xhr.abort('timeout');
}, options.timeout);
}
xhr.send();
@ -375,11 +375,11 @@
swapContent(data.contents, options.container, options.transition, function () {
cacheReplace({
id : options.id || +new Date,
url : data.url,
title : data.title,
timeout : options.timeout,
transition : options.transition
id: options.id || +new Date,
url: data.url,
title: data.title,
timeout: options.timeout,
transition: options.transition
}, options.id);
triggerStateChange();
});
@ -398,18 +398,21 @@
var swapContent = function (swap, container, transition, complete) {
"use strict";
function fadeContainerEnd() {
container.removeEventListener('webkitTransitionEnd', fadeContainerEnd);
swap.classList.add('in');
swap.addEventListener('webkitTransitionEnd', fadeSwapEnd);
}
function fadeSwapEnd () {
function fadeSwapEnd() {
swap.removeEventListener('webkitTransitionEnd', fadeSwapEnd);
container.parentNode.removeChild(container);
swap.classList.remove('fade');
swap.classList.remove('in');
complete && complete();
}
function slideEnd() {
swap.removeEventListener('webkitTransitionEnd', slideEnd);
swap.classList.remove('slide');
@ -465,7 +468,9 @@
var triggerStateChange = function () {
var e = new CustomEvent('push', {
detail: { state: getCached(PUSH.id) },
detail: {
state: getCached(PUSH.id)
},
bubbles: true,
cancelable: true
});
@ -476,7 +481,9 @@
var findTarget = function (target) {
var i, toggles = document.querySelectorAll('a');
for (; target && target !== document; target = target.parentNode) {
for (i = toggles.length; i--;) { if (toggles[i] === target) return target; }
for (i = toggles.length; i--;) {
if (toggles[i] === target) return target;
}
}
};
@ -486,7 +493,9 @@
};
var parseURL = function (url) {
var a = document.createElement('a'); a.href = url; return a;
var a = document.createElement('a');
a.href = url;
return a;
};
var extendWithDom = function (obj, fragment, dom) {
@ -546,10 +555,16 @@
// Attach PUSH event handlers
// ==========================
window.addEventListener('touchstart', function () { isScrolling = false; });
window.addEventListener('touchmove', function () { isScrolling = true; })
window.addEventListener('touchstart', function () {
isScrolling = false;
});
window.addEventListener('touchmove', function () {
isScrolling = true;
})
window.addEventListener('touchend', touchend);
window.addEventListener('click', function (e) { if (getTarget(e)) e.preventDefault(); });
window.addEventListener('click', function (e) {
if (getTarget(e)) e.preventDefault();
});
window.addEventListener('popstate', popstate);
}();
@ -564,7 +579,9 @@
var getTarget = function (target) {
var i, popovers = document.querySelectorAll('.segmented-controller li a');
for (; target && target !== document; target = target.parentNode) {
for (i = popovers.length; i--;) { if (popovers[i] === target) return target; }
for (i = popovers.length; i--;) {
if (popovers[i] === target) return target;
}
}
};
@ -609,8 +626,11 @@
targetBody.classList.add(className);
});
window.addEventListener('click', function (e) { if (getTarget(e.target)) e.preventDefault(); });
}();/* ----------------------------------
window.addEventListener('click', function (e) {
if (getTarget(e.target)) e.preventDefault();
});
}();
/* ----------------------------------
* SLIDER v1.0.0
* Licensed under The MIT License
* Adapted from Brad Birdsall's swipe
@ -636,7 +656,9 @@
var getSlider = function (target) {
var i, sliders = document.querySelectorAll('.slider ul');
for (; target && target !== document; target = target.parentNode) {
for (i = sliders.length; i--;) { if (sliders[i] === target) return target; }
for (i = sliders.length; i--;) {
if (sliders[i] === target) return target;
}
}
}
@ -647,7 +669,7 @@
var setSlideNumber = function (offset) {
var round = offset ? (deltaX < 0 ? 'ceil' : 'floor') : 'round';
slideNumber = Math[round](getScroll() / ( scrollableArea / slider.children.length) );
slideNumber = Math[round](getScroll() / (scrollableArea / slider.children.length));
slideNumber += offset;
slideNumber = Math.min(slideNumber, 0);
slideNumber = Math.max(-(slider.children.length - 1), slideNumber);
@ -702,8 +724,7 @@
if (!slider || isScrolling) return;
setSlideNumber(
(+new Date) - startTime < 1000 && Math.abs(deltaX) > 15 ? (deltaX < 0 ? -1 : 1) : 0
);
(+new Date) - startTime < 1000 && Math.abs(deltaX) > 15 ? (deltaX < 0 ? -1 : 1) : 0);
offsetX = slideNumber * sliderWidth;
@ -711,7 +732,9 @@
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)';
e = new CustomEvent('slide', {
detail: { slideNumber: Math.abs(slideNumber) },
detail: {
slideNumber: Math.abs(slideNumber)
},
bubbles: true,
cancelable: true
});
@ -731,7 +754,7 @@
* ---------------------------------- */
!function () {
"use strict";
var start = {},
touchMove = false,
distanceX = false,
@ -740,7 +763,9 @@
var findToggle = function (target) {
var i, toggles = document.querySelectorAll('.toggle');
for (; target && target !== document; target = target.parentNode) {
for (i = toggles.length; i--;) { if (toggles[i] === target) return target; }
for (i = toggles.length; i--;) {
if (toggles[i] === target) return target;
}
}
}
@ -758,7 +783,10 @@
handleWidth = handle.offsetWidth,
offset = toggle.classList.contains('active') ? (toggleWidth - handleWidth) : 0;
start = { pageX : e.touches[0].pageX - offset, pageY : e.touches[0].pageY };
start = {
pageX: e.touches[0].pageX - offset,
pageY: e.touches[0].pageY
};
touchMove = false;
// todo: probably should be moved to the css
@ -796,7 +824,7 @@
handle.style.webkitTransform = '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');
});
window.addEventListener('touchend', function (e) {
@ -806,7 +834,7 @@
toggleWidth = toggle.offsetWidth,
handleWidth = handle.offsetWidth,
offset = toggleWidth - handleWidth,
slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth/2 - handleWidth/2)));
slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2)));
if (slideOn) {
handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)';
@ -817,7 +845,9 @@
toggle.classList[slideOn ? 'add' : 'remove']('active');
e = new CustomEvent('toggle', {
detail: { isActive: slideOn },
detail: {
isActive: slideOn
},
bubbles: true,
cancelable: true
});

93
lib/js/push.js
Unescape View File

@ -17,15 +17,15 @@
cacheMapping = sessionStorage,
domCache = {},
transitionMap = {
'slide-in' : 'slide-out',
'slide-out' : 'slide-in',
'fade' : 'fade'
'slide-in': 'slide-out',
'slide-out': 'slide-in',
'fade': 'fade'
},
bars = {
bartab : '.bar-tab',
bartitle : '.bar-title',
barfooter : '.bar-footer',
barheadersecondary : '.bar-header-secondary'
bartab: '.bar-tab',
bartitle: '.bar-title',
barfooter: '.bar-footer',
barheadersecondary: '.bar-header-secondary'
};
var cacheReplace = function (data, updates) {
@ -102,10 +102,10 @@
e.preventDefault();
PUSH({
url : target.href,
hash : target.hash,
timeout : target.getAttribute('data-timeout'),
transition : target.getAttribute('data-transition')
url: target.href,
hash: target.hash,
timeout: target.getAttribute('data-timeout'),
transition: target.getAttribute('data-transition')
});
};
@ -150,12 +150,12 @@
if (!activeDom) {
return PUSH({
id : activeObj.id,
url : activeObj.url,
title : activeObj.title,
timeout : activeObj.timeout,
transition : transition,
ignorePush : true
id: activeObj.id,
url: activeObj.url,
title: activeObj.title,
timeout: activeObj.timeout,
transition: transition,
ignorePush: true
});
}
@ -165,8 +165,7 @@
barElement = document.querySelector(bars[key]);
if (activeObj[key]) {
swapContent(activeObj[key], barElement);
}
else if (barElement) {
} else if (barElement) {
barElement.parentNode.removeChild(barElement);
}
}
@ -175,8 +174,7 @@
swapContent(
(activeObj.contents || activeDom).cloneNode(true),
document.querySelector('.content'),
transition
);
transition);
PUSH.id = id;
@ -216,16 +214,18 @@
if (!PUSH.id) {
cacheReplace({
id : +new Date,
url : window.location.href,
title : document.title,
timeout : options.timeout,
transition : null
id: +new Date,
url: window.location.href,
title: document.title,
timeout: options.timeout,
transition: null
});
}
if (options.timeout) {
options._timeout = setTimeout(function () { xhr.abort('timeout'); }, options.timeout);
options._timeout = setTimeout(function () {
xhr.abort('timeout');
}, options.timeout);
}
xhr.send();
@ -256,11 +256,11 @@
swapContent(data.contents, options.container, options.transition, function () {
cacheReplace({
id : options.id || +new Date,
url : data.url,
title : data.title,
timeout : options.timeout,
transition : options.transition
id: options.id || +new Date,
url: data.url,
title: data.title,
timeout: options.timeout,
transition: options.transition
}, options.id);
triggerStateChange();
});
@ -279,18 +279,21 @@
var swapContent = function (swap, container, transition, complete) {
"use strict";
function fadeContainerEnd() {
container.removeEventListener('webkitTransitionEnd', fadeContainerEnd);
swap.classList.add('in');
swap.addEventListener('webkitTransitionEnd', fadeSwapEnd);
}
function fadeSwapEnd () {
function fadeSwapEnd() {
swap.removeEventListener('webkitTransitionEnd', fadeSwapEnd);
container.parentNode.removeChild(container);
swap.classList.remove('fade');
swap.classList.remove('in');
complete && complete();
}
function slideEnd() {
swap.removeEventListener('webkitTransitionEnd', slideEnd);
swap.classList.remove('slide');
@ -346,7 +349,9 @@
var triggerStateChange = function () {
var e = new CustomEvent('push', {
detail: { state: getCached(PUSH.id) },
detail: {
state: getCached(PUSH.id)
},
bubbles: true,
cancelable: true
});
@ -357,7 +362,9 @@
var findTarget = function (target) {
var i, toggles = document.querySelectorAll('a');
for (; target && target !== document; target = target.parentNode) {
for (i = toggles.length; i--;) { if (toggles[i] === target) return target; }
for (i = toggles.length; i--;) {
if (toggles[i] === target) return target;
}
}
};
@ -367,7 +374,9 @@
};
var parseURL = function (url) {
var a = document.createElement('a'); a.href = url; return a;
var a = document.createElement('a');
a.href = url;
return a;
};
var extendWithDom = function (obj, fragment, dom) {
@ -427,10 +436,16 @@
// Attach PUSH event handlers
// ==========================
window.addEventListener('touchstart', function () { isScrolling = false; });
window.addEventListener('touchmove', function () { isScrolling = true; })
window.addEventListener('touchstart', function () {
isScrolling = false;
});
window.addEventListener('touchmove', function () {
isScrolling = true;
})
window.addEventListener('touchend', touchend);
window.addEventListener('click', function (e) { if (getTarget(e)) e.preventDefault(); });
window.addEventListener('click', function (e) {
if (getTarget(e)) e.preventDefault();
});
window.addEventListener('popstate', popstate);
}();

8
lib/js/segmented-controllers.js
Unescape View File

@ -9,7 +9,9 @@
var getTarget = function (target) {
var i, popovers = document.querySelectorAll('.segmented-controller li a');
for (; target && target !== document; target = target.parentNode) {
for (i = popovers.length; i--;) { if (popovers[i] === target) return target; }
for (i = popovers.length; i--;) {
if (popovers[i] === target) return target;
}
}
};
@ -54,5 +56,7 @@
targetBody.classList.add(className);
});
window.addEventListener('click', function (e) { if (getTarget(e.target)) e.preventDefault(); });
window.addEventListener('click', function (e) {
if (getTarget(e.target)) e.preventDefault();
});
}();

13
lib/js/sliders.js
Unescape View File

@ -24,7 +24,9 @@
var getSlider = function (target) {
var i, sliders = document.querySelectorAll('.slider ul');
for (; target && target !== document; target = target.parentNode) {
for (i = sliders.length; i--;) { if (sliders[i] === target) return target; }
for (i = sliders.length; i--;) {
if (sliders[i] === target) return target;
}
}
}
@ -35,7 +37,7 @@
var setSlideNumber = function (offset) {
var round = offset ? (deltaX < 0 ? 'ceil' : 'floor') : 'round';
slideNumber = Math[round](getScroll() / ( scrollableArea / slider.children.length) );
slideNumber = Math[round](getScroll() / (scrollableArea / slider.children.length));
slideNumber += offset;
slideNumber = Math.min(slideNumber, 0);
slideNumber = Math.max(-(slider.children.length - 1), slideNumber);
@ -90,8 +92,7 @@
if (!slider || isScrolling) return;
setSlideNumber(
(+new Date) - startTime < 1000 && Math.abs(deltaX) > 15 ? (deltaX < 0 ? -1 : 1) : 0
);
(+new Date) - startTime < 1000 && Math.abs(deltaX) > 15 ? (deltaX < 0 ? -1 : 1) : 0);
offsetX = slideNumber * sliderWidth;
@ -99,7 +100,9 @@
slider.style.webkitTransform = 'translate3d(' + offsetX + 'px,0,0)';
e = new CustomEvent('slide', {
detail: { slideNumber: Math.abs(slideNumber) },
detail: {
slideNumber: Math.abs(slideNumber)
},
bubbles: true,
cancelable: true
});

19
lib/js/toggles.js
Unescape View File

@ -5,7 +5,7 @@
* ---------------------------------- */
!function () {
"use strict";
var start = {},
touchMove = false,
distanceX = false,
@ -14,7 +14,9 @@
var findToggle = function (target) {
var i, toggles = document.querySelectorAll('.toggle');
for (; target && target !== document; target = target.parentNode) {
for (i = toggles.length; i--;) { if (toggles[i] === target) return target; }
for (i = toggles.length; i--;) {
if (toggles[i] === target) return target;
}
}
}
@ -32,7 +34,10 @@
handleWidth = handle.offsetWidth,
offset = toggle.classList.contains('active') ? (toggleWidth - handleWidth) : 0;
start = { pageX : e.touches[0].pageX - offset, pageY : e.touches[0].pageY };
start = {
pageX: e.touches[0].pageX - offset,
pageY: e.touches[0].pageY
};
touchMove = false;
// todo: probably should be moved to the css
@ -70,7 +75,7 @@
handle.style.webkitTransform = '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');
});
window.addEventListener('touchend', function (e) {
@ -80,7 +85,7 @@
toggleWidth = toggle.offsetWidth,
handleWidth = handle.offsetWidth,
offset = toggleWidth - handleWidth,
slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth/2 - handleWidth/2)));
slideOn = (!touchMove && !toggle.classList.contains('active')) || (touchMove && (distanceX > (toggleWidth / 2 - handleWidth / 2)));
if (slideOn) {
handle.style.webkitTransform = 'translate3d(' + offset + 'px,0,0)';
@ -91,7 +96,9 @@
toggle.classList[slideOn ? 'add' : 'remove']('active');
e = new CustomEvent('toggle', {
detail: { isActive: slideOn },
detail: {
isActive: slideOn
},
bubbles: true,
cancelable: true
});

Write Preview
Loading…
Cancel
Save