Skip to content

Instantly share code, notes, and snippets.

@deepfriedmind

deepfriedmind/Media-Query-Matcher.coffee

Last active August 29, 2015 14:03
Download ZIP

Revisions

  1. deepfriedmind revised this gist Aug 3, 2015. 2 changed files with 2 additions and 2 deletions.
    2 changes: 1 addition & 1 deletion Media-Query-Matcher.coffee
    View file
    Original file line number Diff line number Diff line change
    @@ -11,7 +11,7 @@ class MediaQueries

    ###*
    * Match a specific breakpoint using Modernizr.mq()
    * @param {string} breakpoint Any key from {array} breakpoints
    * @param {string} breakpoint Any key from {Object} breakpoints
    * @return {boolean} true if query matches against the current state of the window
    ###
    match: (breakpoint) =>
    2 changes: 1 addition & 1 deletion Media-Query-Matcher.js
    View file
    Original file line number Diff line number Diff line change
    @@ -20,7 +20,7 @@ MediaQueries = (function() {

    /**
    * Match a specific breakpoint using Modernizr.mq()
    * @param {string} breakpoint Any key from {array} breakpoints
    * @param {string} breakpoint Any key from {Object} breakpoints
    * @return {boolean} true if query matches against the current state of the window
    */
    MediaQueries.prototype.match = function(breakpoint) {
  2. deepfriedmind created this gist Jul 11, 2014.
    26 changes: 26 additions & 0 deletions Media-Query-Matcher.coffee
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,26 @@
    class MediaQueries
    breakpoints =
    screenXS: '(min-width: 480px)'
    screenXSmax: '(max-width: 767px)'
    screenSM: '(min-width: 768px)'
    screenMD: '(min-width: 992px)'
    screenLG: '(min-width: 1200px)'

    errorMsg = 'Invalid or no breakpoint specified.'
    if Object.keys? then errorMsg += " Valid arguments: #{Object.keys(breakpoints)}"

    ###*
    * Match a specific breakpoint using Modernizr.mq()
    * @param {string} breakpoint Any key from {array} breakpoints
    * @return {boolean} true if query matches against the current state of the window
    ###
    match: (breakpoint) =>
    if not breakpoint? or not breakpoints.hasOwnProperty(breakpoint) then throw new Error errorMsg
    Modernizr.mq breakpoints[breakpoint]

    constructor: ->
    if not Modernizr?.mq? then @match = -> throw new Error 'Modernizr is not initialized.'

    # Usage:
    mq = new MediaQueries()
    mq.match 'screenLG' # `true` or `false`
    48 changes: 48 additions & 0 deletions Media-Query-Matcher.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,48 @@
    var MediaQueries, mq,
    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };

    MediaQueries = (function() {
    var breakpoints, errorMsg;

    breakpoints = {
    screenXS: '(min-width: 480px)',
    screenXSmax: '(max-width: 767px)',
    screenSM: '(min-width: 768px)',
    screenMD: '(min-width: 992px)',
    screenLG: '(min-width: 1200px)'
    };

    errorMsg = 'Invalid or no breakpoint specified.';

    if (Object.keys != null) {
    errorMsg += " Valid arguments: " + (Object.keys(breakpoints));
    }

    /**
    * Match a specific breakpoint using Modernizr.mq()
    * @param {string} breakpoint Any key from {array} breakpoints
    * @return {boolean} true if query matches against the current state of the window
    */
    MediaQueries.prototype.match = function(breakpoint) {
    if ((breakpoint == null) || !breakpoints.hasOwnProperty(breakpoint)) {
    throw new Error(errorMsg);
    }
    return Modernizr.mq(breakpoints[breakpoint]);
    };

    function MediaQueries() {
    this.match = __bind(this.match, this);
    if ((typeof Modernizr !== "undefined" && Modernizr !== null ? Modernizr.mq : void 0) == null) {
    this.match = function() {
    throw new Error('Modernizr is not initialized.');
    };
    }
    }

    return MediaQueries;

    })();

    // Usage:
    mq = new MediaQueries();
    mq.match('screenLG'); // `true` or `false`