Created
October 19, 2014 18:42
-
-
Save fishermand46/3682dfd743fea12f1328 to your computer and use it in GitHub Desktop.
// source http://jsbin.com/pudaz
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset=utf-8 /> | |
| <title>JS Bin</title> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> | |
| <script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script> | |
| <script src="http://builds.emberjs.com/tags/v1.7.0/ember.js"></script> | |
| <script src="http://builds.emberjs.com/tags/v1.0.0-beta.9/ember-data.min.js"></script> | |
| </head> | |
| <body> | |
| <script type="text/x-handlebars" data-template-name="application"> | |
| <h1>ember-latest jsbin</h1> | |
| {{outlet}} | |
| </script> | |
| <script type="text/x-handlebars" data-template-name="index"> | |
| <h2>Apple Ratings</h2> | |
| <ul> | |
| {{#each persistedModels}} | |
| <li> | |
| <p>{{name}}: {{rating}}</p> | |
| <button {{action "incrementRating" this}}>Increment Rating</button> | |
| <button {{action "saveRating" this}}>Save Rating</button> | |
| </li> | |
| {{/each}} | |
| </ul> | |
| {{input placeholder="Name..." value=newApple.name}} | |
| {{input placeholder="Rating..." value=newApple.rating}} | |
| <button {{action "saveApple" newApple}}>Save</button> | |
| </script> | |
| <script id="jsbin-javascript"> | |
| App = Ember.Application.create(); | |
| App.ApplicationAdapter = DS.FixtureAdapter; | |
| Ember.computed.filterIgnoreSpuriousChanges = function(dependentKey, callback) { | |
| var didPropertyChange = function(item, changeMeta) { | |
| var previousValues = changeMeta.previousValues; | |
| var observedProperty; | |
| if(!previousValues) { return true; } | |
| observedProperty = Object.keys(previousValues)[0]; | |
| return item.get(observedProperty) !== previousValues[observedProperty]; | |
| }; | |
| var options = { | |
| initialize: function (array, changeMeta, instanceMeta) { | |
| instanceMeta.filteredArrayIndexes = new Ember.SubArray(); | |
| }, | |
| addedItem: function(array, item, changeMeta, instanceMeta) { | |
| if(!didPropertyChange(item, changeMeta)) { return array; } | |
| var match = !!callback.call(this, item), | |
| filterIndex = instanceMeta.filteredArrayIndexes.addItem(changeMeta.index, match); | |
| if (match) { | |
| array.insertAt(filterIndex, item); | |
| } | |
| return array; | |
| }, | |
| removedItem: function(array, item, changeMeta, instanceMeta) { | |
| if(!didPropertyChange(item, changeMeta)) { return array; } | |
| var filterIndex = instanceMeta.filteredArrayIndexes.removeItem(changeMeta.index); | |
| if (filterIndex > -1) { | |
| array.removeAt(filterIndex); | |
| } | |
| return array; | |
| } | |
| }; | |
| return Ember.arrayComputed(dependentKey, options); | |
| }; | |
| App.Apple = DS.Model.extend({ | |
| name: DS.attr('string'), | |
| rating: DS.attr('number') | |
| }); | |
| App.Apple.FIXTURES = [ | |
| {id: 1, name: 'Granny Smith', rating: 7}, | |
| {id: 2, name: 'Fuji', rating: 10}, | |
| {id: 3, name: 'Gala', rating: 6} | |
| ]; | |
| App.IndexRoute = Ember.Route.extend({ | |
| model: function() { | |
| return this.store.find('apple'); | |
| } | |
| }); | |
| App.NewAppleRoute = Ember.Route.extend({ | |
| model: function() { | |
| return this.store.createRecord('apple'); | |
| } | |
| }); | |
| App.IndexController = Ember.Controller.extend({ | |
| initialize: Ember.observer(function() { | |
| this.set('newApple', this.store.createRecord('apple')); | |
| }).on('init'), | |
| persistedModels: Ember.computed.filterIgnoreSpuriousChanges('[email protected]', function(model) { | |
| console.log('reRendered ', model.get('name')); | |
| return !model.get('isNew'); | |
| }), | |
| // persistedModels: Ember.computed.filterBy('model', 'isNew', false), | |
| actions: { | |
| saveApple: function(model) { | |
| model.save(); | |
| Ember.run.scheduleOnce('afterRender', function() { | |
| this.set('newApple', this.store.createRecord('apple')); | |
| }.bind(this)); | |
| }, | |
| incrementRating: function(model) { | |
| model.incrementProperty('rating'); | |
| }, | |
| saveRating: function(model) { | |
| model.save(); | |
| } | |
| } | |
| }); | |
| </script> | |
| <script id="jsbin-source-javascript" type="text/javascript">App = Ember.Application.create(); | |
| App.ApplicationAdapter = DS.FixtureAdapter; | |
| Ember.computed.filterIgnoreSpuriousChanges = function(dependentKey, callback) { | |
| var didPropertyChange = function(item, changeMeta) { | |
| var previousValues = changeMeta.previousValues; | |
| var observedProperty; | |
| if(!previousValues) { return true; } | |
| observedProperty = Object.keys(previousValues)[0]; | |
| return item.get(observedProperty) !== previousValues[observedProperty]; | |
| }; | |
| var options = { | |
| initialize: function (array, changeMeta, instanceMeta) { | |
| instanceMeta.filteredArrayIndexes = new Ember.SubArray(); | |
| }, | |
| addedItem: function(array, item, changeMeta, instanceMeta) { | |
| if(!didPropertyChange(item, changeMeta)) { return array; } | |
| var match = !!callback.call(this, item), | |
| filterIndex = instanceMeta.filteredArrayIndexes.addItem(changeMeta.index, match); | |
| if (match) { | |
| array.insertAt(filterIndex, item); | |
| } | |
| return array; | |
| }, | |
| removedItem: function(array, item, changeMeta, instanceMeta) { | |
| if(!didPropertyChange(item, changeMeta)) { return array; } | |
| var filterIndex = instanceMeta.filteredArrayIndexes.removeItem(changeMeta.index); | |
| if (filterIndex > -1) { | |
| array.removeAt(filterIndex); | |
| } | |
| return array; | |
| } | |
| }; | |
| return Ember.arrayComputed(dependentKey, options); | |
| }; | |
| App.Apple = DS.Model.extend({ | |
| name: DS.attr('string'), | |
| rating: DS.attr('number') | |
| }); | |
| App.Apple.FIXTURES = [ | |
| {id: 1, name: 'Granny Smith', rating: 7}, | |
| {id: 2, name: 'Fuji', rating: 10}, | |
| {id: 3, name: 'Gala', rating: 6} | |
| ]; | |
| App.IndexRoute = Ember.Route.extend({ | |
| model: function() { | |
| return this.store.find('apple'); | |
| } | |
| }); | |
| App.NewAppleRoute = Ember.Route.extend({ | |
| model: function() { | |
| return this.store.createRecord('apple'); | |
| } | |
| }); | |
| App.IndexController = Ember.Controller.extend({ | |
| initialize: Ember.observer(function() { | |
| this.set('newApple', this.store.createRecord('apple')); | |
| }).on('init'), | |
| persistedModels: Ember.computed.filterIgnoreSpuriousChanges('[email protected]', function(model) { | |
| console.log('reRendered ', model.get('name')); | |
| return !model.get('isNew'); | |
| }), | |
| // persistedModels: Ember.computed.filterBy('model', 'isNew', false), | |
| actions: { | |
| saveApple: function(model) { | |
| model.save(); | |
| Ember.run.scheduleOnce('afterRender', function() { | |
| this.set('newApple', this.store.createRecord('apple')); | |
| }.bind(this)); | |
| }, | |
| incrementRating: function(model) { | |
| model.incrementProperty('rating'); | |
| }, | |
| saveRating: function(model) { | |
| model.save(); | |
| } | |
| } | |
| });</script></body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| App = Ember.Application.create(); | |
| App.ApplicationAdapter = DS.FixtureAdapter; | |
| Ember.computed.filterIgnoreSpuriousChanges = function(dependentKey, callback) { | |
| var didPropertyChange = function(item, changeMeta) { | |
| var previousValues = changeMeta.previousValues; | |
| var observedProperty; | |
| if(!previousValues) { return true; } | |
| observedProperty = Object.keys(previousValues)[0]; | |
| return item.get(observedProperty) !== previousValues[observedProperty]; | |
| }; | |
| var options = { | |
| initialize: function (array, changeMeta, instanceMeta) { | |
| instanceMeta.filteredArrayIndexes = new Ember.SubArray(); | |
| }, | |
| addedItem: function(array, item, changeMeta, instanceMeta) { | |
| if(!didPropertyChange(item, changeMeta)) { return array; } | |
| var match = !!callback.call(this, item), | |
| filterIndex = instanceMeta.filteredArrayIndexes.addItem(changeMeta.index, match); | |
| if (match) { | |
| array.insertAt(filterIndex, item); | |
| } | |
| return array; | |
| }, | |
| removedItem: function(array, item, changeMeta, instanceMeta) { | |
| if(!didPropertyChange(item, changeMeta)) { return array; } | |
| var filterIndex = instanceMeta.filteredArrayIndexes.removeItem(changeMeta.index); | |
| if (filterIndex > -1) { | |
| array.removeAt(filterIndex); | |
| } | |
| return array; | |
| } | |
| }; | |
| return Ember.arrayComputed(dependentKey, options); | |
| }; | |
| App.Apple = DS.Model.extend({ | |
| name: DS.attr('string'), | |
| rating: DS.attr('number') | |
| }); | |
| App.Apple.FIXTURES = [ | |
| {id: 1, name: 'Granny Smith', rating: 7}, | |
| {id: 2, name: 'Fuji', rating: 10}, | |
| {id: 3, name: 'Gala', rating: 6} | |
| ]; | |
| App.IndexRoute = Ember.Route.extend({ | |
| model: function() { | |
| return this.store.find('apple'); | |
| } | |
| }); | |
| App.NewAppleRoute = Ember.Route.extend({ | |
| model: function() { | |
| return this.store.createRecord('apple'); | |
| } | |
| }); | |
| App.IndexController = Ember.Controller.extend({ | |
| initialize: Ember.observer(function() { | |
| this.set('newApple', this.store.createRecord('apple')); | |
| }).on('init'), | |
| persistedModels: Ember.computed.filterIgnoreSpuriousChanges('[email protected]', function(model) { | |
| console.log('reRendered ', model.get('name')); | |
| return !model.get('isNew'); | |
| }), | |
| // persistedModels: Ember.computed.filterBy('model', 'isNew', false), | |
| actions: { | |
| saveApple: function(model) { | |
| model.save(); | |
| Ember.run.scheduleOnce('afterRender', function() { | |
| this.set('newApple', this.store.createRecord('apple')); | |
| }.bind(this)); | |
| }, | |
| incrementRating: function(model) { | |
| model.incrementProperty('rating'); | |
| }, | |
| saveRating: function(model) { | |
| model.save(); | |
| } | |
| } | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment