$(document).ready(function () {

    function Task(taskName){
        this.name = ko.observable(taskName);
    }
  
    function AppViewModel() {
        var self = this;

        //List of all tasks
        self.tasks = ko.observableArray([
            new Task("Call Work"),
            new Task("Buy Milk"),
            new Task("Go Home")
        ]);

        self.selectedTask = ko.observable();
        
        //When new task is selected
        self.selectedTask.subscribe(function(){
            if(self.selectedTask()){
                self.newTaskName(self.selectedTask().name());
            } else {
                self.newTaskName('');
            }
        });

        self.newTaskName = ko.observable();

        //When name in input filed is changed
        self.newTaskName.subscribe(function(){
            if(self.selectedTask()){
                self.selectedTask().name(self.newTaskName());
            }
        });
    }

    //Apply 2 way data binding
    ko.applyBindings(new AppViewModel());
});