Recipe component can show multiblock recipes

src/client/models/site/item_page.coffee

@@ -48,11 +48,8 @@ module.exports = class ItemPage extends Observable
         return @_findItemsWithMatchingRecipes (recipe)=>
             recipe.computeQuantityRequired @item
 
-    findMultiblockRecipes: ->
-        return (recipe for recipeId, recipe of @item.recipes when recipes.depth > 1)
-
     findRecipes: ->
-        return (recipe for recipeId, recipe of @item.recipes when recipe.depth is 1)
+        return (recipe for recipeId, recipe of @item.recipes)
 
     findSimilarItems: ->
         group = @mod.itemGroups[@item.groupName]

src/client/models/site/recipe_display.coffee

@@ -0,0 +1,109 @@
+#
+# Crafting Guide - recipe_display.coffee
+#
+# Copyright © 2014-2017 by Redwood Labs
+# All rights reserved.
+#
+
+_            = require "../../../common/underscore"
+c            = require "../../../common/constants"
+{Inventory}  = require("crafting-guide-common").models
+{Observable} = require("crafting-guide-common").util
+
+########################################################################################################################
+
+module.exports = class RecipeDisplay extends Observable
+
+    constructor: (options={})->
+        if not options.recipe? then throw new Error "options.recipe is required"
+        options.multiplier ?= 1
+        super
+
+        @_layerInventories = []
+
+        @recipe     = options.recipe
+        @multiplier = options.multiplier
+
+    # Class Methods ################################################################################
+    
+    @::RECIPE_TYPE =
+        CRAFTING_TABLE: "crafting_table"
+        MULTIBLOCK:     "multiblock"
+
+    @::ALL_RECIPE_TYPES = (value for key, value of @::RECIPE_TYPE)
+
+    # Properties ###################################################################################
+    
+    Object.defineProperties @prototype,
+
+        depth:
+            get: -> return @recipe.depth
+            set: -> throw new Error "depth cannot be assigned"
+
+        height:
+            get: -> return @recipe.height
+            set: -> throw new Error "height cannot be assigned"
+
+        multiplier:
+            get: -> return @_multiplier
+            set: (multiplier)->
+                if not _.isNumber(multiplier) then multiplier = 1
+                @triggerPropertyChange "multiplier", @_multiplier, multiplier
+
+        recipe:
+            get: -> return @_recipe
+            set: (recipe)->
+                return if recipe is @_recipe
+                if not recipe? then throw new Error "recipe is required"
+                if @_recipe? then throw new Error "recipe cannot be reassigned"
+                @_recipe = recipe
+                @_computeType()
+
+        tools:
+            get: -> return @recipe.tools
+            set: -> throw new Error "tools cannot be assigned"
+
+        type:
+            get: -> return @_type
+            set: -> throw new Error "type cannot be assigned"
+
+        width:
+            get: -> return @recipe.width
+            set: -> throw new Error "width cannot be assigned"
+
+    # Public Methods ###############################################################################
+    
+    getInputAt: (x, y, z)->
+        return @recipe.getInputAt x, y, z
+    
+    getInventory: (z)->
+        if not z?
+            return @_fullInventory ?= @_createFullInventory()
+        else
+            return @_layerInventories[z] ?= @_addLayerInventory z
+
+    # Private Methods ##############################################################################
+
+    _addLayerInventory: (z, inventory=null)->
+        inventory ?= new Inventory
+        for x in [0..@recipe.width]
+            for y in [0..@recipe.height]
+                stack = @recipe.getInputAt x, y, z
+                continue unless stack?
+                inventory.add stack.item, stack.quantity
+        return inventory
+    
+    _computeType: ->
+        if not @recipe?
+            type = null
+        else if @recipe.depth > 1
+            type = @RECIPE_TYPE.MULTIBLOCK
+        else
+            type = @RECIPE_TYPE.CRAFTING_TABLE
+        @triggerPropertyChange "type", @_type, type
+    
+    _createFullInventory: (inventory=null)->
+        inventory ?= new Inventory()
+        for z in [0..@recipe.depth]
+            @_addLayerInventory z, inventory
+        return inventory

