Skip to content

Commit

Permalink
Fix #58
Browse files Browse the repository at this point in the history
Added the inheritance amongst styles.
Documentation to be added in #94
  • Loading branch information
Gulix committed Aug 2, 2016
1 parent ac81db6 commit 6df6871
Show file tree
Hide file tree
Showing 4 changed files with 156 additions and 60 deletions.
102 changes: 102 additions & 0 deletions src/js/inheriting-styles.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
define(['utils'], function(Utils) {

// Create a Style object, based on another style
function getStyleFromBase(heritingStyle, heritedStyle) {
var builtStyle = { };

// Basic properties
builtStyle.name = (heritingStyle.name == undefined) ? heritedStyle.name : heritingStyle.name;
builtStyle.description = (heritingStyle.description == undefined) ? heritedStyle.description : heritingStyle.description;
builtStyle.canvasBackground = (heritingStyle.canvasBackground == undefined) ? heritedStyle.canvasBackground : heritingStyle.canvasBackground;
builtStyle.canvasWidth = (heritingStyle.canvasWidth == undefined) ? heritedStyle.canvasWidth : heritingStyle.canvasWidth;
builtStyle.canvasHeight = (heritingStyle.canvasHeight == undefined) ? heritedStyle.canvasHeight : heritingStyle.canvasHeight;

// Fields, identified by 'name'
builtStyle.fields = [ ]; // TODO : need to think about an 'order of fields' with this inheritance
// Adding all the fields existing in the heritedStyle (modified by the heritingStyle, if needed)
for(var iHeritedField = 0; iHeritedField < heritedStyle.fields.length; iHeritedField++) {
var heritedField = Utils.clone(heritedStyle.fields[iHeritedField]);
var heritingField = getFieldByName(heritingStyle.fields, heritedField.name);
if (heritingField == null) {
// Field not modified by heritingStyle
builtStyle.fields.push(heritedField);
} else {
//builtStyle.fields.push(getFieldFromInheritance(heritingField, heritedField));
builtStyle.fields.push(Object.assign(heritedField, heritingField));
}
}
// Adding the fields existing only in the heritingStyle
for (var iHeritingField = 0; iHeritingField < heritingStyle.fields.length; iHeritingField++) {
var heritingField = Utils.clone(heritingStyle.fields[iHeritingField]);
var heritedField = getFieldByName(heritedStyle.fields, heritingField.name);
if (heritedField == null) {
builtStyle.fields.push(heritingField);
}
}

// Canvas fields, identified by 'id' (if no id, fields always added)
builtStyle.canvasFields = [ ]; // TODO : need to think about an 'order of fields / z-index' with this inheritance
// Adding all the canvasFields existing in the heritedStyle (modified by the heritingStyle, if needed)
for(var iHeritedField = 0; iHeritedField < heritedStyle.canvasFields.length; iHeritedField++) {
var heritedField = Utils.clone(heritedStyle.canvasFields[iHeritedField]);
var heritingField = null;
if (heritedField.id != undefined) {
heritingField = getCanvasFieldById(heritingStyle.canvasFields, heritedField.id);
}
if (heritingField == null) {
// Field not modified by heritingStyle
builtStyle.canvasFields.push(heritedField);
} else {
//builtStyle.canvasFields.push(getFieldFromInheritance(heritingField, heritedField));
builtStyle.canvasFields.push(Object.assign(heritedField, heritingField));
}
}
// Adding the canvasFields existing only in the heritingStyle
for (var iHeritingField = 0; iHeritingField < heritingStyle.canvasFields.length; iHeritingField++) {
var heritingField = Utils.clone(heritingStyle.canvasFields[iHeritingField]);
var heritedField = null;
if (heritingField.id != undefined) {
heritedField = getCanvasFieldById(heritedStyle.canvasFields, heritingField.id);
}
if (heritedField == null) {
builtStyle.canvasFields.push(heritingField);
}
}

return builtStyle;
}

function getFieldFromInheritance(heritingField, heritedField) {
var field = heritedField;
for(var key in field) {
if (heritingField[key] != null) {
field[key] = heritingField[key];
}
}
return field;
}

function getFieldByName(fields, name) {
var field = null;
for (var iField = 0; iField < fields.length; iField++) {
if (fields[iField].name == name) field = fields[iField];
}

return field;
}

function getCanvasFieldById(canvasFields, id) {
var field = null;
for (var iField = 0; iField < canvasFields.length; iField++) {
if ((canvasFields[iField].id != null) && (canvasFields[iField].id == id)) {
field = canvasFields[iField];
}
}

return field;
}

return {
getStyleFromBase: function(heritingStyle, heritedStyle) { return getStyleFromBase(heritingStyle, heritedStyle); }
}
});
7 changes: 6 additions & 1 deletion src/js/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@ define(['knockout'], function(ko) {

function isNumber(obj) { return !isNaN(parseFloat(obj)) }

function clone(obj) {
return JSON.parse(JSON.stringify(obj));
}

function getCharsTableFromHtml(sHtml) {
// Using CKEditor, this code needs to be updated.
// Maybe using a good parser ? jquery.parseHtml ?
Expand Down Expand Up @@ -116,6 +120,7 @@ define(['knockout'], function(ko) {
getCharsTableFromHtml: function(sHtml) { return getCharsTableFromHtml(sHtml); },
addCharsFromHtml: function(html, charsArray, style) { return addCharsFromHtml(html, charsArray, style); },
getTextFromCharTable: function(charTable) { return getTextFromCharTable(charTable); },
getStylesTablesFromCharTables: function(charTables) { return getStylesTablesFromCharTables(charTables); }
getStylesTablesFromCharTables: function(charTables) { return getStylesTablesFromCharTables(charTables); },
clone: function(obj) { return clone(obj); }
}
});
22 changes: 21 additions & 1 deletion src/js/viewModels/cardTemplateVM.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
define(["knockout", "utils", "viewModels/styleVM"], function(ko, utils, StyleVM) {
define(["knockout", "utils", "viewModels/styleVM", "inheriting-styles"], function(ko, utils, StyleVM, InheritingStyles) {

function cardTemplateVM(jsonTemplate, updCanvasSize, updCardsOnTemplateChange) {
var self = this;
Expand Down Expand Up @@ -96,13 +96,33 @@ define(["knockout", "utils", "viewModels/styleVM"], function(ko, utils, StyleVM)
self.setStyle(jsonStyle);
}

// Create the Style object, getting if needed the SharedConfiguration objects
// & inheriting values from another style
self.buildStyleObject = function(jsonStyle) {
var jsonCompleteStyle = jsonStyle;

if (jsonCompleteStyle.basedOn != undefined) {
var baseStyle = self.getStyleFromKey(jsonCompleteStyle.basedOn);
baseStyle = self.buildStyleObject(baseStyle);

jsonCompleteStyle = InheritingStyles.getStyleFromBase(jsonCompleteStyle, baseStyle);
}

jsonCompleteStyle.sharedOptions = self.currentTemplate().sharedOptions;

return jsonCompleteStyle;
}

self.getStyleFromKey = function(key) {
var style = null;
for (var iStyle = 0; iStyle < self.styles().length; iStyle++) {
if (self.styles()[iStyle].key == key) {
style = self.styles()[iStyle];
}
}
return style;
}

self.getDefaultStyle = function() {
var selectedStyle = null;
for (var iStyle = 0; iStyle < self.styles().length; iStyle++) {
Expand Down
85 changes: 27 additions & 58 deletions templates/pulpalley-charactercard.json
Original file line number Diff line number Diff line change
Expand Up @@ -55,12 +55,12 @@
{ "type": "text", "text": "$name", "fontSize": 22, "fontWeight": "bold", "left": 80 },
{ "type": "rect", "width": 170, "height": 106, "left": 165, "top": 36, "fill": "#E07B4F", "stroke": "#FFDDAA" },
{ "type": "rect", "width": 170, "height": 106, "left": 165, "top": 146, "fill": "#ACA497", "stroke": "#FFFFAA" },
{ "type": "text", "text": "Brawl", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 39 },
{ "type": "text", "text": "Shoot", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 74 },
{ "type": "text", "text": "Dodge", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 109 },
{ "type": "text", "text": "Might", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 149 },
{ "type": "text", "text": "Finesse", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 184 },
{ "type": "text", "text": "Cunning", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 219 },
{ "id": "brawlLabel", "type": "text", "text": "Brawl", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 39 },
{ "id": "shootLabel", "type": "text", "text": "Shoot", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 74 },
{ "id": "dodgeLabel", "type": "text", "text": "Dodge", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 109 },
{ "id": "mightLabel", "type": "text", "text": "Might", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 149 },
{ "id": "finesseLabel", "type": "text", "text": "Finesse", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 184 },
{ "id": "cunningLabel", "type": "text", "text": "Cunning", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 219 },
{ "type": "text", "text": "$brawl", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 39 },
{ "type": "text", "text": "$shoot", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 74 },
{ "type": "text", "text": "$dodge", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 109 },
Expand All @@ -73,7 +73,7 @@
{ "type": "textbox", "width": 330, "left": 5, "top": 260, "fontSize": 18, "text": "$description$", "styles": "£description" },
{ "type": "rect", "height": 40, "left": 5, "top": 450, "fill": "#B1E29E", "stroke": "#000000",
"width": "{{value = 330; if (card[health] == 'd6*') { value = 167; } else if (card[health] == 'd6') { value = 209; } else if (card[health] == 'd8') { value = 251; } else if (card[health] == 'd10') { value = 293; } else if (card[health] == 'd12') { value = 330; }}}" },
{ "type": "textbox", "width": 70, "left": 8, "textAlign": "left", "top": 460, "fontWeight": "bold", "fontSize": 20, "text": "Health :" },
{ "id": "healthLabel", "type": "textbox", "width": 70, "left": 8, "textAlign": "left", "top": 460, "fontWeight": "bold", "fontSize": 20, "text": "Health :" },
{ "type": "textbox", "width": 42, "left": 76, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "$health$" },
{ "type": "textbox", "width": 42, "left": 118, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
Expand All @@ -93,63 +93,32 @@
},
{
"key": "classic_fr",
"basedOn": "classic",
"name": "Template classique",
"description": "Le template classique pour Pulp Alley, en français.",
"isDefault": true,
"fields": [
{ "name": "name", "label": "Nom", "default": "Captain Wolf" },
{ "name": "brawl", "label": "Bagarre", "default": "3d10" },
{ "name": "shoot", "label": "Tir", "default": "3d10" },
{ "name": "dodge", "label": "Esquive", "default": "2d8" },
{ "name": "might", "label": "Puissance", "default": "3d10" },
{ "name": "finesse", "label": "Habileté", "default": "2d8" },
{ "name": "cunning", "label": "Ruse", "default": "3d10" },
{ "name": "description", "label": "Description", "default": "...", "type": "richtext" },
{ "name": "characterType", "label": "Type", "type": "options", "default": "leader", "sharedOptions": "characterType_fr" },
{ "name": "portray", "label": "Image", "type": "image" },
{ "name": "health", "label": "Santé", "type": "options", "default": "d10", "sharedOptions": "healthDice" }
{ "name": "name", "label": "Nom", "default": "Capitaine Wolf" },
{ "name": "brawl", "label": "Bagarre" },
{ "name": "shoot", "label": "Tir" },
{ "name": "dodge", "label": "Esquive" },
{ "name": "might", "label": "Puissance" },
{ "name": "finesse", "label": "Habileté" },
{ "name": "cunning", "label": "Ruse" },
{ "name": "description", "label": "Description" },
{ "name": "characterType", "label": "Type", "sharedOptions": "characterType_fr" },
{ "name": "portray", "label": "Image" },
{ "name": "health", "label": "Santé" }
],
"canvasFields": [
{ "type": "rect", "width": 350, "height": 495, "fill": "#CAAB7F" },
{ "type": "text", "text": "$characterType$ :", "fontSize": 22 },
{ "type": "text", "text": "$name", "fontSize": 22, "fontWeight": "bold", "left": 80 },
{ "type": "rect", "width": 170, "height": 106, "left": 165, "top": 36, "fill": "#E07B4F", "stroke": "#FFDDAA" },
{ "type": "rect", "width": 170, "height": 106, "left": 165, "top": 146, "fill": "#ACA497", "stroke": "#FFFFAA" },
{ "type": "text", "text": "Bagarre", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 39 },
{ "type": "text", "text": "Tir", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 74 },
{ "type": "text", "text": "Esquive", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 109 },
{ "type": "text", "text": "Puissance", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 149 },
{ "type": "text", "text": "Habileté", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 184 },
{ "type": "text", "text": "Ruse", "fontSize": 22, "fontWeight": "bold", "left": 175, "top": 219 },
{ "type": "text", "text": "$brawl", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 39 },
{ "type": "text", "text": "$shoot", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 74 },
{ "type": "text", "text": "$dodge", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 109 },
{ "type": "text", "text": "$might", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 149 },
{ "type": "text", "text": "$finesse", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 184 },
{ "type": "text", "text": "$cunning", "fontSize": 22, "fontWeight": "bold", "left": 270, "top": 219 },
{ "type": "rect", "left": 2, "width": 156, "top": 36, "height": 216, "fill": "#DABD9E", "stroke": "#FFDDBB"},
{ "type": "image", "left": 6, "width": 150, "top": 40, "height": 210, "src": "$portray" },
{ "type": "rect", "width": 336, "left": 2, "top": 256, "height": 190, "fill": "#DABD9E", "stroke": "#FFDDBB"},
{ "type": "textbox", "width": 330, "left": 5, "top": 260, "fontSize": 18, "text": "$description$", "styles": "£description" },
{ "type": "rect", "height": 40, "left": 5, "top": 450, "fill": "#B1E29E", "stroke": "#000000",
"width": "{{value = 330; if (card[health] == 'd6*') { value = 167; } else if (card[health] == 'd6') { value = 209; } else if (card[health] == 'd8') { value = 251; } else if (card[health] == 'd10') { value = 293; } else if (card[health] == 'd12') { value = 330; }}}" },
{ "type": "textbox", "width": 70, "left": 8, "textAlign": "left", "top": 460, "fontWeight": "bold", "fontSize": 20, "text": "Health :" },
{ "type": "textbox", "width": 42, "left": 76, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "$health$" },
{ "type": "textbox", "width": 42, "left": 118, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "{{if (card[health] == 'd6*') { value = 'Out'; } else if (card[health] == 'd6') { value = 'Down'; } else if (card[health] == 'd8') { value = 'd6'; } else if (card[health] == 'd10') { value = 'd8'; } else if (card[health] == 'd12') { value = 'd10'; }}}" },
{ "type": "textbox", "width": 42, "left": 160, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "{{if (card[health] == 'd6') { value = 'Out'; } else if (card[health] == 'd8') { value = 'Down'; } else if (card[health] == 'd10') { value = 'd6'; } else if (card[health] == 'd12') { value = 'd8'; }}}" },
{ "type": "textbox", "width": 42, "left": 202, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "{{if (card[health] == 'd8') { value = 'Out'; } else if (card[health] == 'd10') { value = 'Down'; } else if (card[health] == 'd12') { value = 'd6'; }}}" },
{ "type": "textbox", "width": 42, "left": 244, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "{{if (card[health] == 'd10') { value = 'Out'; } else if (card[health] == 'd12') { value = 'Down'; }}}" },
{ "type": "textbox", "width": 42, "left": 286, "textAlign": "center", "top": 462, "fontWeight": "bold", "fontSize": 16,
"text": "{{if (card[health] == 'd12') { value = 'Out'; }}}" }
],
"canvasBackground": "#CAAB7F",
"canvasWidth": 340,
"canvasHeight": 495
{ "id": "brawlLabel", "text": "Bagarre" },
{ "id": "shootLabel", "text": "Tir" },
{ "id": "dodgeLabel", "text": "Esquive" },
{ "id": "mightLabel", "text": "Puissance" },
{ "id": "finesseLabel", "text": "Habileté" },
{ "id": "cunningLabel", "text": "Ruse" },
{ "id": "healthLabel", "text": "Santé :" },
]
}
],
"description": {
Expand Down

0 comments on commit 6df6871

Please sign in to comment.