When is control in clients viewport - trigger SCREENON event and when is not trigger SCREENOUT event. Component react on browser resize and scroll. Awesome!

control.coffee

###*
	@fileoverview Komponenta, která ví, jestli je ve viewportu uživatele
  				  popř. střílí eventy, že je viditelná a naopak
	@author Michael Czolko <michael@czolko.cz>
###
goog.provide 'wikidi.ui.Control'

goog.require 'wikidi.events.EventType'

goog.require 'goog.ui.Control'
goog.require 'goog.events.EventType'
goog.require 'goog.events.Event'
goog.require 'goog.style'


class wikidi.ui.Control extends goog.ui.Control


	###*
		@param {goog.ui.ControlContent} content Text caption or DOM structure
		    to display as the content of the component (if any).
		@param {goog.ui.ControlRenderer=} opt_renderer Renderer used to render or
		    decorate the component; defaults to {@link goog.ui.ControlRenderer}.
 		@param {goog.dom.DomHelper=} opt_domHelper Optional DOM helper, used for
 		    document interaction.
		@constructor
		@extends {goog.ui.Control}
	###
	constructor: (content, opt_renderer, opt_domHelper) ->
		super content, opt_renderer, opt_domHelper
		@onScreen = true


	###*
    	@return boolean
    ###
	isOnScreen: -> @onScreen


	###*
    	@see http://upshots.org/javascript/jquery-test-if-element-is-in-viewport-visible-on-screen
    	@return boolean
    ###
	isOnScreen_: ->
		offset = @getOffset()
		return false if offset == null

		windowWidth  = @getDomHelper().getWindow().innerWidth
		windowHeight = @getDomHelper().getWindow().innerHeight
		viewport =
			top:  @getDomHelper().getWindow().scrollY
			left: @getDomHelper().getWindow().scrollX
		viewport.right  = viewport.left + windowWidth
		viewport.bottom = viewport.top  + windowHeight

		windowSize = goog.style.getSize @getElement()
		bounds =
			left: offset.x
			top:  offset.y
		bounds.right  = bounds.left + windowSize.width
		bounds.bottom = bounds.top  + windowSize.height
		return @onScreen = (!(
			viewport.right < bounds.left ||
			viewport.left > bounds.right ||
			viewport.bottom < bounds.top ||
			viewport.top > bounds.bottom))


	###*
		@inheritDoc
	###
	enterDocument: ->
		super
		@isOnScreen_()
		@addWindowListenerType goog.events.EventType.SCROLL
		@addWindowListenerType goog.events.EventType.RESIZE
		return


	###*
		@param {string} type
		@return void
	###
	addWindowListenerType: (type) ->
		@getHandler().listen @getDomHelper().getWindow(), type, @handleWindowEvent, false, @
		return


	###*
    	@return void
	###
	handleWindowEvent: ->
		previousState = @onScreen
		if @isOnScreen_() != previousState
			if @onScreen
				@dispatchEvent new goog.events.Event wikidi.events.EventType.SCREENON, @
			else
				@dispatchEvent new goog.events.Event wikidi.events.EventType.SCREENOUT, @
		return


	###*
    	@return {goog.math.Coordinate|null}
	###
	getOffset: ->
		if @isInDocument()
			return goog.style.getPageOffset @getElement()
		else
			return null