D = Ti.API.get( 'D' );

$( window ).ready( function() {
	new PrefsRouter( $('#content') );
});


/* ---------------------------------------------- */
/* Router for the various Pref sections */
/* ---------------------------------------------- */
PrefsRouter = can.Control({
	defaults: {
		menu: '#sections',
		default_route: 'app'
	}
}, {
	init: function() {
		var self = this;
		self.controls = [];

		if ( window.location.hash == "" ) window.location.hash = "#" + self.options.default_route;
	},

	// Remove controllers (and their children DOM elements) and reflect
	// the currently selected route.
	//
	reset: function() {
		var self = this;
		var current_route = can.route.attr( 'route' );
		var menu = $( self.options.menu );

		menu.find( 'a' ).removeClass( 'selected' );
		menu.find( 'a[href="#' + current_route + '"]' ).addClass( 'selected' );

		while ( control = self.controls.pop() ) control.destroy();
	},

	"app route": function() {
		this.reset();
		this.controls.push( new PrefsAppWidget(this.element) );
	},

	"server route": function() {
		this.reset();
		this.controls.push( new PrefsServerWidget(this.element) );
	},
});


/* ---------------------------------------------- */
/* App behavior section */
/* ---------------------------------------------- */
PrefsAppWidget = can.Control({
	defaults: {
		view: 'app://window/prefs/app.ejs'
	}
}, {
	init: function() {
		var self = this;

		// Get the current preference values.
		//
		var bool_prefs = {
			hidesplash:      [ D.getBoolPref( 'hidesplash' ), 'Skip splash screen at startup' ],
			remember_window: [ D.getBoolPref( 'remember_window' ), 'Remember main window position' ],
		}

		// Running from the builder env (or manually with --debug), include
		// developer options.
		//
		if ( Ti.App.getArguments()[0] == "--debug" )
			bool_prefs.devmode = [ D.getBoolPref( 'devmode' ), 'Developer mode' ];

		self.element.html(
			can.view( self.options.view, {
				bool_prefs: bool_prefs
			})
		);
	},

	'input click': function( ele, event ) {
		var pref = ele.data( 'field' );

		if ( ele.attr('type') == 'checkbox' ) {
			var bool = ele.is( ':checked' );
			D.setBoolPref( pref, ele.is(':checked') );

			if ( pref == 'devmode' && bool ) D.window.main.showInspector( true );
		}
	},
});


/* ---------------------------------------------- */
/* Server section */
/* ---------------------------------------------- */
PrefsServerWidget = can.Control({
	defaults: {
		view: 'app://window/prefs/servers.ejs'
	}
}, {
	init: function() {
		var self = this;
		var server = D.getPref( 'server_uri' );

		self.element.html(
			can.view( self.options.view, {
				server: server
			})
		);
	},

	// Update the server URI preference.
	//
	updateServer: function( uri ) {
		if ( uri.length == 0 ) return;
		D.tf.attr( 'uri', uri );

		if ( D.tf.version ) {
			D.setPref( 'server_uri', uri );
			console.log( 'Updated server_uri to ' + uri + '.' );
			$( '#test .info' ).html( D.tf.version );
			$( '#test .icon' ).html( '' );
		}
		else {
			$( '#test .info' ).empty();
			$( '#test .icon' ).html( '' );
		}
	},

	// Hitting the return key on input fields defer to the 'blur' event,
	// which in turn fires the 'change' event.
	//
	"#server keypress": function( ele, event ) {
		if ( event.which == 13 ) ele.trigger( 'blur' );
	},
	'#server change': function( ele, event ) {
		var self = this;
		self.updateServer( ele.val() );
	},
	'#server keyup': function( ele, event ) {
		var self = this;
		D.delay( function() {
			self.updateServer( ele.val() );
		}, 1000, true );
	}
});