Added QR code and finished page 1
This commit is contained in:
Thaum Rystra
@@ -169,7 +169,7 @@ Template.characterSheet.helpers({
|
||||
return Session.get("isPrinting");
|
||||
},
|
||||
printUrl: function(){
|
||||
return `/character/${this._id}/${this.name || "-"}/print`
|
||||
return `/character/${this._id}/${this.urlName || "-"}/print`
|
||||
},
|
||||
selectedTab: function(){
|
||||
return getTab(this._id);
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
.printedAbility .title.paper-font-subhead {
|
||||
font-size: 2.5mm !important;
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
<template name="printedAttack">
|
||||
<div class="printedAttack" style="margin-bottom: 2mm">
|
||||
<div class="layout horizontal">
|
||||
<div class="paper-font-headline layout horizontal center"
|
||||
style="margin-right: 1mm; min-width: 32px; text-align: right;">
|
||||
{{evaluateAttackBonus charId attack}}
|
||||
</div>
|
||||
<div class="flex layout vertical">
|
||||
<div class="paper-font-body2">
|
||||
{{attack.name}}
|
||||
</div>
|
||||
<div>
|
||||
{{evaluateDamage charId attack}} {{attack.damageType}}
|
||||
</div>
|
||||
{{#if attack.details}}
|
||||
<div>
|
||||
{{attack.details}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,30 @@
|
||||
Template.printedAttack.helpers({
|
||||
evaluateAttackBonus: function(charId, attack) {
|
||||
if (attack.parent.collection == "Spells") {
|
||||
var spell = Spells.findOne(attack.parent.id);
|
||||
if (spell) {
|
||||
bonus = evaluate(charId, attack.attackBonus, {
|
||||
"spellListId": spell.parent.id
|
||||
});
|
||||
}
|
||||
} else {
|
||||
var bonus = evaluate(charId, attack.attackBonus);
|
||||
}
|
||||
|
||||
if (_.isFinite(bonus)) {
|
||||
return bonus > 0 ? "+" + bonus : "" + bonus;
|
||||
} else {
|
||||
return bonus;
|
||||
}
|
||||
},
|
||||
evaluateDamage: function(charId, attack) {
|
||||
if (attack.parent.collection == "Spells") {
|
||||
var spell = Spells.findOne(attack.parent.id);
|
||||
if (spell) {
|
||||
return evaluateSpellString(charId, spell.parent.id, attack.damage);
|
||||
}
|
||||
} else {
|
||||
return evaluateString(charId, attack.damage);
|
||||
}
|
||||
},
|
||||
});
|
||||
@@ -3,7 +3,6 @@
|
||||
padding: 6mm;
|
||||
page-break-inside: avoid;
|
||||
page-break-after: always;
|
||||
font-size: 3mm;
|
||||
}
|
||||
|
||||
.printed .shrink-to-fit {
|
||||
@@ -51,7 +50,7 @@
|
||||
position: relative;
|
||||
top: 4px;
|
||||
z-index: 1;
|
||||
padding: 2px 32px;
|
||||
padding: 2px 18px;
|
||||
background-image: url(/png/upwardPointingBorder.png);
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
@@ -79,7 +78,13 @@
|
||||
|
||||
.printed iron-icon {
|
||||
width: 16px;
|
||||
min-width: 16px;
|
||||
height: 16px;
|
||||
min-height: 16px;
|
||||
}
|
||||
|
||||
.printed .proficiencies, .printed .attacks, .printed .background {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.printed .shield-background {
|
||||
@@ -92,7 +97,6 @@
|
||||
width: 80px;
|
||||
height: 91px;
|
||||
position: relative;
|
||||
top: -6px;
|
||||
}
|
||||
|
||||
.printed .shield-background .paper-font-subhead {
|
||||
@@ -101,21 +105,44 @@
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.printed {
|
||||
font-size: 3mm;
|
||||
}
|
||||
|
||||
.printed .paper-font-body2 {
|
||||
font-size: 3mm;
|
||||
line-height: 4mm;
|
||||
}
|
||||
|
||||
.printed .paper-font-subhead {
|
||||
font-size: 3mm !important;
|
||||
line-height: 3.5mm !important;
|
||||
font-weight: bold !important;
|
||||
text-transform: uppercase !important;
|
||||
}
|
||||
|
||||
.printed .paper-font-subhead.modifier {
|
||||
font-size: 4mm !important;
|
||||
line-height: 6mm !important;
|
||||
}
|
||||
|
||||
.printed .paper-font-display1 {
|
||||
font-size: 8mm !important;
|
||||
font-size: 7mm !important;
|
||||
line-height: 12mm !important;
|
||||
}
|
||||
|
||||
.printed .paper-font-headline {
|
||||
font-size: 5mm !important;
|
||||
line-height: 6mm !important;
|
||||
}
|
||||
|
||||
.printed .lined-background {
|
||||
background-image: url(/png/horizontalLine.png);
|
||||
background-size: 100% 4mm;
|
||||
print-color-adjust: exact;
|
||||
-webkit-print-color-adjust: exact;
|
||||
}
|
||||
|
||||
@media screen {
|
||||
.printed .page {
|
||||
width: 210mm;
|
||||
@@ -153,4 +180,11 @@
|
||||
z-index: 99;
|
||||
background: #fff;
|
||||
}
|
||||
.printed .page-holder {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.printed .page {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<div class="flex character-name">
|
||||
{{name}}
|
||||
</div>
|
||||
<div>
|
||||
<div style="position: relative;">
|
||||
<paper-icon-button icon="print" class="printButton"></paper-icon-button>
|
||||
{{#simpleTooltip}} Print {{/simpleTooltip}}
|
||||
</div>
|
||||
@@ -16,15 +16,16 @@
|
||||
<div class="printed flex">
|
||||
<div class="page-holder">
|
||||
<div class="page">
|
||||
<div class="layout vertical">
|
||||
<div class="layout horizontal" style="margin-bottom: 6mm">
|
||||
<div class="layout vertical" style="height: 100%;">
|
||||
<div class="layout horizontal center" style="margin-bottom: 4mm">
|
||||
<img src="http://localhost:3000/crown-dice-logo-cropped-transparent.png" style="width: 60px; margin-right: 2mm">
|
||||
<div class="characterName paper-font-title" style="margin-right: 4mm">
|
||||
{{name}}
|
||||
</div>
|
||||
<div>
|
||||
<div class="paper-font-body2">
|
||||
<div>
|
||||
{{#each classes}}
|
||||
<span style="margin-right: 16px;">
|
||||
<span style="margin-right: 2mm;">
|
||||
{{name}} {{level}}
|
||||
</span>
|
||||
{{/each}}
|
||||
@@ -33,14 +34,25 @@
|
||||
{{character.alignment}} {{character.gender}} {{character.race}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout horizontal">
|
||||
<div class="col1 flex layout vertical">
|
||||
<div class="initiative" style="margin-bottom: 2mm;">
|
||||
{{> printedLongStat stat="" name="Inspiration" prefix=""}}
|
||||
<div class="flex layout vertical end" style="margin-right: 2mm;">
|
||||
<div class="paper-font-body2 " style="font-size: 5mm !important;">
|
||||
dicecloud.com
|
||||
</div>
|
||||
<div class="proficiencyBonus" style="margin-bottom: 4mm;">
|
||||
{{> printedLongStat stat="proficiencyBonus" name="Proficiency Bonus" prefix="+"}}
|
||||
<div>
|
||||
{{characterUrl}}
|
||||
</div>
|
||||
</div>
|
||||
<canvas id="qrCode"></canvas>
|
||||
</div>
|
||||
<div class="columns layout horizontal flex">
|
||||
<div class="col1 flex layout vertical">
|
||||
<div class="layout vertical center-justified" style="min-height: 100px; margin-bottom: 4mm;">
|
||||
<div class="initiative" style="margin-bottom: 2mm;">
|
||||
{{> printedLongStat stat="" name="Inspiration" prefix=""}}
|
||||
</div>
|
||||
<div class="proficiencyBonus">
|
||||
{{> printedLongStat stat="proficiencyBonus" name="Proficiency Bonus" prefix="+"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout horizontal">
|
||||
<div class="abilities layout vertical justified" style="margin-right: 4mm;">
|
||||
@@ -92,109 +104,136 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="proficiencies double-border" style="margin-top: 4mm">
|
||||
<div class="paper-font-subhead layout vertical center">
|
||||
<div class="proficiencies flex double-border" style="margin-top: 4mm">
|
||||
<div class="paper-font-subhead layout vertical center" style="margin-bottom: 2mm;">
|
||||
Proficiencies
|
||||
</div>
|
||||
<div>
|
||||
{{#if weaponProfs.length}}
|
||||
<div class="paper-font-subhead">Weapons</div>
|
||||
{{/if}}
|
||||
{{#each weaponProfs}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
{{#if armorProfs.length}}
|
||||
<div class="paper-font-subhead">Armor</div>
|
||||
{{/if}}
|
||||
{{#each armorProfs}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
<div class="layout horizontal">
|
||||
<div class="flex" style="margin-right: 2mm">
|
||||
{{#if armorProfs.length}}
|
||||
<div class="paper-font-subhead" style="margin-bottom: 1mm;">Armor</div>
|
||||
{{/if}}
|
||||
{{#each armorProfs}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
{{#if weaponProfs.length}}
|
||||
<div class="paper-font-subhead" style="margin: 2mm 0 1mm;">Weapons</div>
|
||||
{{/if}}
|
||||
{{#each weaponProfs}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{#if toolProfs.length}}
|
||||
<div class="paper-font-subhead">Tools</div>
|
||||
<div class="flex">
|
||||
<div class="paper-font-subhead" style="margin-bottom: 1mm;">Tools</div>
|
||||
{{#each toolProfs}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#each toolProfs}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col2 flex" style="margin-left: 4mm; margin-right: 4mm;">
|
||||
<div class="layout vertical">
|
||||
<div class="layout horizontal justified" style="margin-bottom: 2mm">
|
||||
<div class="armor">
|
||||
{{> printedSquareStat stat="armor" name="Armor Class" class="shield-background"}}
|
||||
</div>
|
||||
<div class="inititive">
|
||||
{{> printedSquareStat stat="initiative" name="Initiative" isSkill="true" class="double-border"}}
|
||||
</div>
|
||||
<div class="speed">
|
||||
{{> printedSquareStat stat="speed" name="Speed" class="double-border"}}
|
||||
</div>
|
||||
<div class="col2 flex layout vertical" style="margin-left: 4mm; margin-right: 4mm;">
|
||||
<div class="layout horizontal center justified" style="min-height: 100px; margin-bottom: 4mm;">
|
||||
<div class="armor">
|
||||
{{> printedSquareStat stat="armor" name="Armor Class" class="shield-background"}}
|
||||
</div>
|
||||
<div class="hitpoints layout vertical double-border" style="margin-bottom: 2mm;">
|
||||
<div class="inititive">
|
||||
{{> printedSquareStat stat="initiative" name="Initiative" isSkill="true" class="double-border"}}
|
||||
</div>
|
||||
<div class="speed">
|
||||
{{> printedSquareStat stat="speed" name="Speed" class="double-border"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="hitpoints layout vertical double-border" style="margin-bottom: 2mm;">
|
||||
<div>
|
||||
Hit point maximum:
|
||||
<span class="paper-font-subhead">
|
||||
{{characterCalculate "attributeBase" _id "hitPoints"}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex" style="width: 3cm; height: 2cm;">
|
||||
<!-- Space for writing -->
|
||||
</div>
|
||||
<div class="layout vertical center paper-font-subhead">
|
||||
Hit Points
|
||||
</div>
|
||||
</div>
|
||||
<div class="tempHitpoints layout vertical double-border" style="margin-bottom: 2mm;">
|
||||
<div style="width: 3cm; height: 1.5cm;">
|
||||
<!-- Space for writing -->
|
||||
</div>
|
||||
<div class="layout vertical center paper-font-subhead">
|
||||
Temporary Hit Points
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout horizontal" style="margin-bottom: 4mm;">
|
||||
<div class="hitDice double-border flex layout vertical" style="margin-right: 2mm;">
|
||||
<div>
|
||||
Hit point maximum:
|
||||
<span class="paper-font-subhead">
|
||||
{{characterCalculate "attributeBase" _id "hitPoints"}}
|
||||
Total:
|
||||
<span class="paper-font-subhead" style="text-transform: none !important;">
|
||||
{{hitDiceTotal}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex" style="width: 3cm; height: 2cm;">
|
||||
<div class="flex" style="min-height: 1cm;">
|
||||
<!-- Space for writing -->
|
||||
</div>
|
||||
<div class="layout vertical center paper-font-subhead">
|
||||
Hit Points
|
||||
<div class="paper-font-subhead layout vertical center">
|
||||
Hit Dice
|
||||
</div>
|
||||
</div>
|
||||
<div class="tempHitpoints layout vertical double-border" style="margin-bottom: 2mm;">
|
||||
<div style="width: 3cm; height: 2cm;">
|
||||
<!-- Space for writing -->
|
||||
<div class="deathSaves layout vertical center double-border">
|
||||
<div class="" style="margin-bottom: 1mm;">
|
||||
Successes
|
||||
</div>
|
||||
<div class="layout vertical center paper-font-subhead">
|
||||
Temporary Hit Points
|
||||
<div class="layout horizontal center">
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout horizontal">
|
||||
<div class="hitDice double-border layout vertical" style="margin-right: 2mm;">
|
||||
<div>
|
||||
Total:
|
||||
<span class="paper-font-subhead">
|
||||
Total goes here
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<!-- Space for writing -->
|
||||
</div>
|
||||
<div class="paper-font-subhead layout vertical center">
|
||||
Hit Dice
|
||||
</div>
|
||||
<div class="" style="margin: 1mm 0;">
|
||||
Failures
|
||||
</div>
|
||||
<div class="deathSaves layout vertical double-border">
|
||||
<div class="layout horizontal center">
|
||||
<div class="flex layout vertical end" style="margin-right: 1mm;">
|
||||
Successes
|
||||
</div>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
</div>
|
||||
<div class="layout horizontal center">
|
||||
<div class="flex layout vertical end" style="margin-right: 1mm;">
|
||||
Failures
|
||||
</div>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
</div>
|
||||
<div class="paper-font-subhead layout vertical center" style="margin-top: 4mm;">
|
||||
Death Saves
|
||||
</div>
|
||||
<div class="layout horizontal center">
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
<iron-icon icon="radio-button-unchecked"></iron-icon>
|
||||
</div>
|
||||
<div class="paper-font-subhead layout vertical center" style="margin-top: 2mm;">
|
||||
Death Saves
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="attacks"></div>
|
||||
|
||||
<div class="attacks double-border flex">
|
||||
<div class="paper-font-subhead layout vertical center" style="margin-bottom: 2mm;">
|
||||
Attacks
|
||||
</div>
|
||||
{{#each attack in attacks}}
|
||||
{{> printedAttack attack=attack charId=_id}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col3 flex">
|
||||
<div class="col3 flex layout vertical">
|
||||
<div class="Languages double-border" style="min-height: 100px; margin-bottom: 4mm;">
|
||||
<div class="paper-font-subhead layout vertical center" style="margin-bottom: 2mm;">
|
||||
Languages
|
||||
</div>
|
||||
<div class="layout horizontal">
|
||||
<div class="flex" style="margin-right: 2mm;">
|
||||
{{#each languageProfs.left}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{#if languageProfs.right.length}}
|
||||
<div class="flex">
|
||||
{{#each languageProfs.right}}
|
||||
{{> printedProficiency}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="traits double-border">
|
||||
{{#markdown}}{{evaluateShortString character._id character.personality}}{{/markdown}}
|
||||
<div class="paper-font-subhead layout vertical center">
|
||||
@@ -219,6 +258,14 @@
|
||||
Flaws
|
||||
</div>
|
||||
</div>
|
||||
<div class="background double-border flex layout vertical" style="margin-top: 2mm">
|
||||
<div class="paper-font-subhead layout vertical center" style="margin-bottom: 4mm">
|
||||
Notes
|
||||
</div>
|
||||
<div class="flex lined-background">
|
||||
<!-- lined space for writing -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
import QRCode from "qrcode"
|
||||
|
||||
Template.printedCharacterSheet.onRendered(function(){
|
||||
// Quickfit is only called once on rendering, text will not resize reactively
|
||||
this.$(".shrink-to-fit").quickfit({
|
||||
@@ -5,6 +7,15 @@ Template.printedCharacterSheet.onRendered(function(){
|
||||
max: 36,
|
||||
truncate: true,
|
||||
});
|
||||
let url = `https://dicecloud.com/character/${this.data._id}`;
|
||||
let canvas = this.find("#qrCode");
|
||||
QRCode.toCanvas(canvas, url, {
|
||||
margin: 0,
|
||||
width: 200,
|
||||
}, function(error){
|
||||
$(canvas).css("width", "60px").css("height", "60px");
|
||||
if (error) console.error(error)
|
||||
});
|
||||
});
|
||||
|
||||
Template.printedCharacterSheet.helpers({
|
||||
@@ -26,6 +37,37 @@ Template.printedCharacterSheet.helpers({
|
||||
var profs = Proficiencies.find({charId: this._id, type: "tool"});
|
||||
return removeDuplicateProficiencies(profs);
|
||||
},
|
||||
languageProfs: function(){
|
||||
var profs = Proficiencies.find({charId: this._id, type: "language"});
|
||||
profs = removeDuplicateProficiencies(profs);
|
||||
if (profs.length > 3){
|
||||
var halfway = Math.floor(profs.length / 2);
|
||||
var left = profs.slice(0, halfway);
|
||||
var right = profs.slice(halfway);
|
||||
return {left, right};
|
||||
} else {
|
||||
return {left: profs, right: []};
|
||||
}
|
||||
},
|
||||
attacks: function(){
|
||||
return Attacks.find(
|
||||
{charId: this._id, enabled: true},
|
||||
{sort: {color: 1, name: 1}});
|
||||
},
|
||||
hitDiceTotal: function(){
|
||||
let d6 = Characters.calculate.attributeValue(this._id, "d6HitDice");
|
||||
let d8 = Characters.calculate.attributeValue(this._id, "d8HitDice");
|
||||
let d10 = Characters.calculate.attributeValue(this._id, "d10HitDice");
|
||||
let d12 = Characters.calculate.attributeValue(this._id, "d12HitDice");
|
||||
d6 = d6 ? d6 + "d6" : "";
|
||||
d8 = d8 ? d8 + "d8" : "";
|
||||
d10 = d10 ? d10 + "d10" : "";
|
||||
d12 = d12 ? d12 + "d12" : "";
|
||||
return [d6, d8, d10, d12].filter(Boolean).join(" ");
|
||||
},
|
||||
characterUrl: function(){
|
||||
return `/character/${this._id}`
|
||||
},
|
||||
});
|
||||
|
||||
Template.printedCharacterSheet.events({
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
.printedProficiency iron-icon {
|
||||
margin-right: 2mm;
|
||||
}
|
||||
@@ -1,4 +1,7 @@
|
||||
.printedSquareStat {
|
||||
min-width: 75px;
|
||||
min-height: 75px;
|
||||
min-width: 67px;
|
||||
}
|
||||
|
||||
.printedSquareStat .title.paper-font-subhead {
|
||||
font-size: 2.5mm !important;
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
{{prefix}}{{characterCalculate "attributeValue" ../_id stat}}
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="paper-font-subhead">
|
||||
<div class="paper-font-subhead title">
|
||||
{{name}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
1142
rpg-docs/package-lock.json
generated
1142
rpg-docs/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -15,6 +15,8 @@
|
||||
"babel-runtime": "^6.23.0",
|
||||
"bcrypt": "^1.0.3",
|
||||
"bower": "^1.7.9",
|
||||
"core-js": "^2.5.1"
|
||||
"core-js": "^2.5.1",
|
||||
"meteor-node-stubs": "^0.3.2",
|
||||
"qrcode": "^1.2.0"
|
||||
}
|
||||
}
|
||||
|
||||
BIN
rpg-docs/public/png/horizontalLine.png
Normal file
BIN
rpg-docs/public/png/horizontalLine.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 180 B |
Reference in New Issue
Block a user