Skip to content

Commit

Permalink
breakpoints: string => number, remove repeated properties in mediauqe…
Browse files Browse the repository at this point in the history 
…ries
  • Loading branch information
@ganlanyuan
ganlanyuan committed Aug 18, 2017
1 parent 8a75cce commit ea39f25
Show file tree
Hide file tree
Showing 9 changed files with 233 additions and 116 deletions.
2 changes: 1 addition & 1 deletion dist/min/tiny-slider.helper.ie8.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion dist/min/tiny-slider.js
View file

Large diffs are not rendered by default.

19 changes: 19 additions & 0 deletions dist/tiny-slider.helper.ie8.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,25 @@ if (!Array.prototype.forEach) {
};
}

// map
// https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Objects/Array/map
if (!Array.prototype.map) {
Array.prototype.map = function(fun /*, thisp*/) {
var len = this.length >>> 0;
if (typeof fun != "function")
throw new TypeError();

var res = new Array(len);
var thisp = arguments[1];
for (var i = 0; i < len; i++) {
if (i in this)
res[i] = fun.call(thisp, this[i], i, this);
}

return res;
};
}

// Filter

if (!Array.prototype.filter) {
Expand Down
93 changes: 55 additions & 38 deletions dist/tiny-slider.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -894,7 +894,9 @@ var tns = function(options) {
breakpointZoneAdjust = 0;

if (responsive) {
breakpoints = Object.keys(responsive).sort(function (a, b) { return a - b; });
breakpoints = Object.keys(responsive)
.map(function (x) { return Number(x); })
.sort(function (a, b) { return a - b; });
if (breakpoints.indexOf(0) < 0) { breakpointZoneAdjust = 1; }

breakpoints.forEach(function(bp) {
Expand Down Expand Up @@ -1111,45 +1113,51 @@ var tns = function(options) {

function getContainerWidth(fixedWidthTem, gutterTem, itemsTem) {
itemsTem = Math.min(slideCount, itemsTem);
var widthStr;
var str;

if (fixedWidthTem) {
widthStr = (fixedWidthTem + Number(gutterTem)) * slideCountNew + 'px';
str = (fixedWidthTem + Number(gutterTem)) * slideCountNew + 'px';
} else {
widthStr = CALC ?
str = CALC ?
CALC + '(' + slideCountNew * 100 + '% / ' + itemsTem + ')' :
slideCountNew * 100 / itemsTem + '%';
}

return widthStr;
return str;
}

function getSlideStyles(fixedWidthTem, gutterTem, itemsTem) {
function getSlideWidthStyle(fixedWidthTem, gutterTem, itemsTem) {
itemsTem = Math.min(slideCount, itemsTem);
var widthStr = gutterStr = '';
var str = '';

if (horizontal) {
widthStr = 'width:';
str = 'width:';
if (fixedWidthTem) {
widthStr += (fixedWidthTem + Number(gutterTem)) + 'px';
str += (fixedWidthTem + Number(gutterTem)) + 'px';
} else {
var dividend = carousel ? slideCountNew : Math.min(slideCount, itemsTem);
widthStr += CALC ?
str += CALC ?
CALC + '(100% / ' + dividend + ')' :
100 / dividend + '%';
}
widthStr += importantStr + ';';
str += importantStr + ';';
}

return str;
}

function getSlideGutterStyle(gutterTem) {
var str = '';

// gutter maybe interger || 0
// so can't use 'if (gutter)'
if (gutterTem !== false) {
var prop = horizontal ? 'padding-' : 'margin-',
dir = horizontal ? 'right' : 'bottom';
gutterStr = prop + dir + ': ' + gutterTem + 'px;';
str = prop + dir + ': ' + gutterTem + 'px;';
}

return widthStr + gutterStr;
return str;
}

(function sliderInit() {
Expand Down Expand Up @@ -1269,7 +1277,6 @@ var tns = function(options) {

// slide left margin
// for IE8 & webkit browsers (no subpixel)
// run once
} else {
[].forEach.call(slideItems, function (slide, i) {
slide.style.marginLeft = getSlideMarginLeft(i);
Expand All @@ -1290,7 +1297,8 @@ var tns = function(options) {

// slide styles
if (horizontal || options.gutter) {
str = getSlideStyles(options.fixedWidth, options.gutter, options.items);
str = getSlideWidthStyle(options.fixedWidth, options.gutter, options.items) +
getSlideGutterStyle(options.gutter);
addCSSRule(sheet, '#' + slideId + ' .tns-item', str, getCssRulesLength(sheet));
}

Expand All @@ -1309,7 +1317,8 @@ var tns = function(options) {

// slide styles
if (horizontal || gutter) {
var str = getSlideStyles(fixedWidth, gutter, items);
var str = getSlideWidthStyle(fixedWidth, gutter, items) +
getSlideGutterStyle(gutter);
// append to the last line
addCSSRule(sheet, '#' + slideId + ' .tns-item', str, getCssRulesLength(sheet));
}
Expand All @@ -1330,21 +1339,27 @@ var tns = function(options) {
edgePaddingBP = getOption('edgePadding', bp),
gutterBP = getOption('gutter', bp);

// inner wrapper string
if ('edgePadding' in opts || 'gutter' in opts) {
innerWrapperStr = '#' + slideId + '-iw{' + getInnerWrapperStyles(edgePaddingBP, gutterBP, fixedWidthBP) + '}';
}

if ('fixedWidth' in opts || 'gutter' in opts || 'items' in opts) {
if (carousel && horizontal) {
containerStr = '#' + slideId + '{' + 'width:' + getContainerWidth(fixedWidthBP, gutterBP, itemsBP) + '}';
}
// container string
if (carousel && horizontal && ('fixedWidth' in opts || 'gutter' in opts || 'items' in opts)) {
containerStr = '#' + slideId + '{' + 'width:' + getContainerWidth(fixedWidthBP, gutterBP, itemsBP) + '}';
}

if (horizontal || 'gutter' in opts) {
slideStr = '#' + slideId + ' .tns-item{' + getSlideStyles(fixedWidthBP, gutterBP, itemsBP) + '}';
}
// slide string
if ('fixedWidth' in opts || checkOption('fixedWidth') && 'gutter' in opts) {
slideStr += getSlideWidthStyle(fixedWidthBP, gutterBP, itemsBP);
}
if ('gutter' in opts) {
slideStr += getSlideGutterStyle(gutterBP);
}
if (slideStr.length > 0) { slideStr = '#' + slideId + ' .tns-item{' + slideStr + '}'; }

str = innerWrapperStr + containerStr + slideStr;

if (str.length > 0) {
sheet.insertRule('@media (min-width: ' + bp / 16 + 'em) {' + str + '}', sheet.cssRules.length);
}
Expand Down Expand Up @@ -1706,25 +1721,28 @@ var tns = function(options) {
// set inline styles for inner wrapper & container
// insert stylesheet (one line) for slides only (since slides are many)
if (!CSSMQ) {
// inner wrapper styles
if (edgePadding !== edgePaddingTem || gutter !== gutterTem) {
// inner wrapper styles
innerWrapper.style.cssText = getInnerWrapperStyles(edgePadding, gutter, fixedWidth);
}

if (fixedWidth !== fixedWidthTem || gutter !== gutterTem || items !== itemsTem) {
if (carousel && horizontal) {
// container styles
container.style.width = getContainerWidth(fixedWidth, gutter, items);
}
// container styles
if (carousel && horizontal && (fixedWidth !== fixedWidthTem || gutter !== gutterTem || items !== itemsTem)) {
container.style.width = getContainerWidth(fixedWidth, gutter, items);
}

// slide styles
if (horizontal || gutter !== gutterTem) {
str = getSlideStyles(fixedWidth, gutter, items);
// remove the last line and
// add it again
sheet.removeRule(getCssRulesLength(sheet) - 1);
addCSSRule(sheet, '#' + slideId + ' .tns-item', str, getCssRulesLength(sheet));
}
// slide styles
// always need to get width property
var str = getSlideWidthStyle(fixedWidth, gutter, items);
if (gutter !== gutterTem) {
str += getSlideGutterStyle(gutter);
}

// remove the last line and
// add it again
if (str.length > 0) {
sheet.removeRule(getCssRulesLength(sheet) - 1);
addCSSRule(sheet, '#' + slideId + ' .tns-item', str, getCssRulesLength(sheet));
}

if (!fixedWidth) { doTransform(0); }
Expand Down Expand Up @@ -1767,7 +1785,6 @@ var tns = function(options) {
}
// auto height
runAutoHeight();

}


Expand Down
1 change: 1 addition & 0 deletions src/tiny-slider.helper.ie8.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import "../bower_components/go-native/src/es5/array/isArray.js";
import "../bower_components/go-native/src/es5/array/forEach.js";
import "../bower_components/go-native/src/es5/array/map.js";
import "../bower_components/go-native/src/es5/array/filter.js";
import "../bower_components/go-native/src/es5/array/indexOf.js";
import "../bower_components/go-native/src/ie8/addEventListener.js";
Expand Down
Loading

0 comments on commit ea39f25

Please sign in to comment.