danwizard208
/
charred-gold
1
0
Fork 0
Code Issues 4 Pull Requests Projects 2 Releases Wiki Activity

Bunch of Stocked fleshed out

Browse Source
stocked
Daniel Asher Resnick 3 years ago
parent 06f581fb78
commit 0df9eb8bca
8 changed files with 2075 additions and 26 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 5
      src/app.rb
  2. 45
      src/public/css/stocked.css
  3. 2
      src/public/js/burning.js
  4. 1769
      src/public/js/stocked.js
  5. 42
      src/public/js/stocked/editable-input.js
  6. 2
      src/views/index.erb
  7. 220
      src/views/partials/stocked.erb
  8. 6
      src/views/partials/stocked/editableInput.erb

5
src/app.rb
Unescape View File

@ -33,6 +33,11 @@ get /\/([\w]+)_partial/ do
erb "partials/#{partial}".to_sym
end
get /\/stocked\/([\w]+)_partial/ do
partial = params['captures'].first
erb "partials/stocked/#{partial}".to_sym
end
get '/namegen/:gender' do
if params['gender'] == 'female'
['Ada', 'Belle', 'Carmen', 'Desdemona', 'Edie'].sample

45
src/public/css/stocked.css
Unescape View File

@ -0,0 +1,45 @@
a.panel-title:link,.panel-title a:link { text-decoration: none; }
a.panel-title:visited,.panel-title a:visited { text-decoration: none; }
a.panel-title:hover,.panel-title a:hover { text-decoration: underline; }
a.panel-title:active,.panel-title a:active { text-decoration: underline; }
input.editable-name {
color: #333;
display: inline;
width: 12em;
}
input.editable-line {
color: #333;
}
input.editable-num {
color: #333;
display: inline;
width: 3em;
}
input.editable-name.not-editing {
background: #F5F5F5;
font-weight: bold;
}
input.editable-line.not-editing {
background: #F5F5F5;
}
input.editable-num.not-editing {
background: #F5F5F5;
}
.add-skills-traits-container {
margin-top: 1em;
margin-bottom: 1em;
}
.horizontal-input-pair {
display: flex;
align-items: center;
gap: 0.5em;
}
.horizontal-input-pair label {
margin-bottom: 0;
}
.horizontal-input-pair input {
flex-grow: 1;
}

2
src/public/js/burning.js
Unescape View File

@ -61,7 +61,7 @@ burningModule.config(function($routeProvider) {
when('/', {controller: BurningCtrl, templateUrl:'/main_partial'}).
when('/config', {controller: ConfigCtrl, templateUrl:'/config_partial'}).
when('/help', {controller: ConfigCtrl, templateUrl:'/help_partial'}).
when('/stocked', {controller: ConfigCtrl, templateUrl:'/stocked_partial'}).
when('/stocked', {controller: StockedCtrl, templateUrl:'/stocked_partial'}).
otherwise({redirectTo:'/'});
});

1769
src/public/js/stocked.js
View File

File diff suppressed because it is too large Load Diff

42
src/public/js/stocked/editable-input.js
Unescape View File

@ -0,0 +1,42 @@
function EditableInputController($scope, $element, $attrs) {
console.log($scope);
console.log($element);
var ctrl = this;
ctrl.isEditing = false;
ctrl.handleModeChange = function() {
if (ctrl.isEditing) {
ctrl.onUpdate({value: ctrl.modelValue});
ctrl.modelValueCopy = ctrl.modelValue;
}
ctrl.isEditing = !ctrl.isEditing;
};
ctrl.reset = function() {
ctrl.modelValue = ctrl.modelValueCopy;
};
ctrl.$onInit = function() {
// Make a copy of the initial value to be able to reset it later
ctrl.modelValueCopy = ctrl.modelValue;
// Set a default inputType
if (!ctrl.inputType) {
ctrl.inputType = 'text';
}
};
}
export function register(module) {
console.log(module);
module.component('editableInput', {
templateUrl: '/stocked/editableInput_partial',
controller: EditableInputController,
bindings: {
modelValue: '<',
inputID: '<',
inputType: '@?',
onUpdate: '&'
}
});
}

2
src/views/index.erb
Unescape View File

@ -3,6 +3,7 @@
<head>
<link href='/css/bootstrap.min.css' rel='stylesheet' type='text/css'>
<link href='/css/style.css' rel='stylesheet' type='text/css'>
<link href='/css/stocked.css' rel='stylesheet' type='text/css'>
<script src='/js/server_settings.js'></script>
<script src='/js/angular.min.js'></script>
<script src='/js/angular-resource.js'></script>
@ -14,6 +15,7 @@
<script src='/js/burning-service.js'></script>
<script src='/js/burning-modal.js'></script>
<script src='/js/burning-serialize.js'></script>
<script src='/js/stocked.js'></script>
<script src='/js/burning.js'></script>
<title>Charred - The Burning Wheel Gold Character Burner</title>
</head>

