Updated inventory to Polymer 1

This commit is contained in:
Stefan Zermatten
2017-01-26 10:23:27 +02:00
parent f7a3929c05
commit d710579025
26 changed files with 480 additions and 412 deletions

View File

@@ -17,6 +17,12 @@ List items
transition: box-shadow 0.3s ease, opacity 0.5s ease-in-out;
}
.item > .itemName {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.item.small {
height: 32px;
}
@@ -31,11 +37,6 @@ List items
padding-bottom: 16px;
}
.item[hero], &:active{
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.37);
z-index: 10;
}
.item iron-icon, .item paper-icon-button {
color: #747474;
color: rgba(0,0,0,0.54);

View File

@@ -1,39 +1,39 @@
<template name="attackEdit">
<div layout horizontal>
<div layout vertical flex>
<div layout horizontal>
<div class="layout horizontal">
<div class="layout vertical flex">
<div class="layout horizontal wrap">
<!--attackBonus-->
<paper-input class="attackBonusInput"
label="Attack Bonus"
floatinglabel
value={{attackBonus}}
flex></paper-input>
<!--details-->
<paper-input class="detailInput"
label="Details"
floatinglabel
value={{details}}></paper-input>
<paper-input class="attackBonusInput flex" label="Attack Bonus" value={{attackBonus}}
style="flex-basis: 200px; margin-right: 16px;">
<div suffix>
<paper-tooltip position="left" animation-delay="0">This is a formula field</paper-tooltip>
<iron-icon icon="lightbulb-outline"></iron-icon>
</div>
<div layout horizontal>
</paper-input>
<!--details-->
<paper-input class="detailInput" label="Details" value={{details}} style="flex-basis: 200px;">
</paper-input>
</div>
<div class="layout horizontal wrap">
<!--damageBonus-->
<paper-input class="damageInput"
label="Damage"
floatinglabel
value={{damage}}
flex></paper-input>
<paper-input class="damageInput flex" label="Damage" value={{damage}}
style="flex-basis: 200px; margin-right: 16px;">
<div suffix>
<paper-tooltip position="left" animation-delay="0">This field accepts formulae in {curly brackets}</paper-tooltip>
<iron-icon icon="dicecloud:code-braces"></iron-icon>
</div>
</paper-input>
<!--DamageType-->
<paper-dropdown-menu class="damageTypeDropdown" label="Damage Type">
<paper-dropdown layered class="dropdown">
<core-menu class="menu" selected={{damageType}}>
<paper-dropdown-menu label="Damage Type" dynamic-align>
<dicecloud-selector class="dropdown-content damageTypeDropdown" selected={{damageType}}>
{{#each damageTypes}}
<paper-item name={{this}} class="containerMenuItem">{{this}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</dicecloud-selector>
</paper-dropdown-menu>
</div>
</div>
<!--Delete Button-->
<paper-icon-button class="deleteAttack" role="button" tabindex="0" icon="delete" aria-label="Delete"></paper-icon-button>
<paper-icon-button class="deleteAttack" icon="delete"></paper-icon-button>
</div>
</template>

View File

@@ -15,7 +15,7 @@ var damageTypes = [
];
Template.attackEdit.events({
"tap .deleteAttack": function(event, instance) {
"click .deleteAttack": function(event, instance) {
Attacks.softRemoveNode(this._id);
GlobalUI.deletedToast(this._id, "Attacks", "Attack");
},
@@ -31,9 +31,8 @@ Template.attackEdit.events({
var value = event.currentTarget.value;
Attacks.update(this._id, {$set: {details: value}});
},
"core-select .damageTypeDropdown": function(event) {
"iron-select .damageTypeDropdown": function(event) {
var detail = event.originalEvent.detail;
if (!detail.isSelected) return;
var value = detail.item.getAttribute("name");
if (value == this.damageType) return;
Attacks.update(this._id, {$set: {damageType: value}});
@@ -44,7 +43,4 @@ Template.attackEdit.helpers({
damageTypes: function() {
return damageTypes;
},
DAMAGE_DICE: function() {
return DAMAGE_DICE;
},
});

View File

@@ -3,7 +3,7 @@
{{#if attacks.count}}
<hr style="margin: 16px 0 16px 0;">
<div id="attacks">
<h2>Attacks</h2>
<div class="paper-font-title">Attacks</div>
{{#each attacks}}
{{>attackEdit}}
{{/each}}

View File

@@ -1,14 +1,14 @@
<template name="attackView">
<div class="attackView" layout horizontal>
<div class="headline" style="margin-right: 16px;" layout horizontal center>
<div class="attackView layout horizontal">
<div class="paper-font-headline layout horizontal center" style="margin-right: 16px;">
{{evaluateSigned charId attackBonus}}
</div>
<div layout vertical>
<div class="layout vertical">
<div>
{{evaluateString charId damage}}&nbsp;{{damageType}}
</div>
{{#if details}}
<div class="caption">
<div class="paper-font-caption">
{{details}}
</div>
{{/if}}

View File

@@ -2,7 +2,7 @@
{{#if attacks.count}}
<hr style="margin: 16px 0 16px 0;">
<div class="attacks">
<h2 class="spaceAfter">Attacks</h2>
<div class="spaceAfter paper-font-title">Attacks</div>
{{#each attacks}}
{{> attackView}}
{{/each}}

View File

@@ -2,7 +2,7 @@ Template.characterSheet.onRendered(function() {
//default to the stats tab
Session.setDefault(this.data._id + ".selectedTab", "0");
//watch this character and make sure their encumbrance is updated
trackEncumbranceConditions(this.data._id, this);
//trackEncumbranceConditions(this.data._id, this);
});
var setTab = function(charId, tab){

View File

@@ -1,10 +1,10 @@
<template name="carryDialog">
{{#baseDialog title="Weight Carried" class=color hideEdit=true}}
<div layout horizontal center-justified end>
<div class="display2">
<div class="layout horizontal center-justified end">
<div class="paper-font-display2">
{{round carriedWeight 1}}
</div>
<div class="display1">
<div class="paper-font-display1">
lbs
</div>
</div>

View File

@@ -11,32 +11,26 @@
<template name="containerEdit">
<paper-input id="containerNameInput"
label="Name"
floatinglabel
value={{name}}></paper-input>
<div layout horizontal around-justified wrap>
<paper-input-decorator label="Weight" floatinglabel>
<input id="weightInput" type="number" value={{weight}}>
</paper-input-decorator>
<paper-input-decorator label="Value" floatinglabel>
<input id="valueInput" type="number" value={{value}}>
</paper-input-decorator>
<div class="layout horizontal around-justified wrap">
<paper-input id="weightInput" label="Weight" type="number" value={{weight}}>
</paper-input>
<paper-input id="valueInput" label="Value" type="number" value={{value}}>
</paper-input>
</div>
<hr class="vertMargin">
<paper-input-decorator label="Description" floatinglabel layout vertical>
<paper-autogrow-textarea>
<textarea id="containerDescriptionInput" placeholder aria-label="Description" value={{description}}></textarea>
</paper-autogrow-textarea>
</paper-input-decorator>
<paper-textarea label="Description" id="containerDescriptionInput" value={{description}}>
</paper-textarea>
</template>
<template name="containerView">
<div layout horizontal wrap center justified>
<div class="layout horizontal wrap center justified">
<table class="summaryTable fullwidth">
<tr><td>Container</td><td>{{round weight}}lbs</td><td>{{longValueString value}}</td></tr>
<tr><td>Contents</td><td>{{round contentsWeight}}lbs</td><td>{{longValueString contentsValue}}</td></tr>
<tr class="body2"><td>Total</td><td>{{round totalWeight}}lbs</td><td>{{longValueString totalValue}}</td></tr>
<tr class="paper-font-body2"><td>Total</td><td>{{round totalWeight}}lbs</td><td>{{longValueString totalValue}}</td></tr>
</table>
</div>
{{#if description}}

View File

@@ -18,26 +18,40 @@ Template.containerDialog.events({
},
});
Template.containerEdit.onRendered(function(){
updatePolymerInputs(this);
});
Template.containerEdit.events({
//TODO validate input (integer, non-negative, etc) for these inputs and give validation errors
"change #containerNameInput": function(event){
"input #containerNameInput": function(event){
var name = Template.instance().find("#containerNameInput").value;
Containers.update(this._id, {$set: {name: name}});
Containers.update(this._id, {
$set: {name: name}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
},
"change #weightInput, input #weightInput": function(event){
var weight = +Template.instance().find("#weightInput").value;
Containers.update(this._id, {$set: {weight: weight}});
Containers.update(this._id, {
$set: {weight: weight}
}, {
removeEmptyStrings: false,
});
},
"change #valueInput, input #valueInput": function(event){
var value = +Template.instance().find("#valueInput").value;
Containers.update(this._id, {$set: {value: value}});
Containers.update(this._id, {
$set: {value: value}
}, {
removeEmptyStrings: false,
});
},
"change #containerDescriptionInput": function(event, instance){
"input #containerDescriptionInput": function(event, instance){
var description = instance.find("#containerDescriptionInput").value;
Containers.update(this._id, {$set: {description: description}});
Containers.update(this._id, {
$set: {description: description}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
},
});

View File

@@ -1,12 +1,11 @@
<template name="inventory">
<div fit>
<div id="inventory" class="scroll-y" fit>
<div id="inventory">
<div class="column-container">
<!--Net Worth-->
<div>
<paper-material class="card">
<div class="white top" layout horizontal center>
<div class="subhead" flex>
<div class="white top layout horizontal center">
<div class="paper-font-subhead flex">
Net Worth
</div>
<div>
@@ -17,12 +16,9 @@
</div>
<!--Weight Carried-->
<div>
<paper-material class="card"
hero-id="main" {{detailHero "weightCarried" _id}}>
<div class="top green white-text weightCarried"
hero-id="toolbar" {{detailHero "weightCarried" _id}}
layout horizontal center>
<div class="subhead" flex>
<paper-material class="card">
<div class="top green white-text weightCarried layout horizontal center">
<div class="paper-font-subhead" flex>
Weight Carried
</div>
<div>
@@ -36,10 +32,8 @@
<div class="bottom list">
{{#each encumberedBuffs}}
<div class="item-slot">
<div class="item buff"
hero-id="main" {{detailHero}}
layout horizontal center>
<div flex>
<div class="item buff layout horizontal center">
<div class="flex">
<iron-icon icon="work"
style="margin-right: 16px">
</iron-icon>
@@ -55,26 +49,26 @@
<!--Equipment-->
<div>
<paper-material class="card equipmentContainer">
<div class="white top" layout horizontal center>
<div class="subhead" flex>
<div class="white top layout horizontal center">
<div class="paper-font-subhead flex">
Equipment
</div>
<div class="caption" style="margin-right: 8px">
<div class="paper-font-caption" style="margin-right: 8px">
{{valueString equipmentValue}}
</div>
<div class="caption">
<div class="paper-font-caption">
{{round equipmentWeight}}lbs
</div>
</div>
<div flex class="bottom list">
{{#if attuned.count}}
<div class="subhead">Attuned</div>
<div class="paper-font-subhead">Attuned</div>
{{/if}}
{{#each attuned}}
{{>inventoryItem}}
{{/each}}
{{#if attuned.count}}
<div class="subhead">Equipment</div>
<div class="paper-font-subhead">Equipment</div>
{{/if}}
{{#each equipment}}
{{>inventoryItem}}
@@ -85,14 +79,14 @@
<!--Carried Items-->
<div>
<paper-material class="card carriedContainer">
<div class="white top" layout horizontal center>
<div class="subhead" flex>
<div class="white top layout horizontal center">
<div class="paper-font-subhead flex">
Carried
</div>
<div class="caption" style="margin-right: 8px">
<div class="paper-font-caption" style="margin-right: 8px">
{{valueString carriedValue}}
</div>
<div class="caption">
<div class="paper-font-caption">
{{round carriedWeight}}lbs
</div>
</div>
@@ -105,27 +99,24 @@
</div>
{{#each containers}}
<div>
<paper-material class="card itemContainer"
hero-id="main" {{detailHero}}>
<div class="top {{colorClass}}"
hero-id="toolbar" {{detailHero}}
layout horizontal center>
<div class="subhead" flex
hero-id="title" {{detailHero}}>
<paper-material class="card itemContainer" data-id={{_id}}>
<div class="top {{colorClass}} layout horizontal center">
<div class="paper-font-subhead flex">
{{name}}
</div>
<div class="caption" style="margin-right: 8px">
<div class="paper-font-caption" style="margin-right: 8px">
{{valueString totalValue}}
</div>
<div class="caption" style="margin-right: 8px">
<div class="paper-font-caption" style="margin-right: 8px">
{{round totalWeight}}lbs
</div>
<core-tooltip label="Container carried" position="left">
<div>
<paper-checkbox class="carriedCheckbox"
disabled={{#unless canEditCharacter charId}}true{{/unless}}
checked={{isCarried}}>
</paper-checkbox>
</core-tooltip>
<paper-tooltip position="left"> Container carried</paper-tooltip>
</div>
</div>
<div class="bottom list">
{{#each items ../_id _id}}
@@ -140,30 +131,30 @@
</div>
{{#if canEditCharacter _id}}
{{#fabMenu}}
<core-tooltip label="New container" position="left">
<div>
<paper-fab icon="work"
class="addContainer"
mini>
</paper-fab>
</core-tooltip>
<core-tooltip label="New item" position="left">
<paper-tooltip position="left"> New container </paper-tooltip>
</div>
<div>
<paper-fab icon="note-add"
class="addItem"
mini>
</paper-fab>
</core-tooltip>
<paper-tooltip position="left"> New item </paper-tooltip>
</div>
{{/fabMenu}}
{{/if}}
</div>
</template>
<template name="inventoryItem">
<div class="item-slot">
<div class="item {{hidden}} inventoryItem"
hero-id="main" {{detailHero}}
layout horizontal center
draggable={{canEditCharacter charId}}>
<div flex class="itemName">
<div class="item {{hidden}} inventoryItem layout horizontal center"
draggable={{canEditCharacter charId}}
data-id={{_id}}>
<div class="itemName flex">
{{#if ne1 quantity}}{{quantity}}&nbsp;{{/if}}{{pluralName}}
</div>
{{#if settings.showIncrement}}{{#if canEditCharacter charId}}

View File

@@ -91,9 +91,11 @@ Template.inventory.helpers({
},
equipmentWeight: function(){
var weight = 0;
Items.find({charId: this._id, enabled: true},
{fields: {weight : 1, quantity: 1}}
).forEach(function(item){
Items.find({
charId: this._id, enabled: true,
}, {
fields: {weight : 1, quantity: 1}
}).forEach(function(item){
weight += item.totalWeight();
});
return weight;
@@ -121,101 +123,88 @@ Template.inventory.helpers({
});
Template.inventory.events({
"tap .addItem": function(event){
"click .addItem": function(event, instance){
var charId = this._id;
Items.insert({
var itemId = Items.insert({
charId: charId,
parent:{
id: charId,
collection: "Characters",
},
}, function(err, itemId){
if (err) throw err;
GlobalUI.setDetail({
});
pushDialogStack({
template: "itemDialog",
data: {itemId: itemId, charId: charId, startEditing: true},
heroId: itemId,
});
element: event.currentTarget,
returnElement: () => $(`[data-id='${itemId}']`).get(0),
});
},
"tap .addContainer": function(event){
"click .addContainer": function(event, instance){
var containerId = Containers.insert({
name: "New Container",
isCarried: true,
charId: this._id,
});
GlobalUI.setDetail({
pushDialogStack({
template: "containerDialog",
data: {
containerId: containerId,
charId: this.charId,
startEditing: true,
},
heroId: containerId,
element: event.currentTarget,
returnElement: instance.find(`.itemContainer[data-id='${containerId}']`),
});
},
"tap .weightCarried": function(event) {
"click .weightCarried": function(event, instance) {
var charId = this._id;
GlobalUI.setDetail({
pushDialogStack({
template: "carryDialog",
data: {charId: charId, color: "green"},
heroId: charId + "weightCarried",
element: event.currentTarget.parentElement,
});
},
"tap .buff": function(event){
"click .buff": function(event, instance){
var buffId = this._id;
var charId = Template.parentData()._id;
GlobalUI.setDetail({
pushDialogStack({
template: "buffDialog",
data: {buffId: buffId, charId: charId},
heroId: buffId,
element: event.currentTarget,
});
},
"tap .inventoryItem": function(event){
"click .inventoryItem": function(event, instance){
var itemId = this._id;
var charId = Template.parentData()._id;
GlobalUI.setDetail({
pushDialogStack({
template: "itemDialog",
data: {itemId: itemId, charId: charId},
heroId: itemId,
element: event.currentTarget,
returnElement: () => $(`[data-id='${itemId}']`).get(0),
});
},
"hold .inventoryItem": function(event, instance) {
var itemId = this._id;
var charId = Template.parentData()._id;
var containerId = this.parent.id;
GlobalUI.showDialog({
template: "moveItemDialog",
data: {
charId: charId,
itemId: itemId,
containerId: containerId,
},
heading: "Move " + this.pluralName(),
});
},
"tap .incrementButtons": function(event) {
"click .incrementButtons": function(event, instance) {
event.stopPropagation();
},
"tap .addItemQuantity": function(event) {
"click .addItemQuantity": function(event, instance) {
var itemId = this._id;
Items.update(itemId, {$set: {quantity: this.quantity + 1}});
},
"tap .subItemQuantity": function(event) {
"click .subItemQuantity": function(event, instance) {
var itemId = this._id;
Items.update(itemId, {$set: {quantity: this.quantity - 1}});
},
"tap .itemContainer .top": function(event){
GlobalUI.setDetail({
"click .itemContainer .top": function(event, instance){
pushDialogStack({
template: "containerDialog",
data: {containerId: this._id, charId: this.charId},
heroId: this._id,
element: event.currentTarget.parentElement,
});
},
"tap .carriedCheckbox": function(event){
"click .carriedCheckbox": function(event, instance){
event.stopPropagation();
},
"change .carriedCheckbox": function(event){
"change .carriedCheckbox": function(event, instance){
var carried;
if (this.isCarried) carried = false;
else carried = true;
@@ -271,7 +260,7 @@ Template.layout.events({
var itemId = event.originalEvent.dataTransfer.getData("dicecloud-id/items");
if (event.ctrlKey){
//split the stack to the container
GlobalUI.showDialog({
pushDialogStack({
template: "splitStackDialog",
data: {
id: itemId,
@@ -294,12 +283,11 @@ Template.layout.events({
var itemId = event.originalEvent.dataTransfer.getData("dicecloud-id/items");
if (event.ctrlKey){
//split the stack to the container
GlobalUI.showDialog({
pushDialogStack({
template: "splitStackDialog",
data: {
id: itemId,
parentCollection: "Characters",
parentId: this._id,
},
});
} else {
@@ -312,7 +300,7 @@ Template.layout.events({
var itemId = event.originalEvent.dataTransfer.getData("dicecloud-id/items");
if (event.ctrlKey){
//split the stack to the container
GlobalUI.showDialog({
pushDialogStack({
template: "splitStackDialog",
data: {
id: itemId,

View File

@@ -9,11 +9,11 @@
</template>
<template name="itemDetails">
<div layout horizontal wrap center justified class="headline">
<div class="paper-font-headline layout horizontal wrap center justified">
{{#if weight}}<div class="sideMargin">{{round totalWeight}}lbs</div>{{/if}}
{{#if value}}<div>{{valueString totalValue}}</div>{{/if}}
</div>
<div layout horizontal wrap class="caption">
<div class="paper-font-caption layout horizontal wrap">
{{#if enabled}}<div class="vertMargin" style="margin-right: 16px">Equipped</div>{{/if}}
{{#if requiresAttunement}}<div class="vertMargin">Requires Attunement</div>{{/if}}
</div>
@@ -26,74 +26,47 @@
</template>
<template name="itemEdit">
<paper-input class="fullwidth" id="itemNameInput" label="Name" floatinglabel value={{name}}></paper-input>
<div layout horizontal wrap>
<paper-input-decorator label="Quantity"
floatinglabel
style="width: 80px">
<input id="quantityInput"
type="number"
value={{quantity}}>
</paper-input-decorator>
<paper-input class="fullwidth" id="itemNameInput" label="Name" value={{name}}></paper-input>
<div class="layout horizontal center wrap">
<paper-input id="quantityInput" type="number" label="Quantity" style="width: 80px" value={{quantity}}>
</paper-input>
{{# if ne1 quantity}}
<paper-input flex id="itemPluralInput"
label="Plural Name"
floatinglabel
value={{plural}}></paper-input>
<paper-input class="flex" id="itemPluralInput" label="Plural Name" value={{plural}} style="flex-basis: 182px;">
</paper-input>
{{else}}
<div class="flex" style="flex-basis: 182px;">
</div>
{{/if}}
</div>
<div center horizontal layout>
<div class="padded">Show increment buttons</div>
<paper-checkbox id="incrementCheckbox"
checked={{settings.showIncrement}}>
<paper-checkbox id="incrementCheckbox" checked={{settings.showIncrement}}>
Show increment buttons
</paper-checkbox>
</div>
<hr class="vertMargin">
<div layout horizontal wrap justified>
<div center horizontal layout>
<div class="padded">Container</div>
<div class="layout horizontal center wrap justified" style="margin-top: 16px;">
{{> containerDropdown}}
</div>
<div center horizontal layout>
<div class="padded">Equipped</div>
<paper-toggle-button id="equippedInput"
checked={{enabled}}
role="button"
aria-pressed="false"
tabindex="0"
touch-action="pan-y">
<paper-toggle-button id="equippedInput" checked={{enabled}}>
Equipped
</paper-toggle-button>
</div>
<div center horizontal layout>
<div class="padded">Requires Attunement</div>
<paper-checkbox id="attunementCheckbox"
checked={{requiresAttunement}}>
<paper-checkbox id="attunementCheckbox" checked={{requiresAttunement}}>
Requires Attunement
</paper-checkbox>
</div>
</div>
<hr class="vertMargin">
<div layout horizontal around-justified>
<paper-input-decorator label="Weight Each (lbs)" floatinglabel>
<input id="weightInput" type="number" value={{weight}}>
</paper-input-decorator>
<div class="layout horizontal around-justified" style="margin-top: 16px;">
<paper-input id="weightInput" type="number" value={{weight}} label="Weight Each (lbs)">
</paper-input>
<!--Value-->
<paper-input-decorator label="Value Each (GP)" floatinglabel>
<input id="valueInput" type="number" value={{value}}>
</paper-input-decorator>
<paper-input id="valueInput" type="number" value={{value}} label="Value Each (GP)">
</paper-input>
</div>
<hr class="vertMargin">
<!--Description-->
<paper-input-decorator label="Description" floatinglabel layout vertical>
<paper-autogrow-textarea>
<textarea id="itemDescriptionInput" placeholder aria-label="Description" value={{description}}></textarea>
</paper-autogrow-textarea>
</paper-input-decorator>
<paper-textarea id="itemDescriptionInput" label="Description" value={{description}}>
<div suffix>
<paper-tooltip position="left" animation-delay="0">This field accepts formulae in {curly brackets}</paper-tooltip>
<iron-icon icon="dicecloud:code-braces"></iron-icon>
</div>
</paper-textarea>
<!--Effects-->
{{> effectsEditList parentId=_id parentCollection="Items" charId=charId enabled=equipped name=name}}
<!--Attacks-->
@@ -101,13 +74,11 @@
</template>
<template name="containerDropdown">
<paper-dropdown-menu id="containerDropDown" label="Container">
<paper-dropdown layered class="dropdown">
<core-menu class="menu" selected={{parent.id}}>
<paper-dropdown-menu label="Container">
<dicecloud-selector class="dropdown-content" id="containerDropDown" selected={{parent.id}}>
{{#each containers}}
<paper-item name={{_id}} class="containerMenuItem">{{name}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</dicecloud-selector>
</paper-dropdown-menu>
</template>

View File

@@ -27,60 +27,95 @@ Template.itemDialog.helpers({
});
Template.itemDialog.events({
"tap #editButton": function(event, instance){
"click #editButton": function(event, instance){
instance.editing.set(true);
},
"tap #doneEditingButton": function(event, instance){
"click #doneEditingButton": function(event, instance){
instance.editing.set(false);
},
"color-change": function(event, instance){
Items.update(instance.data.itemId, {$set: {color: event.color}});
},
"tap #deleteButton": function(event, instance){
"click #deleteButton": function(event, instance){
Items.softRemoveNode(instance.data.itemId);
GlobalUI.deletedToast(instance.data.itemId, "Items", "Item");
GlobalUI.closeDetail();
popDialogStack();
},
});
Template.itemEdit.onRendered(function(){
updatePolymerInputs(this);
});
Template.itemEdit.helpers({
ne1: function(num){
return num != 1;
},
});
const debounce = (f) => _.debounce(f, 200);
Template.itemEdit.events({
//TODO validate input (integer, non-negative, etc) for these inputs and give validation errors
"change #itemNameInput": function(event){
var name = Template.instance().find("#itemNameInput").value;
Items.update(this._id, {$set: {name: name}});
},
"change #itemPluralInput": function(event){
var plural = Template.instance().find("#itemPluralInput").value;
Items.update(this._id, {$set: {plural: plural}});
},
"change #quantityInput": function(event){
var quantity = +Template.instance().find("#quantityInput").value;
Items.update(this._id, {$set: {quantity: quantity}});
},
"change #weightInput": function(event){
var weight = +Template.instance().find("#weightInput").value;
Items.update(this._id, {$set: {weight: weight}});
},
"change #valueInput": function(event){
var value = +Template.instance().find("#valueInput").value;
Items.update(this._id, {$set: {value: value}});
},
"change #itemDescriptionInput": function(event){
var description = Template.instance().find("#itemDescriptionInput").value;
Items.update(this._id, {$set: {description: description}});
},
"input #itemNameInput": debounce(function(event, instance){
const input = event.currentTarget;
var name = input.value;
if (!name){
input.invalid = true;
input.errorMessage = "Name is required";
} else {
input.invalid = false;
Items.update(this._id, {
$set: {name: name}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}
}),
"input #itemPluralInput": debounce(function(event, instance){
var plural = event.currentTarget.value;
Items.update(this._id, {
$set: {plural: plural}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"input #quantityInput": debounce(function(event, instance){
var quantity = +event.currentTarget.value;
Items.update(this._id, {
$set: {quantity: quantity}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"input #weightInput": debounce(function(event, instance){
var weight = +event.currentTarget.value;
Items.update(this._id, {
$set: {weight: weight}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"input #valueInput": debounce(function(event, instance){
var value = +event.currentTarget.value;
Items.update(this._id, {
$set: {value: value}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"input #itemDescriptionInput": debounce(function(event, instance){
var description = event.currentTarget.value;
Items.update(this._id, {
$set: {description: description}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"change #equippedInput": function(event){
var equipped = Template.instance().find("#equippedInput").checked;
var equipped = event.currentTarget.checked;
if (equipped){
Meteor.call("equipItem", this._id, this.charId);
} else {
@@ -104,9 +139,8 @@ Template.containerDropdown.helpers({
});
Template.containerDropdown.events({
"core-select #containerDropDown": function(event){
"iron-select #containerDropDown": function(event){
var detail = event.originalEvent.detail;
if (!detail.isSelected) return;
var containerId = detail.item.getAttribute("name");
Meteor.call("moveItemToContainer", Template.currentData()._id, containerId);
}

View File

@@ -1,13 +1,29 @@
<!-- data needs to include id of item, parentCollection, parentId -->
<template name="splitStackDialog">
<div style="width: 300px; height: 110px;">
<paper-input-decorator label="Quantity" floatinglabel>
<input autoFocus id="quantityInput" type="number" value={{quantity}}>
</paper-input-decorator>
<div class="fit layout vertical">
<app-header-layout has-scrolling-region class="feedback flex">
<app-header fixed effects="waterfall">
<app-toolbar>
Split Stack
</app-toolbar>
</app-header>
<div class="form flex">
<paper-input autoFocus label="Quantity" id="quantityInput" type="number" value={{quantity}}>
</paper-input>
<div class="layout horizontal justified">
<paper-button id="oneButton"> One </paper-button>
<paper-button id="halfButton"> Half </paper-button>
<paper-button id="allButton"> All </paper-button>
</div>
<paper-button id="cancelButton" affirmative> Cancel </paper-button>
<paper-button id="moveButton" affirmative> Move </paper-button>
</div>
</app-header-layout>
<div class="buttons layout horizontal end-justified">
<paper-button id="cancelButton">
Cancel
</paper-button>
<paper-button id="moveButton">
move
</paper-button>
</div>
</div>
</template>

View File

@@ -1,3 +1,7 @@
Template.splitStackDialog.onRendered(function(){
this.find("#quantityInput").focus();
});
Template.splitStackDialog.helpers({
quantity: function(){
var item = Items.findOne(this.id);
@@ -6,22 +10,26 @@ Template.splitStackDialog.helpers({
});
Template.splitStackDialog.events({
"tap #moveButton": function(event, instance){
"click #moveButton": function(event, instance){
Meteor.call(
"splitItemToParent",
this.id,
+instance.find("#quantityInput").value,
{collection: this.parentCollection , id: this.parentId}
);
popDialogStack();
},
"tap #oneButton":function(event, instance){
"click #cancelButton": function(event, instance){
popDialogStack();
},
"click #oneButton":function(event, instance){
instance.find("#quantityInput").value = 1;
},
"tap #halfButton":function(event, instance){
"click #halfButton":function(event, instance){
var val = Math.round(Items.findOne(this.id).quantity / 2);
instance.find("#quantityInput").value = val;
},
"tap #allButton":function(event, instance){
"click #allButton":function(event, instance){
instance.find("#quantityInput").value = Items.findOne(this.id).quantity;
},
});

View File

@@ -8,7 +8,7 @@
</app-toolbar>
</app-header>
<div class="form">
<paper-input id="quantityInput" label="Hitpoint maximum" autoFocus type="number" value="" min="0" allowed-pattern="[0-9]">
<paper-input id="quantityInput" label="Hitpoint maximum" autofocus type="number" value="" min="0" allowed-pattern="[0-9]">
</paper-input>
<paper-input id="nameInput" label="Label"></paper-input>
<paper-checkbox id="deleteWhenZeroCheckbox">

View File

@@ -52,6 +52,7 @@
<link rel="import" href="/components/paper-toggle-button/paper-toggle-button.html">
<link rel="import" href="/components/paper-tooltip/paper-tooltip.html">
<link rel="import" href="/custom_components/dicecloud-icons/dicecloud-icons.html">
<link rel="import" href="/custom_components/dicecloud-selector/dicecloud-selector.html">
<link rel="import" href="/custom_components/paper-checkbox/paper-checkbox.html">
<link rel="import" href="/custom_components/paper-diff-slider/paper-diff-slider.html">

View File

@@ -71,6 +71,7 @@ const dialogOpenAnimation = ({element, returnElement, dialog}) => {
const dialogRect = dialog.getBoundingClientRect();
const elementRect = element.getBoundingClientRect();
element.style.visibility = "hidden";
returnElement = _.isFunction(returnElement) ? returnElement() : returnElement;
if (returnElement) returnElement.style.visibility = "hidden";
// Get how must the element change to become the dialog
const deltaLeft = elementRect.left - dialogRect.left;
@@ -98,9 +99,11 @@ const dialogOpenAnimation = ({element, returnElement, dialog}) => {
const dialogCloseAnimation = ({element, returnElement, dialog, callback}) => {
// We are returning to a different element
// pop the original element back in and use the returnElement in its place
if (returnElement){
returnElement = _.isFunction(returnElement) ? returnElement() : returnElement;
if (returnElement && returnElement !== element){
let originalElement = element;
element = returnElement;
originalElement.style.transition = "";
originalElement.style.visibility = "";
originalElement.style.transform = "scale(0)";
_.defer(() => {

View File

@@ -1,5 +1,5 @@
.mini-holder {
position: absolute;
position: fixed;
padding: 4px;
bottom: 80px;
right: 24px;
@@ -8,7 +8,7 @@
flex-direction: column-reverse !important;
}
.mini-holder core-tooltip{
.mini-holder > div{
transform: scale(0);
transition-property: transform;
transition-duration: 0.3s;
@@ -16,7 +16,7 @@
margin: 4px;
}
.mini-holder.active core-tooltip{
.mini-holder.active > div {
transform: scale(1);
}
@@ -24,18 +24,18 @@
pointer-events: auto;
}
.mini-holder.active core-tooltip:nth-child(2){
.mini-holder.active > div:nth-child(2){
transition-delay: 0.1s;
}
.mini-holder.active core-tooltip:nth-child(3){
.mini-holder.active > div:nth-child(3){
transition-delay: 0.2s;
}
.mini-holder.active core-tooltip:nth-child(4){
.mini-holder.active > div:nth-child(4){
transition-delay: 0.3s;
}
.mini-holder.active core-tooltip:nth-child(5){
.mini-holder.active > div:nth-child(5){
transition-delay: 0.4s;
}

View File

@@ -1,8 +1,7 @@
<template name="fabMenu">
<paper-fab class="floatyButton expand-menu {{#if active}}active{{/if}}"
icon="add"></paper-fab>
<div class="{{#if active}}active{{/if}} mini-holder"
layout vertical center>
<div class="{{#if active}}active{{/if}} mini-holder layout vertical center">
{{> UI.contentBlock}}
</div>
</template>

View File

@@ -2,6 +2,20 @@ Template.fabMenu.onCreated(function() {
this.active = new ReactiveVar(false);
});
Template.fabMenu.onRendered(function(){
const fab = this.find("paper-fab.expand-menu");
// Do a spin animation to turn the + icon into a x when active
this.autorun(() => {
const active = this.active.get();
const iconStyle = active ?
"transition: transform 0.3s ease; transform: rotate(225deg);" :
"transition: transform 0.3s ease;";
fab.updateStyles({
["--paper-fab-iron-icon"]: iconStyle,
});
})
});
Template.fabMenu.helpers({
active: function() {
return Template.instance().active.get();

View File

@@ -138,6 +138,7 @@ trackEncumbranceConditions = function(charId, templateInstance) {
});
};
// jscs:disable maximumLineLength
CONDITIONS = {
//Conditions
blind: {

View File

@@ -5,9 +5,9 @@
<style is="custom-style" include="iron-flex iron-flex-alignment iron-positioning">
:root {
--primary-color: #424242;
--light-primary-color: #666;
--dark-primary-color: #222;
--primary-color: #d13b2e;
--light-primary-color: #ff5a4b;
--dark-primary-color: #ad2a1f;
--accent-color: #d13b2e;
--light-accent-color: #ff5a4b;
@@ -43,4 +43,8 @@
--paper-checkbox-checked-color: rgba(255,255,255,0.30);
--paper-checkbox-checked-ink-color: #fff;
}
paper-input > iron-icon {
--iron-icon-width: 23px;
--iron-icon-height: 23px;
}
</style>

View File

@@ -0,0 +1,9 @@
<link rel="import" href="../../components/iron-icon/iron-icon.html">
<link rel="import" href="../../components/iron-iconset-svg/iron-iconset-svg.html">
<iron-iconset-svg name="dicecloud" size="24">
<svg><defs>
<g id="code-braces">
<path d="M8,3A2,2 0 0,0 6,5V9A2,2 0 0,1 4,11H3V13H4A2,2 0 0,1 6,15V19A2,2 0 0,0 8,21H10V19H8V14A2,2 0 0,0 6,12A2,2 0 0,0 8,10V5H10V3M16,3A2,2 0 0,1 18,5V9A2,2 0 0,0 20,11H21V13H20A2,2 0 0,0 18,15V19A2,2 0 0,1 16,21H14V19H16V14A2,2 0 0,1 18,12A2,2 0 0,1 16,10V5H14V3H16Z" />
</g>
</defs></svg>
</iron-iconset-svg>

24
us.stackdump Normal file
View File

@@ -0,0 +1,24 @@
MSYS-1.0.12 Build:2012-07-05 14:56
Exception: STATUS_NONCONTINUABLE_EXCEPTION at eip=77C10864
eax=0028EDB0 ebx=0028FEE0 ecx=00000000 edx=C0000008 esi=0028EE2C edi=00000000
ebp=0028EE14 esp=0028EDA4 program=us
cs=0023 ds=002B es=002B fs=0053 gs=002B ss=002B
Stack trace:
Frame Function Args
0028EE14 77C10864 (0028EE2C, 0028EE7C, 0028EE2C, 0028EE7C)
0028F2E0 77B90133 (00320114, 00000000, 00320238, 00000000)
0028F2F8 77BB8EE2 (00320114, 0028F358, 0028F588, 6803B9F5)
0028F588 6803BA01 (00320000, 00330F38, 68037457, 00000022)
0028FC38 6803AF8F (00320000, 00660065, 006E0061, 005A002E)
0028FCD8 6803ADC4 (00320000, 0028FD20, 0028FD28, 6803B334)
0028FD28 6803B33E (00320000, 0028FD88, 00000000, 68029DE3)
0028FD48 68039AE6 (00320000, 680F7174, 00011044, 00000000)
0028FE98 68052117 (680A4C64, 00000000, 0028FEE8, 680044EA)
0028FEE8 68004709 (00000000, 00000000, 0028FF28, 0048BC00)
0028FF08 68004C5F (00401248, 00000000, 00000000, 00000000)
0028FF28 68004C98 (00000000, 00000000, 00000000, 00000000)
0028FF58 0048BB08 (00401248, 00000000, 00000000, 00000000)
0028FF88 0040103D (7EFDE000, 0028FFD4, 77BB9F72, 7EFDE000)
0028FF94 755F33AA (7EFDE000, 7D5558E1, 00000000, 00000000)
0028FFD4 77BB9F72 (00401000, 7EFDE000, 00000000, 00000000)
End of stack trace (more stack frames may be present)