diff --git a/rpg-docs/client/views/character/features/features.js b/rpg-docs/client/views/character/features/features.js
index 46250404..bc5d29b9 100644
--- a/rpg-docs/client/views/character/features/features.js
+++ b/rpg-docs/client/views/character/features/features.js
@@ -39,11 +39,6 @@ Template.features.events({
"tap .resetFeature": function(event){
var featureId = this._id;
Features.update(featureId, {$set: {used: 0}});
- },
- "change #hitPointSlider": function(event){
- var value = event.currentTarget.value;
- var adjustment = value - this.attributeBase("hitPoints");
- Characters.update(this._id, {$set: {"hitPoints.adjustment": adjustment}});
}
});
@@ -53,6 +48,13 @@ Template.resource.helpers({
},
cantDecrement: function(){
return !(this.char.attributeValue(this.name) > 0);
+ },
+ getColor: function(){
+ if(this.char.attributeValue(this.name) > 0){
+ return this.color;
+ } else {
+ return "grey";
+ }
}
});
diff --git a/rpg-docs/client/views/character/healthBar/healthBar.css b/rpg-docs/client/views/character/healthBar/healthBar.css
deleted file mode 100644
index b32cbd5d..00000000
--- a/rpg-docs/client/views/character/healthBar/healthBar.css
+++ /dev/null
@@ -1,143 +0,0 @@
-.healthBarContainer{
- width: 300px;
- height: 30px;
- display: flex;
- position: relative;
- align-items: center; /* align vertical */
- margin-top: 25px;
-}
-
-.healthBar{
- position: relative;
- height: 30px;
- flex-grow: 1;
- display: flex;
- align-items: center; /* align vertical */
-}
-
-.healthBarGreen{
- position: absolute;
- top: 2px;
- height: 26px;
- border-radius: 15px;
- background-color: #008C00;
-}
-
-.healthBarRed{
- position: absolute;
- top: 2px;
- height: 26px;
- border-radius: 15px;
- background-color: #AF0000;
-}
-
-.healthBarYellow{
- position: absolute;
- top: 2px;
- height: 26px;
- border-radius: 15px;
- background-color: #CA9548;
-}
-
-.healthBarBorder{
- position: absolute;
- top: 0px;
- left: -1px;
- height: 0px;
- width: 302px;
- border-width: 15px 37px 16px 37px;
- border-image: url('/png/bar-border.png') 46 112 48 112 stretch;
- display: flex;
- justify-content: center; /* align horizontal */
- align-items: center; /* align vertical */
- pointer-events: none;
-}
-
-.hpReadout {
- color: #FFE0B5;
-}
-
-.healthBarButton{
- display: inline-block;
- width: 30px;
- height: 30px;
-}
-
-.healthBarPlus{
-
-}
-
-.healthBarMinus{
-
-}
-/*deadbar*/
-.deadText {
- color: #AF0000;
- text-align: center;
- flex-grow: 1;
- letter-spacing: 10px;
- font-weight: bold;
- cursor: default;
-}
-
-/*death saves bar*/
-.deltaHp{
- position: absolute;
- top: -20px;
-}
-
-.deathSaveFail{
- display:inline-block;
-}
-
-.deathSavePass{
- display: inline-block;
-}
-
-.untickedDeathFail{
- display: inline-block;
- width: 30px;
- height: 28px;
- background-color: grey;
-}
-
-.tickedDeathFail{
- display: inline-block;
- width: 30px;
- height: 28px;
- background-color: red;
-}
-
-.untickedDeathPass{
- display: inline-block;
- width: 30px;
- height: 28px;
- background-color: grey;
-}
-
-.tickedDeathPass{
- display: inline-block;
- width: 30px;
- height: 28px;
- background-color: green;
-}
-
-.stability{
- display: inline-block;
- flex-grow: 1;
- text-align: center;
- color: #40D940;
- cursor: default;
-}
-
-.heal{
- display: inline-block;
- flex-grow: 1;
- text-align: center;
- color: #FFB44B;
- cursor: default;
-}
-
-.unstableButton{
- display: inline-block;
-}
\ No newline at end of file
diff --git a/rpg-docs/client/views/character/healthBar/healthBar.html b/rpg-docs/client/views/character/healthBar/healthBar.html
deleted file mode 100644
index a23eacda..00000000
--- a/rpg-docs/client/views/character/healthBar/healthBar.html
+++ /dev/null
@@ -1,52 +0,0 @@
-
-
-
-
-
-
- {{#if healthy}}
- {{> hitPointBars}}
- {{else}}
- {{# if dead}}
- {{> deadBar}}
- {{else}}
- {{> deathSaves}}
- {{/if}}
- {{/if}}
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{attributeValue "hitPoints"}}/{{maxHp}}
-
-
-
-
-
-
-
-
-
-
-
-
-
{{stabilizeText}}
-
-
-
-
-
\ No newline at end of file
diff --git a/rpg-docs/client/views/character/healthBar/healthBar.js b/rpg-docs/client/views/character/healthBar/healthBar.js
deleted file mode 100644
index 4a5466f2..00000000
--- a/rpg-docs/client/views/character/healthBar/healthBar.js
+++ /dev/null
@@ -1,177 +0,0 @@
-Template.healthBar.helpers({
- healthy: function(){
- var hp = this.attributeValue("hitPoints");
- return hp > 0;
- },
- dead: function(){
- var deathSave = this.getField("deathSave");
- if(deathSave.canDeathSave){
- return deathSave.fail >= 3;
- } else{
- //creatures that can't make death saves die at 0 HP
- var hp = this.attributeValue("hitPoints");
- return hp <= 0;
- }
- }
-});
-
-Template.hitPointBars.helpers({
- hpRed: function(){
- var currentHp = this.attributeValue("hitPoints");
- var damage = this.getField("hitPoints").base;
- return 100*(currentHp/(currentHp - damage));
- },
- hpGreen: function(){
- var currentHp = this.attributeValue("hitPoints");
- var damage = this.getField("hitPoints").base;
- var maxHp = currentHp - damage;
- var percent = 100*(currentHp/ maxHp);
- var change = 100 * Template.instance().deltaHp.get() / maxHp;
- if(change < 0){
- return percent + change;
- }else{
- return percent;
- }
- },
- hpYellow: function(){
- var currentHp = this.attributeValue("hitPoints");
- var damage = this.getField("hitPoints").base;
- var maxHp = currentHp - damage;
- var percent = 100*(currentHp/ maxHp);
- var change = 100 * Template.instance().deltaHp.get() / maxHp;
- if(change > 0){
- return percent + change;
- } else{
- return percent;
- }
- },
- hpPercentDelta: function(){
- if(!Template.instance().deltaHp){
- Template.instance().deltaHp = new ReactiveVar(0);
- }
- var currentHp = this.attributeValue("hitPoints");
- var damage = this.getField("hitPoints").base;
- var maxHp = currentHp - damage;
- var percent = 100*(currentHp/ maxHp);
- var change = 100 * Template.instance().deltaHp.get() / maxHp;
- return percent + change;
- },
- maxHp: function(){
- var currentHp = this.attributeValue("hitPoints");
- var damage = this.getField("hitPoints").base;
- return currentHp - damage;
- },
- deltaHp: function(){
- if(!Template.instance().deltaHp){
- Template.instance().deltaHp = new ReactiveVar(0);
- }
- return Template.instance().deltaHp.get();
- },
- showDelta: function(){
- if(Template.instance().deltaHp){
- if(Template.instance().deltaHp.get() !== 0) return "initial";
- }
- return "none";
- }
-});
-
-Template.hitPointBars.events({
- "dragstart .healthBar": function(event) {
- Template.instance().startDrag = new ReactiveVar(Template.instance().deltaHp.get());
- },
- "drag": function(event, templateInstance, handler){
- //the width of the bar, fetch dynamically if needed
- var healthBarWidth = 300;
- var hpLeft = this.attributeValue("hitPoints");
- var damage = this.getField("hitPoints").base;
- var maxHp = hpLeft - damage;
- var dragMultiplier = maxHp / healthBarWidth;
- var newValue = dragMultiplier * handler.deltaX + Template.instance().startDrag.get();
- //don't heal more than -damage
- newValue = newValue < -damage ? newValue : -damage;
- //dont damage more than hit points left
- newValue = newValue > -hpLeft ? newValue : -hpLeft;
- //floor the value
- newValue = Math.floor(newValue);
- //set the value
- Template.instance().deltaHp.set(newValue);
- },
- "click .healthBarPlus": function(event){
- var newValue = Template.instance().deltaHp.get() + 1;
- //don't heal more than -damage
- var damage = this.getField("hitPoints").base;
- newValue = newValue < -damage ? newValue : -damage;
- //set value
- Template.instance().deltaHp.set(newValue);
- },
- "click .healthBarMinus": function(event){
- var newValue = Template.instance().deltaHp.get() - 1;
- //dont damage more than hit points left
- var hpLeft = this.getField("hitPoints").base;
- newValue = newValue > -hpLeft ? newValue : -hpLeft;
- //set value
- Template.instance().deltaHp.set(newValue);
- },
- "click #applyDelta": function(event){
- Characters.update(this._id, {$inc: {"hitPoints.base": Template.instance().deltaHp.get()}})
- Template.instance().deltaHp.set(0);
- }
-});
-
-Template.deadBar.events({
- "click .deadText": function(){
- Characters.update(this._id, {$set: {"deathSave.fail": 0}});
- Characters.update(this._id, {$set: {"deathSave.pass": 0}});
- }
-});
-
-Template.deathSaves.helpers({
- deathFailGT: function(num){
- var deathSave = this.getField("deathSave");
- if(deathSave.fail > num) return "tickedDeathFail";
- else return "untickedDeathFail";
- },
- deathPassGT: function(num){
- var deathSave = this.getField("deathSave");
- if(deathSave.pass > num) return "tickedDeathPass";
- else return "untickedDeathPass";
- },
- stable: function(){
- var deathSave = this.getField("deathSave");
- if(deathSave.pass > 0 || deathSave.fail > 0){
- return "stability";
- } else{
- return "heal";
- }
- },
- stabilizeText: function(){
- var deathSave = this.getField("deathSave");
- if(deathSave.pass > 0 || deathSave.fail > 0){
- return "stabilize";
- } else{
- return "heal";
- }
- }
-});
-
-Template.deathSaves.events({
- "click .stability": function(){
- Characters.update(this._id, {$set: {"deathSave.fail": 0}});
- Characters.update(this._id, {$set: {"deathSave.pass": 0}});
- },
- "click .heal": function(){
- Characters.update(this._id, {$inc: {"hitPoints.base": 1}});
- },
- "click .untickedDeathFail" : function(){
- Characters.update(this._id, {$inc: {"deathSave.fail": 1}});
- },
- "click .untickedDeathPass" : function(){
- Characters.update(this._id, {$inc: {"deathSave.pass": 1}});
- },
- "click .tickedDeathFail" : function(){
- Characters.update(this._id, {$inc: {"deathSave.fail": -1}});
- },
- "click .tickedDeathPass" : function(){
- Characters.update(this._id, {$inc: {"deathSave.pass": -1}});
- }
-});
\ No newline at end of file
diff --git a/rpg-docs/client/views/character/healthCard/healthCard.css b/rpg-docs/client/views/character/healthCard/healthCard.css
new file mode 100644
index 00000000..b1664340
--- /dev/null
+++ b/rpg-docs/client/views/character/healthCard/healthCard.css
@@ -0,0 +1,25 @@
+.healthCard paper-slider{
+ width: 100%;
+}
+
+/*Slider knob color*/
+#hitPointSlider::shadow #sliderKnobInner {
+ background-color: #0f9d58;
+}
+
+/*Slider pin*/
+#hitPointSlider::shadow #sliderKnobInner::before {
+ background-color: #0f9d58;
+ height: 32px;
+ width: 32px;
+}
+
+/*Slider pin text*/
+#hitPointSlider::shadow #sliderKnob > #sliderKnobInner::after {
+ font-size: 16px;
+}
+
+/*Slider bar*/
+#hitPointSlider::shadow #sliderBar::shadow #activeProgress {
+ background-color: #0f9d58;
+}
diff --git a/rpg-docs/client/views/character/healthCard/healthCard.html b/rpg-docs/client/views/character/healthCard/healthCard.html
new file mode 100644
index 00000000..49534c6b
--- /dev/null
+++ b/rpg-docs/client/views/character/healthCard/healthCard.html
@@ -0,0 +1,15 @@
+
+
+
+ Hit Points
+
+
+
+
diff --git a/rpg-docs/client/views/character/healthCard/healthCard.js b/rpg-docs/client/views/character/healthCard/healthCard.js
new file mode 100644
index 00000000..fe0d3d23
--- /dev/null
+++ b/rpg-docs/client/views/character/healthCard/healthCard.js
@@ -0,0 +1,7 @@
+Template.healthCard.events({
+ "change #hitPointSlider": function(event){
+ var value = event.currentTarget.value;
+ var adjustment = value - this.attributeBase("hitPoints");
+ Characters.update(this._id, {$set: {"hitPoints.adjustment": adjustment}});
+ }
+});
diff --git a/rpg-docs/client/views/character/inventory/inventory.css b/rpg-docs/client/views/character/inventory/inventory.css
index 3b48002d..7cc208b3 100644
--- a/rpg-docs/client/views/character/inventory/inventory.css
+++ b/rpg-docs/client/views/character/inventory/inventory.css
@@ -1,3 +1,12 @@
+div#stats {
+ -webkit-column-width: 200px;
+ -moz-column-width: 200px;
+ column-width: 200px;
+ -webkit-column-count: 4;
+ -moz-column-count: 4;
+ column-count: 4;
+}
+
.containers {
-webkit-column-width: 300px;
-moz-column-width: 300px;
@@ -11,8 +20,7 @@
}
.containerLeft {
- padding: 16px;
- background-color: #2196F3;
+ padding: 16px 16px 16px 24px;
display: flex;
justify-content: center;
flex-direction: row;
@@ -26,6 +34,10 @@
letter-spacing: 0;
}
+.statCard .containerLeft {
+ padding: 16px;
+}
+
.containerRight {
padding: 16px;
cursor: pointer;
diff --git a/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html b/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html
index ef005bd3..8e7b3c72 100644
--- a/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html
+++ b/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html
@@ -3,12 +3,6 @@
{{name}}
-
diff --git a/rpg-docs/client/views/character/persona/textDialog/textDialog.html b/rpg-docs/client/views/character/persona/textDialog/textDialog.html
index badc22e1..7d280fd3 100644
--- a/rpg-docs/client/views/character/persona/textDialog/textDialog.html
+++ b/rpg-docs/client/views/character/persona/textDialog/textDialog.html
@@ -3,12 +3,6 @@
{{title}}
-