From: dsc Date: Mon, 28 Feb 2011 16:43:22 +0000 (-0800) Subject: Items picked up now auto-equip; you can also manually auto-equip (instead of dragging... X-Git-Url: http://git.less.ly:3516/?a=commitdiff_plain;h=31becc073d8fe459d61a77977f1ba09241768f75;p=tanks.git Items picked up now auto-equip; you can also manually auto-equip (instead of dragging) by right-clicking an item. --- diff --git a/data/types/levels.yaml b/data/types/levels.yaml index 2021d39..35c38e8 100644 --- a/data/types/levels.yaml +++ b/data/types/levels.yaml @@ -145,6 +145,8 @@ types: items: - type: rockets loc: [75,275] + - type: rockets + loc: [325,475] - type: nitro loc: [325,25] diff --git a/src/tanks/game.cjs b/src/tanks/game.cjs index 72ec8b9..e51b63a 100644 --- a/src/tanks/game.cjs +++ b/src/tanks/game.cjs @@ -18,7 +18,6 @@ var Y = require('Y').Y , Grid = require('tanks/ui/grid').Grid , PathMapUI = require('tanks/ui/pathmapui').PathMapUI , Viewport = require('tanks/ui/viewport').Viewport -, Backpack = require('tanks/ui/inventory/backpack').Backpack , Thing = thing.Thing , Tank = thing.Tank diff --git a/src/tanks/inventory/bag.cjs b/src/tanks/inventory/bag.cjs index 72dcd0f..f7ff703 100644 --- a/src/tanks/inventory/bag.cjs +++ b/src/tanks/inventory/bag.cjs @@ -4,7 +4,7 @@ var Y = require('Y').Y , Item = require('tanks/thing/item').Item , Container = require('tanks/inventory/container').Container -, ContainerUI = require('tanks/ui/inventory/containerui').ContainerUI +, ContainerUI = require('tanks/ui/containerui').ContainerUI , Bag = diff --git a/src/tanks/inventory/inventory.cjs b/src/tanks/inventory/inventory.cjs index 0a5f134..d8cd401 100644 --- a/src/tanks/inventory/inventory.cjs +++ b/src/tanks/inventory/inventory.cjs @@ -213,7 +213,8 @@ evt.subclass('Inventory', { if ( checkSpecificBag ) { idx = bag._getEmptySlot(item); } else { - idx = this.defaultBag._getEmptySlot(item); + bag = this.defaultBag; + idx = bag._getEmptySlot(item); if (idx === -1) for (var id in this.bags) { bag = this.bags[id]; @@ -224,10 +225,37 @@ evt.subclass('Inventory', { } } - return (idx === -1) ? null : new ContainerMeta(bag, idx); + return (idx === -1) ? null : new ContainerMeta(idx, bag); + }, + + /** + * Searches for an available (equipslot,idx) that will accept supplied Item. + * @param {Item} item + * @return {ContainerMeta} The (bag,idx) information about the empty slot, or null if no matching slot was found. + */ + findEmptyEquipSlot : function findEmptyEquipSlot(item){ + var idx = -1; + for (var name in this.equipSlots) { + var bag = this.equipSlots[name]; + if ( bag.canAddItem(item) ) { + idx = bag._getEmptySlot(); + break; + } + } + return (idx === -1) ? null : new ContainerMeta(idx, bag); }, + equipItem : function equipItem(item){ + var meta = this.findEmptyEquipSlot(item); + if (meta) this.moveItem(item, meta.bag, meta.idx); + return this; + }, + unequipItem : function unequipItem(item){ + var meta = this.findEmptySlot(item); + if (meta) this.moveItem(item, meta.bag, meta.idx); + return this; + }, /// Bag Management /// diff --git a/src/tanks/thing/item.cjs b/src/tanks/thing/item.cjs index 8812b41..b967801 100644 --- a/src/tanks/thing/item.cjs +++ b/src/tanks/thing/item.cjs @@ -1,5 +1,6 @@ var Y = require('Y').Y , op = require('Y/op') +, Event = require('Y/modules/y.event').Event , Rect = require('ezl/shape').Rect , HtmlLayer = require('ezl/layer/html').HtmlLayer @@ -80,7 +81,7 @@ Thing.subclass('Item', { activate : function activate(){ // console.log(this+' activated!'); - if ( this.owner && this.cooldowns.activate.activate() ) { + if ( this.owner && this.cooldowns.activate && this.cooldowns.activate.activate() ) { var buffs = this.currentBuffs , active = this.currentActive ; @@ -101,13 +102,19 @@ Thing.subclass('Item', { }, /** - * Equips this item to owner or given unit. Does not manipulate inventory, or remove from map. + * Equips this item to owner or given unit. Does not manipulate inventory, but does remove from map if newly acquired. * @param {Tank} [unit=this.owner] Unit to equip. If omitted, uses this.owner; if unowned, does nothing. * @return {this} */ equip : function equip(unit){ - if (unit && unit.isUnit) + if (unit instanceof Event && unit.data) { + var evt = unit; + unit = evt.data.unit; + } + if (unit && unit.isUnit) { this.owner = unit; + this.removeFromMap(); + } if (!this.owner) return this; @@ -149,8 +156,11 @@ Thing.subclass('Item', { onCollide : function onCollide(evt){ var unit = evt.data.unit , inv = unit.inventory - if ( inv && inv.canAddItem(this) ) - inv.addItem(this); // fires 'item.acquire' if successful + if ( inv && inv.canAddItem(this) ) { + inv.equipItem(this); + if ( !this.isEquipped ) + inv.addItem(this); // fires 'item.acquire' if successful + } // TODO: else ignore for this traversal }, diff --git a/src/tanks/ui/inventory/containerui.cjs b/src/tanks/ui/containerui.cjs similarity index 87% rename from src/tanks/ui/inventory/containerui.cjs rename to src/tanks/ui/containerui.cjs index c381bdd..fff4d70 100644 --- a/src/tanks/ui/inventory/containerui.cjs +++ b/src/tanks/ui/containerui.cjs @@ -123,6 +123,7 @@ Layer.subclass('ContainerUISlot', { artWidth : 50, artHeight : 50, isDraggable : true, + equipsContents : false, idx : -1, dragging : false, @@ -131,12 +132,14 @@ Layer.subclass('ContainerUISlot', { init : function initContainerUISlot(parent, idx){ - Y.bindAll(this, 'onActivate', 'onDragStart'); + Y.bindAll(this, 'onActivate', 'onDragStart', 'onAutoEquip'); Layer.init.call(this); this.parent = parent; + this.unit = parent.unit; this.isDraggable = parent.isDraggable; this.container = parent.container; + this.equipsContents = this.container.equipsContents; this.idx = idx; this.layer.addClass('slot'+idx); @@ -191,6 +194,7 @@ Layer.subclass('ContainerUISlot', { if (item.activateGauge) this.inner.append(item.activateGauge); + this.inner.layer.bind('contextmenu', this.onAutoEquip); this.inner.layer.bind('click', this.onActivate); return this; @@ -225,8 +229,35 @@ Layer.subclass('ContainerUISlot', { onActivate : function onActivate(evt){ var item = this.item; - // console.log(this+'.onActivate(item='+item+', dragging='+item.dragging+')'); - if (item && !item.dragging) item.activate(); + + // console.log(this+'.onActivate(item='+item+', dragging='+(item || {}).dragging+')', evt); + if (!item || item.dragging) return; + + // right-click + if (evt.which !== 1) { + return this.onAutoEquip(evt); + + // left-click + } else + item.activate(); + }, + + onAutoEquip : function onAutoEquip(evt){ + var item = this.item + , inv = this.unit.inventory + ; + // console.log('onAutoEquip(evt=%s)', (evt||{}).type, evt); + if (evt) { + evt.preventDefault(); + evt.stopPropagation(); + } + + if (this.equipsContents) + inv.unequipItem(item); + else + inv.equipItem(item); + + return false; }, toString : function(){ diff --git a/src/tanks/ui/index.cjs b/src/tanks/ui/index.cjs index 5c41507..45b59ba 100644 --- a/src/tanks/ui/index.cjs +++ b/src/tanks/ui/index.cjs @@ -1,10 +1,14 @@ -var Y = require('Y').Y; +var Y = require('Y').Y +, containerui = require('tanks/ui/containerui') +; + Y.core.extend(exports, { 'config' : require('tanks/ui/configui'), 'main' : require('tanks/ui/main'), - 'inventory' : require('tanks/ui/inventory'), - 'Grid' : require('tanks/ui/grid').Grid, - 'Viewport' : require('tanks/ui/viewport').Viewport, - 'PathMapUI' : require('tanks/ui/pathmapui').PathMapUI + 'Grid' : require('tanks/ui/grid').Grid, + 'Viewport' : require('tanks/ui/viewport').Viewport, + 'PathMapUI' : require('tanks/ui/pathmapui').PathMapUI, + 'ContainerUI' : containerui.ContainerUI, + 'ContainerUISlot' : containerui.ContainerUISlot }); diff --git a/src/tanks/ui/inventory/backpack.cjs b/src/tanks/ui/inventory/backpack.cjs deleted file mode 100644 index 9068b70..0000000 --- a/src/tanks/ui/inventory/backpack.cjs +++ /dev/null @@ -1,189 +0,0 @@ -//#ensure "jquery.tipsy" -//#ensure "jquery-ui" -var Y = require('Y').Y -, Layer = require('ezl/layer/layer').Layer -, - - -Backpack = -exports['Backpack'] = -Layer.subclass('Backpack', { - _layerClasses : 'backpack item-container hud', - _layerAttrs : { 'id':'backpack' }, - _layerHtml : '

backpack

', - hasCanvas : false, - - - init : function initBackpack(unit){ - Y.bindAll(this, 'onItemUpdated', 'onDrop'); - Layer.init.call(this); - - this.unit = unit; - var inv = this.inventory = unit.inventory - , bp = inv.backpack - ; - this.slots = new Y(0, inv.max).map(function(idx){ - var item = bp[idx]; - return new BackpackSlot(this, idx).appendTo(this); - }, this); - - unit.on('item.acquire', this.onItemUpdated); - unit.on('item.lose', this.onItemUpdated); - unit.on('item.move', this.onItemUpdated); - }, - - refresh : function refresh(){ - this.slots.invoke('refresh'); - this.layer.find('.slot') - .droppable({ - accept : '.item', - hoverClass : 'drophover', - drop : this.onDrop - }); - - return this; - }, - - getSlot : function getSlot(idx){ - return this.slots[idx]; - }, - - onItemUpdated : function onItemUpdated(evt){ - var d = evt.data; - this.slots[d.idx].refresh(); - if ('oldIdx' in d) this.slots[d.oldIdx].refresh(); - }, - - onDrop : function onDrop(evt, ui){ - var item = ui.draggable.data('item') - , toIdx = $(evt.target).data('idx') - ; - // console.log(this+'.onDrop(item='+item+', toIdx='+toIdx+')', evt); - this.unit.moveItem(item, toIdx); - - // Clear flag preventing the drag from activing the item - setTimeout(function(){ item.dragging = false; }, 250); - }, - - - toString : function(){ - return this.className+'(unit='+this.unit+')'; - } - -}) -, - - -BackpackSlot = -exports['BackpackSlot'] = -Layer.subclass('BackpackSlot', { - _layerClasses : 'backpack hud slot', - hasCanvas : false, - - artWidth : 50, - artHeight : 50, - - idx : -1, - dragging : false, - backpack : null, - item : null, - - - init : function initBackpackSlot(backpack, idx){ - Y.bindAll(this, 'onActivate', 'onDragStart'); - Layer.init.call(this); - this.backpack = backpack; - this.inventory = backpack.inventory; - this.idx = idx; - this.layer.addClass('slot'+idx); - this.inner = - new Layer({ hasCanvas:false }) - .appendTo(this) - .position(8, 8); - }, - - refresh : function refresh(){ - this.layer.data({ - 'backpack-slot': this, - 'idx': this.idx - }); - var item = this.inventory.backpack[this.idx]; - if (item) - this.setItem(item); - else - this.removeItem(); - }, - - setItem : function setItem(item){ - if (!item) return this; - - this.removeItem(); - this.item = item; - this.layer.addClass('occupied'); - - var icon = item.art && item.art.inv_icon - , src = this.itemEl = - jQuery('') - .width(this.artWidth) - .height(this.artHeight) - .appendTo(this.inner.layer) - ; - this.inner.layer - .addClass('item') - .data('item', item) - .draggable({ - start : this.onDragStart, - revert : 'invalid', - zIndex : 10 - }) - .attr('title', ''+item.name+'
'+item.desc) - .tipsy({ 'html':true, 'gravity':$.fn.tipsy.autoNS }) - ; - - if (icon) src.attr('src', icon); - - this.inner.append(item.activateGauge); - this.inner.layer.bind('click', this.onActivate); - - return this; - }, - - removeItem : function removeItem(){ - if (this.item) { - this.layer - .removeClass('occupied'); - - // Dismiss tooltip if present - this.inner.layer - .trigger('mouseleave'); - - this.inner.remove(); - this.inner = - new Layer({ hasCanvas:false }) - .appendTo(this) - .position(8, 8); - } - - this.item = null; - this.itemEl = null; - return this; - }, - - onDragStart : function onDragStart(evt, ui){ - var item = this.item; - // console.log(this+'.dragStart(item='+item+', dragging='+(item || {}).dragging+')', evt, ui); - if (item) item.dragging = true; - }, - - onActivate : function onActivate(evt){ - var item = this.item; - // console.log(this+'.onActivate(item='+item+', dragging='+item.dragging+')'); - if (item && !item.dragging) item.activate(); - }, - - toString : function(){ - return this.className+'(idx='+this.idx+', item='+this.item+')'; - } - -}) -; diff --git a/src/tanks/ui/inventory/equipslot.cjs b/src/tanks/ui/inventory/equipslot.cjs deleted file mode 100644 index 0056eaa..0000000 --- a/src/tanks/ui/inventory/equipslot.cjs +++ /dev/null @@ -1,194 +0,0 @@ -//#ensure "jquery.tipsy" -//#ensure "jquery-ui" -var Y = require('Y').Y -, Layer = require('ezl/layer/layer').Layer -, HtmlLayer = require('ezl/layer/html').HtmlLayer -, - - -EquipSlot = -exports['EquipSlot'] = -HtmlLayer.subclass('EquipSlot', { - _layerClasses : 'equip item-container hud', - - - init : function initEquipSlot(slotName, reqs, unit){ - Y.bindAll(this, 'onItemUpdated', 'onDrop'); - - this.slotName = slotName; - this.reqs = reqs; - this.unit = unit; - - HtmlLayer.init.call(this, null, - { 'id':slotName+'_slot' }, // layer attributes - '

'+slotName.toLowerCase()+'

'); // layer html - - var inv = this.inventory = unit.inventory - , bp = inv.backpack - ; - this.slots = new Y(0, inv.max).map(function(idx){ - var item = bp[idx]; - return new BackpackSlot(this, idx).appendTo(this); - }, this); - - unit.on('item.acquire', this.onItemUpdated); - unit.on('item.lose', this.onItemUpdated); - unit.on('item.move', this.onItemUpdated); - }, - - refresh : function refresh(){ - this.slots.invoke('refresh'); - this.layer.find('.slot') - .droppable({ - accept : '.item', - hoverClass : 'drophover', - drop : this.onDrop - }); - - return this; - }, - - getSlot : function getSlot(idx){ - return this.slots[idx]; - }, - - onItemUpdated : function onItemUpdated(evt){ - var d = evt.data; - this.slots[d.idx].refresh(); - if ('oldIdx' in d) this.slots[d.oldIdx].refresh(); - }, - - onDrop : function onDrop(evt, ui){ - var item = ui.draggable.data('item') - , toIdx = $(evt.target).data('idx') - ; - // console.log(this+'.onDrop(item='+item+', toIdx='+toIdx+')', evt); - this.unit.moveItem(item, toIdx); - - // Clear flag preventing the drag from activing the item - setTimeout(function(){ item.dragging = false; }, 250); - }, - - - toString : function(){ - return this.className+'(unit='+this.unit+')'; - } - -}) -, - - -BackpackSlot = -exports['BackpackSlot'] = -HtmlLayer.subclass('BackpackSlot', { - _layerClasses : 'backpack hud slot', - hasCanvas : false, - - artWidth : 50, - artHeight : 50, - - idx : -1, - dragging : false, - backpack : null, - item : null, - - - init : function initBackpackSlot(backpack, idx){ - Y.bindAll(this, 'onActivate', 'onDragStart'); - Layer.init.call(this); - this.backpack = backpack; - this.inventory = backpack.inventory; - this.idx = idx; - this.layer.addClass('slot'+idx); - this.inner = - new Layer({ hasCanvas:false }) - .appendTo(this) - .position(8, 8); - }, - - refresh : function refresh(){ - this.layer.data({ - 'backpack-slot': this, - 'idx': this.idx - }); - var item = this.inventory.backpack[this.idx]; - if (item) - this.setItem(item); - else - this.removeItem(); - }, - - setItem : function setItem(item){ - if (!item) return this; - - this.removeItem(); - this.item = item; - this.layer.addClass('occupied'); - - var icon = item.art && item.art.inv_icon - , src = this.itemEl = - jQuery('') - .width(this.artWidth) - .height(this.artHeight) - .appendTo(this.inner.layer) - ; - this.inner.layer - .addClass('item') - .data('item', item) - .draggable({ - start : this.onDragStart, - revert : 'invalid', - zIndex : 10 - }) - .attr('title', ''+item.name+'
'+item.desc) - .tipsy({ 'html':true, 'gravity':$.fn.tipsy.autoNS }) - ; - - if (icon) src.attr('src', icon); - - if (item.activateGauge) - this.inner.append(item.activateGauge); - this.inner.layer.bind('click', this.onActivate); - - return this; - }, - - removeItem : function removeItem(){ - if (this.item) { - this.layer - .removeClass('occupied'); - - // Dismiss tooltip if present - this.inner.layer - .trigger('mouseleave'); - - this.inner.remove(); - this.inner = - new Layer({ hasCanvas:false }) - .appendTo(this) - .position(8, 8); - } - - this.item = null; - this.itemEl = null; - return this; - }, - - onDragStart : function onDragStart(evt, ui){ - var item = this.item; - // console.log(this+'.dragStart(item='+item+', dragging='+(item || {}).dragging+')', evt, ui); - if (item) item.dragging = true; - }, - - onActivate : function onActivate(evt){ - var item = this.item; - // console.log(this+'.onActivate(item='+item+', dragging='+item.dragging+')'); - if (item && !item.dragging) item.activate(); - }, - - toString : function(){ - return this.className+'(idx='+this.idx+', item='+this.item+')'; - } - -}) -; diff --git a/src/tanks/ui/inventory/index.cjs b/src/tanks/ui/inventory/index.cjs deleted file mode 100644 index c7604fa..0000000 --- a/src/tanks/ui/inventory/index.cjs +++ /dev/null @@ -1,4 +0,0 @@ -require('Y').Y -.extend(exports, { - 'Backpack' : require('tanks/ui/inventory/backpack').Backpack -}); \ No newline at end of file diff --git a/www/css/lttl.css b/www/css/lttl.css index 693085f..710c0b4 100644 --- a/www/css/lttl.css +++ b/www/css/lttl.css @@ -48,7 +48,7 @@ td { text-align:center; vertical-align:middle; } /*** Game and Viewport ***/ -#game { position:relative; width:100%; height:100%; margin:0; padding:0; } +#game { width:100%; height:100%; } #viewport { width:100%; height:100%; /* max-width:1024px; max-height:690px; */ /* <- Set by Viewport class */ position:relative; margin:10px auto; overflow:hidden; cursor:crosshair; background-color:#3F3F3F; border:15px solid #222;