220
src/views/partials/stocked.erb
Unescape View File

@ -1,5 +1,5 @@
<div class='container'>
<h2 id='intro'>Stocked</h2>
<div class='container' ng-controller='StockedCtrl'>
<h1 id='intro'>Stocked</h1>
<div class='well'>
Stocked (Stock&middot;ed)
<br>
@ -10,11 +10,10 @@
</ol>
</div>
<div class='panel panel-default'>
<div class='panel-heading'>
<div class='panel-heading' >
<h4 class='panel-title'>
<a data-target='#collapse_tools' data-toggle='collapse' href=''>
<a href='' ng-click='collapseBody("#collapse_tools")'>▸</a>
Tools
</a>
</h4>
</div>
<div class='panel-collapse collapse in' id='collapse_tools'>
@ -31,17 +30,17 @@
<div class='row'>
<div class='col-md-3'>
<a href='' ng-click='stocked_downloadCharredModel()'>
Download charred model
TODO: Download charred model
</a>
</div>
<div class='col-md-3'>
<a href='' ng-click='stocked_generateMarkdown()'>
Generate Markdown
TODO: Generate Markdown
</a>
</div>
<div class='col-md-3'>
<a href='' ng-click='stocked_generateWikipage()'>
Generate wikipage
TODO: Generate wikipage
</a>
</div>
</div>
@ -50,38 +49,219 @@
</div>
<div class='panel-heading'>
<h4 class='panel-title'>
<a data-target='#collapse_general' data-toggle='collapse' href=''>
<a href='' ng-click='collapseBody("#collapse_general")'>▸</a>
General
</a>
</h4>
</div>
<div class='panel-collapse collapse in' id='collapse_general'>
<div class='panel-body'>
Name, common traits, stride, etc.
TODO: Name, common traits, stride, etc.
</div>
</div>
<div class='panel-heading'>
<h4 class='panel-title'>
<a data-target='#collapse_settings' data-toggle='collapse' href=''>
<a href='' ng-click='collapseBody("#collapse_settings")'>▸</a>
Settings
</a>
</h4>
</div>
<div class='panel-collapse collapse in' id='collapse_settings'>
<div class='panel-body'>
Some settings will go here
<a ng-click='collapseBody(".collapse_all_settings", $event)' href=''>
collapse/expand all settings
</a>
<div class='list-group'>
<div class='list-group-item'>
Foo
<div ng-repeat="setting in settings" class='list-group-item'>
<div class='panel-heading'>
<a href='' class="panel-title" ng-click='collapseBody("#collapse_" + to_id(setting.name))'>▸</a>
<input class='form-control input-lg not-editing editable-name'
ng-model="setting.name" ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
</div>
<div class='panel-collapse collapse in collapse_all_settings' id='collapse_{{to_id(setting.name)}}'>
<div class='panel-body'>
<div class="panel">
<div class="panel-body">
<a ng-click='collapseBody(".collapse_all_"+to_id(setting.name), $event)' href=''>
collapse/expand all paths in setting
</a>
<div class='container-fluid'>
<div class='row'>
<div class='h4 col-md-3'>Lifepath</div>
<div class='h4 col-md-1'>Time</div>
<div class='h4 col-md-1'>Res</div>
<div class='h4 col-md-3'>Stat</div>
<div class='h4 col-md-4'>Leads</div>
</div>
</div>
</div>
<div ng-repeat="path in setting.lifepaths">
<div class='panel-heading'>
<div class='container-fluid'>
<div class='row'>
<div class="col-md-3">
<a href='' class="panel-title" ng-click='collapseBody("#collapse_" + to_id(path.name))'>▸</a>
<input ng-model="path.name"
class='form-control input-lg not-editing editable-name'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
</div>
<div class="col-md-1">
<input type="number" ng-model="path.time"
class='not-editing editable-num'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
<span>yrs</span>
</div>
<div class="col-md-1">
<input type="number" ng-model="path.res"
class='not-editing editable-num'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
</div>
<div class="col-md-3">
<input type="number" ng-model="path.stat.M"
class='not-editing editable-num'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
<span>M</span>
<input type="number" ng-model="path.stat.P"
class='not-editing editable-num'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
<span>P</span>
<input type="number" ng-model="path.stat.PM"
class='not-editing editable-num'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
<span>P/M</span>
</div>
<div class='h5 col-md-4 path-leads'>
<div class="path-leads-read">
<i>{{path.leads().join(", ")}}</i>
<a href='' ng-click='editLeads($event)'>Edit</a>
</div>
<div class="path-leads-write" hidden="hidden">
<div ng-repeat="setting in settings">
<input type="checkbox" id='{{to_id(path.name)}}-to-{{to_id(setting.name)}}'
ng-model='path.leads_dict[setting.name]' value='{{to_id(setting.name)}}' />
<label for='{{to_id(path.name)}}-to-{{to_id(setting.name)}}'>
{{setting.name}}
</label>
</div>
<a href='' ng-click='readLeads($event)'>Done</a>
</div>
</div>
</div>
</div>
</div>
<div class='panel-collapse collapse in collapse_all_{{to_id(setting.name)}}' id='collapse_{{to_id(path.name)}}'>
<div class='panel-body'>
<span ng-if='$first'>TODO: Born/common traits</span>
<div>
<b><i>Skills:</i></b>
<span ng-if='path.skills.lpSkills.length > 0' ng-click='editPoints($event)'>
{{StockedUtil.pluralize(path.skills.lpPoints, "pt")}}:
</span>
<div style="display: inline;" ng-repeat='skill in path.skills.lpSkills track by $index'>
{{skill}}<a href='' ng-click='path.skills.removeSkill($index)'>[X]</a><!--
--><span ng-if='!$last'>,</span></div><!--
--><span ng-if='path.skills.lpSkills.length > 0 && path.skills.generalPoints > 0'>;</span>
<span ng-if='path.skills.generalPoints > 0'>{{StockedUtil.pluralize(path.skills.generalPoints, "pt")}}: General</span>
</div>
<div>
<b><i>Traits:</i></b>
<span ng-if='path.traits.lpTraits.length == 0'>—</span>
<span ng-if='path.traits.lpTraits.length > 0' ng-click='editPoints($event)'>
{{StockedUtil.pluralize(path.traits.points, "pt")}}:
</span>
<div style="display: inline;" ng-repeat='trait in path.traits.lpTraits track by $index'>
{{trait}}<a href='' ng-click='path.traits.removeTrait($index)'>[X]</a><!--
--><span ng-if='!$last'>,</span></div>
</div>
<div ng-if="path.requires" class="horizontal-input-pair">
<label for="{{to_id(path.name)}}-requires"><b><i>Requires: </i></b></label>
<input ng-model="path.requires" id="{{to_id(path.name)}}-requires"
class='form-control not-editing editable-line'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
</div>
<div ng-if="path.restrict" class="horizontal-input-pair">
<label for="{{to_id(path.name)}}-restrict"><b><i>Restrictions: </i></b></label>
<input ng-model="path.restrict" id="{{to_id(path.name)}}-restrict"
class='form-control not-editing editable-line'
ng-click="$event.stopPropagation()"
ng-focus='editField($event, true)' ng-blur='editField($event, false)' />
</div>
<div class="add-skills-traits-container" class="container">
<div class='row'>
<div class='col-md-3'>
<select class='form-control' ng-model='path.selectedSkill' ng-options='s for s in charredSkills'></select>
</div>
<div class='col-md-1'>
<a href='' ng-click='path.skills.addSkill(path.selectedSkill)'>Add skill</a>
</div>
<div class='col-md-2'>
<a href='' ng-click=''>TODO: Add new skill</a>
</div>
<div class='col-md-3'>
<select class='form-control' ng-model='path.selectedTrait' ng-options='t for t in charredTraits'></select>
</div>
<div class='col-md-1'>
<a href='' ng-click='path.traits.addTrait(path.selectedTrait)'>Add trait</a>
</div>
<div class='col-md-2'>
<a href='' ng-click=''>TODO: Add new trait</a>
</div>
</div>
</div>
<span>WISHLIST: requires expression</span>
</div>
</div>
</div>
<div class='panel panel-default'>
<a href='/#/stocked'>+ TODO: Add new lifepath</a>
</div>
</div>
</div>
<div class='list-group-item'>
Bar
</div>
</div>
<div class='panel panel-default'>
<a href='/#/stocked'>+ Add new setting</a>
<a href='/#/stocked'>+ TODO: Add new setting</a>
</div>
</div>
</div>
</div>
</div>
<div class='panel-heading'>
<h4 class='panel-title'>
<a href='' ng-click='collapseBody("#collapse_skills")'>▸</a>
Skills
</h4>
</div>
<div class='panel-collapse collapse in' id='collapse_skills'>
<div class='panel-body'>
TODO: The stock's skill list and adding a new one
</div>
</div>
<div class='panel-heading'>
<h4 class='panel-title'>
<a href='' ng-click='collapseBody("#collapse_traits")'>▸</a>
Traits
</h4>
</div>
<div class='panel-collapse collapse in' id='collapse_traits'>
<div class='panel-body'>
TODO: The stock's trait list and adding a new one
</div>
</div>
</div>

6
src/views/partials/stocked/editableInput.erb
Unescape View File

@ -0,0 +1,6 @@
<span ng-if='$ctrl.label' for='{{$ctrl.inputID}}'>{{$ctrl.label}}</span>
<span ng-switch='$ctrl.isEditing'>
<input ng-switch-when="true" ng-model='$ctrl.modelValue' ng-blur='$ctrl.handleModeChange()'
id='{{$ctrl.inputID}}' type='{{$ctrl.inputType}}' class="editable-input editing">
<span ng-switch-default class="editable-input">{{$ctrl.modelValue}}</span>
</span>
Write Preview
Loading…
Cancel
Save