Custom Task lightning component not working

Question

I'm trying to learn lightning and in this process I'm developing a component akin to a small to-do list with subject and activity date (idea taken from paul battison's blog) which I've put in account record page using app builder. However i'm getting some error which i'm not able to understand. Can someone help as to where i'm going wrong?

[P.S - Updated code, this is working now]

Component:

<aura:component controller="TaskController" implements="force:appHostable,flexipage:availableForAllPageTypes,force:hasRecordId" >

<aura:attribute name="recordId" type="Id" />
<aura:attribute name="newTask" type="Task" default="{'sobjectType':'Task'}"/>
<aura:attribute name="tasks" type="Task[]"/>
<aura:handler name="init" action="{!c.doInit}" value="{!this}"/>

<ui:inputText aura:id="taskSubject" label="Task Subject" value="{!v.newTask.Subject}"/>
<ui:inputDateTime aura:id="taskDate" label="Activity Date" value="{!v.newTask.ActivityDate}" displayDatePicker="true"/>
<ui:button label="Add Task" press="{!c.createNewTask}"/>

<aura:iteration items="{!v.tasks}" var="item">
    {!item.Subject}, {!item.ActivityDate}<br/>
</aura:iteration>

</aura:component>

JS controller:

    ({
    doInit: function(component, event, helper) {
    var action = component.get("c.loadTasks");
    var whatId = component.get("v.recordId");
    action.setParams({
        "recordId":whatId
    });
    action.setCallback(this,function(response){
        var state = response.getState();
        if(component.isValid() && state === "SUCCESS"){
            component.set("v.tasks",response.getReturnValue());
        }
        else{
            console.log("Failed with state "+state);
        }
    });
    $A.enqueueAction(action);

    component.set("v.newTask.WhatId",component.get("v.recordId"));
},
createNewTask : function(component, event, helper) {
    var action = component.get("c.saveTask");
    var newTask = component.get("v.newTask");
    action.setParams({
        "task": newTask
    });
    action.setCallback(this,function(response)({
        var state = response.getState();
        if(component.isValid() && state === "SUCCESS"){
            var items = component.get("v.tasks");
            items.push(response.getReturnValue());
            component.set("v.tasks",items);
        }
        else{
            console.log("Failed with state "+state);
        }
    });
    $A.enqueueAction(action);
}
})

Apex controller:

public with sharing class TaskController {
  @AuraEnabled
  public static List<Task> loadTasks(Id recordId){
    return[SELECT Subject, ActivityDate FROM Task WHERE WhatId=:recordId];
  }
  @AuraEnabled
  public static Task saveTask(Task task){
    upsert task;
    return task;
   }
}

Answer 1

1) Take away the Init handler if you are not using it.

2) Do not use same function name for create and save in your client side controller.

3) In your second CreateNewTask function You messed up here :

change this from:

action.setCallback({

to:

action.setCallback(this,function(response){