Skip to content

Instantly share code, notes, and snippets.

@CheezItMan
Last active May 30, 2017 15:21
Show Gist options
  • Save CheezItMan/f6ca39005274ec23d79060384dbf944b to your computer and use it in GitHub Desktop.
Save CheezItMan/f6ca39005274ec23d79060384dbf944b to your computer and use it in GitHub Desktop.
// /src/app.js
// Import jQuery
import $ from 'jquery';
import _ from 'underscore';
import Task from './models/task';
import TaskList from './collections/task_list';
var taskData = [{
title: "Create a model",
completed: true
},
{
title: "Create a collection",
completed: false
}];
var taskList = new TaskList(taskData);
var render = function(task) {
// Select the template using jQuery
var template_text = $('#taskItemTemplate').html();
//console.log(template_text);
// Get an underscore template object
var templateObject = _.template(template_text);
// Use the underscore template function to compile the
// template and data into raw html.
var compiledHTML = templateObject(task.toJSON());
// append the html to the unordered list.
$('.todo-items').append(compiledHTML);
};
var renderList = function(taskList) {
// Clear the unordered list
$('.todo-items').empty();
// Iterate through the list rendering each Task
taskList.each(function(task) {
render(task);
});
};
$(document).ready(function() {
renderList(taskList);
};
var readNewTaskForm = function() {
// Get the values from the fields
var title = $('#title').val();
$('#title').val('');
var description = $('#description').val();
$('#description').val('');
var completed = $('#completed-checkbox').is(":checked");
$('#completed-checkbox').prop('checked', false);
return {
title: title,
description: description,
completed: completed
};
$('#add-task').click( function() {
// Create a new Task
var task = new Task( readNewTaskForm() );
// Add the Task to the list
taskList.add(task);
// Clear the Unordered list
$('.todo-items').empty();
// re-render the list
renderList(taskList);
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment