The last thing we can do is to populate the view with all the captured images.
Let's create the controller in the app/controller/Pictures.js file:
Ext.define('Imaginary.controller.Pictures', {
extend: 'Ext.app.Controller',
config: {
refs: {
photoContainer: '#photos'
}
},
launch: function() {
var pictures = this.getPictures();
var photoContainer = this.getPhotoContainer();
for (var i = 0; i < pictures.length; i++) {
this.addPictureToContainer(pictures[i], photoContainer);
}
}
// getPictures and addPictureToContainer implementation goes here
});The main purpose of the controller is to retrieve all pictures from the pictures store, create images, and add them to the container, as presented here in the addPictureToContainer method:
addPictureToContainer: function(picture, container) {
var self = this;
var thumb = Ext.create('Ext.Img', {
src: picture.get...