Created
August 29, 2012 15:22
-
-
Save autumn-hoerr/3514274 to your computer and use it in GitHub Desktop.
Breakpoint custom events
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#Coffeescript Breakpoint Event Broadcaster | |
#requires coffeescript, underscore.js, jQuery, throttledresize event (https://github.com/louisremi/jquery-smartresize) | |
#to initialize: breakpoint = new BreakpointEvent([480,600]) | |
#pass array of breakpoints you want to watch | |
class BreakpointEvent | |
#we're going to fire a custom event when the page goes past certain breakpoints | |
#this should prevent multiple objects doing lots of logic on throttledresize; they | |
#can just listen for a particular breakpoint event | |
#passed arguments will fire as "breakpoint" + argument e.g. new BreakpointEvent([480]) would announce a "breakpoint480" event | |
constructor: (points) -> | |
#set up some variables | |
@breakpoints = points if _.isArray(points) | |
@last_size = 0 | |
#do it | |
this.fireEvents() | |
#call the bind event method to get things going from here | |
this.bindEvents() | |
bindEvents: -> | |
that = this | |
$(window).on 'throttledresize', -> | |
that.fireEvents() | |
fireEvents: -> | |
window_width = $(window).width() | |
delta = [@last_size..window_width] | |
#see if there's any intersection between the two arrays | |
test = _.intersection(delta, @breakpoints) | |
#console.log "fireEvent fired. Window width: " + window_width + "Intersection: " + test | |
#trigger our breakpoint | |
$(window).trigger('breakpoint'+test) if test? | |
@last_size = window_width |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment