dojo.require("dojo.string")
dojo.require("dojo.dom")
dojo.require("dojo.html.*")
dojo.require("dojo.html.layout")
dojo.require("dojo.html.style")
dojo.require("perse.*")
dojo.require("perse.mvc")
dojo.require("perse.animation")

dojo.provide("lgz.web.animation")

lgz.web.animation = new function(){
	
	this.prefix = function(){
		var url = window.location.toString()
		if (dojo.string.endsWithAny(url, 'werk/', 'werk')) {
			return '../@@/'
		} else {
			return '@@/'
		}
	}

	this.createAflax = function(){
		var prefix = lgz.web.animation.prefix()
		if (dojo.render.html.ie) {
			var suffix = Math.round(Math.random() * 10000)
			var name = prefix + 'aflax_any/' + suffix + '.swf'
		} else {
			var name = prefix +  'aflax/aflax.swf'
		}
		return new AFLAX(name)
	}

    this.aflaxgo = function() {
    	var prefix = lgz.web.animation.prefix()
        var media = [4, 5, 10, 11]
        var model = perse.mvc.models.lookup('lgz.web.animation.aflax')
        var aflax = model.aflax
        var sounds = model.sounds
	    for (var i = 1; i < 26; i++) {
			var snd = new AFLAX.FlashObject(aflax, 'Sound')
			snd.exposeFunction('loadSound', snd)
			snd.exposeFunction('start', snd)
			snd.exposeFunction('stop', snd)
			snd.exposeProperty('position', snd)
			snd.mapFunction('addEventHandler')
			snd.loadSound(prefix + 'sound/beat' + (i).toString() + '.mp3', true)
			snd.stop()
			sounds.push(snd)
       }
       perse.mvc.models.update('lgz.web.animation.aflax', model)
    }
    
    this.playSound = function(model){
    	var sounds = perse.mvc.models.lookup('lgz.web.animation.aflax', 'sounds')
    	if (model) {
			try {
				sounds[model%sounds.length].start()
			} catch(e) {
				// omit sound bugs
			}
    	}
    }

	this.amountOfShownMoments = function() {return Math.ceil(perse.animation.windowSize().width / 57)}

	this.initialAmountOfWorks = function() {
		var amount = perse.mvc.models.lookup('lgz.amount_of_works', 'amount')
		if (typeof(amount) == 'undefined') {
			var amount = dojo.html.getElementsByClass('moment', document.getElementById('page.center.content')).length
		}
		return amount
	}

	this.extendWorks = function(view, name, model){

		var node =  document.getElementById('page.center.content')
		var initial_amount_of_works = lgz.web.animation.initialAmountOfWorks()
		var current_works = dojo.html.getElementsByClass('moment', node)
		var current_amount_of_works = current_works.length
		var max_amount_of_works = model.amount
		
		if (current_amount_of_works < max_amount_of_works) {
			var additional_copies = max_amount_of_works - current_amount_of_works
			var new_work_sets = Math.ceil(additional_copies / initial_amount_of_works)
			
			for (var i = 0; i < new_work_sets; i++){
				for (var w = 0; w < initial_amount_of_works; w++) {
					var work = current_works[w].cloneNode(true)
					var id = 'page.center.content.' + (current_amount_of_works + (i * initial_amount_of_works) + w)
					var subs = dojo.html.getElementsByClass('moment_hide', work)
					work.id = id
					for (var s in subs) {
						var sub = subs[s]
						var sub_id = perse.helper.slice(sub.id, -2, -1, '.')
						sub.id = id + '.' + sub_id
					}
					node.appendChild(work)
				}
			}
		}
	}

	window.onresize = function(evt) {
		perse.mvc.models.update('lgz.timebar', {amount: lgz.web.animation.amountOfShownMoments()})
	}

	this.startRightMove = function(view, name, evt){
		view.update('move', {move: true})
		perse.animation.moveElement(document.getElementById('page.center.content'), view, false, 100)
	}

	this.startLeftMove = function(view, name, evt){
		view.update('move', {move: true})
		perse.animation.moveElement(document.getElementById('page.center.content'), view, true, 100)
	}

	this.stopMove = function(view, name, evt){
		view.update('move', {move: false})
	}

	// left navigation view
	this.LeftNavigation = new perse.mvc.View('page.leftnav')
	this.LeftNavigation.addModel('move', {move: false})
	this.LeftNavigation.addListener('onmouseover', this.startLeftMove, false)
	this.LeftNavigation.addListener('onmouseout', this.stopMove, false)

	// right navigation view
	this.RightNavigation = new perse.mvc.View('page.rightnav')
	this.RightNavigation.addModel('move', {move: false})
	this.RightNavigation.addListener('onmouseover', this.startRightMove, false)
	this.RightNavigation.addListener('onmouseout', this.stopMove, false)

	// Initialize the global registration
	this.init = function() {
		// model registration
		perse.mvc.models.register('lgz.timebar', {amount: lgz.web.animation.amountOfShownMoments()})
		perse.mvc.models.register('lgz.web.animation.aflax', {aflax: lgz.web.animation.createAflax(), sounds: [], index: null})
		perse.mvc.models.register('lgz.web.animation.play', null)
		perse.mvc.models.register('lgz.amount_of_works', {amount: lgz.web.animation.initialAmountOfWorks()})
		perse.mvc.models.lookup('lgz.web.animation.aflax', 'aflax').addFlashToElement('page.sound', 0, 0, '#ffffff', 'lgz.web.animation.aflaxgo')
		
		// model subscriber
		perse.mvc.models.subscribeToModel('lgz.web.animation.play', lgz.web.animation.playSound)

		// view registration
		perse.mvc.view.register(lgz.web.animation.LeftNavigation)
		perse.mvc.view.register(lgz.web.animation.RightNavigation)
	}
}

dojo.addOnLoad(lgz.web.animation.init)