Editor.ImageGalleryModel = Editor.Model.extend({
   _className: 'Editor.ImageGalleryModel',
-  serverURL: null,  
+  serverURL: null,
+  data: [],
   state: 'empty',
 
   init: function(serverURL) {
       alert('erroneous state:', this.get('state'));
     }
 
-    this.set('pages', data[0].pages)
+    $.log('galleries:', data);
+
+    if (data.length == 0)
+        this.set('data', []);
+    else {
+        $.log('dupa');
+        this.set('data', data[0].pages);
+    }
+    
     this.set('state', 'synced');
   },
 
 
--- /dev/null
+/*global View render_template panels */
+var ImageGalleryView = View.extend({
+  _className: 'ImageGalleryView',
+  element: null,
+  model: null,
+  template: 'image-gallery-view-template',
+  
+  init: function(element, model, parent, template) 
+  {
+    this.currentPage = 0;
+    
+    this._super(element, model, template);
+    this.parent = parent;
+       
+    this.model
+      .addObserver(this, 'data', this.modelDataChanged.bind(this))
+      .addObserver(this, 'state', this.modelStateChanged.bind(this));
+      
+    //$('.image-gallery-view', this.element).html(this.model.get('data'));
+    this.modelStateChanged('state', this.model.get('state'));
+    this.model.load();
+  },
+  
+  modelDataChanged: function(property, value) 
+  {
+    $.log('updating pages', property, value);
+    if( property == 'data')
+    {        
+        this.gotoPage(this.currentPage);        
+        this.element.html(render_template(this.template, this));        
+    }   
+  },
+
+  gotoPage: function(index) {
+     if (index < 0) 
+         index = 0;
+
+     var n = this.model.get('pages').length;
+     if (index >= n) index = n-1;
+
+     this.currentPage = index;
+  },
+  
+  modelStateChanged: function(property, value) {
+    if (value == 'synced' || value == 'dirty') {
+      this.parent.unfreeze();
+    } else if (value == 'unsynced') {
+      this.parent.freeze('Niezsynchronizowany...');
+    } else if (value == 'loading') {
+      this.parent.freeze('Ładowanie...');
+    } else if (value == 'saving') {
+      this.parent.freeze('Zapisywanie...');
+    }
+  },
+  
+  dispose: function() {
+    this.model.removeObserver(this);
+    this._super();
+  }
+});
+
+// Register view
+panels['gallery'] = ImageGalleryView;
\ No newline at end of file
 
         <script type="text/html" charset="utf-8" id="image-gallery-view-template">
        <div class="image-gallery-view-template">
 
-        <div class="image-gallery-panel-header">
+        <div class="image-gallery-header">
         <p>
         <button type="button" class="image-gallery-prev-button">Previous</button>
         <input type="input" class="image-gallery-current-page" />
         </div>
 
         <div>
-            <% for (page in model.pages) { %>
-                <p>page.url</p>
+            <% for(var i=0; i < model.data.length; i++) { %>
+                <p class="image-gallery-page-container"><%= model.data[i] %></p>
             <% }; %>
        </div>