/*******************************************************************************
 * Licensed Materials - Property of IBM
 * Mobile Browser Simulator
 * © Copyright IBM Corporation 2011. All Rights Reserved.
 *
 * U.S. Government Users Restricted Rights - Use, duplication or 
 * disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 *******************************************************************************/


/**
 * Widget for displaying a tree of mobile devices
 */
define("ibm_mobile/MobileDeviceTree",[
	"dojo",
	"dijit",
	"dijit/_Widget",
	"dijit/_TemplatedMixin",
	"dijit/_WidgetsInTemplateMixin",
	"dojo/text!ibm_mobile/templates/MobileDeviceTree.html",
	"dijit/form/RadioButton",
	"dijit/Tree",
	"dojo/i18n"
], function(dojo, dijit, _Widget, _TemplatedMixin, _WidgetsInTemplateMixin, mobileDeviceTreeTemplate) {
	
	var MobileDeviceTree = dojo.declare("ibm_mobile.MobileDeviceTree", [dijit._Widget, dijit._TemplatedMixin, dijit._WidgetsInTemplateMixin ], {	
	
		// PUBLIC PARAMS
		/** @type dojo.data.ItemFileReadStore */
		deviceStore : null,
		/**
		 * Optional parent dijit.form.DropDownButton that contains this tree.
		 * 
		 * @type dijit.form.DropDownButton
		 */
		parentDropDownButton : null,
		
		// PUBLIC EVENTS
		/**
		 * <p>Sent when a device is clicked in the tree.<p>
		 * 
		 * @param device the device that was clicked in the tree
		 */
		onClick : function(device) {},
		
		// WIDGET PARAMS
		templateString : mobileDeviceTreeTemplate,
		
		// PRIVATE
		/** @type dijit.tree.ForestStoreModel */
		_platformForest : null,
		/** @type dijit.tree.ForestStoreModel */
		_resoltuionForest : null,
		/** @type dijit.Tree */
		_platformTree : null,
		/** @type dijit.Tree */
		_resolutionTree : null,
		/** @type dijit.Tree */
		_currentTree : null,
		
		// DOJO ATTATCH POINTS
		_platformTreeNode : null,
		_resolutionTreeNode : {},
		/** @type dijit.form.RadioButton */
		_resolutionRadio : null,
		/** @type dijit.form.RadioButton */
		_platformRadio : null,
		_byPlatformLabel : null,
		_byResolutionLabel : null,
		
		/**
		 * <p>Widget lifecycle function.</p>
		 */
		postMixInProperties : function(params) {
			var nls = dojo.i18n.getLocalization("ibm_mobile", "mobile");
			
			this._platformForest = new dijit.tree.ForestStoreModel({
				store : this.deviceStore,
				query : {
					"type" : "platform"
				},
				rootid : "root",
				rootLabel : nls.MobileDeviceTree_platforms,
				childrenAttrs : [ "children" ]
			});
			
			this._resoltuionForest = new dijit.tree.ForestStoreModel({
				store : this.deviceStore,
				query : {
					"type" : "resolution"
				},
				rootid : "root",
				rootLabel : nls.MobileDeviceTree_resolutions,
				childrenAttrs : [ "children" ]
			});
		},
	
		/**
		 * <p>Widget lifecycle function.</p>
		 */
		postCreate : function() {
			//add in translated strings
			var nls = dojo.i18n.getLocalization("ibm_mobile", "mobile");
			dojo.attr(this._byPlatformLabel, 'innerHTML', nls.MobileDeviceTree_by_platform);
			dojo.attr(this._byResolutionLabel, 'innerHTML', nls.MobileDeviceTree_by_resolution);
			
			//set unique name for the radio group
			dojo.attr(this._resolutionRadio, 'name', this.id + "_sortType");
			dojo.attr(this._platformRadio, 'name', this.id + "_sortType");
			
			// create the trees
			this._platformTree = new dijit.Tree({
				model : this._platformForest,
				showRoot : false,
				autoExpand : false,
				persist : true
			}, this._platformTreeNode);
			
			this._resolutionTree = new dijit.Tree({
				model : this._resoltuionForest,
				showRoot : false,
				autoExpand : false,
				persist : true
			}, this._resolutionTreeNode);
			this._currentTree = this._platformTree;
			dojo.toggleClass(this._resolutionTree.domNode, 'hidden');
			
			// hook up to open and close events to refresh the optional parent dijit.form.DropDownButton
			dojo.connect(this._platformTree, 'onOpen', dojo.hitch(this, this._refreshParentDropDownButton));
			dojo.connect(this._platformTree, 'onClose', dojo.hitch(this, this._refreshParentDropDownButton));
			dojo.connect(this._resolutionTree, 'onOpen', dojo.hitch(this, this._refreshParentDropDownButton));
			dojo.connect(this._resolutionTree, 'onClose', dojo.hitch(this, this._refreshParentDropDownButton));
			
			//connect onclick of tree sort type
			dojo.connect(this._platformRadio, 'onClick', dojo.hitch(this, this._switchTrees));
			dojo.connect(this._resolutionRadio, 'onClick', dojo.hitch(this, this._switchTrees));
			dojo.connect(this._platformRadio, 'onClick', dojo.hitch(this, this._refreshParentDropDownButton));
			dojo.connect(this._resolutionRadio, 'onClick', dojo.hitch(this, this._refreshParentDropDownButton));
			
			//connect onclick of trees
			dojo.connect(this._platformTree, 'onClick', dojo.hitch(this, this._selectDevice));
			dojo.connect(this._resolutionTree, 'onClick', dojo.hitch(this, this._selectDevice));
		},
		
		_switchTrees : function() {
			//display correct tree
			dojo.toggleClass(this._resolutionTree.domNode, 'hidden');
			dojo.toggleClass(this._platformTree.domNode, 'hidden');
			
			//switch current tree and update radio checked state
			if(this._currentTree == this._platformTree) {
				this._platformRadio.set('checked', false);
				this._currentTree = this._resolutionTree;
			} else {
				this._resolutionRadio.set('checked', false);
				this._currentTree = this._platformTree;
			}
		},
		
		_selectDevice : function(item, node, event) {
			//send off event notification if selected item is a device
			if(item.type == "device") {
				this.onClick(item);
			}
		},
		
		/**
		 * <p>Refreshes the optional containing dijit.form.DropDownButton.</p>
		 */
		_refreshParentDropDownButton : function(item, node, def) {
			if(this.parentDropDownButton) {
				//this trick does not work on IE, it makes the pop up disappear
				if(!dojo.isIE) {
					if(def) {
						def.addCallback(dojo.hitch(this, function() {
							this.parentDropDownButton.openDropDown();
						}));
					} else {
						this.parentDropDownButton.openDropDown();
					}
				}
			}
		}
	}); //end dojo.declair
	
	return MobileDeviceTree;
});