/client/scripts/modules/ui.module.js

// welcome module

/*
Provides the first contact with the client. Prepares UI and prepares access to the applications' features


*/

//
define([
  'jquery',
  'underscore',
  'backbone',
  'views/splash.view',
  'views/end.view',
  'views/target.view',
  'views/ui.basic.view',
  'models/targetmark.model',
], function($, _, Backbone, SplashView, endView,  targetView, UiBasicView, targetmarkModel){
	var module = Backbone.Collection.extend({
		views: new Backbone.Collection(),
		description: "ui-module",
		defaults: {},
		localStorage: null, 
		initialize: function(items, options){

			this.socket = options.socket;
			this.ludare = options.ludare;
			// loading basic ui elements for the given DOM node or element: body
			this.ui = new UiBasicView({socket:this.socket, ui: this});
			this.ui.render();

			//display splashscreen
		//	console.log("slots", this.ui.slots.popups);
			this.splashscreen = new SplashView({el: this.ui.slots.popups});

		
			this.endView = new endView({el: this.ui.slots.popups, model: this.ludare.data });

			this.targetView = new targetView({el: this.ui.slots.top, model: this.ludare.data });
	

			this.marker = new targetmarkModel();

		},
		message: function(data){
			this.noty({text:data});
		},
		displayFUN: function(){
			this.targetView.render()
		},
		displayEND: function(){
			this.endView.render();
			this.endView.$el.show(1000);
		},
		update:function(){
			var self = this;
			_.each(this.views.models, function(item){
				item.view.uiUpdate();
			});
		},
		targetMarker: function(item){
		
			this.marker.view && this.marker.view.unpin();
			
			this.marker.view.pin(item.mesh.position);
		},

		//takes a model and pins its inactive UI onto its view
		displayInformation: function(item){
			console.log(item);
			item.view.pin(item.view.mesh.position);
		},

		initNoty: function(){
			$.noty.defaultOptions = {
			  layout : 'top', // (top, topLeft, topCenter, topRight, bottom, center, bottomLeft, bottomRight)
			  theme : 'noty_theme_default',  // theme name (accessable with CSS)
			  animateOpen : {height: 'toggle'}, // opening animation
			  animateClose : {height: 'toggle'}, // closing animation
			  easing : 'swing', // easing
			  text : '', // notification text
			  type : 'alert', // noty type (alert, success, error)
			  speed : 500, // opening & closing animation speed
			  timeout : 5000, // delay for closing event. Set false for sticky notifications
			  closeButton : false, // enables the close button when set to true
			  closeOnSelfClick : true, // close the noty on self click when set to true
			  closeOnSelfHover : false, // close the noty on self mouseover when set to true
			  force : false, // adds notification to the beginning of queue when set to true
			  onShow : false, // callback for on show
			  onClose : false, // callback for on close
			  buttons : false, // an array of buttons
			  modal : false, // adds modal layer when set to true
			  template: '<div class="noty_message"><span class="noty_text"></span><div class="noty_close"></div></div>',
			  cssPrefix: 'noty_', // this variable will be a type and layout prefix.
			  custom: {
			    container: this.ui.slots.top // $('.custom_container')
			  }
			};
		}

	});

	return module;
});