src/client/site/common/recipe/crafting_table/crafting_table_controller.coffee

@@ -8,6 +8,7 @@
 BaseController         = require "../../../base_controller"
 CraftingGridController = require "../../crafting_grid/crafting_grid_controller"
 ItemDisplay            = require "../../../../models/site/item_display"
+RecipeDisplay          = require "../../../../models/site/recipe_display"
 SlotController         = require "../../slot/slot_controller"
 {StringBuilder}        = require("crafting-guide-common").util
 
@@ -24,21 +25,14 @@ module.exports = class CraftingTableController extends BaseController
 
         @_imageLoader = options.imageLoader
         @_modPack     = options.modPack
-        @_multiplier  = options.multiplier
         @_router      = options.router
 
     # BaseController Overrides #####################################################################
 
     onDidRender: ->
-        @_gridController = @addChild CraftingGridController, ".view__crafting_grid",
-            modPack:     @_modPack
-            imageLoader: @_imageLoader
-            router:      @_router
-
-        @_outputSlotController = @addChild SlotController, ".output .view__slot",
-            imageLoader: @_imageLoader
-            modPack:     @_modPack
-            router:      @_router
+        options = modPack:@_modPack, imageLoader:@_imageLoader, router:@_router
+        @_gridController = @addChild CraftingGridController, ".view__crafting_grid", options
+        @_outputSlotController = @addChild SlotController, ".output .view__slot", options
 
         @$multiplier     = @$(".multiplier")
         @$outputImg      = @$(".output img")
@@ -47,32 +41,19 @@ module.exports = class CraftingTableController extends BaseController
         @$toolContainer  = @$(".tool")
         super
 
+    onWillChangeModel: (oldModel, newModel)->
+        if not newModel? then throw new Error "model is required"
+        if newModel.constructor isnt RecipeDisplay then throw new Error "model must be a RecipeDisplay"
+        return super oldModel, newModel
+
     refresh: ->
-        @_gridController.model = @model
-        @_outputSlotController.model = @model?.output
+        @_gridController.model = @model.recipe
+        @_outputSlotController.model = @model?.recipe.output
 
         @_refreshMultiplier()
         @_refreshTools()
         super
 
-    # Property Methods #############################################################################
-
-    Object.defineProperties @prototype,
-        multiplier:
-            get: ->
-                @_multiplier ?= 1
-                return @_multiplier
-
-            set: (newMultiplier)->
-                oldMultiplier = @_multiplier
-                return if newMultiplier is oldMultiplier
-
-                @_multiplier = newMultiplier
-                @_refreshMultiplier()
-
-                @trigger "change:multiplier", this, oldMultiplier, newMultiplier
-                @trigger "change", this
-
     # Backbone.View Methods ########################################################################
 
     events: ->
@@ -82,8 +63,8 @@ module.exports = class CraftingTableController extends BaseController
     # Private Methods ##############################################################################
 
     _refreshMultiplier: ->
-        if @multiplier > 1
-            @$multiplier.html "x#{@multiplier}"
+        if @model.multiplier > 1
+            @$multiplier.html "x#{@model.multiplier}"
         else
             @$multiplier.html ""
 

src/client/site/common/recipe/multiblock_viewer/multiblock/multiblock_controller.coffee

@@ -5,8 +5,8 @@
 # All rights reserved.
 #
 
-BaseController = require "../../../base_controller"
-ItemDisplay    = require "../../../../models/site/item_display"
+BaseController = require "../../../../base_controller"
+ItemDisplay    = require "../../../../../models/site/item_display"
 
 ########################################################################################################################
 
@@ -28,7 +28,7 @@ module.exports = class MultiblockController extends BaseController
     constructor: (options={})->
         if not options.imageLoader? then throw new Error "options.imageLoader is required"
         if not options.modPack? then throw new Error "options.modPack is required"
-        options.templateName = "item_page/multiblock_viewer/multiblock"
+        options.templateName = "common/recipe/multiblock_viewer/multiblock"
         super options
 
         @_currentLayer = 0

src/client/site/common/recipe/multiblock_viewer/multiblock_viewer_controller.coffee

