Moved views out of private folder
This commit is contained in:
Stefan Zermatten
@@ -0,0 +1,85 @@
|
||||
<template name="featureDialog">
|
||||
{{#with feature}}
|
||||
{{#baseDialog title=name class=colorClass startEditing=../startEditing}}
|
||||
{{> featureDetails}}
|
||||
{{else}}
|
||||
{{> featureEdit}}
|
||||
{{/baseDialog}}
|
||||
{{/with}}
|
||||
</template>
|
||||
|
||||
<template name="featureDetails">
|
||||
{{#if or canEnable hasUses}}
|
||||
<div layout horizontal center justified wrap>
|
||||
{{#if canEnable}}
|
||||
<div>enabled:</div>
|
||||
<paper-checkbox class="sideMargin" checked={{enabled}}></paper-checkbox>
|
||||
{{/if}}
|
||||
{{#if hasUses}}
|
||||
<div class="subhead" style="margin-right: 16px">
|
||||
Uses: {{usesLeft}}/{{usesValue}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#if hasUses}}
|
||||
<div layout horizontal>
|
||||
<paper-button class="useFeature" disabled={{noUsesLeft}}>Use</paper-button>
|
||||
<paper-button class="resetFeature" disabled={{usesFull}}>Reset</paper-button>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<hr class="vertMargin">
|
||||
{{/if}}
|
||||
|
||||
{{#if description}}
|
||||
<div>{{#markdown}}{{evaluateString charId description}}{{/markdown}}</div>
|
||||
{{/if}}
|
||||
|
||||
{{> effectsViewList charId=charId parentId=_id}}
|
||||
{{> proficiencyViewList charId=charId parentId=_id}}
|
||||
</template>
|
||||
|
||||
<template name="featureEdit">
|
||||
<!--name-->
|
||||
<paper-input id="featureNameInput" class="fullwidth" label="Name" floatinglabel value={{name}}></paper-input>
|
||||
|
||||
<hr class="vertMargin">
|
||||
|
||||
<div layout horizontal center style="height: 60px;">
|
||||
<paper-dropdown-menu id="enabledDropdown" label="Enable Feature">
|
||||
<paper-dropdown layered class="dropdown">
|
||||
<core-menu id="enabledMenu" class="menu" selected={{enabledSelection}} on-tap="onStatMenuTap">
|
||||
<paper-item name="alwaysEnabled"> Always Enabled </paper-item>
|
||||
<paper-item name="enabled"> Enabled </paper-item>
|
||||
<paper-item name="disabled"> Disabled </paper-item>
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
</paper-dropdown-menu>
|
||||
<div layout horizontal center class="sideMargin">
|
||||
<div>Limit Uses: </div>
|
||||
<paper-toggle-button id="limitUseCheck"
|
||||
class="sideMargin"
|
||||
checked={{usesSet}}
|
||||
role="button"
|
||||
aria-pressed="false"
|
||||
tabindex="0"
|
||||
touch-action="pan-y">
|
||||
</paper-toggle-button>
|
||||
</div>
|
||||
{{#if usesSet}}
|
||||
<paper-input flex id="usesInput" label="Uses" floatinglabel value={{uses}}></paper-input>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<hr class="vertMargin">
|
||||
|
||||
<!--description-->
|
||||
<paper-input-decorator label="Description" floatinglabel layout vertical>
|
||||
<paper-autogrow-textarea>
|
||||
<textarea id="featureDescriptionInput" placeholder aria-label="Description" value={{description}}></textarea>
|
||||
</paper-autogrow-textarea>
|
||||
</paper-input-decorator>
|
||||
|
||||
{{> effectsEditList parentId=_id parentCollection="Features" charId=charId name=name enabled=enabled}}
|
||||
{{> proficiencyEditList parentId=_id parentCollection="Features" charId=charId enabled=enabled}}
|
||||
</template>
|
||||
@@ -0,0 +1,109 @@
|
||||
Template.featureDialog.helpers({
|
||||
feature: function(){
|
||||
return Features.findOne(this.featureId);
|
||||
},
|
||||
});
|
||||
|
||||
Template.featureDialog.events({
|
||||
"color-change": function(event, instance){
|
||||
Features.update(instance.data.featureId, {$set: {color: event.color}});
|
||||
},
|
||||
"tap #deleteButton": function(event, instance){
|
||||
Features.softRemoveNode(instance.data.featureId);
|
||||
GlobalUI.deletedToast(instance.data.featureId, "Features", "Feature");
|
||||
GlobalUI.closeDetail();
|
||||
},
|
||||
});
|
||||
|
||||
Template.featureDetails.helpers({
|
||||
or: function(a, b){
|
||||
return a || b;
|
||||
},
|
||||
hasUses: function(){
|
||||
return this.usesValue() > 0;
|
||||
},
|
||||
noUsesLeft: function(){
|
||||
return this.usesLeft() <= 0;
|
||||
},
|
||||
usesFull: function(){
|
||||
return this.usesLeft() >= this.usesValue();
|
||||
},
|
||||
});
|
||||
|
||||
Template.featureDetails.events({
|
||||
"tap .useFeature": function(event){
|
||||
var featureId = this._id;
|
||||
Features.update(featureId, {$inc: {used: 1}});
|
||||
},
|
||||
"tap .resetFeature": function(event){
|
||||
var featureId = this._id;
|
||||
Features.update(featureId, {$set: {used: 0}});
|
||||
},
|
||||
|
||||
"change .enabledCheckbox": function(event){
|
||||
var enabled = !this.enabled;
|
||||
Features.update(this._id, {$set: {enabled: enabled}});
|
||||
},
|
||||
});
|
||||
|
||||
Template.featureEdit.onRendered(function(){
|
||||
updatePolymerInputs(this);
|
||||
});
|
||||
|
||||
Template.featureEdit.helpers({
|
||||
usesSet: function(){
|
||||
return _.isString(this.uses);
|
||||
},
|
||||
enabledSelection: function(){
|
||||
if (this.enabled){
|
||||
if (this.alwaysEnabled){
|
||||
return "alwaysEnabled";
|
||||
} else {
|
||||
return "enabled";
|
||||
}
|
||||
} else if (this.enabled === false){ //make sure it is false, not just falsey
|
||||
return "disabled";
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
Template.featureEdit.events({
|
||||
"change #featureNameInput": function(event){
|
||||
var name = Template.instance().find("#featureNameInput").value;
|
||||
Features.update(this._id, {$set: {name: name}});
|
||||
},
|
||||
"change #featureDescriptionInput": function(event){
|
||||
var description = Template.instance().find("#featureDescriptionInput").value;
|
||||
Features.update(this._id, {$set: {description: description}});
|
||||
},
|
||||
"change #limitUseCheck": function(event){
|
||||
var currentUses = this.uses;
|
||||
var featureId = this._id;
|
||||
if (event.target.checked && !_.isString(currentUses)){
|
||||
Features.update(featureId, {$set: {uses: ""}}, {removeEmptyStrings: false});
|
||||
} else if (!event.target.checked && _.isString(currentUses)){
|
||||
Features.update(featureId, {$unset: {uses: ""}});
|
||||
}
|
||||
},
|
||||
"change #usesInput, input #quantityInput": function(event){
|
||||
var value = event.target.value;
|
||||
var featureId = this._id;
|
||||
Features.update(featureId, {$set: {uses: value}});
|
||||
},
|
||||
"core-select #enabledDropdown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var value = detail.item.getAttribute("name");
|
||||
var setter;
|
||||
if (value === "enabled"){
|
||||
setter = {enabled: true, alwaysEnabled: false};
|
||||
} else if (value === "disabled"){
|
||||
setter = {enabled: false, alwaysEnabled: false};
|
||||
} else {
|
||||
setter = {enabled: true, alwaysEnabled: true};
|
||||
}
|
||||
if (setter.enabled === this.enabled &&
|
||||
setter.alwaysEnabled === this.alwaysEnabled) return;
|
||||
Features.update(this._id, {$set: setter});
|
||||
},
|
||||
});
|
||||
57
rpg-docs/client/views/character/features/features.css
Normal file
57
rpg-docs/client/views/character/features/features.css
Normal file
@@ -0,0 +1,57 @@
|
||||
.containerTop {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.features {
|
||||
display: flex !important;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
flex-wrap: wrap;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.featureCardTop {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.containerMain.featureDescription {
|
||||
white-space: pre-line;
|
||||
}
|
||||
|
||||
.resourceCards paper-material.healthCard {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/*To change the ink color for checked state:*/
|
||||
.containerTop paper-checkbox::shadow #ink[checked] {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/*To change the checkbox checked color:*/
|
||||
.containerTop paper-checkbox::shadow #checkbox.checked {
|
||||
background-color: #ffffff;
|
||||
background-color: rgba(255,255,255,0.27);
|
||||
border-color: #ffffff;
|
||||
border-color: rgba(255,255,255,0.27);
|
||||
}
|
||||
|
||||
/*ensure the checkmark is shown when ticked*/
|
||||
.containerTop paper-checkbox::shadow #checkbox.checked #checkmark {
|
||||
display: initial;
|
||||
}
|
||||
|
||||
/*To change the ink color for unchecked state:*/
|
||||
.containerTop paper-checkbox::shadow #ink {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/*To change the checkbox unchecked color:*/
|
||||
.containerTop paper-checkbox::shadow #checkbox {
|
||||
border-color: #ffffff;
|
||||
border-color: rgba(255,255,255,0.54);
|
||||
}
|
||||
|
||||
/*ensure checkmark isn't shown early*/
|
||||
.containerTop paper-checkbox::shadow #checkbox #checkmark {
|
||||
display: none;
|
||||
}
|
||||
174
rpg-docs/client/views/character/features/features.html
Normal file
174
rpg-docs/client/views/character/features/features.html
Normal file
@@ -0,0 +1,174 @@
|
||||
<template name="features">
|
||||
<div fit>
|
||||
<div class="scroll-y" fit>
|
||||
<div class="column-container">
|
||||
<!--expertiseDice-->
|
||||
{{>resource name="expertiseDice" title="Expertise Dice" color="teal" char=this}}
|
||||
<!--ki-->
|
||||
{{>resource name="ki" title="Ki Points" color="teal" char=this}}
|
||||
<!--rages-->
|
||||
{{>resource name="rages" title="Rages" color="teal" char=this}}
|
||||
<!--sorceryPoints-->
|
||||
{{>resource name="sorceryPoints" title="Sorcery Points" color="teal" char=this}}
|
||||
<!--superiorityDice-->
|
||||
{{>resource name="superiorityDice" title="Superiority Dice" color="teal" char=this}}
|
||||
|
||||
<!--Attacks-->
|
||||
<div>
|
||||
<paper-material class="card">
|
||||
<div class="top white">
|
||||
Attacks
|
||||
</div>
|
||||
<div class="bottom list">
|
||||
{{#each attacks}}
|
||||
<div class="item-slot">
|
||||
<div class="flexible attack item"
|
||||
hero-id="main" {{detailHero}}>
|
||||
<div layout horizontal>
|
||||
<div class="headline"
|
||||
style="margin-right: 16px;"
|
||||
layout horizontal center>
|
||||
{{evaluateSigned ../_id attackBonus}}
|
||||
</div>
|
||||
<div flex layout vertical>
|
||||
<div class="body2">
|
||||
{{name}}
|
||||
</div>
|
||||
<div>
|
||||
{{evaluateString ../_id damage}} {{damageType}}
|
||||
</div>
|
||||
{{#if details}}
|
||||
<div class="caption">
|
||||
{{details}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</paper-material>
|
||||
</div>
|
||||
|
||||
<!--Proficiencies-->
|
||||
<div>
|
||||
<paper-material class="card">
|
||||
<div class="white top">
|
||||
Proficiencies
|
||||
</div>
|
||||
<div flex class="bottom list">
|
||||
{{#if weaponProfs.count}}
|
||||
<div class="subhead">Weapons</div>
|
||||
{{/if}}
|
||||
{{#each weaponProfs}}
|
||||
{{> proficiencyListItem}}
|
||||
{{/each}}
|
||||
{{#if armorProfs.count}}
|
||||
<div class="subhead">Armor</div>
|
||||
{{/if}}
|
||||
{{#each armorProfs}}
|
||||
{{> proficiencyListItem}}
|
||||
{{/each}}
|
||||
{{#if toolProfs.count}}
|
||||
<div class="subhead">Tools</div>
|
||||
{{/if}}
|
||||
{{#each toolProfs}}
|
||||
{{> proficiencyListItem}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</paper-material>
|
||||
</div>
|
||||
|
||||
<!--features-->
|
||||
{{#each features}}
|
||||
<div>
|
||||
<paper-material class="card featureCard"
|
||||
hero-id="main" {{detailHero}}>
|
||||
<div class="top {{colorClass}} subhead"
|
||||
layout horizontal
|
||||
hero-id="toolbar" {{detailHero}}>
|
||||
<div flex hero-id="title" {{detailHero}}>
|
||||
{{name}}
|
||||
</div>
|
||||
{{#if hasUses}}
|
||||
<div style="margin-right: 8px">
|
||||
{{usesLeft}}/{{usesValue}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#if canEnable}}
|
||||
<core-tooltip label="Feature enabled"
|
||||
position="left">
|
||||
<paper-checkbox class="enabledCheckbox"
|
||||
checked={{enabled}}
|
||||
disabled={{#unless canEditCharacter charId}}true{{/unless}}>
|
||||
</paper-checkbox>
|
||||
</core-tooltip>
|
||||
{{/if}}
|
||||
</div>
|
||||
{{#if description}}
|
||||
<div flex class="bottom">
|
||||
{{#markdown}}{{evaluateString charId shortDescription}}{{/markdown}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#if hasUses}}
|
||||
<div layout horizontal center end-justified>
|
||||
<paper-button class="useFeature"
|
||||
disabled={{noUsesLeft}}>
|
||||
Use
|
||||
</paper-button>
|
||||
<paper-button class="resetFeature"
|
||||
disabled={{usesFull}}>
|
||||
Reset
|
||||
</paper-button>
|
||||
</div>
|
||||
{{/if}}
|
||||
</paper-material>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
<div class="fab-buffer"></div>
|
||||
</div>
|
||||
{{#if canEditCharacter _id}}
|
||||
<paper-fab id="addFeature"
|
||||
class="floatyButton"
|
||||
icon="add"
|
||||
title="Add"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
aria-label="Add"
|
||||
hero-id="main"></paper-fab>
|
||||
{{/if}}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="resource">
|
||||
{{#if characterCalculate "attributeBase" char._id name}}
|
||||
<div>
|
||||
<paper-material class="card"
|
||||
hero-id="main" {{detailHero name char._id}}
|
||||
layout horizontal>
|
||||
<div class="left {{getColor}} display1 white-text"
|
||||
hero-id="toolbar" {{detailHero name char._id}}
|
||||
layout horizontal center>
|
||||
<div style="margin-right: 8px;">
|
||||
<paper-icon-button class="resourceUp"
|
||||
icon="arrow-drop-up"
|
||||
disabled={{cantIncrement}}>
|
||||
</paper-icon-button>
|
||||
<paper-icon-button class="resourceDown"
|
||||
icon="arrow-drop-down"
|
||||
disabled={{cantDecrement}}>
|
||||
</paper-icon-button>
|
||||
</div>
|
||||
<div>{{characterCalculate "attributeValue" char._id name}}</div>
|
||||
<!--<div>/{{char.attributeBase name}}</div>-->
|
||||
</div>
|
||||
<div class="right clickable"
|
||||
flex layout horizontal center>
|
||||
{{title}}
|
||||
</div>
|
||||
</paper-material>
|
||||
</div>
|
||||
{{/if}}
|
||||
</template>
|
||||
149
rpg-docs/client/views/character/features/features.js
Normal file
149
rpg-docs/client/views/character/features/features.js
Normal file
@@ -0,0 +1,149 @@
|
||||
Template.features.helpers({
|
||||
features: function(){
|
||||
var features = Features.find({charId: this._id}, {sort: {color: 1, name: 1}});
|
||||
return features;
|
||||
},
|
||||
shortDescription: function() {
|
||||
if (_.isString(this.description)){
|
||||
return this.description.split(/^( *[-*_]){3,} *(?:\n+|$)/m)[0];
|
||||
}
|
||||
},
|
||||
hasUses: function(){
|
||||
return this.usesValue() > 0;
|
||||
},
|
||||
noUsesLeft: function(){
|
||||
return this.usesLeft() <= 0 || !canEditCharacter(this.charId);
|
||||
},
|
||||
usesFull: function(){
|
||||
return this.usesLeft() >= this.usesValue() || !canEditCharacter(this.charId);
|
||||
},
|
||||
colorClass: function(){
|
||||
return getColorClass(this.color);
|
||||
},
|
||||
featureOrder: function(){
|
||||
return _.indexOf(_.keys(colorOptions), this.color);
|
||||
},
|
||||
attacks: function(){
|
||||
return Attacks.find(
|
||||
{charId: this._id, enabled: true},
|
||||
{sort: {color: 1, name: 1}});
|
||||
},
|
||||
canEnable: function(){
|
||||
return !this.alwaysEnabled;
|
||||
},
|
||||
weaponProfs: function(){
|
||||
return Proficiencies.find({charId: this._id, type: "weapon"});
|
||||
},
|
||||
armorProfs: function(){
|
||||
return Proficiencies.find({charId: this._id, type: "armor"});
|
||||
},
|
||||
toolProfs: function(){
|
||||
return Proficiencies.find({charId: this._id, type: "tool"});
|
||||
},
|
||||
});
|
||||
|
||||
Template.features.events({
|
||||
"tap #addFeature": function(event){
|
||||
var featureId = Features.insert({
|
||||
name: "New Feature",
|
||||
charId: this._id,
|
||||
enabled: true,
|
||||
alwaysEnabled: true,
|
||||
});
|
||||
GlobalUI.setDetail({
|
||||
template: "featureDialog",
|
||||
data: {featureId: featureId, charId: this._id, startEditing: true},
|
||||
heroId: featureId,
|
||||
});
|
||||
},
|
||||
"tap #addAttackButton": function(event){
|
||||
var charId = this._id;
|
||||
Attacks.insert({
|
||||
charId: charId
|
||||
}, function(error, id){
|
||||
if (!error){
|
||||
GlobalUI.setDetail({
|
||||
template: "attackDialog",
|
||||
data: {attackId: id, charId: charId},
|
||||
heroId: id,
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
"tap .featureCard .top": function(event){
|
||||
var featureId = this._id;
|
||||
var charId = Template.parentData()._id;
|
||||
GlobalUI.setDetail({
|
||||
template: "featureDialog",
|
||||
data: {featureId: featureId, charId: charId},
|
||||
heroId: featureId,
|
||||
});
|
||||
},
|
||||
"tap .attack": function(event){
|
||||
openParentDialog(this.parent, this.charId, this._id);
|
||||
},
|
||||
"tap .useFeature": function(event){
|
||||
var featureId = this._id;
|
||||
Features.update(featureId, {$inc: {used: 1}});
|
||||
},
|
||||
"tap .resetFeature": function(event){
|
||||
var featureId = this._id;
|
||||
Features.update(featureId, {$set: {used: 0}});
|
||||
},
|
||||
"tap .enabledCheckbox": function(event){
|
||||
event.stopPropagation();
|
||||
},
|
||||
"change .enabledCheckbox": function(event){
|
||||
var enabled = !this.enabled;
|
||||
Features.update(this._id, {$set: {enabled: enabled}});
|
||||
},
|
||||
});
|
||||
|
||||
Template.resource.helpers({
|
||||
cantIncrement: function(){
|
||||
var value = Characters.calculate.attributeValue(this.char._id, this.name);
|
||||
var base = Characters.calculate.attributeBase(this.char._id, this.name);
|
||||
var baseBigger = value < base;
|
||||
return !baseBigger || !canEditCharacter(this.char._id);
|
||||
},
|
||||
cantDecrement: function(){
|
||||
var value = Characters.calculate.attributeValue(this.char._id, this.name);
|
||||
var valuePositive = value > 0;
|
||||
return !valuePositive || !canEditCharacter(this.char._id);
|
||||
},
|
||||
getColor: function(){
|
||||
var value = Characters.calculate.attributeValue(this.char._id, this.name);
|
||||
if (value > 0){
|
||||
return this.color;
|
||||
} else {
|
||||
return "grey";
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
Template.resource.events({
|
||||
"tap .resourceUp": function(event){
|
||||
var value = Characters.calculate.attributeValue(this.char._id, this.name);
|
||||
var base = Characters.calculate.attributeBase(this.char._id, this.name);
|
||||
if (value < base){
|
||||
var modifier = {$inc: {}};
|
||||
modifier.$inc[this.name + ".adjustment"] = 1;
|
||||
Characters.update(this.char._id, modifier, {validate: false});
|
||||
}
|
||||
},
|
||||
"tap .resourceDown": function(event){
|
||||
var value = Characters.calculate.attributeValue(this.char._id, this.name);
|
||||
if (value > 0){
|
||||
var modifier = {$inc: {}};
|
||||
modifier.$inc[this.name + ".adjustment"] = -1;
|
||||
Characters.update(this.char._id, modifier, {validate: false});
|
||||
}
|
||||
},
|
||||
"tap .right": function(event, instance) {
|
||||
GlobalUI.setDetail({
|
||||
template: "attributeDialog",
|
||||
data: {name: this.title, statName: this.name, charId: this.char._id},
|
||||
heroId: this.char._id + this.name,
|
||||
});
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user