mirror of https://github.com/Oreolek/fikugsen.git
Initial commit - not usable
Still working on the scripting and layout.
This commit is contained in:
commit
d6f568dc7a
|
@ -0,0 +1,9 @@
|
|||
It's a simple character generator for my tabletop RPG system.
|
||||
|
||||
My system has close resemblance to the SPECIAL system (Fallout 2) :-) but still there are differences. The generator is flexible and is quick to configure for any similar set of rules.
|
||||
|
||||
Used libraries: [jQuery](http://jquery.com), [LESS](http://www.lesscss.org).
|
||||
|
||||
Texture by webtreats: http://www.flickr.com/photos/webtreatsetc/4081217898/ (CC-BY 2.0)
|
||||
|
||||
Text is in Russian, but code should be obvious.
|
|
@ -0,0 +1,79 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="ru"><head>
|
||||
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
|
||||
<title>Генератор персонажа</title>
|
||||
<link rel="stylesheet" media="all" href="style.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script src="http://code.jquery.com/jquery-1.8.2.min.js" type="text/javascript"></script>
|
||||
<script src="script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper_overview">
|
||||
<div class="group" id="specials"></div>
|
||||
<div class="group" id="derived"></div>
|
||||
|
||||
<div id="skills" class="group">
|
||||
<div class="parameter">
|
||||
<div class="name"><input type="checkbox">Энергетическое Оружие</div>
|
||||
<div class="value" id="energy_weapons"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Огнестрельное Оружие</div>
|
||||
<div class="value" id="guns"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Стрельба из лука</div>
|
||||
<div class="value" id="archery"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Холодное оружие</div>
|
||||
<div class="value" id="melee"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Рукопашный бой</div>
|
||||
<div class="value" id="unarmed"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Метание</div>
|
||||
<div class="value" id="throwing"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Взлом</div>
|
||||
<div class="value" id="lockpick"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Медицина</div>
|
||||
<div class="value" id="first_aid"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Ремонт</div>
|
||||
<div class="value" id="repair"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Наука</div>
|
||||
<div class="value" id="science"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Скрытность</div>
|
||||
<div class="value" id="stealth"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Выступление</div>
|
||||
<div class="value" id="performance"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Выживание</div>
|
||||
<div class="value" id="survival"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Обращение с животными</div>
|
||||
<div class="value" id="animal_handling"></div>
|
||||
</div>
|
||||
<div class="parameter">
|
||||
<div class="name">Вождение</div>
|
||||
<div class="value" id="driving"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,100 @@
|
|||
function parameter(id, name, value) {
|
||||
if (typeof value === 'undefined') {
|
||||
value = 5;
|
||||
}
|
||||
return {
|
||||
id: id,
|
||||
name: name,
|
||||
value: value
|
||||
};
|
||||
}
|
||||
parameter.prototype.increment = function () {
|
||||
this.value = this.value + 1;
|
||||
};
|
||||
parameter.prototype.decrement = function () {
|
||||
this.value = this.value - 1;
|
||||
};
|
||||
function positive(value) {
|
||||
if (value < 1) return 1;
|
||||
else return value;
|
||||
}
|
||||
var options = {
|
||||
specials: {
|
||||
strength: parameter('strength', 'Сила'),
|
||||
endurance: parameter('endurance', 'Выносливость'),
|
||||
charisma: parameter('charisma', 'Обаяние'),
|
||||
intelligence: parameter('intelligence', 'Интеллект'),
|
||||
agility: parameter('agility', 'Ловкость'),
|
||||
luck: parameter('luck', 'Удача'),
|
||||
},
|
||||
special_points: 5,
|
||||
skills_to_tag: 3,
|
||||
derived: [
|
||||
parameter('action_points','Очки действий', function(specials){
|
||||
return Math.floor(5 + specials.agility.value * 0.5);
|
||||
}),
|
||||
parameter('carry_weight','Максимальный вес, кг', function(specials){
|
||||
return 6 + specials.strength.value * 10;
|
||||
}),
|
||||
parameter('critical_chance','Критический шанс, %', function(specials){
|
||||
return specials.luck.value;
|
||||
}),
|
||||
parameter('hit_points','Очки Здоровья', function(specials){
|
||||
return 15 + specials.strength.value + specials.endurance.value * 2;
|
||||
}),
|
||||
parameter('skill_points','Очки навыков на уровень', function(specials){
|
||||
return 5 + specials.intelligence.value * 2;
|
||||
}),
|
||||
parameter('combat_sequence','Очерёдность в бою', function(specials){
|
||||
return Math.floor(specials.agility.value + (specials.luck.value + specials.strength.value) * 0.5);
|
||||
}),
|
||||
parameter('healing_rate','Скорость лечения', function(specials){
|
||||
return specials.endurance.value + 6;
|
||||
}),
|
||||
parameter('throwing_range','Дальность броска, м', function(specials){
|
||||
return specials.strength.value + 6;
|
||||
}),
|
||||
parameter('poison_resistance','Сопротивление яду, %', function(specials){
|
||||
return specials.endurance.value * 5;
|
||||
}),
|
||||
parameter('radiation_resistance','Сопротивление радиации, %', function(specials){
|
||||
return specials.endurance.value * 2;
|
||||
}),
|
||||
parameter('armor_class','Базовый класс брони', function(specials){
|
||||
return specials.agility.value;
|
||||
}),
|
||||
parameter('melee_damage','Рукопашный урон', function(specials){
|
||||
return positive(specials.strength.value - 5);
|
||||
})
|
||||
],
|
||||
skills: {
|
||||
}
|
||||
};
|
||||
function rewrite_value(newvalue) {
|
||||
jQuery(this).siblings(".value").text(newvalue);
|
||||
}
|
||||
function update_derived() {
|
||||
var i = 0;
|
||||
jQuery('#derived').empty();
|
||||
for (i = 0; i < options.derived.length; i++) {
|
||||
jQuery('#derived').append('<div class="parameter"><div class="value" id="' + options.derived[i].id + '"> '+ options.derived[i].value(options.specials) + ' </div></div><div class="name">' + options.derived[i].name + '</div>');
|
||||
}
|
||||
}
|
||||
|
||||
jQuery(document).ready(function () {
|
||||
var i = 0;
|
||||
objects = ['strength', 'endurance', 'charisma', 'intelligence', 'agility', 'luck'];
|
||||
for (i = 0; i < objects.length; i++) {
|
||||
jQuery('#specials').append('<div class="parameter"><a class="decrement" href="#">–</a><div class="value" id="' + options.specials[objects[i]].id + '"> '+ options.specials[objects[i]].value + ' </div><a class="increment" href="#">+</a></div><div class="name">' + options.specials[objects[i]].name + '</div>');
|
||||
}
|
||||
update_derived();
|
||||
jQuery('#specials .increment').click(function () {
|
||||
for (i = 0; i < objects.length; i++) {
|
||||
if (options.specials[objects[i]].id === jQuery(this).id) {
|
||||
options.specials[objects[i]].increment();
|
||||
rewrite_value(options.specials[objects[i]].value);
|
||||
}
|
||||
}
|
||||
update_derived();
|
||||
});
|
||||
});
|
|
@ -0,0 +1,159 @@
|
|||
@font-size: 18; //in pixels
|
||||
|
||||
@column: 30;
|
||||
@gutter: 10;
|
||||
@columns: 12;
|
||||
//@total-width: 100%;
|
||||
|
||||
// from Frameless - http://framelessgrid.com/
|
||||
.width (@cols:1) {
|
||||
width: (@cols * (@column + @gutter) - @gutter) / @font-size * 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
Margin, padding, and border resets
|
||||
except for form elements
|
||||
*/
|
||||
|
||||
body, div,
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, th, td,
|
||||
article, aside, figure, footer, header, hgroup, menu, nav, section {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Consistency fixes
|
||||
adopted from http://necolas.github.com/normalize.css/
|
||||
*/
|
||||
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, nav, section, audio, canvas, video {
|
||||
display: block;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {min-height: 100%; font-size: 100%;}
|
||||
|
||||
sub, sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {top: -0.5em;}
|
||||
sub {bottom: -0.25em;}
|
||||
|
||||
pre {
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
b, strong {font-weight: bold;}
|
||||
abbr[title] {border-bottom: 1px dotted;}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
a img, img {
|
||||
-ms-interpolation-mode: bicubic;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
input, textarea, button, select {
|
||||
margin: 0;
|
||||
font-size: 100%;
|
||||
line-height: normal;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
button,
|
||||
html input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
cursor: pointer;
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-o-box-sizing: border-box;
|
||||
-ms-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
textarea {overflow: auto;}
|
||||
|
||||
#wrapper_overview{
|
||||
margin: 1em auto;
|
||||
.width(20);
|
||||
}
|
||||
.group{
|
||||
.width(10);
|
||||
.parameter{
|
||||
.width(2);
|
||||
display: inline-block;
|
||||
.value{
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
.name{
|
||||
.width(8);
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
.invert(left){
|
||||
text-align: right;
|
||||
}
|
||||
.invert(right){
|
||||
text-align: left;
|
||||
}
|
||||
.align(@x) {
|
||||
float: @x;
|
||||
.value{
|
||||
text-align: @x;
|
||||
}
|
||||
.name{
|
||||
.invert(@x);
|
||||
}
|
||||
}
|
||||
|
||||
#specials, #skills{
|
||||
.align(left);
|
||||
}
|
||||
#derived{
|
||||
.align(right);
|
||||
}
|
||||
|
||||
.increment, .decrement{
|
||||
visibility: visible;
|
||||
}
|
||||
#skills{
|
||||
/* checkboxes! */
|
||||
}
|
||||
/* Colors */
|
||||
@text: #be008a;
|
||||
@background: #7c005a;
|
||||
@links: #df64bd;
|
||||
body{
|
||||
background: url('bgr.jpg');
|
||||
color: @text;
|
||||
}
|
||||
a {
|
||||
color: @links;
|
||||
}
|
Loading…
Reference in New Issue