var scene,
		cam;

var app = new function(){}
app.dragging = false

app.init = function () {

	var mainbox,
			coords,
			box, size,
			floor,
			// controls = new MX.RotationControl(),
			movements,
			viewHeight = 350

	scene = new MX.Scene().addTo('#scene')
	scene.sizeToScreen()

	window.onresize = function () {
		scene.sizeToScreen()
	}

	cam = scene.camera
	cam.y = viewHeight
	
	minimap = new MX.Minimap()

	movements = new MX.Movements(cam, viewHeight, minimap)
	movements.init()

	animate()
	
	function animate () {
		requestAnimationFrame(animate)
		//controls.update()
		movements.update()
		// TWEEN.update()
		scene.update()
	}

	window.inAnimation = true

	environment.init()
	minimap.update()
	
	bind()
	
}

var is_iphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i));
var is_ipad = (navigator.userAgent.match(/iPad/i));
var is_android = (navigator.userAgent.match(/Android/i))
var is_mobile = is_iphone || is_ipad || is_android;

function bind () {

	if(is_mobile) {
		$("html").addClass("mobile");
	}
	else {
		$("html").addClass("desktop");
	}

	$.fn.clickToToggle = function(fn){
		$(this).click(function(e){
			e.stopPropagation()
			var isActive = ! $(this).hasClass("icon-close")
			disable_mode()
			fn(isActive)
			$(this).toggleClass("icon-close", isActive);
		})
	}
	
  $(".addMedia").clickToToggle(function(isActive){
    $(".mediaDrawer").toggleClass("active", isActive);
    $(".fileUpload").toggleClass("active", isActive);
  });

  $(".room1 .editBtn").click(function () {
  	var room = $(this).parent();
  	room.addClass('editing');
  	$(this).siblings('.formHolder').find('[type="submit"]').one('click', function (evt) {
  		evt.preventDefault();
  		evt.stopPropagation();
  		room.removeClass('editing');
  	});
  });

  // Place media logic
  var $floatingImg = $('.floatingImg');

  function placeMedia(evt, img) {
  	// JULES DO YO THANG
  	alert('Place media at (' + evt.pageX + ', ' + evt.pageY + ')');
  }

	$('.mediaContainer img').mousedown(function(e){
		e.preventDefault()
		e.stopPropagation()
	})
  $('.mediaContainer img').click(function (e) {
		e.stopPropagation()
  	$(".mediaDrawer, .fileUpload, .addMedia").removeClass("active icon-close");
  	$floatingImg.attr('src', $(this).attr('src'));
  	function _followCursor(e) {
  		$floatingImg.parent().css({
  			top: (e.pageY - ($floatingImg.height() / 2)) + 'px',
  			left: (e.pageX - ($floatingImg.width() / 2)) + 'px'
  		});
  	}
  	$(window).on('mousemove', _followCursor);
  	$(window, this).one('click', function () {
  		$floatingImg.attr('src', '');
  		$(window).off('mousemove', _followCursor);
  		$floatingImg.parent().removeClass('edit');
  	});
  	$floatingImg.parent().addClass('edit');
  	_followCursor(e);
  });

  $(".icon-arrow-resize").clickToToggle(function(isActive){
    $(".image").toggleClass("active", isActive);
  });
  $(".icon-map").click(function(){
    $("#minimap").toggleClass("hide");
    $(this).toggleClass('hidden');
  });
  $(".icon-ios7-keypad-outline").clickToToggle(function(isActive){
    $(".wallpaper").toggleClass("active", isActive);
    $("body").removeClass("pastePaper");
  });
  $(".paper1").click(function(){
    $("body").toggleClass("pastePaper");
    $(this).toggleClass("active");
  });
  
  $(".icon-ios7-sunny-outline").clickToToggle(function(isActive){
    $(".lightcontrol").toggleClass("active", isActive);
  });
  $(".delete-image-toggle").clickToToggle(function(isActive){
    $("body").toggleClass("deleteActive", isActive);
  });
  $(".icon-key").clickToToggle(function(isActive){
    $(".settings").toggleClass("active", isActive);
  });

  
  
  $(".edit-text-toggle").clickToToggle(function(isActive){
    $(".image").toggleClass("editText", isActive);
  });
  

  
  $(".foundToggle").click(function(){
    $(".foundMedia").addClass("active");
    $(".myMedia").addClass("inactive");
    $('a').removeClass("active");
    $(this).addClass("active");
  });
  
  $(".yourMedia").click(function(){
    $(".foundMedia").removeClass("active");
    $(".myMedia").removeClass("inactive");
    $('a').removeClass("active");
    $(this).addClass("active");
  });
  
  $("#deleteMedia").click(function(){
    $("body").toggleClass("deleteArmed");
  });
  
  $("#startpoint").click(function(){
    $(this).toggleClass("active");
    $("#startText").toggleClass("hide");
    $("#moveText").toggleClass("show");
  });
  
  
  $(".deleteArmed .mediaContainer").click(function(){
    $(this).addClass("deleted");
  });
  
  
  $("#createProject").click(function(){
    $(".mediaDrawer.newProject").toggleClass("active");
    $("body").addClass("noOverflow")
  });
  
  $(".templates span").click(function(){
    $(".templates span").removeClass("active");
    $(this).toggleClass("active");
  });
  
  $(document).on("click", ".icon-close", disable_mode)

  function disable_mode(){
  	$(".icon-close").removeClass("icon-close")
    $('.mediaDrawer,.fileUpload,.image,.lightcontrol,.settings,.wallpaper').removeClass("active");
    $(".image").removeClass("editText")
    $("body").removeClass("deleteArmed")
  }

	$("#shadow-control").on({
		mousedown: function(){ app.dragging = true },
		change: function(){
			var hex = (~~($(this).int() / 100 * 0xff)).toString(10)
			if (hex.length == 1) hex = "0" + hex;
			var color = "rgba(" + [hex, hex, hex, "1.0"] + ")"
			$(".face").css("border-color", color)
		}
	})

	$("#brightness-control").on({
		mousedown: function(){ app.dragging = true },
		change: function(){
			var hex = (~~($(this).int() / 100 * 0xff)).toString(10)
			var color = "rgba(" + [hex, hex, hex, "0.9"] + ")"
			$("body,.face").css("background-color", color)
		}
	})
	

	//
	// EDIT IMAGE HOVER MENU
	
	var hideEditImageMenuTimeout
	environment.image.el.addEventListener('mouseover', function(e){
		environment.image.el.classList.add('hover')
		var offset = $(".image").offset()
		offset.left = max(0, offset.left + 30)
		offset.top = max(0, offset.top + 50)
		$(".edit-image.menu").show().offset( offset )
		clearTimeout(hideEditImageMenuTimeout)
	})
	environment.image.el.addEventListener('mouseout', function(e){
		environment.image.el.classList.remove('hover')
		hideEditImageMenuTimeout = setTimeout(function(){
			$(".edit-image.menu").hide()
		}, 50)
	})
	$(".edit-image.menu").on({
		mouseover: function(){
			clearTimeout(hideEditImageMenuTimeout)
		},
		mouseout: function(){
			hideEditImageMenuTimeout = setTimeout(function(){
				$(".edit-image.menu").hide()
			}, 50)
		},
		mousedown: function(e){
			e.stopPropagation()
		},
		mouseup: function(e){
			e.stopPropagation()
		}
	})


	//
	// EDIT VIDEO HOVER MENU
	
	var hideEditVideoMenuTimeout
	environment.video.el.addEventListener('mouseover', function(e){
		environment.video.el.classList.add('hover')
		var offset = $(".video").offset()
		offset.left = max(0, offset.left + 30)
		offset.top = max(0, offset.top + 50)
		$(".edit-video.menu").show().offset( offset )
		clearTimeout(hideEditImageMenuTimeout)
	})
	environment.video.el.addEventListener('mouseout', function(e){
		environment.video.el.classList.remove('hover')
		hideEditVideoMenuTimeout = setTimeout(function(){
			$(".edit-video.menu").hide()
		}, 50)
	})
	$(".edit-video.menu").on({
		mouseover: function(){
			clearTimeout(hideEditVideoMenuTimeout)
		},
		mouseout: function(){
			hideEditVideoMenuTimeout = setTimeout(function(){
				$(".edit-video.menu").hide()
			}, 50)
		},
		mousedown: function(e){
			e.stopPropagation()
		},
		mouseup: function(e){
			e.stopPropagation()
		}
	})
	$(".icon-ios7-reload,.ios7-arrow-forward").click(function(){
		$(this).toggleClass('toggled')
	})
	
	//
	// ALL DONE

	$('body').removeClass('loading');
}


$(function(){

  $(".signIn").click(function(){
    $(".mediaDrawer.signin").addClass("active");
  });
  
  $(".signUp").click(function(){
    $(".mediaDrawer.signup").addClass("active");
  });
  
  $(".bigClose").click(function(){
    $(".mediaDrawer, .room1").removeClass("active editing");
    $("body").removeClass("noOverflow");
  });
  
  var classes = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen'];

  $(".bio").addClass(choice(classes));
    
  
  function randomizeList(listObj) {
      $(listObj).each(function() {
          $(this).addClass(classes[Math.Random()*classes.size]);
      });
  }
})