@@ -5,10 +5,10 @@
 # All rights reserved.
 #
 
-BaseController       = require "../../base_controller"
-InventoryController  = require "../../common/inventory/inventory_controller"
+BaseController       = require "../../../base_controller"
+InventoryController  = require "../../inventory/inventory_controller"
 MultiblockController = require "./multiblock/multiblock_controller"
-MultiblockDisplay    = require "../../../models/site/multiblock_display"
+RecipeDisplay        = require "../../../../models/site/recipe_display"
 
 ########################################################################################################################
 
@@ -18,7 +18,7 @@ module.exports = class MultiblockViewerController extends BaseController
         if not options.imageLoader? then throw new Error "options.imageLoader is required"
         if not options.modPack? then throw new Error "options.modPack is required"
         if not options.router? then throw new Error "options.router is required"
-        options.templateName = "item_page/multiblock_viewer"
+        options.templateName = "common/recipe/multiblock_viewer"
         super options
 
         @_imageLoader = options.imageLoader
@@ -51,22 +51,14 @@ module.exports = class MultiblockViewerController extends BaseController
     # BaseController Overrides #####################################################################
 
     onDidRender: ->
-        @completeInventoryController = @addChild InventoryController, ".view__inventory.complete",
-            editable:    false
-            imageLoader: @_imageLoader
-            modPack:     @_modPack
-            router:      @_router
+        baseOptions = imageLoader:@_imageLoader, modPack:@_modPack, router:@_router
 
-        @layerInventoryController = @addChild InventoryController, ".view__inventory.layer",
-            editable:    false
-            imageLoader: @_imageLoader
-            modPack:     @_modPack
-            router:      @_router
+        options = _.extend {editable:false}, baseOptions
+        @completeInventoryController = @addChild InventoryController, ".view__inventory.complete", options
+        @layerInventoryController = @addChild InventoryController, ".view__inventory.layer", options
 
-        @multiblockController = @addChild MultiblockController, ".view__multiblock",
-            imageLoader: @_imageLoader
-            modPack:     @_modPack
-            onHovering:  (itemDisplay)=> @onBlockHovered(itemDisplay)
+        options = _.extend {onHovering:(itemDisplay)=> @onBlockHovered(itemDisplay)}, baseOptions
+        @multiblockController = @addChild MultiblockController, ".view__multiblock", options
 
         @$backButton  = @$(".button.back")
         @$nextButton  = @$(".button.next")
@@ -75,13 +67,13 @@ module.exports = class MultiblockViewerController extends BaseController
         super
 
     onWillChangeModel: (oldModel, newModel)->
-        @_display = new MultiblockDisplay newModel
-        super oldModel, newModel
+        if not newModel? then throw new Error "model is required"
+        if newModel.constructor isnt RecipeDisplay then throw new Error "model must be a RecipeDisplay"
+        return super oldModel, newModel
 
     refresh: ->
-        if @model? and @_display?
-            @completeInventoryController.model = @_display.getInventory()
-            @layerInventoryController.model = @_display.getInventory @multiblockController.currentLayer
+        @completeInventoryController.model = @model.getInventory()
+        @layerInventoryController.model = @model.getInventory @multiblockController.currentLayer
         @multiblockController.model = @model
 
         if @multiblockController.hasBackLayer()

src/client/site/common/recipe/recipe_controller.coffee

@@ -7,6 +7,8 @@
 
 BaseController             = require "../../base_controller"
 CraftingTableController    = require "./crafting_table/crafting_table_controller"
+MultiblockViewerController = require "./multiblock_viewer/multiblock_viewer_controller"
+RecipeDisplay              = require "../../../models/site/recipe_display"
 
 ########################################################################################################################
 
@@ -21,73 +23,38 @@ module.exports = class RecipeController extends BaseController
 
         @_imageLoader = options.imageLoader
         @_modPack     = options.modPack
-        @_multiplier  = options.multiplier
         @_router      = options.router
 
