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

Replace jQuery animations with CSS animations

Browse Source
This commit is contained in:
Andrew Miner
2015-03-21 19:00:46 -07:00
parent 3d0908c421
commit 9956e64af0
32 changed files with 385 additions and 369 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/coffee/constants.coffee
+16 -5
View File
@@ -20,10 +20,10 @@ exports.DefaultMods =
thermal_expansion: { defaultVersion: '4.0.0B8-23' }
exports.Duration = Duration = {}
Duration.snap = 200
Duration.fast = Duration.snap * 2
Duration.normal = Duration.fast * 2
Duration.slow = Duration.normal * 2
Duration.snap = 100
Duration.fast = 200
Duration.normal = 400
Duration.slow = 1200
exports.Event = Event = {}
Event.add = 'add' # collection, item...
@@ -38,7 +38,18 @@ Event.request = 'request' # model
Event.route = 'route'
Event.sort = 'sort'
Event.sync = 'sync' # model, response
Event.transitionEnd = 'webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend'
Event.transitionEnd = (->
transitions =
'transition': 'transitionend',
'OTransition': 'oTransitionEnd',
'MSTransition': 'msTransitionEnd',
'MozTransition': 'transitionend',
'WebkitTransition': 'webkitTransitionEnd'
el = document.createElement 'fakeelement'
for styleName, eventName of transitions
return eventName if el.style[styleName]?
)()
exports.Key = Key = {}
Key.Return = 13
src/coffee/controllers/base_controller.coffee
+65 -12
View File
@@ -5,7 +5,8 @@ Copyright (c) 2014-2015 by Redwood Labs
All rights reserved.
###
views = require '../views'
views = require '../views'
{Event} = require '../constants'
########################################################################################################################
@@ -31,13 +32,31 @@ module.exports = class BaseController extends Backbone.View
options.parent = this
child = new Controller options
child.render()
child.render options
@_children.push child
return child
hide: (args...)->
{$el, callback} = @_resolveShowHideArgs args
$el.addClass 'hideable' unless $el.hasClass 'hideable'
if $el.hasClass('hiding') or $el.hasClass('hidden')
_.defer => callback this
else
$el.one Event.transitionEnd, =>
$el.addClass 'hidden'
$el.removeClass 'hiding'
callback this
$el.addClass 'hiding'
refresh: ->
logger.verbose => "#{this} refreshing"
remove: ->
@hide -> @$el.remove()
routeLinkClick: (event)->
event.preventDefault()
href = $(event.target).attr 'href'
@@ -45,6 +64,23 @@ module.exports = class BaseController extends Backbone.View
logger.info "Re-routing link to internal navigation: #{href}"
router.navigate href, trigger:true
show: (args...)->
{$el, callback} = @_resolveShowHideArgs args
$el.addClass 'hideable' unless $el.hasClass 'hideable'
if $el.hasClass('hiding') or $el.hasClass('hidden')
$el.one Event.transitionEnd, =>
callback this
$el.removeClass 'hiding'
$el.removeClass 'hidden'
else
_.defer => callback this
unrender: ->
@undelegateEvents()
@$el.empty()
# Event Methods ################################################################################
onDidModelChange: ->
@@ -68,7 +104,7 @@ module.exports = class BaseController extends Backbone.View
if newModel?.on?
@listenTo newModel, 'sync', (e)=> @onDidModelSync e
@listenTo newModel, 'change', (e)=> @onDidModelChange e
return true
return newModel
# Property Methods #############################################################################
@@ -77,8 +113,8 @@ module.exports = class BaseController extends Backbone.View
setModel: (newModel)->
return if @model is newModel
return unless @onWillChangeModel @_model, newModel
newModel = @onWillChangeModel @_model, newModel
@_model = newModel
@tryRefresh()
@@ -88,23 +124,27 @@ module.exports = class BaseController extends Backbone.View
return {}
render: (options={})->
options.force ?= false
options.show ?= true
return this unless not @_rendered or options.force
data = (@model?.toHash? and @model.toHash()) or @model or {}
if not @_template?
logger.error => "Default render called for #{@constructor.name} without a template"
return this
data = (@model?.toHash? and @model.toHash()) or @model or {}
logger.verbose => "#{this} rendering with data: #{data}"
$renderedEl = $($(@_template(data))[0])
@onWillRender()
$oldEl = @$el
$newEl = Backbone.$(@_template(data))
if $oldEl
$oldEl.replaceWith $newEl
$newEl.addClass $oldEl.attr 'class'
@hide()
@unrender()
@$el.append $renderedEl.children()
@$el.addClass $renderedEl.attr 'class'
@delegateEvents()
@show() if options.show
@setElement $newEl
@_rendered = true
@onDidRender()
@@ -121,6 +161,19 @@ module.exports = class BaseController extends Backbone.View
if templateName?
@_template = views[templateName]
_resolveShowHideArgs: (args)->
if args.length is 0
return $el:@$el, callback:->
else if args.length is 1
if _.isFunction args[0]
return $el:@$el, callback:args[0]
else
return $el:args[0], callback:->
else if args.length is 2
return $el:args[0], callback:args[1]
else
throw new Error "expected to get 0, 1, or 2 args"
_tryRefresh: ->
return unless @_rendered
@refresh()
src/coffee/controllers/browse_page_controller.coffee
+1 -2
View File
@@ -54,7 +54,6 @@ module.exports = class BrowsePageController extends PageController
while @_controllers.length > controllerIndex
controller = @_controllers.pop()
controller.$el.addClass 'removing'
controller.$el.one Event.transitionEnd -> controller.$el.remove()
controller.hide -> controller.$el.remove()
super
src/coffee/controllers/crafting_table_controller.coffee
+2 -2
View File
@@ -79,9 +79,9 @@ module.exports = class CraftingTableController extends BaseController
@$multiplier.html ''
if not (@model.hasSteps and global.feedbackController?)
@$problemControl.hide duration:Duration.snap
@$problemControl.addClass 'hidden'
else
@$problemControl.show duration:Duration.snap
@$problemControl.removeClass 'hidden'
super
src/coffee/controllers/feedback_controller.coffee
+2 -2
View File
@@ -49,9 +49,9 @@ module.exports = class FeedbackController extends BaseController
@model.send(message)
.then =>
@onToggle()
@$error.slideUp duration:Duration.normal
@$error.addClass 'hidden'
.catch (error)=>
@$error.slideDown duration:Duration.normal
@$error.removeClass 'hidden'
.finally =>
@$sendButton.removeAttr 'disabled'
src/coffee/controllers/inventory_controller.coffee
+10 -12
View File
@@ -120,12 +120,12 @@ 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'
'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 ##############################################################################
@@ -164,18 +164,16 @@ module.exports = class InventoryController extends BaseController
modPack: @modPack
onChange: @onChange
onRemove: if not @editable then null else (stack)=> @_removeStack(stack)
controller.render()
controller.$el.hide()
controller.$el.insertBefore $lastRow
controller.$el.slideDown duration:Duration.fast
@_stackControllers.push controller
controller.$el.insertBefore $lastRow
controller.render()
else
controller.model = stack
index += 1
while @_stackControllers.length > index
controller = @_stackControllers.pop()
controller.$el.fadeOut duration:Duration.fast, complete:-> @remove()
@_stackControllers.pop().remove()
_removeStack: (stack)->
@model.remove stack.itemSlug, stack.quantity
src/coffee/controllers/inventory_table_controller.coffee
+40 -26
View File
@@ -72,7 +72,7 @@ module.exports = class InventoryTableController extends BaseController
onNameFieldChanged: ->
item = @modPack.findItemByName @$nameField.val()
@_updateButtonState()
@_refreshButtonState()
onNameFieldFocused: ->
@$nameField.val ''
@@ -99,7 +99,7 @@ module.exports = class InventoryTableController extends BaseController
@$quantityField.removeClass 'error', Duration.normal
@$quantityField.removeClass 'error-new', Duration.normal
@_updateButtonState()
@_refreshButtonState()
onQuantityFieldFocused: ->
@$quantityField.val ''
@@ -125,22 +125,10 @@ module.exports = class InventoryTableController extends BaseController
if _.isEmpty(@$quantityField.val()) then @$quantityField.val '1'
@$table.find('tr:not(:last-child)').remove()
$lastRow = @$table.find 'tr:last-child'
@_stackControllers = []
@model.each (stack)=>
controller = new StackController
editable: @editable
imageLoader: @imageLoader
model: stack
modPack: @modPack
onRemove: if not @editable then null else (stack)=> @_removeStack(stack)
controller.render()
controller.$el.insertBefore $lastRow
@_stackControllers.push controller
@_updateNameAutocomplete()
@_updateButtonState()
@_refreshNameAutocomplete()
@_refreshButtonState()
@_refreshStacks()
super
@@ -160,10 +148,15 @@ module.exports = class InventoryTableController extends BaseController
# Private Methods ##############################################################################
_removeStack: (stack)->
@model.remove stack.itemSlug, stack.quantity
_refreshButtonState: ->
if @model.isEmpty then @$clearButton.attr('disabled', 'disabled') else @$clearButton.removeAttr('disabled')
_updateNameAutocomplete: ->
itemValid = @modPack.findItemByName(@$nameField.val())?
quantityValid = @$quantityField.val().match(InventoryTableController.ONLY_DIGITS)
disable = not (itemValid and quantityValid)
if disable then @$addButton.attr('disabled', 'disabled') else @$addButton.removeAttr('disabled')
_refreshNameAutocomplete: ->
onChanged = => @onNameFieldChanged()
onSelected = => @onItemSelected()
@@ -175,10 +168,31 @@ module.exports = class InventoryTableController extends BaseController
close: onChanged
select: onSelected
_updateButtonState: ->
if @model.isEmpty then @$clearButton.attr('disabled', 'disabled') else @$clearButton.removeAttr('disabled')
_refreshStacks: ->
@_stackControllers ?= []
index = 0
itemValid = @modPack.findItemByName(@$nameField.val())?
quantityValid = @$quantityField.val().match(InventoryTableController.ONLY_DIGITS)
disable = not (itemValid and quantityValid)
if disable then @$addButton.attr('disabled', 'disabled') else @$addButton.removeAttr('disabled')
$lastRow = @$table.find 'tr:last-child'
@model.each (stack)=>
controller = @_stackControllers[index]
if not controller?
controller = new StackController
editable: @editable
imageLoader: @imageLoader
model: stack
modPack: @modPack
onRemove: if not @editable then null else (stack)=> @_removeStack(stack)
@_stackControllers.push controller
controller.$el.insertBefore $lastRow
controller.render()
else
controller.model = stack
index += 1
while @_stackControllers.length > index
@_stackControllers.pop().remove()
_removeStack: (stack)->
@model.remove stack.itemSlug, stack.quantity
src/coffee/controllers/item_group_controller.coffee
+29 -30
View File
@@ -6,10 +6,10 @@ All rights reserved.
###
BaseController = require './base_controller'
{Duration} = require '../constants'
{Event} = require '../constants'
Item = require '../models/item'
ItemController = require './item_controller'
{Duration} = require '../constants'
{Event} = require '../constants'
########################################################################################################################
@@ -18,19 +18,15 @@ module.exports = class ItemGroupController 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.model ?= []
options.title ?= ''
options.templateName = 'item_group'
super options
@_delayStep = 20
@_imageLoader = options.imageLoader
@_itemControllers = []
@_modPack = options.modPack
@_title = options.title
Object.defineProperties this,
title: {get:@getTitle, set:@setTitle}
# Property Methods #############################################################################
getTitle: ->
@@ -40,6 +36,9 @@ module.exports = class ItemGroupController extends BaseController
@_title = title
@tryRefresh()
Object.defineProperties @prototype,
title: {get:@prototype.getTitle, set:@prototype.setTitle}
# BaseController Overrides #####################################################################
onDidRender: ->
@@ -47,37 +46,37 @@ module.exports = class ItemGroupController extends BaseController
@$items = @$('.panel')
super
onWillChangeModel: (oldModel, newModel)->
newModel ?= []
return super oldModel, newModel
refresh: ->
@$title.html @_title
@_refreshItems()
if @model.length > 0
@$title.html @_title
@_refreshItems()
@show()
else
@hide()
super
# Private Methods ##############################################################################
_createItemController: (item, delay)->
controller = new ItemController imageLoader:@_imageLoader, model:item, modPack:@_modPack
@_itemControllers.push controller
attachController = =>
controller.render()
@$items.append controller.$el
_.delay attachController, delay
_refreshItems: ->
@_itemControllers ?= []
controllerIndex = 0
delay = 0
if @model?
for item in @model
controller = @_itemControllers[controllerIndex]
if not controller?
@_createItemController item, delay
delay += @_delayStep
else
controller.model = item
controllerIndex += 1
for item in @model
controller = @_itemControllers[controllerIndex]
if not controller?
controller = new ItemController imageLoader:@_imageLoader, model:item, modPack:@_modPack
@_itemControllers.push controller
@$items.append controller.$el
controller.render()
else
controller.model = item
controllerIndex += 1
while @_itemControllers.length > controllerIndex
controller = @_itemControllers.pop()
controller.$el.slideUp duration:Duration.normal, complete:-> @remove()
@_itemControllers.pop().remove()
src/coffee/controllers/item_page_controller.coffee
+28 -51
View File
@@ -43,6 +43,7 @@ module.exports = class ItemPageController extends PageController
craftingPlanButtonClicked: ->
display = @modPack.findItemDisplay @model.item.slug
logger.debug "button clicked, going to: #{display.craftingUrl}"
router.navigate display.craftingUrl, trigger:true
return false
@@ -56,21 +57,13 @@ module.exports = class ItemPageController extends PageController
onDidRender: ->
@adsenseController = @addChild AdsenseController, '.view__adsense', model:'sidebar_skyscraper'
@_similarItemsController = @addChild ItemGroupController, '.similar .view__item_group',
imageLoader: @imageLoader
modPack: @modPack
@_usedAsToolToMakeController = @addChild ItemGroupController, '.usedAsToolToMake .view__item_group',
imageLoader: @imageLoader
modPack: @modPack
@_usedToMakeController = @addChild ItemGroupController, '.usedToMake .view__item_group',
imageLoader: @imageLoader
modPack: @modPack
options = imageLoader:@imageLoader, modPack:@modPack, show:false
@_similarItemsController = @addChild ItemGroupController, '.view__item_group.similar', options
@_usedAsToolToMakeController = @addChild ItemGroupController, '.view__item_group.usedAsToolToMake', options
@_usedToMakeController = @addChild ItemGroupController, '.view__item_group.usedToMake', options
@$byline = @$('.byline')
@$bylineLink = @$('.byline a')
@$craftingPlanButton = @$('button.craftingPlan')
@$descriptionPanel = @$('.description .panel')
@$descriptionSection = @$('.description')
@$name = @$('h1.name')
@@ -92,20 +85,18 @@ module.exports = class ItemPageController extends PageController
if @model.item?
display = @modPack.findItemDisplay @model.item.slug
@$craftingPlanButton.fadeIn duration:Duration.fast
@imageLoader.load display.iconUrl, @$titleImage
@$name.html display.itemName
if @model.item.officialUrl?
@$officialPageLink.attr 'href', @model.item.officialUrl
@$officialPageLink.fadeIn duration:Duration.normal
@show @$officialPageLink
else
@$officialPageLink.fadeOut duration:Duration.normal
@hide @$officialPageLink
@$el.slideDown duration:Duration.normal
@show()
else
@$craftingPlanButton.fadeOut duration:Duration.fast
@$el.slideUp duration:Duration.normal
@hide()
@_refreshByline()
@_refreshDescription()
@@ -121,10 +112,10 @@ module.exports = class ItemPageController extends PageController
events: ->
return _.extend super,
'click a.craftingPlan': 'routeLinkClick'
'click .byline a': 'routeLinkClick'
'click .markdown': 'routeLinkClick'
'click button.craftingPlan': 'craftingPlanButtonClicked'
'click a.craftingPlan': 'routeLinkClick'
'click .byline a': 'routeLinkClick'
'click .markdown': 'routeLinkClick'
'click button': 'craftingPlanButtonClicked'
# Private Methods ##############################################################################
@@ -133,25 +124,25 @@ module.exports = class ItemPageController extends PageController
if mod?.name?.length > 0
@$bylineLink.attr 'href', Url.mod modSlug:mod.slug
@$bylineLink.html mod.name
@$byline.fadeIn duration:Duration.fast
@show @$byline
else
@$byline.fadeOut duration:Duration.fast
@hide @$byline
_refreshDescription: ->
description = @model.compileDescription()
if description?
@$descriptionPanel.html description
@$descriptionSection.slideDown duration:Duration.normal
@show @$descriptionPanel
else
@$descriptionSection.slideUp duration:Duration.normal
@hide @$descriptionPanel
_refreshRecipes: ->
@_recipeControllers ?= []
index = 0
recipes = @model.findRecipes()
if recipes?
@$recipesSection.slideDown duration:Duration.normal
if recipes?.length > 0
@$recipesSectionTitle.html if recipes.length is 1 then 'Recipe' else 'Recipes'
for recipe in @model.findRecipes()
@@ -159,17 +150,18 @@ module.exports = class ItemPageController extends PageController
if not controller?
controller = new FullRecipeController imageLoader:@imageLoader, modPack:@modPack, model:recipe
@_recipeControllers.push controller
controller.render()
@$recipeContainer.append controller.$el
controller.render()
else
controller.model = recipe
index++
@show @$recipesSection
else
@$recipesSection.slideUp duration:Duration.normal
@hide @$recipesSection
while @_recipeControllers.length > index
controller = @_recipeControllers.pop()
controller.$el.slideUp duration:Duration.normal, complete:-> controller.$el.remove()
@_recipeControllers.pop().remove()
_refreshSimilarItems: ->
group = @model.item?.group
@@ -179,28 +171,13 @@ module.exports = class ItemPageController extends PageController
else
@_similarItemsController.model = null
if @_similarItemsController.model?
@$similarSection.slideDown duration:Duration.normal
else
@$similarSection.slideUp duration:Duration.normal
_refreshUsedAsToolToMake: ->
@_usedAsToolToMakeController.title = 'Used as Tool to Make'
@_usedAsToolToMakeController.model = @model.findToolForRecipes()
if @_usedAsToolToMakeController.model?
@$usedAsToolToMakeSection.slideDown duration:Duration.normal
else
@$usedAsToolToMakeSection.slideUp duration:Duration.normal
_refreshUsedToMake: ->
@_usedToMakeController.title = 'Used to Make'
@_usedToMakeController.model = @model.findComponentInItems()
if @_usedToMakeController.model?
@$usedToMakeSection.slideDown duration:Duration.normal
else
@$usedToMakeSection.slideUp duration:Duration.normal
_refreshVideos: ->
@_videoControllers ?= []
@@ -208,7 +185,6 @@ module.exports = class ItemPageController extends PageController
videos = @model?.item?.videos or []
if videos? and videos.length > 0
@$videosSection.slideDown duration:Duration.normal
@$videosSectionTitle.html if videos.length is 1 then 'Video' else 'Videos'
for video in videos
@@ -221,12 +197,13 @@ module.exports = class ItemPageController extends PageController
else
controller.model = video
index++
@show @$videosSection
else
@$videosSection.slideUp duration:Duration.normal
@hide @$videosSection
while @_videoControllers.length > index
controller = @_videoControllers.pop()
controller.$el.slideUp duration:Duration.normal, complete:-> controller.$el.remove()
@_videoControllers.pop().remove()
_resolveItemSlug: ->
return if @model.item?
src/coffee/controllers/mod_controller.coffee
+5 -9
View File
@@ -13,6 +13,7 @@ BaseController = require './base_controller'
module.exports = class ModController extends BaseController
constructor: (options={})->
if not options.model? then throw new Error 'options.model is required'
options.templateName = 'mod'
super options
@@ -26,15 +27,10 @@ module.exports = class ModController extends BaseController
super
refresh: ->
if @model?
@$el.removeClass 'empty'
@$link.attr 'href', Url.mod modSlug:@model.slug
@$logo.attr 'src', Url.modIcon modSlug:@model.slug
@$name.html @model.name
@$description.html @model.description
else
@$el.addClass 'empty'
@$link.attr 'href', Url.mod modSlug:@model.slug
@$logo.attr 'src', Url.modIcon modSlug:@model.slug
@$name.html @model.name
@$description.html @model.description
# Backbone.View Overrides ######################################################################
src/coffee/controllers/mod_page_controller.coffee
+56 -49
View File
@@ -34,9 +34,6 @@ module.exports = class ModPageController extends PageController
@_effectiveModVersion = null
@_groupControllers = []
Object.defineProperties this,
effectiveModVersion: {get:@_getEffectiveModVersion}
# Event Methods ################################################################################
onVersionChanged: ->
@@ -46,6 +43,21 @@ module.exports = class ModPageController extends PageController
if modVersion? then modVersion.fetch()
@refresh()
# Property Methods #############################################################################
getEffectiveModVersion: ->
return @_effectiveModVersion if @_effectiveModVersion?
return null unless @model?
modVersion = @model.activeModVersion
modVersion ?= @model.getModVersion Mod.Version.Latest
modVersion.fetch() if modVersion?
return modVersion
Object.defineProperties @prototype,
effectiveModVersion: {get:@prototype.getEffectiveModVersion}
# PageController Overrides #####################################################################
getTitle: ->
@@ -56,34 +68,35 @@ module.exports = class ModPageController extends PageController
onDidRender: ->
@adsenseController = @addChild AdsenseController, '.view__adsense', model:'sidebar_skyscraper'
@$name = @$('.name')
@$byline = @$('.byline p')
@$description = @$('.description p')
@$documentationLink = @$('.documentation')
@$downloadLink = @$('.download')
@$homePageLink = @$('.homePage')
@$groupContainer = @$('.itemGroups')
@$titleImage = @$('.titleImage img')
@$tutorialsSection = @$('.tutorials')
@$tutorialsContainer = @$('.tutorials .panel')
@$versionSelector = @$('select.version')
@$name = @$('.name')
@$byline = @$('.byline p')
@$description = @$('.description p')
@$documentationLink = @$('.documentation')
@$downloadLink = @$('.download')
@$homePageLink = @$('.homePage')
@$groupContainer = @$('.itemGroups')
@$titleImage = @$('.titleImage img')
@$titleImageContainer = @$('.titleImage')
@$tutorialsSection = @$('.tutorials')
@$tutorialsContainer = @$('.tutorials .panel')
@$versionSelector = @$('select.version')
super
refresh: ->
if @model?
@$name.html @model.name
if @model?.isLoaded and @effectiveModVersion?.isLoaded
@$byline.html "by #{@model.author}"
@$titleImage.attr 'src', Url.modIcon modSlug:@model.slug
@$description.html @model.description
@$name.html @model.name
@$titleImage.attr 'src', Url.modIcon modSlug:@model.slug
@$el.slideDown duration:Duration.normal
@show()
else
@$el.slideUp duration:Duration.normal
@hide()
@_refreshLink @$homePageLink, @model.homePageUrl
@_refreshLink @$documentationLink, @model.documentationUrl
@_refreshLink @$downloadLink, @model.downloadUrl
@_refreshLink @$homePageLink, @model?.homePageUrl
@_refreshLink @$documentationLink, @model?.documentationUrl
@_refreshLink @$downloadLink, @model?.downloadUrl
@_refreshItemGroups()
@_refreshTutorials()
@@ -97,33 +110,25 @@ module.exports = class ModPageController extends PageController
# Private Methods ##############################################################################
_getEffectiveModVersion: ->
return @_effectiveModVersion if @_effectiveModVersion?
return null unless @model?
modVersion = @model.activeModVersion
modVersion ?= @model.getModVersion Mod.Version.Latest
modVersion.fetch() if modVersion?
return modVersion
_refreshItemGroups: ->
@_groupControllers ?= []
groupIndex = 0
modVersion = @effectiveModVersion
if modVersion?
modVersion.eachGroup (group)=>
controller = @_groupControllers[groupIndex]
items = modVersion.allItemsInGroup group
if not controller?
title = if group is Item.Group.Other then 'Items' else group
controller = new ItemGroupController
imageLoader: @imageLoader
model: items
modPack: @modPack
title: title
controller.render()
title: if group is Item.Group.Other then 'Items' else group
@_groupControllers.push controller
@$groupContainer.append controller.$el
@_groupControllers[groupIndex] = controller
controller.render()
else
controller.modVersion = modVersion
controller.model = items
@@ -132,32 +137,28 @@ module.exports = class ModPageController extends PageController
while @_groupControllers.length > groupIndex + 1
controller = @_groupControllers.pop()
controller.$el.slideUp duration:Duration.normal, complete:-> @remove()
controller.hide -> controller.$el.remove()
_refreshLink: ($link, url)->
if url?
$link.slideDown duration:Duration.normal
$link.attr 'href', url
$link.removeClass 'hidden'
else
$link.slideUp duration:Duration.normal
$link.addClass 'hidden'
_refreshTutorials: ->
@_tutorialControllers ?= []
tutorials = @model.tutorials
index = 0
tutorials = @model.tutorials
if tutorials.length is 0
@$tutorialsSection.addClass 'hidden'
else
@$tutorialsSection.removeClass 'hidden'
index = 0
if tutorials.length > 0
for tutorial in tutorials
controller = @_tutorialControllers[index]
if not controller?
controller = new TutorialController model:tutorial
controller.render()
@$tutorialsContainer.append controller.$el
@_tutorialControllers.push controller
@$tutorialsContainer.append controller.$el
controller.render()
else
controller.model = model
@@ -165,12 +166,18 @@ module.exports = class ModPageController extends PageController
while @_tutorialControllers.length > index
controller = @_tutorialControllers.pop()
controller.$el.slideUp duration:Duration.normal, complete:-> @remove()
controller.hide -> controller.$el.remove()
@show @$tutorialsSection
else
@hide @tutorialsSection
_refreshVersions: ->
@$versionSelector.empty()
return unless @model?
@$versionSelector.removeClass 'hiding'
effectiveModVersion = @effectiveModVersion
versionCount = 0
@model.eachModVersion (modVersion)=>
src/coffee/controllers/mod_selector_controller.coffee
+1 -1
View File
@@ -1,5 +1,5 @@
###
Crafting Guide - mod_controller.coffee
Crafting Guide - mod_selector_controller.coffee
Copyright (c) 2014-2015 by Redwood Labs
All rights reserved.
src/coffee/controllers/recipe_step_controller.coffee
-25
View File
@@ -1,25 +0,0 @@
###
Crafting Guide - recipe_step_controller.coffee
Copyright (c) 2014-2015 by Redwood Labs
All rights reserved.
###
BaseController = require './base_controller'
########################################################################################################################
module.exports = class RecipeStepController 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 = 'recipe_step'
super options
# BaseController Overrides #####################################################################
onDidRender: ->
@$slotImages = (@$slots.push $(el) for el in @$('.table-slot img'))
@$output = @$('.output')
super
src/coffee/controllers/stack_controller.coffee
+3
View File
@@ -25,6 +25,7 @@ module.exports = class StackController extends BaseController
options.editable ?= false
options.onChange ?= -> # do nothing
options.onRemove ?= (stack)-> # do nothing
options.tagName = 'tr'
options.templateName = 'stack'
super options
@@ -95,6 +96,8 @@ module.exports = class StackController extends BaseController
super
refresh: ->
if not @model? then throw new Error "must have a model to render"
display = @modPack.findItemDisplay @model.itemSlug
@_imageLoader.load display.iconUrl, @$image
src/coffee/controllers/tutorial_page_controller.coffee
+35 -43
View File
@@ -53,64 +53,55 @@ module.exports = class TutorialPageController extends BaseController
refresh: ->
if @model? and @model.isLoaded
@$el.removeClass 'hidden'
@_refreshByline()
@_refreshOfficialUrl()
@_refreshSections()
@_refreshTitle()
@_refreshVideos()
@show()
else
@$el.addClass 'hidden'
@hide()
@_refreshByline()
@_refreshOfficialUrl()
@_refreshSections()
@_refreshTitle()
@_refreshVideos()
super
# Private Methods ##############################################################################
_refreshByline: ->
if @model?
@$byline.removeClass 'hidden'
@$bylineLink.html @modPack.getMod(@modSlug).name
@$bylineLink.attr 'href', Url.mod modSlug:@modSlug
else
@$byline.addClass 'hidden'
@$bylineLink.html @modPack.getMod(@modSlug).name
@$bylineLink.attr 'href', Url.mod modSlug:@modSlug
_refreshOfficialUrl: ->
if @model?.officialUrl?
if @model.officialUrl?
@$officialLink.attr 'href', @model.officialUrl
@$officialLink.removeClass 'hidden'
@show @$officialLink
else
@$officialLink.addClass 'hidden'
@hide @$officialLink
_refreshTitle: ->
if @model?
@$title.html @model.name
@$titleImage.attr 'src', Url.tutorialIcon modSlug:@modSlug, tutorialSlug:@tutorialSlug
else
@$title.empty()
@$titleImage.removeAttr 'src'
@$title.html @model.name
@$titleImage.attr 'src', Url.tutorialIcon modSlug:@modSlug, tutorialSlug:@tutorialSlug
_refreshSections: ->
@_sectionControllers ?= []
index = 0
if @model?
for section in @model.sections
controller = @_sectionControllers[index]
if not controller?
controller = new MarkdownSectionController title:section.title, model:section.content
controller.render()
@$sectionsContainer.append controller.$el
@_sectionControllers.push controller
else
controller.title = section.title
controller.model = section.model
controller.refresh()
for section in @model.sections
controller = @_sectionControllers[index]
if not controller?
controller = new MarkdownSectionController title:section.title, model:section.content
@_sectionControllers.push controller
@$sectionsContainer.append controller.$el
controller.render()
else
controller.title = section.title
controller.model = section.model
controller.refresh()
index += 1
index += 1
while @_sectionControllers.length > index
controller = @_sectionController.pop()
controller.$el.fadeOut duration:Duration.normal, complete:-> @remove()
@_sectionController.pop().remove()
_refreshVideos: ->
@_videoControllers ?= []
@@ -118,7 +109,6 @@ module.exports = class TutorialPageController extends BaseController
videos = @model?.videos or []
if videos? and videos.length > 0
@$videosSection.slideDown duration:Duration.normal
@$videosSectionTitle.html if videos.length is 1 then 'Video' else 'Videos'
for video in videos
@@ -126,17 +116,19 @@ module.exports = class TutorialPageController extends BaseController
if not controller?
controller = new VideoController model:video
@_videoControllers.push controller
controller.render()
@$videosSectionPanel.append controller.$el
controller.render()
else
controller.model = video
index++
index += 1
@show @$videosSection
else
@$videosSection.slideUp duration:Duration.normal
@hide @$videosSection
while @_videoControllers.length > index
controller = @_videoControllers.pop()
controller.$el.slideUp duration:Duration.normal, complete:-> controller.$el.remove()
@_videoControllers.pop().remove()
_resolveTutorial: ->
return if @model?
src/coffee/crafting_guide_router.coffee
+11 -11
View File
@@ -163,27 +163,27 @@ module.exports = class CraftingGuideRouter extends Backbone.Router
@headerController.model = page
showDuration = Duration.normal
show = =>
switchToNextController = (event)=>
logger.debug "show called: #{event}"
@_resetGlobals()
@_controller.unrender() if @_controller?
@_page = page
@_controller = controller
$pageContent = $('.page')
$pageContent.attr 'class', 'page hideable hidden'
window.scrollTo 0, 0
controller.onWillShow()
controller.$el = $pageContent
controller.render()
$pageContent = $('.page')
controller.$el.addClass 'page'
$pageContent.replaceWith controller.$el
controller.$el.slideDown showDuration, ->
controller.onDidShow()
if @_controller?
showDuration = showDuration / 2
@_controller.$el.slideUp showDuration, show
@_controller.hide -> switchToNextController()
else
show()
switchToNextController()
_resetGlobals: ->
if global.env in ProductionEnvs
src/coffee/models/mod_version.coffee
+5
View File
@@ -87,6 +87,11 @@ module.exports = class ModVersion extends BaseModel
# Group Methods ################################################################################
getAllGroups: ->
result = []
@eachGroup (group)-> result.push group
return result
eachGroup: (callback)->
groupNames = _.keys @_groups
groupNames.sort (a, b)->
src/jade/app.jade
+1 -1
View File
@@ -23,7 +23,7 @@ html
.content
include ./includes/_header.jade
.page
.page.hideable
include ./includes/_footer.jade
block scripts
src/jade/templates/browse_page.jade
+1 -1
View File
@@ -11,4 +11,4 @@
.mainBody
h2: p Active Mods
.mods
.mods
src/jade/templates/crafting_table.jade
+1 -1
View File
@@ -15,5 +15,5 @@
.view__minimal_recipe
.next
.problem
.problem.hideable
a report a problem
src/jade/templates/feedback.jade
+1 -1
View File
@@ -12,7 +12,7 @@
label(name="comment") Comment:
textarea(name="comment")
button(name="send") send
.error: p Sending failed. Please try again later.
.error.hideable.hidden: p Sending failed. Please try again later.
.label
img(src="/images/paper.png")
src/jade/templates/home_page.jade
+20 -25
View File
@@ -47,6 +47,26 @@
.section
h2 What's new?
.panel
h3 2015-03-20
.entry
p.
Recently, I've been working on allowing mod authors to add more detail to the item pages here on
Crafting Guide. To that end, there are a couple of new features to announce. First, item detail
pages can now show text and pictures to describe the item (check out the <a
href="/browse/buildcraft/assembly_table">Assembly Table</a> for an example). Second, mods can
now include tutorial pages containing similar text and pictures to describe tricky concepts,
complex builds, or anything else their mod has to offer (see <a
href="/browse/buildcraft/tutorials/gates_wires_and_chips">Gates, Wires, and Chips</a> for an
example). Finally, both item pages and tutorial pages can display a list of YouTube videos. Only
a few pages in the Buildcraft section have been updated so far, but keep an eye out for
more to come!
p.
And... the second piece of news is that Crafting Guide now supports <a
href="/browse/thermal_dynamics">Thermal Dynamics</a>! This mod is an off-shoot from <a
href="/browse/thermal_expansion">Thermal Expansion</a> which contains all the ducts (item, fluid
and redstone flux) you're used to from TE3 plus some extras both for higher capacity throughput
and combining item ducts with redstone flux ducts.
h3 2015-03-13
.entry
p.
@@ -126,28 +146,3 @@
| smelting ore directly in a furnace
li recipes for vanilla items added by mods are now available (e.g., smelting Iron Dust into Iron
| ingots)
h3 2015-02-10
.entry
p.
I just pushed up some fixes to avoid confusing various items of the same name from different
mods. The best example of this are the two Wrenches from Buildcraft and IC2, but there are a
bunch of others.
h3 2015-02-09
.entry
p.
This release fixes a number of small issues and improves performance in a number of places. Most
especially, all links within the site have been changed to update the page in place without the
need to re-download anything. This should make browsing between item pages <i>much</i> faster.
h3 2015-02-08
.entry
p.
This is the singlest largest expansion of the website yet! Each item from each mod now has its
own page! This will expand in the future, but for now this shows all the recipes for the item as
well as all the closely related items and the others items that can be made using the item.
p.
This also changes things so that links to Crafting Guide from other sites will first go to the
item's page (instead of to the crafting plan). Not to worry though... there's still a direct
link from each item to the full crafting plan for that item.
src/jade/templates/item.jade
+1 -1
View File
@@ -5,7 +5,7 @@
//- All rights reserved.
//-
.view__item
.view__item.hideable.hidden
a
table
tr
src/jade/templates/item_group.jade
+1 -1
View File
@@ -5,6 +5,6 @@
//- All rights reserved.
//-
.view__item_group.section
.view__item_group.section.hideable.hidden
h2
.panel
src/jade/templates/item_page.jade
+8 -8
View File
@@ -8,7 +8,7 @@
.view__item_page
.sidebar
.titleImage: a: img
a.officialPage.externalLink(target="new"): p Offical Documentation
a.officialPage.externalLink.hideable.hidden(target="new"): p Offical Documentation
button.large.craftingPlan See Crafting Plan
@@ -16,22 +16,22 @@
.mainBody
h1.name
.byline: p from <a></a>
.byline.hideable.hidden: p from <a></a>
.recipes.section
.recipes.section.hideable.hidden
h2 Recipes
.panel
.description.section
.description.section.hideable.hidden
h2 Description
.panel.markdown
.videos.section
.videos.section.hideable.hidden
h2 Videos
.panel
.usedToMake: .view__item_group
.view__item_group.usedToMake
.usedAsToolToMake: .view__item_group
.view__item_group.usedAsToolToMake
.similar: .view__item_group
.view__item_group.similar
src/jade/templates/mod_page.jade
+4 -4
View File
@@ -9,9 +9,9 @@
.sidebar
.titleImage: a: img
select.version
a.homePage.externalLink(target="new"): p Offical Home Page
a.documentation.externalLink(target="new"): p Documentation
a.download.externalLink(target="new"): p Download
a.homePage.externalLink.hideable.hidden(target="new"): p Offical Home Page
a.documentation.externalLink.hideable.hidden(target="new"): p Documentation
a.download.externalLink.hideable.hidden(target="new"): p Download
.view__adsense
@@ -20,7 +20,7 @@
.byline: p
.description: p
.tutorials.section
.tutorials.section.hideable.hidden
h2 Tutorials
.panel
src/jade/templates/tutorial_page.jade
+2 -2
View File
@@ -8,7 +8,7 @@
.view__tutorial_page
.sidebar
.titleImage: a: img
a.officialPage.externalLink(target="new"): p Offical Documentation
a.officialPage.externalLink.hideable.hidden(target="new"): p Offical Documentation
.view__adsense
@@ -18,6 +18,6 @@
.sections
.videos.section
.videos.section.hideable.hidden
h2
.panel
src/scss/classes.scss
+11 -5
View File
@@ -32,11 +32,20 @@ All rights reserved.
.error-new { background: $color-error-new !important; }
.hidden {
max-height: 0;
.hideable {
opacity: 1;
transition: opacity $animate-normal;
}
.hiding {
opacity: 0;
}
.hidden {
opacity: 0;
display: none;
}
.mainBody {
position: relative; width: 81.25%;
@@ -67,7 +76,6 @@ All rights reserved.
.externalLink {
position: relative; width: 80%;
margin: 0.5em 10%;
display: none;
p {
font-family: $font-family-normal;
@@ -104,8 +112,6 @@ All rights reserved.
}
.videos {
display: none;
.panel {
text-align: center;
}
src/scss/main.scss
+3 -3
View File
@@ -28,9 +28,9 @@ All rights reserved.
// Animation Speeds ////////////////////////////////////////////////////////////////////////////////
$animate-fast: 0.1s;
$animate-normal: 0.25s;
$animate-slow: 0.6s;
$animate-fast: 0.200s;
$animate-normal: 0.400s;
$animate-slow: 1.200s;
// Font Faces //////////////////////////////////////////////////////////////////////////////////////
src/scss/templates/item_page.scss
-15
View File
@@ -6,18 +6,12 @@ All rights reserved.
*/
.view__item_page {
display: none;
& > div {
vertical-align: top;
display: inline-block;
}
.sidebar {
.externalLink {
display: none;
}
button.large {
width: 100%;
}
@@ -26,7 +20,6 @@ All rights reserved.
.mainBody {
.recipes {
display: none;
.view__full_recipe {
width: 100%;
@@ -37,14 +30,6 @@ All rights reserved.
}
}
}
.similar {
display: none;
}
.usedToMake {
display: none;
}
}
.view__item {
src/scss/templates/mod_page.scss
-2
View File
@@ -6,8 +6,6 @@ All rights reserved.
*/
.view__mod_page {
display: none;
& > div {
vertical-align: top;
display: inline-block;