Have task outputting into a view

Assigning them into the page by using jquery.

diff --git a/dash/app.js b/dash/app.js
index 1fb4024..7a8c4c7 100644 (file)
--- a/dash/app.js
+++ b/dash/app.js
@@ -1,26 +1,64 @@
 $(document).ready(function(){
     // render to the page
-    // project 1
-    var task11 = new Task({title: "new task #11", project: 1});
+    // Emmet Gov't
+    var task11 = new Task({title: "Main Navigation", project: 1, employee: "Laury", status: "On Hold"});
     var taskView11 = new TaskView({model: task11});
-    var task12 = new Task({title: "new task #12", project: 1});
+    var task12 = new Task({title: "Plugin Req: Uber Menu", project: 1, employee: "Laury", status: "New"});
     var taskView12 = new TaskView({model: task12});
+    var task13 = new Task({title: "Department Section", project: 1, employee: "Laury", status: "In Progress"});
+    var taskView13 = new TaskView({model: task13});
+    var task14 = new Task({title: "Content Migration", project: 1, employee: "Steve", status: "New"});
+    var taskView14 = new TaskView({model: task14});
     $('#myList').append(taskView11.render().el);
     $('#myList').append(taskView12.render().el);
+    $('#myList').append(taskView13.render().el);
 
-    // project 2
-    var task21 = new Task({title: "new task #21", project: 2});
+    // Western UP
+    var task21 = new Task({title: "Banner Ads", project: 2, employee: "Steve", status: "New"});
     var taskView21 = new TaskView({model: task21});
-    var task22 = new Task({title: "new task #22", project: 2});
+    var task22 = new Task({title: "Contact Forms MailChimp", project: 2, employee: "Laury", status: "New"});
     var taskView22 = new TaskView({model: task22});
+    var task23 = new Task({title: "Events", project: 2, employee: "Laury", status: "New"});
+    var taskView23 = new TaskView({model: task23});
+    var task24 = new Task({title: "Members", project: 2, employee: "Laury", status: "New"});
+    var taskView24 = new TaskView({model: task24});
+    var task25 = new Task({title: "Wordress Setup", project: 2, employee: "Laury", status: "New"});
+    var taskView25 = new TaskView({model: task25});
+    var task26 = new Task({title: "Content Migration", project: 2, employee: "Steve", status: "New"});
+    var taskView26 = new TaskView({model: task26});
     $('#myList2').append(taskView21.render().el);
     $('#myList2').append(taskView22.render().el);
+    $('#myList2').append(taskView23.render().el);
+    $('#myList2').append(taskView24.render().el);
+    $('#myList2').append(taskView25.render().el);
+    $('#myList2').append(taskView26.render().el);
 
-    // project 3
-    var task31 = new Task({title: "new task #31", project: 3});
+    // NLEA
+    var task31 = new Task({title: "Constant Contact", project: 3, employee: "Steve", status: "New"});
     var taskView31 = new TaskView({model: task31});
-    var task32 = new Task({title: "new task #32", project: 3});
+    var task32 = new Task({title: "Forms", project: 3, employee: "Steve", status: "New"});
     var taskView32 = new TaskView({model: task32});
     $('#myList3').append(taskView31.render().el);
     $('#myList3').append(taskView32.render().el);
+
+    // Mount Pleasant Wow
+    var task41 = new Task({title: "Break Out / Theme", project: 4, employee: "Ian", status: "New"});
+    var taskView41 = new TaskView({model: task41});
+    var task42 = new Task({title: "Forms", project: 4, employee: "Steve", status: "New"});
+    var taskView42 = new TaskView({model: task42});
+    var task43 = new Task({title: "Coupons", project: 4, employee: "Steve", status: "New"});
+    var taskView43 = new TaskView({model: task43});
+    var task44 = new Task({title: "Events", project: 4, employee: "Steve", status: "New"});
+    var taskView44 = new TaskView({model: task44});
+    var task45 = new Task({title: "Members", project: 4, employee: "Steve", status: "New"});
+    var taskView45 = new TaskView({model: task45});
+    var task46 = new Task({title: "Photos/Videos", project: 4, employee: "Steve", status: "New"});
+    var taskView46 = new TaskView({model: task46});
+    $('#myList4').append(taskView41.render().el);
+    $('#myList4').append(taskView42.render().el);
+    $('#myList4').append(taskView43.render().el);
+    $('#myList4').append(taskView44.render().el);
+    $('#myList4').append(taskView45.render().el);
+    $('#myList4').append(taskView46.render().el);
+
 });