-    # Class Members ################################################################################
-    
-    @::RECIPE_TYPE =
-        CRAFTING_TABLE:
-            css: "crafting_table"
-            Controller: CraftingTableController
-
-    @::ALL_RECIPE_TYPES = (value for key, value of @::RECIPE_TYPE)
-
-    # Properties ###################################################################################
-
-    Object.defineProperties @prototype,
-        multiplier:
-            get: ->
-                @_multiplier ?= 1
-                return @_multiplier
-
-            set: (newMultiplier)->
-                oldMultiplier = @_multiplier
-                return if newMultiplier is oldMultiplier
-
-                @_multiplier = newMultiplier
-
-                @trigger "change:multiplier", this, oldMultiplier, newMultiplier
-                @trigger "change", this
-
-        recipeType:
-            get: -> return @_recipeType
-            set: -> throw new Error "recipeType cannot be assigned"
-
     # BaseController Overrides #####################################################################
 
     onWillChangeModel: (oldModel, newModel)->
-        @_recomputeRecipeType(newModel)
+        if not newModel? then throw new Error "model is required"
+        if newModel.constructor isnt RecipeDisplay then throw new Error "model must be a RecipeDisplay"
         return super oldModel, newModel
 
     refresh: ->
+        return unless @model?
         @_refreshRecipeType()
+        super
 
     # Private Methods ##############################################################################
 
-    _recomputeRecipeType: (recipe)->
-        oldRecipeType = @_recipeType
-
-        if not recipe?
-            newRecipeType = null
-        else
-            newRecipeType = @RECIPE_TYPE.CRAFTING_TABLE
-
-        return unless newRecipeType isnt oldRecipeType
-
-        @_recipeType = newRecipeType
-        @trigger "change:recipeType", this, oldRecipeType, newRecipeType
+    _lookupControllerFor: (recipeType)->
+        if recipeType is RecipeDisplay::RECIPE_TYPE.CRAFTING_TABLE then return CraftingTableController
+        if recipeType is RecipeDisplay::RECIPE_TYPE.MULTIBLOCK then return MultiblockViewerController
 
     _refreshRecipeType: ->
-        return if @_renderedRecipeType is @recipeType
-        @_renderedRecipeType = @recipeType
+        return if @_renderedRecipeType is @model.type
+        @_renderedRecipeType = @model.type
 
         if @_typeController?
             @_typeController.remove()
             @_typeController = null
 
-        return unless @recipeType?
+        return unless @_renderedRecipeType?
 
-        @$el.append "<div class=\"view__#{@recipeType.css}\"></div>"
+        TypeController = @_lookupControllerFor @model.type
+
+        @$el.append "<div class=\"view__#{@model.type}\"></div>"
         options = imageLoader:@_imageLoader, model:@model, modPack:@_modPack, router:@_router
-        @_typeController = @addChild @recipeType.Controller, ".view__#{@recipeType.css}", options
+        @_typeController = @addChild TypeController, ".view__#{@model.type}", options

src/client/site/craft_page/step/step.jade

@@ -7,8 +7,6 @@
 
 .view__step
     h3
-    .main_content
-        .view__inventory
     .view__recipe
     .buttons
         a.button.tool: .bezel: p <span class="full">show plan for </span>tools

src/client/site/craft_page/step/step.scss

@@ -25,24 +25,7 @@
         margin-bottom: 1em;
     }
 
