/*
	Depends on JQuery version 1.5+
*/

var qmatic = qmatic || {};

(function($) {

	var errors = {
			illegalArgument : "Illegal argument"
	};
		
		
	/*
	 * Call history component which displays a list of called tickets.
	 * Attached to public qmatic namespace
	 */
	qmatic.Positionalcallwidget = (function() {
		// private statics		
		var LIST_MAIN_CLASS = 'ticket-list',
	    	FOOTER_MASK_CLASS = 'ticket-footer-mask',
	    	HEADER_MASK_CLASS = 'ticket-header-mask',
 		   	DEFAULT_ENTRY_ADD_DELAY = 700,  // number of milliseconds before processing next item from the queue
 		   	BLINK_TRANSITION = 300; // Milliseconds from opacity 1.0 to 0.0, or from 0.0 to 1.0. I.e. a full blink is this value x2

    var flash_timer;
    
		// public
		var constructor = function(config) {
			var listElem,
				entryPane,
				entryPusher,
				footerMask,
				headerMask;
				
					
			if (config === undefined || config.id === undefined || config.id === '') {
				throw new Error(errors.illegalArgument);
			}
			
			this._p = {
				listElem: $('#' + config.id),
				entries: [],
				entryQueue: [],
				processingQueue: false
			};
			
			var priv = this._p;

			listElem = priv.listElem;
			listElem.addClass(LIST_MAIN_CLASS);
			listElem.empty();
						
			listElem.css('background-color', 'transparent');
		};
		
		constructor.prototype = {
		
			addEntry : function(config) {
				if (config === undefined) {
					throw new Error(errors.illegalArgument);
				}
				
				var priv = this._p;
				var newEntry = new TicketEntry(config);
				
				priv.entryQueue.push(newEntry);
				this._processEntryQueue();
			},
		
			clean : function() {
				var entries = this._p.entries;
				for (var index = 0, total = entries.length; index < total; index++) {
					entries[index].clean();
				}
			},

			/**
			 * Register to this callback to get a chance to manipulate the entry element before it is processed.
			 * Provided with one parameter which is the DOM element that will be presented to users.
			 */
			onBeforeShowEntry : undefined,
						
			// private
			_processEntryQueue : function() {
				var priv = this._p,
					theEntry,
					self = this;
					
				if (priv.entryQueue.length > 0 && !priv.processingQueue) {
					priv.processingQueue = true;
					theEntry = priv.entryQueue.shift();
					priv.entries.push(theEntry);
					if (this.onBeforeShowEntry) {
						this.onBeforeShowEntry(theEntry.getElement(), theEntry.getIsCustomerName());
					}
					$('#ticketCall').empty();
					$('#ticketCall').html(theEntry.getElement());
					var duration = theEntry.getFlashDuration();
					var flashSpeed = theEntry.getFlashSpeed();
					if(duration && duration > 0) {
						this._flash(duration, flashSpeed);
					}
					priv.processingQueue = false;					
				}
			},
			
			_flash : function(duration, flashSpeed) {
			  clearTimeout(flash_timer);
			  var f = flashSpeed / 1000;
				$('#ticketNumber').css('-webkit-animation', 'fadeinout ' + f + 's linear infinite');
				$('#ticketNumber').css('animation', 'fadeinout ' + f + 's linear infinite');
				flash_timer = setTimeout( function() { 
				                                       $('#ticketNumber').css('-webkit-animation', '');
			                                         $('#ticketNumber').css('animation', '');
				                                     }, duration);
			}
		};
		
		return constructor;

	})();


	/*
		Represents an entry in the list of called tickets.
		config = {
			html: string, // The html to display on the ticket call entry
			ticketBackgroundColor : string, // Color for ticket's background
			ticketTextColor : string, // Color for ticket text
		};
	*/
    var TicketEntry = (function() {
    	
    	var ENTRY_MAIN_CLASS = 'ticket-entry';

		var constructor = function(config) {
			this._p = {};	
			var entryElem = $('<div/>');
			entryElem.addClass(ENTRY_MAIN_CLASS);
			entryElem.append(config.html);			
			
			this._p.theElem = entryElem;
			this._p.flashDuration = config.flashDuration;
			this._p.flashSpeed = config.flashSpeed;
			this._p.theElem.status = config.status;
			this._p.isCustomerName = config.isCustomerName;
		};
		
		constructor.prototype = {

			getElement : function() {
				return this._p.theElem;		
			},
			
			getFlashDuration : function() {
				return this._p.flashDuration;		
			},
						
			getFlashSpeed : function() {
				return this._p.flashSpeed;
			},
			
			getIsCustomerName : function() {
				return this._p.isCustomerName;		
			},
			
			clean : function() {
				this._p.theElem.remove();
			}
		
		};
				
		return constructor;

	})();
	

})(jQuery);

