msenkpiel
2/20/2014 - 3:01 PM

responsive helper

responsive helper


App.responsive = {

    breakpoints: [
        {
            name:'xs',
            width: 641
        }
    ],

    addWatcher:function(){
        var scope = this;
        $(window).on('resize', function(e) {
            scope.watcher();
        });
    },

    watcher:function(){
        var w = $(window).width();
        var target = $('.resp-target');

        _.each(_.pluck(this.breakpoints, 'name'), function(val){
            target.removeClass(val);
        });

        for(var i = 0, len = this.breakpoints.length; i < len; i++){
            var obj = this.breakpoints[i];
            if(w < obj.width){
                target.addClass(obj.name);
                return;
            }
        }
    }
};