diff --git a/dash/models/Task.js b/dash/models/Task.js
index 20f0f71..00250fd 100644 (file)
--- a/dash/models/Task.js
+++ b/dash/models/Task.js
@@ -1,6 +1,7 @@
 var Task = Backbone.Model.extend({
     defaults: {
         title: "untitled",
+        employee: "",
         status: "new",
         project: 0
     }

diff --git a/dash/views/TaskListView.js b/dash/views/TaskListView.js
deleted file mode 100644 (file)
index 43bb409..0000000
--- a/dash/views/TaskListView.js
+++ /dev/null
@@ -1,13 +0,0 @@
-var TaskListView = Backbone.View.extend({
-    el: '#myList',
-    tagName: 'section',
-    template: _.template('<h1><%= title %></h1>'),
-    initialize: function(){
-        this.render();
-    },
-    render: function(){
-        var taskView = this.collection.map(function(task){
-            return (new TaskView({model: task}).render().el);
-        });
-    }
-});

diff --git a/dash/views/TaskView.js b/dash/views/TaskView.js
deleted file mode 100644 (file)
index 420bf55..0000000
--- a/dash/views/TaskView.js
+++ /dev/null
@@ -1,12 +0,0 @@
-var TaskView = Backbone.View.extend({
-    tagName: 'tr',
-    className: 'task',
-    template: _.template(
-        '<td><%= status %></td>' +
-        '<td><%= project %></td>' +
-        '<td><%= title %></td>'),
-    render: function(){
-        this.$el.append(this.template(this.model.toJSON()));
-        return this;
-    }
-});

diff --git a/dash/views/task.js b/dash/views/task.js
new file mode 100644 (file)
index 0000000..ae10a55
--- /dev/null
+++ b/dash/views/task.js
@@ -0,0 +1,12 @@
+var TaskView = Backbone.View.extend({
+    tagName: 'tr',
+    className: 'task',
+    template: _.template(
+        '<td><%= employee %></td>' +
+        '<td><%= status %></td>' +
+        '<td><%= title %></td>'),
+    render: function(){
+        this.$el.append(this.template(this.model.toJSON()));
+        return this;
+    }
+});

diff --git a/dash/views/taskList.js b/dash/views/taskList.js
new file mode 100644 (file)
index 0000000..13e181c
--- /dev/null
+++ b/dash/views/taskList.js
@@ -0,0 +1,11 @@
+var TaskListView = Backbone.View.extend({
+    el: '#myList',
+    tagName: 'section',
+    render: function(){
+        var taskView = this.collection.map(function(task){
+            return (new TaskView({model: task})).render().el;
+        });
+        this.$el.html(taskView);
+        return this;
+    }
+});

diff --git a/index.html b/index.html
index c673bdd..c1a111b 100644 (file)
--- a/index.html
+++ b/index.html
@@ -37,39 +37,52 @@
         <div class="container">
             <div class="row">
                 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
-                    <h3>Project 1</h3>
+                    <h3>NLEA</h3>
+                    <table id="myList3"
+                        class="table table-condensed table-striped table-bordered table-hover">
+                        <thead>
+                            <tr>
+                                <th>Employee</th>
+                                <th>Status</th>
+                                <th>Task Name</th>
+                            </tr>
+                        </thead>
+                    </table>
+                </div>
+                <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
+                    <h3>Emmet - Gov't</h3>
                     <table id="myList"
                         class="table table-condensed table-striped table-bordered table-hover">
                         <thead>
                             <tr>
+                                <th>Employee</th>
                                 <th>Status</th>
-                                <th>Project</th>
                                 <th>Task Name</th>
                             </tr>
                         </thead>
                     </table>
                 </div>
                 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
-                    <h3>Project 2</h3>
+                    <h3>Western UP</h3>
                     <table id="myList2"
                         class="table table-condensed table-striped table-bordered table-hover">
                         <thead>
                             <tr>
+                                <th>Employee</th>
                                 <th>Status</th>
-                                <th>Project</th>
                                 <th>Task Name</th>
                             </tr>
                         </thead>
                     </table>
                 </div>
                 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
-                    <h3>Project 3</h3>
-                    <table id="myList3"
+                    <h3>Mount Pleasant Wow</h3>
+                    <table id="myList4"
                         class="table table-condensed table-striped table-bordered table-hover">
                         <thead>
                             <tr>
+                                <th>Employee</th>
                                 <th>Status</th>
-                                <th>Project</th>
                                 <th>Task Name</th>
                             </tr>
                         </thead>
@@ -86,8 +99,8 @@
         <script src="dash/models/Task.js"></script>
         <script src="dash/models/Project.js"></script>
         <script src="dash/collections/Tasks.js"></script>
-        <script src="dash/views/TaskView.js"></script>
-        <script src="dash/views/TaskListView.js"></script>
+        <script src="dash/views/task.js"></script>
+        <script src="dash/views/taskList.js"></script>
         <script src="dash/app.js"></script>
     </body>
 </html>