var ToggleRow = (function(){
	var defaultOpts = {
		status: false,
		headerClass: 'wide'
	};

	function ToggleRow(ele, cb, opts) {
		opts = mergeOpts(opts, defaultOpts);

		var self = this,
			header = ele.querySelector('h3'),
			toggle = ele.querySelector('.toggle'),
			view = ele.querySelector('.view'),
			remove = ele.querySelector('.remove'), removeCtl,
			toggleCtrl;

		this.ele = ele;
		this.setToggle = setToggle;

		if(!!remove && opts.removeAppFn) {
			removeCtl = new ConfirmationButton(remove, {
					'text' : 'Remove app',
					'noClass' : true,
					'confirmText' : 'Confirm?'
				}, opts.removeAppFn);
			
		}

		toggleCtrl = new ToggleInput(toggle, updateToggle, { 'initialValue' : opts.status || opts.initialValue || false });

		function setToggle(e){
			if(e){
				toggleCtrl.set();
			} else {
				toggleCtrl.unset();
			}
		}

		function updateToggle(e) {
			if(!!view) {
				if(e) {
					view.classList.remove('noDisplay');
				} else {
					view.classList.add('noDisplay');
				}
			}
			cb(e, self);
		}

		this.exit = function() {
			if(toggleCtrl) toggleCtrl.exit(); 
			if(removeCtl) removeCtl.exit();
			if(ele) ele.innerHTML = ''; 
			self = view = toggleCtrl = toggle = header = remove = removeCtl = null;
		};
		this.querySelector = !!view ? view.querySelector.bind(view) : ele.querySelector.bind(ele);
		this.querySelectorAll = !!view ? view.querySelectorAll.bind(view) : ele.querySelectorAll.bind(ele);
		this.qS = this.querySelector;
		this.qSA = this.querySelectorAll;

	}

	return ToggleRow;
})();