knockoutjs_require codestyle.

labs/dependency-examples/knockoutjs_require/index.html

@@ -10,8 +10,7 @@
 	<section id="todoapp">
 		<header id="header">
 			<h1>todos</h1>
-			<input id="new-todo" type="text" data-bind="value: current, valueUpdate: 'afterkeydown', enterKey: add"
-					placeholder="What needs to be done?" autofocus>
+			<input id="new-todo" type="text" data-bind="value: current, valueUpdate: 'afterkeydown', enterKey: add" placeholder="What needs to be done?" autofocus>
 		</header>
 		<section id="main" data-bind="visible: todos().length">
 			<input id="toggle-all" type="checkbox" data-bind="checked: allCompleted">

labs/dependency-examples/knockoutjs_require/js/config/global.js

@@ -1,6 +1,8 @@
+/*global define */
+
 // Author: Loïc Knuchel <loicknuchel@gmail.com>
 
 define({
-  ENTER_KEY: 13,
-  localStorageItem: 'todos-knockout-require'
+	ENTER_KEY: 13,
+	localStorageItem: 'todos-knockout-require'
 });

labs/dependency-examples/knockoutjs_require/js/extends/handlers.js

@@ -1,46 +1,50 @@
+/*global define */
+
 define([
-  'knockout',
-  'config/global'
-], function(ko, g){
-  'use strict';
-  // a custom binding to handle the enter key (could go in a separate library)
-  ko.bindingHandlers.enterKey = {
-    init: function( element, valueAccessor, allBindingsAccessor, data ) {
-      var wrappedHandler, newValueAccessor;
+	'knockout',
+	'config/global'
+], function (ko, g) {
+	'use strict';
+
+	// a custom binding to handle the enter key (could go in a separate library)
+	ko.bindingHandlers.enterKey = {
+		init: function (element, valueAccessor, allBindingsAccessor, data) {
+			var wrappedHandler;
+			var newValueAccessor;
 
-      // wrap the handler with a check for the enter key
-      wrappedHandler = function( data, event ) {
-        if ( event.keyCode === g.ENTER_KEY ) {
-          valueAccessor().call( this, data, event );
-        }
-      };
+			// wrap the handler with a check for the enter key
+			wrappedHandler = function (data, event) {
+				if (event.keyCode === g.ENTER_KEY) {
+					valueAccessor().call(this, data, event);
+				}
+			};
 
-      // create a valueAccessor with the options that we would want to pass to the event binding
-      newValueAccessor = function() {
-        return {
-          keyup: wrappedHandler
-        };
-      };
+			// create a valueAccessor with the options that we would want to pass to the event binding
+			newValueAccessor = function () {
+				return {
+					keyup: wrappedHandler
+				};
+			};
 
-      // call the real event binding's init function
-      ko.bindingHandlers.event.init( element, newValueAccessor, allBindingsAccessor, data );
-    }
-  };
+			// call the real event binding's init function
+			ko.bindingHandlers.event.init(element, newValueAccessor, allBindingsAccessor, data);
+		}
+	};
 
-  // wrapper to hasfocus that also selects text and applies focus async
-  ko.bindingHandlers.selectAndFocus = {
-    init: function( element, valueAccessor, allBindingsAccessor ) {
-      ko.bindingHandlers.hasfocus.init( element, valueAccessor, allBindingsAccessor );
-      ko.utils.registerEventHandler( element, 'focus', function() {
-        element.focus();
-      } );
-    },
-    update: function( element, valueAccessor ) {
-      ko.utils.unwrapObservable( valueAccessor() ); // for dependency
-      // ensure that element is visible before trying to focus
-      setTimeout(function() {
-        ko.bindingHandlers.hasfocus.update( element, valueAccessor );
-      }, 0 );
-    }
-  };
+	// wrapper to hasfocus that also selects text and applies focus async
+	ko.bindingHandlers.selectAndFocus = {
+		init: function (element, valueAccessor, allBindingsAccessor) {
+			ko.bindingHandlers.hasfocus.init(element, valueAccessor, allBindingsAccessor);
+			ko.utils.registerEventHandler(element, 'focus', function () {
+				element.focus();
+			});
+		},
+		update: function (element, valueAccessor) {
+			ko.utils.unwrapObservable(valueAccessor()); // for dependency
+			// ensure that element is visible before trying to focus
+			setTimeout(function () {
+				ko.bindingHandlers.hasfocus.update(element, valueAccessor);
+			}, 0);
+		}
+	};
 });

