complex-view.js

  $(document).ready(function(){
    $('header.collection').affix();
    
    function Page(){
      var self = this;
      $.extend(self, new Model());
      
      self.fileCount = 0;
      self.fileCounter = 0;
      
      self.counter = ko.observable(new Counter('products'));
      self.products = ko.observableArray([]);
      self.categoryFilter = ko.observable(new CategoryFilter(self));
      self.selectedCategory = ko.computed(function(){
        return self.categoryFilter().selected_category();
      });

      self.add_product = function(){
        $.post_json('/admin/products', {
          category_id: self.selectedCategory() && self.selectedCategory().id()
        }).done(function(data){
          var product = new Product(data, self);  
          self.products.unshift(product);
        });
      };
      
      self.remove_product = function(){
        var product = this;
        $.delete_json('/admin/products/' + product.id()).done(function(){
          self.products.remove(product);
          self.test_excluded();
          $('.tiled').trigger('clear');
        });
      };
      
      self.remove_excluded = function(){
        $.each(self.products(), function(index, product){
          if(!product.excluded()) return;
          $.delete_json('/admin/products/' + product.id()).done(function(){
            self.products.remove(product);
            self.test_excluded();
          });
        });
      };
      
      self.is_clipboard_empty = ko.observable(true);
      self.clipboard = ko.observable({});
      
      self.copy_to_clipboard = function(){
        var product = this;
        self.clipboard(product.getData());
        self.is_clipboard_empty(false);
        console.log('clipboard', self.clipboard());
      };
      
      self.paste = function(){
        var product = this;
        var data = self.clipboard();
        product.setData({
          id: product.id(),
          title: data.title,
          article: data.article,
          brand: data.brand,
          category_title: data.category_title,
          price: data.price,
          description: data.description,
        });
        
        product.changed(true);
      };
      
      self.paste_title = function(){ self.title(self.clipboard().title); };
      self.paste_article = function(){ self.article(self.clipboard().article); };
      self.paste_brand = function(){ self.brand(self.clipboard().brand); };
      self.paste_price = function(){ self.price(self.clipboard().price); };
      self.paste_category_title = function(){
        self.category_title(self.clipboard().category_title); };
      this.paste_description = function(){
        self.description(self.clipboard().description); };
      
      self.clear_clipboard = function(){
        self.clipboard({});
        self.is_clipboard_empty(true);
      };
      
      self.has_excluded = ko.observable(false);
      self.test_excluded = function(){
        var count = 0;
        $.each(self.products(), function(index, product){
          if(product.excluded()){ ++count; };
        });
        self.has_excluded(count != 0);
      };
      
      self.uploader = new Uploader('#uploader', {before: function(){
        $('.bar').css('width', '0%');
        $('.progress').show();
      },progress: function(e, data){
        var progress = parseInt(data.loaded / data.total * 90, 10);
        $('.bar').css('width', '' + progress + '%');
      },after: function(){
        $('.bar').css('width', '100%');
        $('.progress').fadeOut(3000);
      }});
      
      self.multiupload = function(){
        self.uploader.upload('photos', function(e, data){
          var photo_data = data.result;
          $.post_json('products', {
            category_id: self.selectedCategory() && self.selectedCategory().id()
          }).done(function(data){
            var product = new Product(data, self);
            var photo = new Photo(photo_data, product);
            photo.is_main(true);
            product.photos.push(photo);
            product.photo_id(photo.id());
            product.save();
            self.products.unshift(product);
          });
        });
      };
      
      self.upload = function(){
        product = this;
        self.uploader.upload('photos', function(e, data){
          var photo = new Photo(data.result, product);
          product.photos.push(photo);  
        });
      };
      
      self.upload_texture = function(){
        product = this;
        self.uploader.upload('textures', function(e, data){
          var texture = new Texture(data.result, product);
          product.textures.unshift(texture);
        });
      };
      
      self.index = 0;
    };
    
    var page = new Page();
    ko.applyBindings(page);
    
    var tiler = new Tiler({
      tile: function(callback, index){
        callback(index + 1);

        var category = page.categoryFilter().selected_category();
        var category_ids = [];

        (function collect_all(category, category_ids){
          if(!category){return};
          category_ids.push(category.id());
          $.each(category.children(), function(index, category){
            collect_all(category, category_ids)
          });
        })(category, category_ids);

        var keyword_query_text  = $('#filter-query').val().trim();
        if(keyword_query_text.length > 0)
          var keywords = ".*" + keyword_query_text + ".*";

        var query_params = {filter: {
            category_id: {'$in': category_ids},
            keywords: keywords,
        }, order_field: 'id', order_direction: 'desc'};
        
        page.counter().filter(query_params);
        page.counter().update();

        $.post_json('/iterators/products/' + index, query_params).done(function(data){
          var product = new Product(data, page);
          product.restore();
          page.products.push(product);
          $.pushOrInsertAt(page.products, index, product);
          $(window).scroll();
        }).fail(function(){
          //
        }).always(function(){
          // query string green/red highlighting
          if((page.products().length < 1) && $('#filter-query').val().trim().length > 0)
            $('#filter-query').css('background-color', '#fcc');
          if((page.products().length > 0) && $('#filter-query').val().trim().length > 0)
            $('#filter-query').css('background-color', '#cfc');
          if($('#filter-query').val().trim().length < 1)
            $('#filter-query').css('background-color', 'white');
        });
      },
      clear: function(){
        page.products([]);
      },
      init: function(){
      //
      }
    });
    
    $('.tiled').trigger('more');
  });