sassqwatch
Advanced tools
Comparing version 0.3.0-0 to 0.4.0
@@ -68,30 +68,32 @@ // Dependencies | ||
/** | ||
* Public: A convenience method to fire a callback when above, below, or on a specified breakpoint | ||
* @param direction - A string "above", "below", or "on" | ||
* Public: A CSS-like query function to check against a min or max breakpoint. For convenience you can also query on a specific breakpoint. | ||
* @param type - A string "min", "max", or "on" | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var when = function(direction, which, callback) { | ||
var | ||
dir = direction.toLowerCase(), | ||
check; | ||
var query = function(type, which, callback) { | ||
var check; | ||
if (dir === 'above') { | ||
check = function(e, newMediaQuery) { | ||
if (isAbove(which)) { | ||
callback(newMediaQuery); | ||
switch (type.toLowerCase()) { | ||
case 'min': | ||
check = function(e, newMediaQuery) { | ||
if (isAbove(which)) { | ||
callback(newMediaQuery); | ||
} | ||
} | ||
} | ||
} else if (dir === 'below') { | ||
check = function(e, newMediaQuery) { | ||
if (isBelow(which)) { | ||
callback(newMediaQuery); | ||
break; | ||
case 'max': | ||
check = function(e, newMediaQuery) { | ||
if (isBelow(which)) { | ||
callback(newMediaQuery); | ||
} | ||
} | ||
} | ||
} else if (dir === 'on') { | ||
check = function(e, newMediaQuery, oldMediaQuery) { | ||
if (matches(which)) { | ||
callback(oldMediaQuery); | ||
break; | ||
case 'only': | ||
check = function(e, newMediaQuery, oldMediaQuery) { | ||
if (matches(which)) { | ||
callback(oldMediaQuery); | ||
} | ||
} | ||
} | ||
break; | ||
} | ||
@@ -108,2 +110,32 @@ | ||
/** | ||
* Public: A convenience function to call query with a 'min' value | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var min = function(which, callback) { | ||
query('min', which, callback); | ||
return this; | ||
}; | ||
/** | ||
* Public: A convenience function to call query with a 'max' value | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var max = function(which, callback) { | ||
query('max', which, callback); | ||
return this; | ||
}; | ||
/** | ||
* Public: A convenience function to call query with a 'only' value | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var only = function(which, callback) { | ||
query('only', which, callback); | ||
return this; | ||
}; | ||
/** | ||
* Public: Checks if the media query is greater than the specified | ||
@@ -200,11 +232,14 @@ * @param which - The media query to check against | ||
onMediaQueryChange: onMediaQueryChange, | ||
when: when, | ||
responsiveImages: responsiveImages, | ||
fetchMediaQuery: fetchMediaQuery, | ||
fetchMqIndex: fetchMqIndex, | ||
fetchMqName: fetchMqName, | ||
throttleOff: throttleOff, | ||
throttleOn: throttleOn, | ||
isAbove: isAbove, | ||
isBelow: isBelow, | ||
throttleOn: throttleOn, | ||
throttleOff: throttleOff, | ||
responsiveImages: responsiveImages | ||
query: query, | ||
only: only, | ||
min: min, | ||
max: max | ||
}; | ||
@@ -211,0 +246,0 @@ }.call(); |
{ | ||
"name": "sassqwatch", | ||
"version": "0.3.0-0", | ||
"version": "0.4.0", | ||
"description": "The Sass Query Watcher.", | ||
@@ -5,0 +5,0 @@ "repository": "https://github.com/40Digits/sassqwatch/", |
@@ -34,3 +34,3 @@ # SassQwatch - The Sass Query Watcher. | ||
@media (min-width: 600px) { | ||
font-family: 'mq-small'; | ||
font-family: 'mq-medium'; | ||
} | ||
@@ -86,16 +86,61 @@ @media (min-width: 768px) { | ||
#### when( direction, breakpoint, callback ) | ||
`direction` (string): "above", "below", or "on" | ||
## Methods | ||
`breakpoint` (string): the name of the media query to check for | ||
#### min( breakpoint, callback ) | ||
`breakpoint` (string): the name of the media query to check against | ||
`callback` (function): the callback function to call | ||
Fires a callback when the current breakpoint is above, below, or on the specified breakpoint. If checking for "above" or "below" then the callback receives the name of the new media query. If checking for "on" the callback receives the name of the old media query. | ||
A convenience method that functions similarly to a `min-width` media query in CSS. The callback is fired on the specified breakpoint as well as any breakpoint that is above it. The callback is provided the name of the current media query. | ||
```javascript | ||
sassqwatch.when('above', 'mq-medium', function (newMediaQuery) { | ||
console.log('now above mq-medium'); | ||
sassqwatch.min(mq-medium', function (newMediaQuery) { | ||
console.log('now min mq-medium'); | ||
}); | ||
sassqwatch.when('on', 'mq-xxlarge', function (oldMediaQuery) { | ||
``` | ||
#### max( breakpoint, callback ) | ||
`breakpoint` (string): the name of the media query to check against | ||
`callback` (function): the callback function to call | ||
A convenience method that functions similarly to a `max-width` media query in CSS. The callback is fired on the specified breakpoint as well as any breakpoint that is below it. The callback is provided the name of the current media query. | ||
```javascript | ||
sassqwatch.max(mq-medium', function (newMediaQuery) { | ||
console.log('now max mq-medium'); | ||
}); | ||
``` | ||
#### only( breakpoint, callback ) | ||
`breakpoint` (string): the name of the media query to check against | ||
`callback` (function): the callback function to call | ||
A convenience method that fires a callback only on a specified breakpoint. The callback is provided the name of the previous media query. | ||
```javascript | ||
sassqwatch.min(mq-medium', function (oldMediaQuery) { | ||
console.log('now on mq-medium'); | ||
}); | ||
``` | ||
#### query( type, breakpoint, callback ) | ||
`type` (string): "min", "max", or "only" | ||
`breakpoint` (string): the name of the media query to check against | ||
`callback` (function): the callback function to call | ||
Fires a callback when the current breakpoint is min, max, or only the specified breakpoint. If checking for "min" or "max" then the callback receives the name of the new media query. If checking for "only" the callback receives the name of the old media query. | ||
```javascript | ||
sassqwatch.query('min', 'mq-medium', function (newMediaQuery) { | ||
console.log('now min mq-medium'); | ||
}); | ||
sassqwatch.query('only', 'mq-xxlarge', function (oldMediaQuery) { | ||
console.log('now on mq-xxlarge'); | ||
@@ -105,4 +150,2 @@ }); | ||
## Methods | ||
#### fetchMediaQuery() | ||
@@ -109,0 +152,0 @@ |
@@ -382,30 +382,32 @@ require=(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){ | ||
/** | ||
* Public: A convenience method to fire a callback when above, below, or on a specified breakpoint | ||
* @param direction - A string "above", "below", or "on" | ||
* Public: A CSS-like query function to check against a min or max breakpoint. For convenience you can also query on a specific breakpoint. | ||
* @param type - A string "min", "max", or "on" | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var when = function(direction, which, callback) { | ||
var | ||
dir = direction.toLowerCase(), | ||
check; | ||
var query = function(type, which, callback) { | ||
var check; | ||
if (dir === 'above') { | ||
check = function(e, newMediaQuery) { | ||
if (isAbove(which)) { | ||
callback(newMediaQuery); | ||
switch (type.toLowerCase()) { | ||
case 'min': | ||
check = function(e, newMediaQuery) { | ||
if (isAbove(which)) { | ||
callback(newMediaQuery); | ||
} | ||
} | ||
} | ||
} else if (dir === 'below') { | ||
check = function(e, newMediaQuery) { | ||
if (isBelow(which)) { | ||
callback(newMediaQuery); | ||
break; | ||
case 'max': | ||
check = function(e, newMediaQuery) { | ||
if (isBelow(which)) { | ||
callback(newMediaQuery); | ||
} | ||
} | ||
} | ||
} else if (dir === 'on') { | ||
check = function(e, newMediaQuery, oldMediaQuery) { | ||
if (matches(which)) { | ||
callback(oldMediaQuery); | ||
break; | ||
case 'only': | ||
check = function(e, newMediaQuery, oldMediaQuery) { | ||
if (matches(which)) { | ||
callback(oldMediaQuery); | ||
} | ||
} | ||
} | ||
break; | ||
} | ||
@@ -422,2 +424,32 @@ | ||
/** | ||
* Public: A convenience function to call query with a 'min' value | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var min = function(which, callback) { | ||
query('min', which, callback); | ||
return this; | ||
}; | ||
/** | ||
* Public: A convenience function to call query with a 'max' value | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var max = function(which, callback) { | ||
query('max', which, callback); | ||
return this; | ||
}; | ||
/** | ||
* Public: A convenience function to call query with a 'only' value | ||
* @param which - The media query to check against | ||
* @param callback - The function to call when the event is fired | ||
*/ | ||
var only = function(which, callback) { | ||
query('only', which, callback); | ||
return this; | ||
}; | ||
/** | ||
* Public: Checks if the media query is greater than the specified | ||
@@ -514,11 +546,14 @@ * @param which - The media query to check against | ||
onMediaQueryChange: onMediaQueryChange, | ||
when: when, | ||
responsiveImages: responsiveImages, | ||
fetchMediaQuery: fetchMediaQuery, | ||
fetchMqIndex: fetchMqIndex, | ||
fetchMqName: fetchMqName, | ||
throttleOff: throttleOff, | ||
throttleOn: throttleOn, | ||
isAbove: isAbove, | ||
isBelow: isBelow, | ||
throttleOn: throttleOn, | ||
throttleOff: throttleOff, | ||
responsiveImages: responsiveImages | ||
query: query, | ||
only: only, | ||
min: min, | ||
max: max | ||
}; | ||
@@ -525,0 +560,0 @@ }.call(); |
@@ -1,1 +0,1 @@ | ||
require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a="function"==typeof require&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}for(var i="function"==typeof require&&require,o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){(function(global){var $="undefined"!=typeof window?window.$:"undefined"!=typeof global?global.$:null;module.exports=function(el){return"string"==typeof el?$(el):el}}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],2:[function(require,module,exports){var preloader=function(src,callback){var loaded=!1,img=new Image,loadHandler=function(){loaded||(loaded=!0,callback(src),img=null)};img.addEventListener("load",loadHandler),img.src=src,img.complete&&loadHandler()};module.exports=preloader},{}],3:[function(require,module,exports){(function(global){module.exports=function(options){var $="undefined"!=typeof window?window.$:"undefined"!=typeof global?global.$:null,sassqwatch=require("./sassqwatch"),toDashed=require("./toDashed"),elementify=require("./elementify"),preloader=require("./preloader"),defaultSelector=$(".sassqwatch"),settings=$.extend({selector:defaultSelector},options),knownSizes=[],storeSizes=function($image){var mqName,src=getSource($image),responsiveSrcs=$image.data(),sizes={image:$image,loaded:[],originalSrc:src,activeSrc:src};$.each(responsiveSrcs,function(key,value){mqName=toDashed(key),sizes[mqName]=value}),knownSizes.push(sizes)},getSource=function($image){var imageSrc;return imageSrc=$image.is("img")?$image.attr("src"):$image.css("background-image").replace(/^url\(['"]?/,"").replace(/['"]?\)$/,"")},swapImage=function($target,newImageSrc){$target.is("img")?$target.attr("src",newImageSrc):$target.css("background-image","url("+newImageSrc+")")},updateImages=function(newMediaQuery){var isLoaded=!1;null==newMediaQuery&&(newMediaQuery=sassqwatch.fetchMediaQuery()),$.each(knownSizes,function(i){var thisImage=knownSizes[i],newSource=thisImage[newMediaQuery];if(!newSource){var thisMQ,ii=sassqwatch.fetchMqIndex(newMediaQuery);for(ii;ii>0;ii--)if(thisMQ=sassqwatch.fetchMqName(ii),thisImage[thisMQ]){newSource=thisImage[thisMQ];break}newSource=newSource||thisImage.originalSrc}-1===newSource.indexOf(thisImage.activeSrc)&&($.each(thisImage.loaded,function(i){return thisImage.loaded[i].indexOf(newSource)>0?void(isLoaded=!0):void 0}),isLoaded?swapImage(thisImage.image,newSource):preloader(newSource,function(src){swapImage(thisImage.image,src),thisImage.loaded.push(src)}),thisImage.activeSrc=newSource)})};return settings.selector!==defaultSelector&&(settings.selector=elementify(settings.selector)),settings.selector.each(function(){storeSizes($(this))}),updateImages(),sassqwatch.onMediaQueryChange(updateImages),sassqwatch}}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./elementify":1,"./preloader":2,"./sassqwatch":"sassqwatch","./toDashed":5}],4:[function(require,module,exports){var jq_throttle;exports.throttle=jq_throttle=function(delay,no_trailing,callback,debounce_mode){function wrapper(){function exec(){last_exec=+new Date,callback.apply(that,args)}function clear(){timeout_id=void 0}var that=this,elapsed=+new Date-last_exec,args=arguments;debounce_mode&&!timeout_id&&exec(),timeout_id&&clearTimeout(timeout_id),void 0===debounce_mode&&elapsed>delay?exec():no_trailing!==!0&&(timeout_id=setTimeout(debounce_mode?clear:exec,void 0===debounce_mode?delay-elapsed:delay))}var timeout_id,last_exec=0;return"boolean"!=typeof no_trailing&&(debounce_mode=callback,callback=no_trailing,no_trailing=void 0),wrapper},exports.debounce=function(delay,at_begin,callback){return void 0===callback?jq_throttle(delay,at_begin,!1):jq_throttle(delay,callback,at_begin!==!1)}},{}],5:[function(require,module,exports){module.exports=function(string){var words=[],currentChar="",currentWord="",i=0;for(i;string.length>=i;i++)currentChar=string.charAt(i),currentChar===currentChar.toUpperCase()?(words.push(currentWord),currentWord=currentChar.toLowerCase()):currentWord+=currentChar;return words.join("-")}},{}],sassqwatch:[function(require,module,exports){(function(global){var $="undefined"!=typeof window?window.$:"undefined"!=typeof global?global.$:null,td=require("./throttleDebounce"),$window=$(window),$orderElement=($("body"),$("title")),$listenElement=$("head"),currentMediaQuery="",mqOrderNamed={},mqOrderNumbered=[],matches=function(which){return fetchMediaQuery()==which},onResize=function(){var lastMediaQuery=currentMediaQuery;currentMediaQuery=fetchMediaQuery(),currentMediaQuery!=lastMediaQuery&&$listenElement.trigger("mediaQueryChange",[currentMediaQuery,lastMediaQuery])},setOrder=function(){var mediaQueries=$orderElement.css("font-family");mqOrderNumbered=mediaQueries.replace(/['"\s]/g,"").split(","),$.each(mqOrderNumbered,function(index,value){mqOrderNamed[value]=index})},onMediaQueryChange=function(callback){return $listenElement.on("mediaQueryChange",function(e,newMediaQuery,oldMediaQuery){callback(newMediaQuery,oldMediaQuery)}),this},when=function(direction,which,callback){var check,dir=direction.toLowerCase();return"above"===dir?check=function(e,newMediaQuery){isAbove(which)&&callback(newMediaQuery)}:"below"===dir?check=function(e,newMediaQuery){isBelow(which)&&callback(newMediaQuery)}:"on"===dir&&(check=function(e,newMediaQuery,oldMediaQuery){matches(which)&&callback(oldMediaQuery)}),"function"==typeof check&&(check(),$listenElement.on("mediaQueryChange",check)),this},isAbove=function(which){var currentMq=mqOrderNamed[fetchMediaQuery()],whichMq=mqOrderNamed[which];return currentMq>=whichMq},isBelow=function(which){var currentMq=mqOrderNamed[fetchMediaQuery()],whichMq=mqOrderNamed[which];return whichMq>currentMq},fetchMediaQuery=function(){var mq=$listenElement.css("font-family");return mq=mq.replace(/['",]/g,"")},fetchMqIndex=function(mediaQuery){return mqOrderNamed[mediaQuery]},fetchMqName=function(index){return mqOrderNumbered[index]},throttleOn=function(duration){return $window.on("resize.throttle",td.throttle(duration||250,onResize)),$window.off("resize.no-throttle"),this},throttleOff=function(){return $window.on("resize.no-throttle",onResize),$window.off("resize.throttle"),this},responsiveImages=require("./responsiveImages"),constructor=function(){return setOrder(),currentMediaQuery=fetchMediaQuery(),throttleOff(),{onMediaQueryChange:onMediaQueryChange,when:when,fetchMediaQuery:fetchMediaQuery,fetchMqIndex:fetchMqIndex,fetchMqName:fetchMqName,isAbove:isAbove,isBelow:isBelow,throttleOn:throttleOn,throttleOff:throttleOff,responsiveImages:responsiveImages}}.call();module.exports=constructor}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./responsiveImages":3,"./throttleDebounce":4}]},{},[]); | ||
require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a="function"==typeof require&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}for(var i="function"==typeof require&&require,o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){(function(global){var $="undefined"!=typeof window?window.$:"undefined"!=typeof global?global.$:null;module.exports=function(el){return"string"==typeof el?$(el):el}}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],2:[function(require,module,exports){var preloader=function(src,callback){var loaded=!1,img=new Image,loadHandler=function(){loaded||(loaded=!0,callback(src),img=null)};img.addEventListener("load",loadHandler),img.src=src,img.complete&&loadHandler()};module.exports=preloader},{}],3:[function(require,module,exports){(function(global){module.exports=function(options){var $="undefined"!=typeof window?window.$:"undefined"!=typeof global?global.$:null,sassqwatch=require("./sassqwatch"),toDashed=require("./toDashed"),elementify=require("./elementify"),preloader=require("./preloader"),defaultSelector=$(".sassqwatch"),settings=$.extend({selector:defaultSelector},options),knownSizes=[],storeSizes=function($image){var mqName,src=getSource($image),responsiveSrcs=$image.data(),sizes={image:$image,loaded:[],originalSrc:src,activeSrc:src};$.each(responsiveSrcs,function(key,value){mqName=toDashed(key),sizes[mqName]=value}),knownSizes.push(sizes)},getSource=function($image){var imageSrc;return imageSrc=$image.is("img")?$image.attr("src"):$image.css("background-image").replace(/^url\(['"]?/,"").replace(/['"]?\)$/,"")},swapImage=function($target,newImageSrc){$target.is("img")?$target.attr("src",newImageSrc):$target.css("background-image","url("+newImageSrc+")")},updateImages=function(newMediaQuery){var isLoaded=!1;null==newMediaQuery&&(newMediaQuery=sassqwatch.fetchMediaQuery()),$.each(knownSizes,function(i){var thisImage=knownSizes[i],newSource=thisImage[newMediaQuery];if(!newSource){var thisMQ,ii=sassqwatch.fetchMqIndex(newMediaQuery);for(ii;ii>0;ii--)if(thisMQ=sassqwatch.fetchMqName(ii),thisImage[thisMQ]){newSource=thisImage[thisMQ];break}newSource=newSource||thisImage.originalSrc}-1===newSource.indexOf(thisImage.activeSrc)&&($.each(thisImage.loaded,function(i){return thisImage.loaded[i].indexOf(newSource)>0?void(isLoaded=!0):void 0}),isLoaded?swapImage(thisImage.image,newSource):preloader(newSource,function(src){swapImage(thisImage.image,src),thisImage.loaded.push(src)}),thisImage.activeSrc=newSource)})};return settings.selector!==defaultSelector&&(settings.selector=elementify(settings.selector)),settings.selector.each(function(){storeSizes($(this))}),updateImages(),sassqwatch.onMediaQueryChange(updateImages),sassqwatch}}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./elementify":1,"./preloader":2,"./sassqwatch":"sassqwatch","./toDashed":5}],4:[function(require,module,exports){var jq_throttle;exports.throttle=jq_throttle=function(delay,no_trailing,callback,debounce_mode){function wrapper(){function exec(){last_exec=+new Date,callback.apply(that,args)}function clear(){timeout_id=void 0}var that=this,elapsed=+new Date-last_exec,args=arguments;debounce_mode&&!timeout_id&&exec(),timeout_id&&clearTimeout(timeout_id),void 0===debounce_mode&&elapsed>delay?exec():no_trailing!==!0&&(timeout_id=setTimeout(debounce_mode?clear:exec,void 0===debounce_mode?delay-elapsed:delay))}var timeout_id,last_exec=0;return"boolean"!=typeof no_trailing&&(debounce_mode=callback,callback=no_trailing,no_trailing=void 0),wrapper},exports.debounce=function(delay,at_begin,callback){return void 0===callback?jq_throttle(delay,at_begin,!1):jq_throttle(delay,callback,at_begin!==!1)}},{}],5:[function(require,module,exports){module.exports=function(string){var words=[],currentChar="",currentWord="",i=0;for(i;string.length>=i;i++)currentChar=string.charAt(i),currentChar===currentChar.toUpperCase()?(words.push(currentWord),currentWord=currentChar.toLowerCase()):currentWord+=currentChar;return words.join("-")}},{}],sassqwatch:[function(require,module,exports){(function(global){var $="undefined"!=typeof window?window.$:"undefined"!=typeof global?global.$:null,td=require("./throttleDebounce"),$window=$(window),$orderElement=($("body"),$("title")),$listenElement=$("head"),currentMediaQuery="",mqOrderNamed={},mqOrderNumbered=[],matches=function(which){return fetchMediaQuery()==which},onResize=function(){var lastMediaQuery=currentMediaQuery;currentMediaQuery=fetchMediaQuery(),currentMediaQuery!=lastMediaQuery&&$listenElement.trigger("mediaQueryChange",[currentMediaQuery,lastMediaQuery])},setOrder=function(){var mediaQueries=$orderElement.css("font-family");mqOrderNumbered=mediaQueries.replace(/['"\s]/g,"").split(","),$.each(mqOrderNumbered,function(index,value){mqOrderNamed[value]=index})},onMediaQueryChange=function(callback){return $listenElement.on("mediaQueryChange",function(e,newMediaQuery,oldMediaQuery){callback(newMediaQuery,oldMediaQuery)}),this},query=function(type,which,callback){var check;switch(type.toLowerCase()){case"min":check=function(e,newMediaQuery){isAbove(which)&&callback(newMediaQuery)};break;case"max":check=function(e,newMediaQuery){isBelow(which)&&callback(newMediaQuery)};break;case"only":check=function(e,newMediaQuery,oldMediaQuery){matches(which)&&callback(oldMediaQuery)}}return"function"==typeof check&&(check(),$listenElement.on("mediaQueryChange",check)),this},min=function(which,callback){return query("min",which,callback),this},max=function(which,callback){return query("max",which,callback),this},only=function(which,callback){return query("only",which,callback),this},isAbove=function(which){var currentMq=mqOrderNamed[fetchMediaQuery()],whichMq=mqOrderNamed[which];return currentMq>=whichMq},isBelow=function(which){var currentMq=mqOrderNamed[fetchMediaQuery()],whichMq=mqOrderNamed[which];return whichMq>currentMq},fetchMediaQuery=function(){var mq=$listenElement.css("font-family");return mq=mq.replace(/['",]/g,"")},fetchMqIndex=function(mediaQuery){return mqOrderNamed[mediaQuery]},fetchMqName=function(index){return mqOrderNumbered[index]},throttleOn=function(duration){return $window.on("resize.throttle",td.throttle(duration||250,onResize)),$window.off("resize.no-throttle"),this},throttleOff=function(){return $window.on("resize.no-throttle",onResize),$window.off("resize.throttle"),this},responsiveImages=require("./responsiveImages"),constructor=function(){return setOrder(),currentMediaQuery=fetchMediaQuery(),throttleOff(),{onMediaQueryChange:onMediaQueryChange,responsiveImages:responsiveImages,fetchMediaQuery:fetchMediaQuery,fetchMqIndex:fetchMqIndex,fetchMqName:fetchMqName,throttleOff:throttleOff,throttleOn:throttleOn,isAbove:isAbove,isBelow:isBelow,query:query,only:only,min:min,max:max}}.call();module.exports=constructor}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./responsiveImages":3,"./throttleDebounce":4}]},{},[]); |
var | ||
sassqwatch = require('sassqwatch').throttleOn(), | ||
breakpoint1 = 'mq-medium', | ||
breakpoint2 = 'mq-small'; | ||
sassqwatch = require('sassqwatch'), | ||
breakpoint = 'mq-medium'; | ||
@@ -11,7 +10,10 @@ // you can chain methods! | ||
}) | ||
.when('above', breakpoint1, function() { | ||
console.log('breakpoint is above ' + breakpoint1); | ||
.min(breakpoint, function(newMQ) { | ||
console.log('breakpoint is a minimum of ' + breakpoint); | ||
}) | ||
.when('on', breakpoint2, function() { | ||
console.log('breakpoint is ' + breakpoint2); | ||
.max(breakpoint, function(newMQ) { | ||
console.log('breakpoint is ' + newMQ); | ||
}) | ||
.only(breakpoint, function(oldMQ) { | ||
console.log('breakpoint was ' + oldMQ); | ||
}); |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
795423
35
1366
273