Initial commit - not usable

Still working on the scripting and layout.
11 years ago · d6f568dc7a
commit d6f568dc7a
6 changed files with 349 additions and 0 deletions
--- a/2
+++ b/2
@ -0,0 +1,2 @@
+all:
+	lessc style.less >style.css
--- a/README.md
+++ b/README.md
@ -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.
--- a/bgr.jpg
+++ b/bgr.jpg
--- a/chargen.html
+++ b/chargen.html
@ -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>
--- a/script.js
+++ b/script.js
@ -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();
+	});
+});
--- a/style.less
+++ b/style.less
@ -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;
+}