Display images for each item referenced

This commit is contained in:
Andrew Miner
2015-01-04 01:01:00 -08:00
parent fc97854718
commit 150e85bb49
14 changed files with 147 additions and 34 deletions
+2
View File
@@ -44,6 +44,8 @@ module.exports = (grunt)->
copy:
data:
files: [expand:true, cwd:'./src/data', src:'**/*.json', dest:'./dist/data']
data_images:
files: [expand:true, cwd:'./src/data', src:'**/*.png', dest:'./dist/data']
fonts:
files: [expand:true, cwd:'./src/fonts', src:'**/*.ttf', dest:'./dist/fonts']
images:
-15
View File
@@ -7,17 +7,6 @@ All rights reserved.
.view__crafting_table {
.quantity {
border-radius: 0.75em;
background: $color-ice;
color: $color-table-background;
display: inline-block;
text-align: center;
min-width: 3em;
margin-right: 0.5em;
padding: 0 0.5em;
}
.recipe_selector {
background: $color-table-background;
padding: 1em;
@@ -39,10 +28,6 @@ All rights reserved.
margin-bottom: 0.5em;
}
li {
margin: 0.25em 0;
}
table { background: $color-table-background; width: 100%; }
td {
+1
View File
@@ -7,3 +7,4 @@ All rights reserved.
@import 'crafting_table';
@import 'mod_pack';
@import 'stack';
+30
View File
@@ -0,0 +1,30 @@
/*
Crafting Guide - stack.scss
Copyright (c) 2014 by Redwood Labs
All rights reserved.
*/
.view__stack {
position: relative; width: 100%; height: 1.8em;
.quantity {
border-radius: 0.75em;
background: $color-ice;
color: $color-table-background;
display: inline-block;
font-size: $font-size-small;
text-align: center;
min-width: 3em;
margin-right: 0.5em;
padding: 0 0.5em;
}
.name {
padding-right: 2.4em;
}
img {
position: absolute; top: 0; right: 0; height: 1.6em; width: 1.6em;
}
}
+4 -4
View File
@@ -244,7 +244,7 @@
"tools": "Crafting Table"
}, {
"output": "Charcoal",
"input": ["{furnace fuel}", "Oak Log"],
"input": ["{furnace fuel}", "Oak Wood"],
"tools": "Furnace"
}, {
"output": "Charcoal",
@@ -816,7 +816,7 @@
"tools": "Crafting Table"
}, {
"output": [[8, "Magenta Stained Glass"]],
"input": [[8, "Glass"], "Magenta"],
"input": [[8, "Glass"], "Magenta Dye"],
"tools": "Crafting Table"
}, {
"output": [[16, "Magenta Stained Glass Pane"]],
@@ -844,7 +844,7 @@
"tools": "Cow"
}, {
"output": "Minecart",
"input": [[5, "Iron"]],
"input": [[5, "Iron Ingot"]],
"tools": "Crafting Table"
}, {
"output": "Minecart with Chest",
@@ -901,7 +901,7 @@
"tools": "Crafting Table"
}, {
"output": [[4, "Oak Wood Planks"]],
"input": "Oak Log"
"input": "Oak Wood"
}, {
"output": [[6, "Oak Wood Slab"]],
"input": [[3, "Oak Wood Planks"]],
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

+2
View File
@@ -31,6 +31,8 @@ Event.load.failed = 'load:failed' # controller, error message
Event.load.finished = 'load:finished' # controller
Event.remove = 'remove' # collection, item...
exports.ImageUrl = _.template "/data/<%= modSlug %>/images/<%= itemSlug %>.png"
exports.Key = Key = {}
Key.Return = 13
@@ -10,6 +10,7 @@ BaseController = require './base_controller'
{Event} = require '../constants'
InventoryParser = require '../models/inventory_parser'
{Key} = require '../constants'
StackController = require './stack_controller'
url = require 'url'
{UrlParam} = require '../constants'
@@ -23,6 +24,7 @@ module.exports = class CraftingTableController extends BaseController
super options
@_parser = new InventoryParser
@_resetStackControllers()
@model.modPack.on Event.change, => @onModPackChanged()
@@ -99,16 +101,17 @@ module.exports = class CraftingTableController extends BaseController
@$makeList.empty()
@$resultList.empty()
makeController = (name, stack)=>
controller = new StackController model:stack, modPack:@model.modPack
controller.render()
this["$#{name}List"].append controller.$el
this["_#{name}Controllers"].push controller
if @model.plan?
@model.plan.need.each (stack)=>
name = @model.modPack.findName stack.itemSlug
@$needList.append "<li><span class='quantity'>#{stack.quantity}</span> #{name}</li>"
@model.plan.make.each (stack)=>
name = @model.modPack.findName stack.itemSlug
@$makeList.append "<li><span class='quantity'>#{stack.quantity}</span> #{name}</li>"
@model.plan.result.each (stack)=>
name = @model.modPack.findName stack.itemSlug
@$resultList.append "<li><span class='quantity'>#{stack.quantity}</span> #{name}</li>"
@_resetStackControllers()
@model.plan.need.each (stack)=> makeController 'need', stack
@model.plan.make.each (stack)=> makeController 'make', stack
@model.plan.result.each (stack)=> makeController 'result', stack
super
@@ -133,6 +136,11 @@ module.exports = class CraftingTableController extends BaseController
@model.craft()
@refresh()
_resetStackControllers: ->
@_needControllers = []
@_makeControllers = []
@_resultControllers = []
_updateNameAutocomplete: ->
onChanged = => @onNameFieldChanged()
@@ -1,8 +1,8 @@
###
# Crafting Guide - mod_version_controller.coffee
#
# Copyright (c) 2014 by Redwood Labs
# All rights reserved.
Crafting Guide - mod_version_controller.coffee
Copyright (c) 2014 by Redwood Labs
All rights reserved.
###
BaseController = require './base_controller'
@@ -0,0 +1,71 @@
###
Crafting Guide - stack_controller.coffee
Copyright (c) 2014 by Redwood Labs
All rights reserved.
###
BaseController = require './base_controller'
{ImageUrl} = require '../constants'
########################################################################################################################
module.exports = class StackController extends BaseController
constructor: (options={})->
if not options.model? then throw new Error 'options.model is required'
if not options.modPack? then throw new Error 'options.modPack is required'
options.templateName = 'stack'
super options
@modPack = options.modPack
@_loadImage()
# Event Methods ################################################################################
onImageLoaded: ->
return if @_image.loaded
logger.trace "#{@constructor.name}.onImageLoaded(#{@_image.src})"
@_image.loaded = true
@$image.attr 'src', @_image.src
# BaseController Overrides #####################################################################
onDidRender: ->
@$image = @$('img')
@$nameField = @$('.name')
@$quantityField = @$('.quantity')
super
refresh: ->
{itemName} = @_gatherData()
@$nameField.html itemName
@$quantityField.html @model.quantity
@$image.attr 'src', (if @_image?.loaded then @_image.src else '/images/unknown.png')
super
# Private Methods ##############################################################################
_gatherData: ->
itemSlug = @model.itemSlug
item = @modPack.findItem @model.itemSlug
if item?
itemName = item.name
modSlug = item.modVersion.slug
else
itemName = @modPack.findName @model.itemSlug
modSlug = 'minecraft'
return itemName:itemName, itemSlug:itemSlug, modSlug:modSlug
_loadImage: ->
{itemSlug, modSlug} = @_gatherData()
url = ImageUrl(modSlug:modSlug, itemSlug:itemSlug)
return if @$image?.attr('src').indexOf(url) is -1
@_image = new Image()
@_image.loaded = false
@_image.onload = => @onImageLoaded()
@_image.src = url
logger.verbose "loading image: #{url}"
+1
View File
@@ -17,6 +17,7 @@ module.exports = class Item extends BaseModel
if not attributes.name? then throw new Error 'attributes.name is required'
attributes.isGatherable ?= false
attributes.modVersion ?= null
attributes.recipes ?= []
attributes.slug ?= _.slugify attributes.name
attributes.stackSize ?= Item.DEFAULT_STACK_SIZE
+3 -1
View File
@@ -17,9 +17,10 @@ module.exports = class ModVersion extends BaseModel
if _.isEmpty(attributes.version) then throw new Error 'version cannot be empty'
attributes.description ?= ''
attributes.items ?= {}
attributes.enabled ?= attributes.name in RequiredMods
attributes.items ?= {}
attributes.names ?= {}
attributes.slug ?= _.slugify attributes.name
super attributes, options
# Public Methods ###############################################################################
@@ -27,6 +28,7 @@ module.exports = class ModVersion extends BaseModel
addItem: (item)->
if @items[item.slug]? then throw new Error "duplicate item for #{item.slug}"
@items[item.slug] = item
item.modVersion = this
return this
compareTo: (that)->
+1 -1
View File
@@ -12,7 +12,7 @@ _.mixin
result = text.toLowerCase()
result = result.replace /[^a-zA-Z0-9_]/g, '_'
result = result.replace /_+/, '_'
result = result.replace /__+/, '_'
result = result.replace /_$/, ''
result = result.replace /^_/, ''
return result
+11
View File
@@ -0,0 +1,11 @@
//-
//- Crafting Guide - stack.jade
//-
//- Copyright (c) 2014 by Redwood Labs
//- All rights reserved.
//-
li.view__stack
p.quantity
a.name: p
img(src='')