diff --git a/client/naturalCrit/defaultMonsterManual.js b/client/naturalCrit/defaultMonsterManual.js new file mode 100644 index 000000000..687542aad --- /dev/null +++ b/client/naturalCrit/defaultMonsterManual.js @@ -0,0 +1,42 @@ +module.exports = { + goblin : { + hp : 40, + mov: 30, + ac : 13, + attr : { + str : 8, + con : 8, + dex : 8, + int : 8, + wis : 8, + cha : 8 + }, + attacks : { + dagger : { + atk : "1d20-5", + dmg : "1d4+5", + type : "pierce", + notes : "Super cool" + }, + bow : { + atk : "1d20+2", + dmg : "6d6", + rng : "30" + } + }, + spells : { + fireball: { + dmg : "6d6", + uses : 4 + }, + "healing bolt" : { + heal : "2d8+4", + uses : 6 + } + }, + abilities : { + "pack tactics" : "Does a thing" + }, + items : ['healing_potion', 'healing_potion', 'ring'] + } +} \ No newline at end of file diff --git a/client/naturalCrit/encounter/monsterCard/monsterCard.jsx b/client/naturalCrit/encounter/monsterCard/monsterCard.jsx index 0c663fd77..fdded9439 100644 --- a/client/naturalCrit/encounter/monsterCard/monsterCard.jsx +++ b/client/naturalCrit/encounter/monsterCard/monsterCard.jsx @@ -127,6 +127,14 @@ var MonsterCard = React.createClass({ }) }, + renderAbilities : function(){ + return _.map(this.props.abilities, function(text, name){ + return
+ {name}: {text} +
+ }); + }, + renderItems : function(){ var self = this; var usedItems = this.state.usedItems.slice(0); @@ -172,7 +180,7 @@ var MonsterCard = React.createClass({
- {this.props.abilities} + {this.renderAbilities()}
diff --git a/client/naturalCrit/encounter/monsterCard/monsterCard.less b/client/naturalCrit/encounter/monsterCard/monsterCard.less index 4c0eb97cf..fd8226346 100644 --- a/client/naturalCrit/encounter/monsterCard/monsterCard.less +++ b/client/naturalCrit/encounter/monsterCard/monsterCard.less @@ -104,10 +104,16 @@ } } .abilitiesContainer{ - margin-top : 5px; + margin-top : 10px; + .ability{ + font-size: 0.7em; + .name{ + font-weight: 800; + } + } } .itemContainer{ - margin-top : 5px; + margin-top : 10px; i{ font-size : 0.7em; } diff --git a/client/naturalCrit/naturalCrit.jsx b/client/naturalCrit/naturalCrit.jsx index 8dd7b4198..256913404 100644 --- a/client/naturalCrit/naturalCrit.jsx +++ b/client/naturalCrit/naturalCrit.jsx @@ -2,12 +2,9 @@ var React = require('react'); var _ = require('lodash'); var cx = require('classnames'); - var Sidebar = require('./sidebar/sidebar.jsx'); - var Encounter = require('./encounter/encounter.jsx'); - var encounters = [ { name : 'The Big Bad', @@ -47,46 +44,7 @@ var encounters = [ ]; -var monsterManual = { - 'goblin' : { - "hp" : 40, - "mov": 30, - "ac" : 13, - "attr" : { - "str" : 8, - "con" : 8, - "dex" : 8, - "int" : 8, - "wis" : 8, - "cha" : 8 - }, - "attacks" : { - "dagger" : { - "atk" : "1d20-5", - "dmg" : "1d4+5", - "type" : "pierce", - "notes" : "Super cool" - }, - "bow" : { - "atk" : "1d20+2", - "dmg" : "6d6", - "rng" : "30" - } - }, - "spells" : { - "fireball": { - "dmg" : "6d6", - "uses" : 4 - }, - "healing_bolt" : { - "heal" : "2d8+4", - "uses" : 6 - } - }, - "abilities" : ["pack tactics"], - "items" : ['healing_potion', 'healing_potion', 'ring'] - } -} +var defaultMonsterManual = require('./defaultMonsterManual.js'); var attrMod = function(attr){ return Math.floor(attr/2) - 5; @@ -100,7 +58,7 @@ var NaturalCrit = React.createClass({ return { selectedEncounterIndex : 0, encounters : JSON.parse(localStorage.getItem('encounters')) || encounters, - monsterManual : JSON.parse(localStorage.getItem('monsterManual')) || monsterManual, + monsterManual : JSON.parse(localStorage.getItem('monsterManual')) || defaultMonsterManual, players : localStorage.getItem('players') || 'jasper 13\nzatch 19' @@ -128,6 +86,7 @@ var NaturalCrit = React.createClass({ localStorage.setItem("players", e.target.value); }, handleSelectedEncounterChange : function(encounterIndex){ + console.log(encounterIndex); this.setState({ selectedEncounterIndex : encounterIndex }); @@ -146,7 +105,9 @@ var NaturalCrit = React.createClass({ return encounter.name == self.state.selectedEncounter; }); - if(this.state.selectedEncounterIndex != null){ + + + if(this.state.selectedEncounterIndex != null && selectedEncounter != null){ var selectedEncounter = this.state.encounters[this.state.selectedEncounterIndex] return + + + + + + + +
+ }) + }, render : function(){ var self = this; return(
- Encounters Ready! +

+ Encounters + +

+ {this.renderEncounters()} + +
+ +
); } diff --git a/client/naturalCrit/sidebar/encounters/encounters.less b/client/naturalCrit/sidebar/encounters/encounters.less index 1144cab67..371ec5732 100644 --- a/client/naturalCrit/sidebar/encounters/encounters.less +++ b/client/naturalCrit/sidebar/encounters/encounters.less @@ -1,3 +1,53 @@ -.encounters{ +.encounters{ + margin-bottom : 20px; + h3{ + background-color : @red; + color : white; + button{ + .animate(color); + float : right; + cursor : pointer; + background-color : transparent; + border : none; + outline : none; + &:hover{ + color : white; + } + } + } + .encounter{ + position : relative; + padding-left : 15px; + border-left : 0px solid @teal; + .animateAll(); + &:hover{ + i.remove{ + opacity : 1; + } + } + i.remove{ + .animate(opacity); + position : absolute; + top : 3px; + right : 3px; + cursor : pointer; + opacity : 0; + font-size : 0.6em; + color : #333; + &:hover{ + color : @red; + } + } + i.select{ + cursor : pointer; + } + .jsonFileEditor{ + display : inline-block; + } + &.selected{ + //background-color : fade(@green, 30%); + border-left : 8px solid @teal; + } + } } \ No newline at end of file diff --git a/client/naturalCrit/sidebar/sidebar.jsx b/client/naturalCrit/sidebar/sidebar.jsx index ff0e68679..398587c34 100644 --- a/client/naturalCrit/sidebar/sidebar.jsx +++ b/client/naturalCrit/sidebar/sidebar.jsx @@ -40,16 +40,8 @@ var Sidebar = React.createClass({ }) }, - handleJSONChange : function(encounterIndex, json){ - this.props.onJSONChange(encounterIndex, json); - }, - handleSelectEncounter : function(encounterIndex){ - this.props.onSelectEncounter(encounterIndex); - }, - handleRemoveEncounter : function(encounterIndex){ - this.props.onRemoveEncounter(encounterIndex); - }, +/* renderEncounters : function(){ var self = this; @@ -74,7 +66,7 @@ var Sidebar = React.createClass({ }) }, - +*/ render : function(){ var self = this; return( @@ -82,7 +74,8 @@ var Sidebar = React.createClass({
- NaturalCrit +
NaturalCrit
+ Combat Manager
@@ -95,21 +88,16 @@ var Sidebar = React.createClass({ />
-
-

- Encounters - -

- {this.renderEncounters()} -
+ -
+ onJSONChange={this.props.onJSONChange} + onSelectEncounter={this.props.onSelectEncounter} + onRemoveEncounter={this.props.onRemoveEncounter} - + />

Players

diff --git a/client/naturalCrit/sidebar/sidebar.less b/client/naturalCrit/sidebar/sidebar.less index f0e74e44a..a94a408a4 100644 --- a/client/naturalCrit/sidebar/sidebar.less +++ b/client/naturalCrit/sidebar/sidebar.less @@ -45,12 +45,20 @@ span.name{ .animateAll(); position : absolute; - top : 13px; + top : 15px; left : 50px; opacity : 1; + font-size: 0.9em; + line-height: 0.5em; span.crit{ font-family : 'CodeBold'; } + small{ + font-size: 0.3em; + font-family : 'Open Sans'; + font-weight: 800; + text-transform: uppercase; + } } } .contents{ @@ -66,49 +74,6 @@ font-weight : 800; text-transform : uppercase; } - .encounterContainer{ - margin-bottom : 20px; - h3{ - background-color : @red; - color : white; - - button{ - outline: none; - border : none; - cursor: pointer; - background-color: transparent; - .animate(color); - float : right; - &:hover{ - color : white; - } - } - } - .encounter{ - padding-left: 20px; - position: relative; - i.remove{ - position: absolute; - top : 3px; - right : 3px; - font-size: 0.6em; - cursor: pointer; - color : #333; - &:hover{ - color: @red; - } - } - i.select{ - cursor: pointer; - } - .jsonFileEditor{ - display: inline-block; - } - &.selected{ - background-color : fade(@green, 30%); - } - } - } .addPlayers{ h3{ color : white; @@ -121,12 +86,5 @@ } } - .dmDice{ - h3{ - color : white; - background-color: @teal; - } - - } } } \ No newline at end of file diff --git a/shared/naturalCrit/jsonFileEditor/jsonFileEditor.less b/shared/naturalCrit/jsonFileEditor/jsonFileEditor.less index 7ab8fbc0c..3800116f5 100644 --- a/shared/naturalCrit/jsonFileEditor/jsonFileEditor.less +++ b/shared/naturalCrit/jsonFileEditor/jsonFileEditor.less @@ -7,6 +7,9 @@ .jsonEditor{ display : initial; } + button.showEditor{ + color: @red; + } } .jsonEditor{ position : absolute; @@ -26,9 +29,6 @@ .controls{ display: inline-block; float: right; - //position : absolute; - //top : 0px; - //right : 0px; button{ outline: none;