craftingguide/website
1
0
Fork 0
Code Pull Requests Actions Activity

Use new item picker for inventory manipulations

Browse Source
This commit is contained in:
Andrew Miner
2015-04-06 13:34:18 -07:00
parent 99d486f33b
commit 8aaf82db02
10 changed files with 86 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/coffee/controllers/craft_page_controller.coffee
+2 -1
View File
@@ -31,6 +31,7 @@ module.exports = class CraftPageController extends PageController
super options
@imageLoader = options.imageLoader
@modPack = options.modPack
@storage = options.storage
# Event Methods ################################################################################
@@ -56,6 +57,7 @@ module.exports = class CraftPageController extends PageController
editable: true
icon: '/images/fishing_rod.png'
imageLoader: @imageLoader
isAcceptable: (item)-> item.isCraftable
model: @model.plan.want
modPack: @model.modPack
onChange: => @_updateLocation()
@@ -67,7 +69,6 @@ module.exports = class CraftPageController extends PageController
model: @model.plan.have
modPack: @model.modPack
onChange: => @_saveHaveInventory()
nameFinder: new NameFinder @model.modPack, includeGatherable:true
title: 'Items you have'
@needController = @addChild InventoryController, '.need',
src/coffee/controllers/inventory_controller.coffee
+13 -69
View File
@@ -6,12 +6,13 @@ All rights reserved.
###
BaseController = require './base_controller'
ImageLoader = require './image_loader'
ItemSelectorController = require './item_selector_controller'
NameFinder = require '../models/name_finder'
StackController = require './stack_controller'
{Duration} = require '../constants'
{Event} = require '../constants'
{Key} = require '../constants'
ImageLoader = require './image_loader'
NameFinder = require '../models/name_finder'
StackController = require './stack_controller'
########################################################################################################################
@@ -29,8 +30,8 @@ module.exports = class InventoryController extends BaseController
@editable = options.editable ?= true
@icon = options.icon ?= '/images/chest_front.png'
@imageLoader = options.imageLoader
@isAcceptable = options.isAcceptable ?= null
@modPack = options.modPack
@nameFinder = options.nameFinder ?= new NameFinder options.modPack
@onChange = options.onChange ?= -> # do nothing
@title = options.title ?= 'Inventory'
@@ -43,59 +44,25 @@ module.exports = class InventoryController extends BaseController
# Event Methods ################################################################################
onAddButtonClicked: ->
if @$nameField.val().trim().length is 0
@$nameField.focus()
return
item = @modPack.findItemByName @$nameField.val()
return unless item?
@model.add item.slug, 1
@$nameField.val ''
@$scrollbox.scrollTop @$scrollbox.prop 'scrollHeight'
@$nameField.autocomplete 'close'
@onChange()
onClearButtonClicked: ->
@model.clear()
@onChange()
onItemSelected: ->
func = =>
@onNameFieldChanged()
@onAddButtonClicked()
@$nameField.blur()
setTimeout func, 10 # needed to allow the autocomplete to finish
return true
onNameFieldBlur: ->
item = @modPack.findItemByName @$nameField.val()
@$nameField.val if item? then item.name else ''
@onNameFieldChanged()
onNameFieldChanged: ->
@_refreshButtonState()
onNameFieldFocused: ->
@$nameField.val ''
@$nameField.autocomplete 'search'
onNameFieldKeyUp: (event)->
if event.which is Key.Return
@onAddButtonClicked()
onItemChosen: (itemSlug)->
@model.add itemSlug, 1
@onChange()
# BaseController Overrides #####################################################################
onDidRender: ->
@$addButton = @$('button[name="add"]')
@selector = @addChild ItemSelectorController, '.view__item_selector',
isAcceptable: @isAcceptable
modPack: @modPack,
onChoseItem: (itemSlug)=> @onItemChosen(itemSlug)
@$clearButton = @$('button[name="clear"]')
@$icon = @$('.icon')
@$editPanel = @$('.edit')
@$nameField = @$('input[name="name"]')
@$scrollbox = @$('.scrollbox')
@$table = @$('table')
@$toolbar = @$('.toolbar')
@@ -118,7 +85,6 @@ module.exports = class InventoryController extends BaseController
@$title.html @title
@_refreshStacks()
@_refreshNameAutocomplete()
@_refreshButtonState()
super
@@ -127,35 +93,13 @@ module.exports = class InventoryController extends BaseController
events: ->
return _.extend super,
'blur input[name="name"]': 'onNameFieldBlur'
'click button[name="add"]': 'onAddButtonClicked'
'click button[name="clear"]': 'onClearButtonClicked'
'focus input[name="name"]': 'onNameFieldFocused'
'input input[name="name"]': 'onNameFieldChanged'
'keyup input[name="name"]': 'onNameFieldKeyUp'
# Private Methods ##############################################################################
_refreshButtonState: ->
if @model.isEmpty then @$clearButton.attr('disabled', 'disabled') else @$clearButton.removeAttr('disabled')
noText = @$nameField.val().trim().length is 0
itemValid = @modPack.findItemByName(@$nameField.val())?
disable = not (itemValid or noText)
if disable then @$addButton.attr('disabled', 'disabled') else @$addButton.removeAttr('disabled')
_refreshNameAutocomplete: ->
onChanged = => @onNameFieldChanged()
onSelected = => @onItemSelected()
@$nameField.autocomplete
source: (request, callback)=> callback @nameFinder.search request.term
delay: 0
minLength: 0
change: onChanged
close: onChanged
select: onSelected
_refreshStacks: ->
@_stackControllers ?= []
index = 0
src/coffee/controllers/item_selector_controller.coffee
+9 -1
View File
@@ -18,7 +18,8 @@ module.exports = class ItemSelectorController extends BaseController
constructor: (options)->
if not options.modPack? then throw new Error 'options.modPack is required'
options.model ?= new ItemSelector {}, modPack:options.modPack
options.isAcceptable ?= null
options.model ?= new ItemSelector {}, modPack:options.modPack, isAcceptable:options.isAcceptable
options.onChoseItem ?= (item)-> # do nothing
options.templateName = 'item_selector'
super options
@@ -66,6 +67,7 @@ module.exports = class ItemSelectorController extends BaseController
@$popup.on Event.click, (event)=> @onPopupClicked(event)
@$popup.removeClass 'hiding'
@$hintField.off 'keyup input'
@$hintField.on 'keyup', (event)=> @onHintKeyPress(event)
@$hintField.on 'input', (event)=> @onHintChanged(event)
@@ -111,6 +113,11 @@ module.exports = class ItemSelectorController extends BaseController
@_refreshResults()
super
render: ->
$buttonContent = @$el.html()
super
@$el.html $buttonContent
# Backbone.View Overrides ######################################################################
events: ->
@@ -134,6 +141,7 @@ module.exports = class ItemSelectorController extends BaseController
@$popup.one Event.transitionEnd, =>
@$screen.css 'display', 'none'
@$popup.detach()
@model.hint = ''
_refreshResults: ->
index = 0
src/coffee/main.coffee
+6 -2
View File
@@ -43,7 +43,9 @@ client.onStatusChanged = (c, oldStatus, newStatus)->
logger.info "Crafting Guide server status changed from #{oldStatus} to #{newStatus}"
client.trigger 'change:status', client, oldStatus, newStatus
client.trigger 'change', client
client.checkStatus()
# Disabled until required by some feature -- andrewminer 2015-04-06
# client.checkStatus()
global.router = new CraftingGuideRouter client:client
global.util = require 'util'
@@ -53,7 +55,9 @@ global.markdown = global.markdown.markdown
global.feedbackController = new FeedbackController el:'.view__feedback'
feedbackController.render()
global.router.loadCurrentUser()
# Disabled until required by some feature. -- andrewminer 2015-04-06
# global.router.loadCurrentUser()
global.router.loadDefaultModPack()
logger.info -> "CraftingGuide is ready"
src/coffee/models/item_selector.coffee
+9 -4
View File
@@ -14,9 +14,10 @@ module.exports = class ItemSelector extends BaseModel
constructor: (attributes={}, options={})->
if not options.modPack? then throw new Error 'options.modPack is required'
options.isAcceptable ?= (itemSlug)-> return true # accept everything by default
super attributes, options
@_isAcceptable = options.isAcceptable
@_maxResults = 100
@_minHintLength = 3
@_modPack = options.modPack
@@ -46,7 +47,7 @@ module.exports = class ItemSelector extends BaseModel
# Private Methods ##############################################################################
_isMatch: (name)->
_isMatch: (name, itemSlug)->
hintIndex = 0
hintLetter = @_hint[hintIndex]
name = name.toLowerCase()
@@ -54,7 +55,10 @@ module.exports = class ItemSelector extends BaseModel
for nameIndex in [0...name.length] by 1
if name.charAt(nameIndex) is hintLetter
hintIndex += 1
return true if hintIndex is @_hint.length
if hintIndex is @_hint.length
item = @_modPack.findItem itemSlug
return false unless item?
return @_isAcceptable item
hintLetter = @_hint[hintIndex]
return false
@@ -68,11 +72,12 @@ module.exports = class ItemSelector extends BaseModel
if @_hint.length >= @_minHintLength
@_modPack.eachMod (mod)=>
return if count >= @_maxResults
return unless mod.enabled
mod.eachName (name, itemSlug)=>
return if count >= @_maxResults
if @_isMatch name
if @_isMatch name, itemSlug
if itemSlug.isQualified
newResults[itemSlug] = itemSlug
count += 1
src/jade/includes/_header.jade
+1 -1
View File
@@ -30,4 +30,4 @@
p Craft
.dot
.view__item_selector
.view__item_selector: p.placeholder find an item...
src/jade/templates/inventory.jade
+1 -4
View File
@@ -13,9 +13,6 @@
.scrollbox
table
tr.edit.hideable.hidden
td.quantity
td.icon
td.name(width="*"): input(name="name")
td.action: button(name="add") add
td.name(colspan="4", width="*"): .view__item_selector: p.button-label add an item...
.toolbar.hideable.hidden
button(name="clear") clear
src/scss/templates/inventory.scss
+12
View File
@@ -31,6 +31,18 @@ All rights reserved.
border-top: 1px solid $color-gray-light;
}
.view__item_selector {
height: 2.5em; width: 80%;
background: $color-gray-faint;
margin: 0 auto;
transition: background $animate-normal;
&:hover {
background: $color-background-panel;
}
}
button[name="clear"] {
position: absolute; bottom: 0.5em; right: 0.5em;
}
src/scss/templates/item_selector.scss
+11 -1
View File
@@ -12,14 +12,24 @@ All rights reserved.
cursor: pointer;
padding: 0 0.75em;
p.placeholder {
p {
position: relative; top: 50%; width: 100%;
@include transform(translateY(-50%));
&.placeholder {
color: $color-gray-medium;
font-family: $font-family-input;
font-size: $font-size-normal;
}
&.button-label {
color: $color-active;
font-family: $font-family-normal;
font-size: $font-size-normal;
font-weight: bold;
text-align: center;
}
}
}
.view__item_selector_popup {
src/scss/templates/item_selector_element.scss
+2 -2
View File
@@ -6,8 +6,8 @@ All rights reserved.
*/
.view__item_selector_element {
height: 3.6em;
padding: 0.3em 1em;
height: 4.0em;
padding: 0.2em 1em;
clear: both;
transition: background $animate-fast, color $animate-fast;