labs/dependency-examples/knockoutjs_require/js/main.js

@@ -1,24 +1,26 @@
+/*global require, window */
+
 // Author: Loïc Knuchel <loicknuchel@gmail.com>
 
 // Require.js allows us to configure shortcut alias
 require.config({
-  paths: {
-    knockout: '../bower_components/knockout.js/knockout'
-  }
+	paths: {
+		knockout: '../bower_components/knockout.js/knockout'
+	}
 });
 
 require([
-  'knockout',
-  'config/global',
-  'viewmodels/todo',
-  'extends/handlers',
-  'extends/native'
-], function(ko, g, TodoViewModel){
-  'use strict';
-  // var app_view = new AppView();
-  // check local storage for todos
-  var todos = ko.utils.parseJson( localStorage.getItem( g.localStorageItem ) );
+	'knockout',
+	'config/global',
+	'viewmodels/todo',
+	'extends/handlers'
+], function (ko, g, TodoViewModel) {
+	'use strict';
+
+	// var app_view = new AppView();
+	// check local storage for todos
+	var todos = ko.utils.parseJson(window.localStorage.getItem(g.localStorageItem));
 
-  // bind a new instance of our view model to the page
-  ko.applyBindings( new TodoViewModel( todos || [] ) );
+	// bind a new instance of our view model to the page
+	ko.applyBindings(new TodoViewModel(todos || []));
 });

labs/dependency-examples/knockoutjs_require/js/models/Todo.js

@@ -1,12 +1,16 @@
+/*global define */
+
 define([
-  'knockout'
-], function(ko){
-  'use strict';
-  // represent a single todo item
-  var Todo = function( title, completed ) {
-    this.title = ko.observable( title );
-    this.completed = ko.observable( completed );
-    this.editing = ko.observable( false );
-  };
-  return Todo;
+	'knockout'
+], function (ko) {
+	'use strict';
+
+	// represent a single todo item
+	var Todo = function (title, completed) {
+		this.title = ko.observable(title);
+		this.completed = ko.observable(completed);
+		this.editing = ko.observable(false);
+	};
+
+	return Todo;
 });

labs/dependency-examples/knockoutjs_require/js/viewmodels/todo.js

@@ -1,97 +1,100 @@
+/*global define, window */
+
 define([
-  'knockout',
-  'config/global',
-  'models/Todo'
-], function(ko, g, Todo){
-  'use strict';
-  // our main view model
-  var ViewModel = function( todos ) {
-    var self = this;
-
-    // map array of passed in todos to an observableArray of Todo objects
-    self.todos = ko.observableArray( ko.utils.arrayMap( todos, function( todo ) {
-      return new Todo( todo.title, todo.completed );
-    }));
-
-    // store the new todo value being entered
-    self.current = ko.observable();
-
-
-
-    // add a new todo, when enter key is pressed
-    self.add = function() {
-      var current = self.current().trim();
-      if ( current ) {
-        self.todos.push( new Todo( current ) );
-        self.current( '' );
-      }
-    };
-
-    // remove a single todo
-    self.remove = function( todo ) {
-      self.todos.remove( todo );
-    };
-
-    // remove all completed todos
-    self.removeCompleted = function() {
-      self.todos.remove(function( todo ) {
-        return todo.completed();
-      });
-    };
-
-    // edit an item
-    self.editItem = function( item ) {
-      item.editing( true );
-    };
-
-    // stop editing an item.  Remove the item, if it is now empty
-    self.stopEditing = function( item ) {
-      item.editing( false );
-      if ( !item.title().trim() ) {
-        self.remove( item );
-      }
-    };
-
-    // count of all completed todos
-    self.completedCount = ko.computed(function() {
-      return ko.utils.arrayFilter( self.todos(), function(todo) {
-        return todo.completed();
-      } ).length;
-    });
-
-    // count of todos that are not complete
-    self.remainingCount = ko.computed(function() {
-      return self.todos().length - self.completedCount();
-    });
-
-    // writeable computed observable to handle marking all complete/incomplete
-    self.allCompleted = ko.computed({
-      //always return true/false based on the done flag of all todos
-      read: function() {
-        return !self.remainingCount();
-      },
-      // set all todos to the written value (true/false)
-      write: function( newValue ) {
-        ko.utils.arrayForEach(self.todos(), function( todo ) {
-          // set even if value is the same, as subscribers are not notified in that case
-          todo.completed( newValue );
-        });
-      }
-    });
-
-    // helper function to keep expressions out of markup
-    self.getLabel = function( count ) {
-      return ko.utils.unwrapObservable( count ) === 1 ? 'item' : 'items';
-    };
-
-    // internal computed observable that fires whenever anything changes in our todos
-    ko.computed(function() {
-      // store a clean copy to local storage, which also creates a dependency on the observableArray and all observables in each item
-      localStorage.setItem( g.localStorageItem, ko.toJSON( self.todos ) );
-    }).extend({
-      throttle: 500
-    }); // save at most twice per second
-
-  };
-  return ViewModel;
+	'knockout',
+	'config/global',
+	'models/Todo'
+], function (ko, g, Todo) {
+	'use strict';
+
+	// our main view model
+	var ViewModel = function (todos) {
+		var self = this;
+
+		// map array of passed in todos to an observableArray of Todo objects
+		self.todos = ko.observableArray(ko.utils.arrayMap(todos, function (todo) {
+			return new Todo(todo.title, todo.completed);
+		}));
+
+		// store the new todo value being entered
+		self.current = ko.observable();
+
+		// add a new todo, when enter key is pressed
+		self.add = function () {
+			var current = self.current().trim();
+
+			if (current) {
+				self.todos.push(new Todo(current));
+				self.current('');
+			}
+		};
+
+		// remove a single todo
+		self.remove = function (todo) {
+			self.todos.remove(todo);
+		};
+
+		// remove all completed todos
+		self.removeCompleted = function () {
+			self.todos.remove(function (todo) {
+				return todo.completed();
+			});
+		};
+
+		// edit an item
+		self.editItem = function (item) {
+			item.editing(true);
+		};
+
+		// stop editing an item.  Remove the item, if it is now empty
+		self.stopEditing = function (item) {
+			item.editing(false);
+
+			if (!item.title().trim()) {
+				self.remove(item);
+			}
+		};
+
+		// count of all completed todos
+		self.completedCount = ko.computed(function () {
+			return ko.utils.arrayFilter(self.todos(), function (todo) {
+				return todo.completed();
+			}).length;
+		});
+
+		// count of todos that are not complete
+		self.remainingCount = ko.computed(function () {
+			return self.todos().length - self.completedCount();
+		});
+
+		// writeable computed observable to handle marking all complete/incomplete
+		self.allCompleted = ko.computed({
+			//always return true/false based on the done flag of all todos
+			read: function () {
+				return !self.remainingCount();
+			},
+			// set all todos to the written value (true/false)
+			write: function (newValue) {
+				ko.utils.arrayForEach(self.todos(), function (todo) {
+					// set even if value is the same, as subscribers are not notified in that case
+					todo.completed(newValue);
+				});
+			}
+		});
+
+		// helper function to keep expressions out of markup
+		self.getLabel = function (count) {
+			return ko.utils.unwrapObservable(count) === 1 ? 'item' : 'items';
+		};
+
+		// internal computed observable that fires whenever anything changes in our todos
+		ko.computed(function () {
+			// store a clean copy to local storage, which also creates a dependency on the observableArray and all observables in each item
+			window.localStorage.setItem(g.localStorageItem, ko.toJSON(self.todos));
+		}).extend({
+			throttle: 500
+		}); // save at most twice per second
+	};
+
+	return ViewModel;
 });