Add the Celebrity Model

In this section, we will create the Javascript native object classes that the app will use. At this point, we will create a Celebrity object using standard Javascript patterns. This is your object definition, the NoServer Fraamework does not create dependencies in your code by requiring you to use our own proprietary object classes.

Creating the Celebrity Class

We will create a Celebrity data model that contains the following members:

Celebrity
{string}	firstName	the celebrity’s first name
{string}	lastName	the celebrity’s last name
{byte[]}	imageData	the celebrity’s profile image
{string}	gender	the gender of the celebrity

You may notice that we are anticipating a byte array datatype for the image data as a native member of this class–stay tuned to see how that works.

The hoodyoodoo.js File

We will now start creating the JavaScript code for our application. In the Scripts directory of your scaffolded application, create a file called hoodyoodoo.js. We will first add a little bit of JQuery and initialize some global variables:

$(document).ready(function(){
    HoodyoodooViewModel.init();
});

var G_DEBUG = false;
var m_loadingImageElement = null;

Next, we define the Celebrity object model:

// models
function Celebrity(data) {
    if (data) {
        this.clazz = data.clazz;
        this.guid = data.guid;
        this.firstName = data.firstName;
        this.lastName = data.lastName;
        this.gender = data.gender;
        this.selectedCount = data.selectedCount;
        this.rejectedCount = data.rejectedCount;
        this.imageSrc = '.' + data.ffUrl + '/imageData';
    } else {
        this.clazz = "Celebrity";
        this.guid = null;
        this.firstName = null;
        this.lastName = null;
        this.gender = null;
        this.imageData = null;
        this.selectedCount = null;
        this.rejectedCount = null;
    }
    return this;
}

Notice that, in addition to the members listed in the table above, we have defined a member named clazz. This member tells the NoServer API the objecttype of the object. The objecttype may be one you have defined in FFDL, or an objecttype which your API has learned. Any JavaScript object you intend to persist to your API must define a clazz member. We also copy a member named guid, which is one of the NoServer Object Metadata members.

Finally, we define a view model for our app:

var HoodyoodooViewModel = (function() {
    var ff =  new FatFractal();

    var previousPage = "";

    var m_leftCelebrity = null;
    var m_celebrity = null;
    var m_leftCelebrityButton = null;
    var m_leftCelebrityLabel = null;
    var m_doneButton = null;
    var m_addCelebImage = null;
    var m_firstNameField = null;
    var m_lastNameField = null;
    var m_wouldYa = null;

    var self = {
        init: function() {
            ff.setDebug(G_DEBUG);

            m_celebrity = new Celebrity();
        }
    }
    return self;
})();

We define a number of member variables that we'll use in the coming sections.

NEXT: Storing a Celebrity Object