-    .main_content {
-        display: flex;
-
-        .view__inventory {
-            flex: 50%;
-            margin-left: $size-margin-large;
-
-            .buttons {
-                display: none;
-            }
-        }
-
-        .view__recipe {
-            flex: 50%;
-        }
-    }
-
-    .buttons {
+    & > .buttons {
         margin-top: $size-margin-large;
 
         opacity: 0;

src/client/site/craft_page/step/step_controller.coffee

@@ -5,11 +5,12 @@
 # All rights reserved.
 #
 
-BaseController      = require '../../base_controller'
+BaseController      = require "../../base_controller"
 {Inventory}         = require("crafting-guide-common").models
 {CraftingPlanStep}  = require("crafting-guide-common").crafting
-InventoryController = require '../../common/inventory/inventory_controller'
-RecipeController    = require '../../common/recipe/recipe_controller'
+InventoryController = require "../../common/inventory/inventory_controller"
+RecipeController    = require "../../common/recipe/recipe_controller"
+RecipeDisplay       = require "../../../models/site/recipe_display"
 
 
 ########################################################################################################################
@@ -19,9 +20,9 @@ module.exports = class StepController extends BaseController
     constructor: (options={})->
         if options.model?.constructor isnt CraftingPlanStep
             throw new Error "options.model must be a CraftingPlanStep"
-        if not options.modPack? then throw new Error 'options.modPack is required'
-        if not options.imageLoader? then throw new Error 'options.imageLoader is required'
-        options.templateName = 'craft_page/step'
+        if not options.modPack? then throw new Error "options.modPack is required"
+        if not options.imageLoader? then throw new Error "options.imageLoader is required"
+        options.templateName = "craft_page/step"
         super options
 
         @_imageLoader = options.imageLoader
@@ -36,57 +37,45 @@ module.exports = class StepController extends BaseController
     # Public Methods ###############################################################################
 
     markComplete: (targetInventory)->
-        @$el.addClass 'complete'
-        @$completeButton.addClass 'disabled'
+        @$el.addClass "complete"
+        @$completeButton.addClass "disabled"
         @model.completeInto targetInventory
 
     # Event Methods ################################################################################
 
     onCompleteButtonClicked: (event)->
-        return false if @$completeButton.hasClass 'disabled'
-        tracker.trackEvent c.tracking.category.craft, 'mark-complete', null, @model.count
+        return false if @$completeButton.hasClass "disabled"
+        tracker.trackEvent c.tracking.category.craft, "mark-complete", null, @model.count
         @onComplete this
 
     onShowToolPlan: (event)->
-        return false if @$toolButton.hasClass 'disabled'
-        tracker.trackEvent c.tracking.category.navigate, 'show-tool-plan', @$toolButton.attr 'target'
+        return false if @$toolButton.hasClass "disabled"
+        tracker.trackEvent c.tracking.category.navigate, "show-tool-plan", @$toolButton.attr "target"
         return true
 
     # BaseController Overrides #####################################################################
 
     onDidRender: ->
-        @inventoryController = @addChild InventoryController, '.view__inventory',
-            editable:    false
-            imageLoader: @_imageLoader
-            model:       @model.inputInventory
-            modPack:     @_modPack
-            router:      @_router
+        options = imageLoader:@_imageLoader, modPack:@_modPack, router:@_router
+        @recipeController = @addChild RecipeController, ".view__recipe", options
 
-        @recipeController = @addChild RecipeController, '.view__recipe',
-            imageLoader: @_imageLoader
-            model:       @model.recipe
-            modPack:     @_modPack
-            router:      @_router
-
-        @$completeButton  = @$('.button.complete')
-        @$header          = @$('h3')
-        @$toolButton      = @$('.button.tool')
-        @$toolButtonLabel = @$('.button.tool p')
+        @$completeButton  = @$(".button.complete")
+        @$header          = @$("h3")
+        @$toolButton      = @$(".button.tool")
+        @$toolButtonLabel = @$(".button.tool p")
         super
 
     onWillChangeModel: (oldModel, newModel)->
-        if not newModel? then throw new Error 'model cannot be null'
+        if not newModel? then throw new Error "model cannot be null"
         if @rendered
-            @$el.removeClass 'complete'
-            @$completeButton.removeClass 'disabled'
+            @$el.removeClass "complete"
+            @$completeButton.removeClass "disabled"
         return super
 
     refresh: ->
         @$header.html "#{@model.number}. #{@model.recipe.output.item.displayName}"
 
-        @inventoryController.model   = @model.inputInventory
-        @recipeController.model      = @model.recipe
-        @recipeController.multiplier = @model.count
+        @recipeController.model = new RecipeDisplay recipe:@model.recipe, multiplier:@model.count
 
         @_refreshCompleteButton()
         @_refreshToolButton()
@@ -97,8 +86,8 @@ module.exports = class StepController extends BaseController
 
     events: ->
         return _.extend super,
-            'click .button.complete': 'onCompleteButtonClicked'
-            'click .button.tool':     'onShowToolPlan'
+            "click .button.complete": "onCompleteButtonClicked"
+            "click .button.tool":     "onShowToolPlan"
 
     # Private Methods ##############################################################################
 
@@ -108,16 +97,16 @@ module.exports = class StepController extends BaseController
             inventory.add item
 
         inventoryText = inventory.toUrlString()
-        @$toolButton.attr 'href', "/craft/#{inventoryText}"
-        @$toolButton.attr 'target', inventoryText
+        @$toolButton.attr "href", "/craft/#{inventoryText}"
+        @$toolButton.attr "target", inventoryText
 
         if @canAddTools this
-            @$toolButton.removeClass 'disabled'
+            @$toolButton.removeClass "disabled"
         else
-            @$toolButton.addClass 'disabled'
+            @$toolButton.addClass "disabled"
 
     _refreshCompleteButton: ->
         if @canComplete this
-            @$completeButton.removeClass 'disabled'
+            @$completeButton.removeClass "disabled"
         else
-            @$completeButton.addClass 'disabled'
+            @$completeButton.addClass "disabled"

src/client/site/item_page/item_page.jade

@@ -24,11 +24,6 @@
 
         section.description.view__markdown_section
 
-        section.multiblock
-            h2 Multiblock Construction
-            .panel
-                .view__multiblock_viewer
-
         section.recipes
             h2 Recipes
             .panel

src/client/site/item_page/item_page_controller.coffee

@@ -11,9 +11,9 @@ ItemDisplay                = require "../../models/site/item_display"
 ItemGroupController        = require "../common/item_group/item_group_controller"
 ItemPage                   = require "../../models/site/item_page"
 MarkdownSectionController  = require "../common/markdown_section/markdown_section_controller"
-MultiblockViewerController = require "./multiblock_viewer/multiblock_viewer_controller"
 PageController             = require "../page_controller"
-RecipeDetailController     = require "./recipe_detail/recipe_detail_controller"
+RecipeController           = require "../common/recipe/recipe_controller"
+RecipeDisplay              = require "../../models/site/recipe_display"
 VideoController            = require "../common/video/video_controller"
 w                          = require "when"
 
@@ -79,7 +79,6 @@ module.exports = class ItemPageController extends PageController
 
     onDidRender: ->
         options                      = imageLoader:@_imageLoader, modPack:@_modPack, router:@_router, show:false
-        @_multiblockController       = @addChild MultiblockViewerController, '.view__multiblock_viewer', options
         @_similarItemsController     = @addChild ItemGroupController, '.view__item_group.similar', options
         @_usedAsToolToMakeController = @addChild ItemGroupController, '.view__item_group.usedAsToolToMake ', options
         @_usedToMakeController       = @addChild ItemGroupController, '.view__item_group.usedToMake', options
@@ -140,7 +139,6 @@ module.exports = class ItemPageController extends PageController
 
         @_refreshSourceMod()
         @_refreshDescription()
-        @_refreshMultiblock()
         @_refreshRecipes()
         @_refreshSimilarItems()
         @_refreshUsedAsToolToMake()
@@ -221,13 +219,6 @@ module.exports = class ItemPageController extends PageController
             @_descriptionController.model = @model.item.detail.description
             @_descriptionController.resetToDefaultState()
 
-    _refreshMultiblock: ->
-        if @model.item.isMultiblock
-            @_multiblockController.model = @model.item.getMultiblockRecipe()
-            @show @$multiblockSection
-        else
-            @hide @$multiblockSection
-
     _refreshRecipes: ->
         @_recipeControllers ?= []
         index = 0
@@ -239,16 +230,16 @@ module.exports = class ItemPageController extends PageController
             for recipe in recipes
                 controller = @_recipeControllers[index]
                 if not controller?
-                    controller = new RecipeDetailController
+                    controller = new RecipeController
                         imageLoader: @_imageLoader
                         modPack:     @_modPack
-                        model:       recipe
+                        model:       new RecipeDisplay recipe:recipe
                         router:      @_router
                     @_recipeControllers.push controller
                     @$recipeContainer.append controller.$el
                     controller.render()
                 else
-                    controller.model = recipe
+                    controller.model = new RecipeDisplay recipe:recipe
                 index++
 
             @show @$recipesSection