diff --git a/app/assets/javascripts/darkswarm/controllers/products/product_node_controller.js.coffee b/app/assets/javascripts/darkswarm/controllers/products/product_node_controller.js.coffee new file mode 100644 index 0000000000..4ec316e65f --- /dev/null +++ b/app/assets/javascripts/darkswarm/controllers/products/product_node_controller.js.coffee @@ -0,0 +1,9 @@ +Darkswarm.controller "ProductNodeCtrl", ($scope) -> + $scope.price = -> + if $scope.product.variants.length > 0 + prices = (v.price for v in $scope.product.variants) + Math.min.apply(null, prices) + else + $scope.product.price + + $scope.hasVariants = $scope.product.variants.length > 0 diff --git a/app/assets/javascripts/darkswarm/controllers/products_controller.js.coffee b/app/assets/javascripts/darkswarm/controllers/products_controller.js.coffee index 9ba11baa5b..735a80257b 100644 --- a/app/assets/javascripts/darkswarm/controllers/products_controller.js.coffee +++ b/app/assets/javascripts/darkswarm/controllers/products_controller.js.coffee @@ -2,7 +2,6 @@ Darkswarm.controller "ProductsCtrl", ($scope, $rootScope, Product, OrderCycle) - $scope.data = Product.data $scope.limit = 3 $scope.order_cycle = OrderCycle.order_cycle - Product.update() $scope.incrementLimit = -> if $scope.limit < $scope.data.products.length @@ -14,8 +13,3 @@ Darkswarm.controller "ProductsCtrl", ($scope, $rootScope, Product, OrderCycle) - e.preventDefault() $scope.productPrice = (product) -> - if product.variants.length > 0 - prices = (v.price for v in product.variants) - Math.min.apply(null, prices) - else - product.price diff --git a/app/assets/javascripts/darkswarm/services/product.js.coffee b/app/assets/javascripts/darkswarm/services/product.js.coffee index 89778b659c..ca31d5e9c0 100644 --- a/app/assets/javascripts/darkswarm/services/product.js.coffee +++ b/app/assets/javascripts/darkswarm/services/product.js.coffee @@ -1,12 +1,12 @@ Darkswarm.factory 'Product', ($resource) -> new class Product - data: { + constructor: -> + @update() + data: products: null loading: true - } + update: -> @data.products = $resource("/shop/products").query => @data.loading = false @data - all: -> - @data.products || @update() diff --git a/app/assets/stylesheets/darkswarm/product_table.css.sass b/app/assets/stylesheets/darkswarm/product_table.css.sass new file mode 100644 index 0000000000..9b0a7b4598 --- /dev/null +++ b/app/assets/stylesheets/darkswarm/product_table.css.sass @@ -0,0 +1,4 @@ +.product_table + .row + border: 1px solid black + padding: 8px inherit diff --git a/app/assets/stylesheets/darkswarm/shop.css.sass b/app/assets/stylesheets/darkswarm/shop.css.sass index 2107542594..03ba40eba1 100644 --- a/app/assets/stylesheets/darkswarm/shop.css.sass +++ b/app/assets/stylesheets/darkswarm/shop.css.sass @@ -82,63 +82,3 @@ product padding-top: 1em input.button.right float: left - table - table-layout: fixed - width: 100% - border-collapse: collapse - border: none - th - line-height: 50px - &.name - width: 330px - //&.notes - //width: 140px - &.variant - width: 180px - &.quantity, &.bulk, &.price - width: 90px - .notes - max-width: 300px - td, th - background: #fff - > span - min-width: 50px - display: block - tbody - border: 1px solid #cccccc - border-left: 0px - border-right: 0px - td - padding: 20px 0px - &.name - img - float: left - margin-right: 30px - @media all and (max-width: 768px) - margin-right: 1em - div - min-width: 150px - tr.product-description - display: none - - - // Responsive - @media all and (max-width: 768px) - td.notes, th.notes - display: none - img - width: 20px - height: auto - tr.product-description - display: table-row - td:empty - display: none - - - input[type=number] - width: 60px - margin: 0px - display: block - float: right - padding-top: 14px - diff --git a/app/views/shop/_product_master.html.haml b/app/views/shop/_product_master.html.haml new file mode 100644 index 0000000000..c335103d4e --- /dev/null +++ b/app/views/shop/_product_master.html.haml @@ -0,0 +1,43 @@ +.small-1.column + %span.bulk{"bo-if" => "product.group_buy"} bulk +   + +.small-5.columns + {{ product.name }} + ({{ product.master.options_text }}) + + +-# WITHOUT GROUP BUY +.small-5.columns{"bo-if" => "!product.group_buy"} + %input{type: :number, + min: 0, + "ofn-disable-scroll" => true, + max: "{{product.on_demand && 9999 || product.count_on_hand }}", + name: "variants[{{product.master.id}}]", + id: "variants_{{product.master.id}}", + "ng-model" => "product.quantity"} + {{ product.master.options_text }} + +-# WITH GROUP BUY +.small-2.columns{"bo-if" => "product.group_buy"} + %input{type: :number, + min: 0, + "ofn-disable-scroll" => true, + max: "{{product.on_demand && 9999 || product.count_on_hand }}", + name: "variants[{{product.master.id}}]", + id: "variants_{{product.master.id}}", + "ng-model" => "product.quantity"} + {{ product.master.options_text }} + (min) + +.small-3.columns{"bo-if" => "product.group_buy"} + %input{type: :number, + min: 0, + "ofn-disable-scroll" => true, + max: "{{product.on_demand && 9999 || product.count_on_hand }}", + name: "variant_attributes[{{product.master.id}}][max_quantity]", + "ng-model" => "product.max_quantity"} + (max) + +.small-1.column + {{ product.price | currency }} diff --git a/app/views/shop/_product_summary.html.haml b/app/views/shop/_product_summary.html.haml new file mode 100644 index 0000000000..8edb2e2536 --- /dev/null +++ b/app/views/shop/_product_summary.html.haml @@ -0,0 +1,12 @@ +.row{bindonce: true} + .small-1.column + %img{"bo-src" => "product.master.images[0].small_url"} + %img{name: "taxon icon here"} + .small-5.columns + %strong {{ product.name }} + .small-4.columns + {{ product.supplier.name }} + .small-1.columns + %span{"ng-if" => "hasVariants"} from + {{ price() | currency }} + diff --git a/app/views/shop/_product_variants.html.haml b/app/views/shop/_product_variants.html.haml new file mode 100644 index 0000000000..c915a55361 --- /dev/null +++ b/app/views/shop/_product_variants.html.haml @@ -0,0 +1,44 @@ +.row{bindonce: true, + "ng-repeat" => "variant in product.variants"} + .small-1.column + %span.bulk{"bo-if" => "product.group_buy"} bulk +   + + .small-5.columns + {{ variant.options_text }} + {{ variant.id }} + + -# WITHOUT GROUP BUY + .small-5.columns{"bo-if" => "!product.group_buy"} + %input{type: :number, + value: nil, + min: 0, + "ofn-disable-scroll" => true, + max: "{{variant.on_demand && 9999 || variant.count_on_hand }}", + name: "variants[{{variant.id}}]", id: "variants_{{variant.id}}", + "bo-model" => "variant.quantity"} + {{ variant.options_text }} + + -# WITH GROUP BUY + .small-2.columns{"bo-if" => "product.group_buy"} + %input{type: :number, + value: nil, + min: 0, + "ofn-disable-scroll" => true, + max: "{{variant.on_demand && 9999 || variant.count_on_hand }}", + name: "variants[{{variant.id}}]", id: "variants_{{variant.id}}", + "bo-model" => "variant.quantity"} + {{ variant.options_text }} + (min) + + .small-3.columns{"bo-if" => "product.group_buy"} + %input{type: :number, + min: 0, + "ofn-disable-scroll" => true, + max: "{{variant.on_demand && 9999 || variant.count_on_hand }}", + name: "variant_attributes[{{variant.id}}][max_quantity]", + "ng-model" => "variant.max_quantity"} + (max) + + .small-1.columns + {{ variant.price | currency }} diff --git a/app/views/shop/_products.html.haml b/app/views/shop/_products.html.haml index 7fa562acdf..0944fcae9d 100644 --- a/app/views/shop/_products.html.haml +++ b/app/views/shop/_products.html.haml @@ -11,19 +11,18 @@ .row .small-12.columns - .product_table + .product_table{bindonce: true} %product.row{"ng-controller" => "ProductNodeCtrl", "ng-repeat" => "product in data.products | filter:query | limitTo: limit track by product.id"} = render partial: "shop/product_summary" - .row{bindonce: true, "ng-if" => "hasVariants()"} + %div{"bo-if" => "hasVariants"} = render partial: "shop/product_variants" - .row{bindonce: true, "ng-if" => "!hasVariants()"} + .row{"bo-if" => "!hasVariants"} = render partial: "shop/product_master" - -#%table -#%thead -#%th.name Item diff --git a/app/views/shop/_variants.html.haml b/app/views/shop/_variants.html.haml new file mode 100644 index 0000000000..e69de29bb2 diff --git a/app/views/shop/products.rabl b/app/views/shop/products.rabl index c92a1afaa0..a7430fc08c 100644 --- a/app/views/shop/products.rabl +++ b/app/views/shop/products.rabl @@ -1,10 +1,6 @@ collection @products attributes :id, :name, :permalink, :count_on_hand, :on_demand, :group_buy -node :show_variants do - true -end - node do |product| { notes: strip_tags(product.notes),