jasonjmcghee/bestEver.html

## bestEver.html
<!DOCTYPE html>
<html>
  <head>
    <title>ICanHaz + Backbone</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="http://underscorejs.org/underscore-min.js" ></script>
    <script src="http://backbonejs.org/backbone-min.js" ></script>
    <script src="https://github.com/andyet/ICanHaz.js/raw/master/ICanHaz.min.js" ></script>

    <script id="user" type="text/html">
      <li>
        <p>Hi, I&apos;m <a href="http://twitter.com/{{ twitter }}">{{ name }}</a></p>
        <p>I work for {{ employer }} as a {{ job_title }}.</p>
      </li>
    </script>

    <style>
      body {
        font-family: Helvetica;
      }
    </style>
  </head>
  <body>
    <h1>Awesome Demonstration</h1>
    <h3>User List</h3>
    <button id="add_user">Add User</button>
    <ul id="user_list"></ul>


    <script type="text/javascript">
      // when the dom's ready
      (function($){
          User = Backbone.Model.extend({
              name : null,
              twitter : null,
              employer : null,
              job_title : null
          });

          Users = Backbone.Collection.extend({
              initialize: function (models, options) {
                this.bind("add", options.view.addUser);
              }
          });

          AppView = Backbone.View.extend({
              el : $("body"),
              initialize: function () {
                  this.users = new Users(null, {view : this});
              },
              events: {
                  "click #add_user": "askQuestions",
              },
              askQuestions: function () {
                  console.log("rawr");
                  var user_object = {
                      name: prompt("What's your name?"),
                      twitter: prompt("What's your twitter?"),
                      employer: prompt("Where do you work?"),
                      job_title: prompt("What's your job title?")
                  };

                  var user_model = new User(user_object);

                  this.users.add(user_model);
              },

              addUser: function(model) {
                  //Using ICanHaz.js to template user script

                  var user = ich.user({
                    name : model.attributes.name,
                    twitter : model.attributes.twitter,
                    employer : model.attributes.employer,
                    job_title: model.attributes.job_title
                  });

                  $("#user_list").append(user);
              }
          });

          var appview = new AppView;
      })(jQuery);
    </script>
  </body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>ICanHaz + Backbone</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
	<script src="http://underscorejs.org/underscore-min.js" ></script>
	<script src="http://backbonejs.org/backbone-min.js" ></script>
	<script src="https://github.com/andyet/ICanHaz.js/raw/master/ICanHaz.min.js" ></script>

	<script id="user" type="text/html">
	<li>
	<p>Hi, I'm <a href="http://twitter.com/{{ twitter }}">{{ name }}</a></p>
	<p>I work for {{ employer }} as a {{ job_title }}.</p>
	</li>
	</script>

	<style>
	body {
	font-family: Helvetica;
	}
	</style>
	</head>
	<body>
	<h1>Awesome Demonstration</h1>
	<h3>User List</h3>
	<button id="add_user">Add User</button>
	<ul id="user_list"></ul>


	<script type="text/javascript">
	// when the dom's ready
	(function($){
	User = Backbone.Model.extend({
	name : null,
	twitter : null,
	employer : null,
	job_title : null
	});

	Users = Backbone.Collection.extend({
	initialize: function (models, options) {
	this.bind("add", options.view.addUser);
	}
	});

	AppView = Backbone.View.extend({
	el : $("body"),
	initialize: function () {
	this.users = new Users(null, {view : this});
	},
	events: {
	"click #add_user": "askQuestions",
	},
	askQuestions: function () {
	console.log("rawr");
	var user_object = {
	name: prompt("What's your name?"),
	twitter: prompt("What's your twitter?"),
	employer: prompt("Where do you work?"),
	job_title: prompt("What's your job title?")
	};

	var user_model = new User(user_object);

	this.users.add(user_model);
	},

	addUser: function(model) {
	//Using ICanHaz.js to template user script

	var user = ich.user({
	name : model.attributes.name,
	twitter : model.attributes.twitter,
	employer : model.attributes.employer,
	job_title: model.attributes.job_title
	});

	$("#user_list").append(user);
	}
	});

	var appview = new AppView;
	})(jQuery);
	</script>
	</body>
	</html>