Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://builds.emberjs.com.s3.amazonaws.com/tags/v1.0.0/ember.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <script type="text/x-handlebars" id="ponies">
  {{#each rotatingPonies}}
    <img {{bind-attr src=url}}/>
  {{/each}}
  </script>
</body>
</html>
 
App = Ember.Application.create();
​
App.Router.map(function () {
  this.resource('ponies', {path: '/'});
});
​
App.PoniesView = Ember.View.extend({
  willInsertElement: function () {
    var self = this;
    setInterval(function () {
      self.rotate();
    }, 1000);    
  },
​
  rotate: function () {
    var imgs = this.$('img');
    imgs.last().after(imgs.get(0));
  }
});
​
App.PoniesRoute = Ember.Route.extend({
  model: function () {
    return [
      {id: 1,
       url: 'http://ponyfac.es/1/thumb'
      },
      {id: 2,
       url: 'http://ponyfac.es/2/thumb'
      },
      {id: 3,
       url: 'http://ponyfac.es/3/thumb'
      }
    ];
  }
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers