justinmc/index.html

## index.html
<!doctype html>
<html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

    </head>
    <body>

        <!-- Add your site or application content here -->
        <p>
            Backbone model/collection example from <a href="http://www.justinmccandless.com/blog/Getting+a+Very+Simple+Backbone.js+Project+Up+and+Running" target="_blank">http://www.justinmccandless.com/blog/Getting+a+Very+Simple+Backbone.js+Project+Up+and+Running</a>.
        </p>
        <p>
            Open the console to see the bootstrapped task titles output.
        </p>

        <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>
        <script>

            (function() {

                var Myapp_Task = Backbone.Model.extend({

                    // The default values for a task
                    defaults: function() {
                        // get current date
                        var now = new Date;
                        var date = now.getUTCFullYear() + '-' + now.getUTCMonth() + '-' + now.getUTCDate() + 'T' + now.getUTCHours() + ':' + now.getUTCMinutes() + ':' + now.getUTCSeconds() + '.000Z';
                        return {
                            title: 'New Task',
                            updated: date,
                            status: 'needsAction',
                            completed: null
                      };
                    },

                    // Any functions you need go here

                    // Destroy the task
                    clear: function() {
                      this.destroy();
                    }
                });

                var Myapp_TaskList = Backbone.Collection.extend({

                    // Reference the model you made!
                    model: Myapp_Task,

                    // Url to call to get the task list (mine is just a static local file)
                    url: '/js/tasklist.json',
                    // Any functions you need go here
                });

                // bootstrap backbone
                window.onload = function(){

                    // create an instance of your collection
                    var mytasks = new Myapp_TaskList;

                    // use the reset function to set your initial pre-ajax data
                    mytasks.reset([
                        {title: 'Collect underpants'},
                        {title: '???'},
                        {title: 'Profit'},
                    ]);

                    // now you can use your data in your app!
                    mytasks.each(function(obj, key) {
                        console.log(obj.get('title'));
                    });
                };

            })()

        </script>

    </body>
</html>
	<!doctype html>
	<html class="no-js">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	</head>
	<body>

	<!-- Add your site or application content here -->
	<p>
	Backbone model/collection example from <a href="http://www.justinmccandless.com/blog/Getting+a+Very+Simple+Backbone.js+Project+Up+and+Running" target="_blank">http://www.justinmccandless.com/blog/Getting+a+Very+Simple+Backbone.js+Project+Up+and+Running</a>.
	</p>
	<p>
	Open the console to see the bootstrapped task titles output.
	</p>

	<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"></script>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>
	<script>

	(function() {

	var Myapp_Task = Backbone.Model.extend({

	// The default values for a task
	defaults: function() {
	// get current date
	var now = new Date;
	var date = now.getUTCFullYear() + '-' + now.getUTCMonth() + '-' + now.getUTCDate() + 'T' + now.getUTCHours() + ':' + now.getUTCMinutes() + ':' + now.getUTCSeconds() + '.000Z';
	return {
	title: 'New Task',
	updated: date,
	status: 'needsAction',
	completed: null
	};
	},

	// Any functions you need go here

	// Destroy the task
	clear: function() {
	this.destroy();
	}
	});

	var Myapp_TaskList = Backbone.Collection.extend({

	// Reference the model you made!
	model: Myapp_Task,

	// Url to call to get the task list (mine is just a static local file)
	url: '/js/tasklist.json',
	// Any functions you need go here
	});

	// bootstrap backbone
	window.onload = function(){

	// create an instance of your collection
	var mytasks = new Myapp_TaskList;

	// use the reset function to set your initial pre-ajax data
	mytasks.reset([
	{title: 'Collect underpants'},
	{title: '???'},
	{title: 'Profit'},
	]);

	// now you can use your data in your app!
	mytasks.each(function(obj, key) {
	console.log(obj.get('title'));
	});
	};

	})()

	</script>

	</body>
	</html>