mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-11-28 01:55:38 -05:00
Adds search bar for adding thangs in level editor
This commit is contained in:
parent
358d7fa181
commit
80f53d2c6b
5 changed files with 95 additions and 11 deletions
|
@ -79,7 +79,7 @@
|
||||||
#thangs-list
|
#thangs-list
|
||||||
position: absolute
|
position: absolute
|
||||||
right: 0
|
right: 0
|
||||||
top: 40px
|
top: 60px
|
||||||
bottom: 0
|
bottom: 0
|
||||||
overflow: scroll
|
overflow: scroll
|
||||||
|
|
||||||
|
|
10
app/templates/editor/level/add_thangs.jade
Normal file
10
app/templates/editor/level/add_thangs.jade
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
h3(data-i18n="editor.level_tab_thangs_add") Add Thangs
|
||||||
|
input(type="text", id="thang-search")
|
||||||
|
#thangs-list
|
||||||
|
for group in groups
|
||||||
|
h4= group.name
|
||||||
|
for thangType in group.thangs
|
||||||
|
div.add-thang-palette-icon(data-thang-type=thangType.name)
|
||||||
|
- path = '/file/db/thang.type/'+thangType.original+'/portrait.png'
|
||||||
|
img(title="Add " + thangType.name, src=path, alt="")
|
||||||
|
div.clearfix
|
|
@ -21,14 +21,5 @@
|
||||||
#canvas-left-gradient.gradient
|
#canvas-left-gradient.gradient
|
||||||
#canvas-top-gradient.gradient
|
#canvas-top-gradient.gradient
|
||||||
|
|
||||||
.add-thangs-palette.thangs-column
|
.add-thangs-palette.thangs-column#add-thangs-column
|
||||||
h3(data-i18n="editor.level_tab_thangs_add") Add Thangs
|
|
||||||
#thangs-list
|
|
||||||
for group in groups
|
|
||||||
h4= group.name
|
|
||||||
for thangType in group.thangs
|
|
||||||
div.add-thang-palette-icon(data-thang-type=thangType.name)
|
|
||||||
- path = '/file/db/thang.type/'+thangType.original+'/portrait.png'
|
|
||||||
img(title="Add " + thangType.name, src=path, alt="")
|
|
||||||
div.clearfix
|
|
||||||
#editor-level-thang-edit.secret
|
#editor-level-thang-edit.secret
|
81
app/views/editor/level/add_thangs_view.coffee
Normal file
81
app/views/editor/level/add_thangs_view.coffee
Normal file
|
@ -0,0 +1,81 @@
|
||||||
|
View = require 'views/kinds/CocoView'
|
||||||
|
add_thangs_template = require 'templates/editor/level/add_thangs'
|
||||||
|
ThangType = require 'models/ThangType'
|
||||||
|
CocoCollection = require 'models/CocoCollection'
|
||||||
|
|
||||||
|
class ThangTypeSearchCollection extends CocoCollection
|
||||||
|
url: '/db/thang.type/search?project=true'
|
||||||
|
model: ThangType
|
||||||
|
|
||||||
|
addTerm: (term) ->
|
||||||
|
@url += "&term=#{term}" if term
|
||||||
|
|
||||||
|
module.exports = class AddThangsView extends View
|
||||||
|
id: "add-thangs-column"
|
||||||
|
className: 'add-thangs-palette thangs-column'
|
||||||
|
template: add_thangs_template
|
||||||
|
startsLoading: false
|
||||||
|
|
||||||
|
events:
|
||||||
|
'keyup input#thang-search': 'runSearch'
|
||||||
|
|
||||||
|
constructor: (options) ->
|
||||||
|
super options
|
||||||
|
@world = options.world
|
||||||
|
@thangTypes = @supermodel.getCollection new ThangTypeSearchCollection() # should load depended-on Components, too
|
||||||
|
@thangTypes.once 'sync', @onThangTypesLoaded
|
||||||
|
@thangTypes.fetch()
|
||||||
|
|
||||||
|
onThangTypesLoaded: =>
|
||||||
|
return if @destroyed
|
||||||
|
@render() # do it again but without the loading screen
|
||||||
|
|
||||||
|
getRenderData: (context={}) ->
|
||||||
|
context = super(context)
|
||||||
|
if @searchModels
|
||||||
|
models = @searchModels
|
||||||
|
else
|
||||||
|
models = @supermodel.getModels(ThangType)
|
||||||
|
|
||||||
|
thangTypes = (thangType.attributes for thangType in models)
|
||||||
|
thangTypes = _.uniq thangTypes, false, 'original'
|
||||||
|
thangTypes = _.reject thangTypes, kind: 'Mark'
|
||||||
|
groupMap = {}
|
||||||
|
for thangType in thangTypes
|
||||||
|
groupMap[thangType.kind] ?= []
|
||||||
|
groupMap[thangType.kind].push thangType
|
||||||
|
|
||||||
|
groups = []
|
||||||
|
for groupName in Object.keys(groupMap).sort()
|
||||||
|
someThangTypes = groupMap[groupName]
|
||||||
|
someThangTypes = _.sortBy someThangTypes, 'name'
|
||||||
|
group =
|
||||||
|
name: groupName
|
||||||
|
thangs: someThangTypes
|
||||||
|
groups.push group
|
||||||
|
|
||||||
|
context.thangTypes = thangTypes
|
||||||
|
context.groups = groups
|
||||||
|
context
|
||||||
|
|
||||||
|
afterRender: ->
|
||||||
|
return if @startsLoading
|
||||||
|
super()
|
||||||
|
|
||||||
|
runSearch: (e) =>
|
||||||
|
if e?.which is 27
|
||||||
|
@onEscapePressed()
|
||||||
|
term = @$el.find('input#thang-search').val()
|
||||||
|
return unless term isnt @lastSearch
|
||||||
|
|
||||||
|
@searchModels = @thangTypes.filter (model) ->
|
||||||
|
return true unless term
|
||||||
|
regExp = new RegExp term, 'i'
|
||||||
|
return model.get('name').match regExp
|
||||||
|
@render()
|
||||||
|
@$el.find('input#thang-search').focus().val(term)
|
||||||
|
@lastSearch = term
|
||||||
|
|
||||||
|
onEscapePressed: ->
|
||||||
|
@$el.find('input#thang-search').val("")
|
||||||
|
@runSearch
|
|
@ -1,4 +1,5 @@
|
||||||
View = require 'views/kinds/CocoView'
|
View = require 'views/kinds/CocoView'
|
||||||
|
AddThangsView = require './add_thangs_view'
|
||||||
thangs_template = require 'templates/editor/level/thangs_tab'
|
thangs_template = require 'templates/editor/level/thangs_tab'
|
||||||
Level = require 'models/Level'
|
Level = require 'models/Level'
|
||||||
ThangType = require 'models/ThangType'
|
ThangType = require 'models/ThangType'
|
||||||
|
@ -110,6 +111,7 @@ module.exports = class ThangsTabView extends View
|
||||||
$('.tab-content').click @selectAddThang
|
$('.tab-content').click @selectAddThang
|
||||||
$('#thangs-list').bind 'mousewheel', @preventBodyScrollingInThangList
|
$('#thangs-list').bind 'mousewheel', @preventBodyScrollingInThangList
|
||||||
@$el.find('#extant-thangs-filter button:first').button('toggle')
|
@$el.find('#extant-thangs-filter button:first').button('toggle')
|
||||||
|
@addThangsView = @insertSubView new AddThangsView world: @world, supermodel: @supermodel
|
||||||
|
|
||||||
onFilterExtantThangs: (e) ->
|
onFilterExtantThangs: (e) ->
|
||||||
@$el.find('#extant-thangs-filter button.active').button('toggle')
|
@$el.find('#extant-thangs-filter button.active').button('toggle')
|
||||||
|
|
Loading…
Reference in a new issue