EMBER WORKSHOP: Re-Opening Classes

Re-Opening Classes

by jdcravens

HTML

<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://builds.emberjs.com/release/ember.js"></script>

JavaScript

// Re-Opening Classes

App = Ember.Application.create({});

App.DefaultPlayer = Ember.Object.extend({
  init: function () {
    this.set('imgProfilePrefix', 'default_');
    this.set('imgProfileSuffix', '_profile');
  },
  name: "Steve", // one way to handle default 
  baseDir: "/images",
  imgName: function(){
    return this.get('imgProfilePrefix') + this.get('name').split(' ').join('_').toLowerCase() + this.get('imgProfileSuffix') + '.png';
  }, // see no property method ... so call is different below
    
  imgPath: function(){
    return this.get('baseDir') + '/profile/' + this.imgName();
  }.property('baseDir', 'imgName'), 
  
  onlineStatusChanged: function(){
    //console.log('onlineStatusChanged to: ' + this.get('isOnline'));
  }.observes('isOnline').on('init')    
});

var steve = App.DefaultPlayer.create({
    'isOnline': true
});
steve.set('isOnline', false);

//////////////////////////////////////////////////////////////////////////////////////////////////

console.log('steve isDefault: ' + steve.get('isDefault')); // undefined

App.DefaultPlayer.reopen({
  isDefault: true
});

// DefaultPlayer.reopen() adds code for every new instance that will be created (existing instances will not be changed)

// Does not impact an earlier instance
console.log('steve isDefault: ' + steve.get('isDefault')); // undefined

// Create a new instance after reopening
var suzie = App.DefaultPlayer.create({});
console.log('suzie isDefault: ' + suzie.get('isDefault')); // true

// default_player.reopen() adds the code to the logger instance **notice lowercase d

suzie.reopen({
  isDefault: false
});

console.log('suzie isDefault: ' + suzie.get('isDefault')); // false

// can also override existing methods
App.DefaultPlayer.reopen({
  isDefault: false
});

var jake = App.DefaultPlayer.create({});

console.log('jake isDefault: ' + jake.get('isDefault'));

// DefaultPlayer.reopenClass() adds code that is static to the Player Class (it cannot be called from instances, only...