Is this a javascript method or property?

Question

I'm having the hardest time getting my terminology right. In the following code:

Notes.NotesController = Ember.ArrayController.extend({
  newNoteName: null,

  actions: {
    createNewNote: function() {
        var content = this.get('content');
        var newNoteName = this.get('newNoteName');
        var unique = newNoteName != null && newNoteName.length > 1;

        content.forEach(function(note) { 
            if (newNoteName === note.get('name')) {
             unique = false; return;
           }
         });

        if (unique) {
            var newNote = this.store.createRecord('note'); 
            newNote.set('id', newNoteName);
            newNote.set('name', newNoteName);
            newNote.save(); 

            this.set('newNoteName', null);
          } else {
            alert('Note must have a unique name of at least 2 characters!');
         }
     } 
  }
});

What is 'newNoteName:', 'actions:', and 'createNewNote:'?

Are they methods or properties or hooks? What are the differences? And does 'createNewNote' being nested inside of 'actions:' make 'actions' something altogether different?

What is the difference between ember 'hooks' and methods/properties that you create and name yourself and how they're used?

Thank you.'

[UPDATE]

Where does 'content' come from?

Notes.NotesNoteController = Ember.ObjectController.extend({
actions: {
    updateNote: function() {
        var content = this.get('content');
        console.log(content);
        if (content) {
            content.save();
        }
    }
 }
});

It isn't an attribute of the model so how does Ember know what to retrieve with

this.get('content')

Does it come with the textArea handlebars helper?

Answer 1

All of the previous answers are correct, however, none of them address the Ember conventions at play in your question.

newNoteName is a property of the NotesController. Inside the template called 'notes' you can display it using {{newNoteName}} or use it in an input with {{input value=newNoteName}}. In the NotesController you can read the value with this.get('newNoteName') and you can set the value with this.set('newNoteName').

actions is a special property on Ember controllers. Any functions declared in the actions hash can be called in a template. Using createNewNote as an example, you can use something like this to call the function in response to a button click:

<button {{action 'createNewNote'}}>Create New Note</button>

createNewNote is a controller action. It can be called from a template, as shown above, or it can be invoked from other controllers or views using send.

From another controller you might have this:

Notes.OtherController = Ember.Controller.extend({
  needs : ["notes"],
  actions : {
    someAction : function(){
      this.get('controllers.notes').send('createNewNote');
    }
  }
});

[UPDATE] : Addressing the question about hooks.

In Ember hooks are functions that you can create on your objects that Ember will call at various points as it manages your object hierarchy and lifecycle. For instance, in a Route you will often want to implement the model hook. If you have declared a function called model in a Route, then Ember will call that method automatically when it needs to get a hold of the model that is to be represented by that route. This allows you to override the default way that Ember looks for a model, without needing to also implement all of the things that Ember does in the way of Route/Controller creation and setup. Hook methods are really technically no different than other methods that you may implement on your objects, the only real difference is that Ember will automatically call hook methods at the appropriate time.

[UPDATE 2] : Where does 'content' come from?

content is the object that your controller is representing. The route sets the content on the controller, and it is retrieved from the model hook. Ember has some smart defaults built in that will try to do the right thing based on your Router. But you can implement the model hook to return whatever you want.

If you haven't created Notes.NotesRoute yourself, then Ember is generating one for you that is more or less equivalent to this:

Notes.NotesRoute = Ember.Route.extend({
  model : function(){
    return this.store.find('note');
  }
});

That controller is finding all Note models and setting that collection to the content property of the NotesController.