gulix / geckos Goto Github PK
View Code? Open in Web Editor NEWAn online Card Editor with Templates
Home Page: http://gulix.github.io/geckos/
License: Other
An online Card Editor with Templates
Home Page: http://gulix.github.io/geckos/
License: Other
Some fields don't need to be displayed in every card. A boolean field "Show more fields" should be able to hide / display those other fields.
To be set in the template.
An "image field" should be added to the list of fields, to add an image to a card
Well, that"s the question ...
Should the page open on the template part, so that the user can set its own template ?
Or is the Cards'List more important ?
A field with multi-selection.
Reminder : a way to display this selection (string with separator ?), a function to know if a value / list of values / value inside a list is selected, a limit to the number of items selected.
Geckos needs to validate a template before using it.
The user should know what is wrong with its template without having to use an external Json Validator or reading the Javascript function.
Related to Issue #14 (the Template Editor)
For example, a canvas object can have a property "paths" that is an Array. This type of data is not resolved when generating the Canvas json.
A "List image" field, which text value is an image (dataurl).
A field with a True/False value.
To test :
A template with an Input Text field, with no default value, and a Textbox Canvas Field, with text linked to this variable.
When setting the template, an error occurs in the javascript.
Having a Rich Text Field is necessary : skills, special rules, ... often need to have bold or italic text.
The result in the template should be an itext object, with styles generated on the run.
A page of geckos should come with a list of templates pre-installed, and a convenient way to select them.
See #21 for the information to be displayed
See #5 for comments on a better list UI.
The need here is to get a true DataGrid to display the cards in the upper part of the page. Column sorting / filtering, binding (with the current card), multi-selection (for exporting cards ?), ...
Each field could be added as a column to this list (depending on a variable).
The first one should be selected
An about box, with credits, links to the frameworks & libraries used, and so on, needs to be made.
Some group of fields (see #16) could be used as an Array.
For exemple, a table of weapons, with each the same values / fields (Range, Power, Name, Special rules). Instead of having each of these fields repeated from Weapon 1 to Weapon X (with X needed to be static), having those fields registered as a Group in an Array could be a good idea.
How to get this to work with the generation of the Canvas should be well thought.
A better image input should be provided, with the image adjusted to the field (ratio / scale), and a selector of the part of the image used.
When writing a text to be added to a card, some symbols (defined by the template) could be added to the text via some mechanism : Constants, Special format (like bold & italic), copy / paste, ...
Maybe looking how it's done in Magic Set Editor
To be linked to #8
A template should have a Name, Description and why not an Icon / Image. Could be useful to store Templates in the website.
Following the completion of Issue #12
Need to write documentation on how to use the Rich Text Field and its generated variables.
The UI of the page needs to be refreshed, with good CSS rules to give the identity of the product.
An editor for the templates (fields & Canvas) need to be done.
It should allow the user to edit a canvas like the Kitchensink page of fabricjs : http://fabricjs.com/kitchensink
Adding an entry in the wiki explaining how to push a design from kitchensink (FabricJS editor) to Geckos.
The "Options" field should allow the user to get the value / text of the options on the canvas.
Right now, only the value is put on the card.
Maube a third value (text on card) could be added top options.
How to reproduce :
Open the demo file.
Replace the template with a void one (should work also with a complete one)
{
"fields": [
{ "name": "name", "label": "Name", "default": "Morg N Thorg" }
],
"canvasFields": [
],
"canvasBackground": "#FF0000",
"canvasWidth": 536,
"canvasHeight": 750
}
Set the template.
The old card is still in the list, and the fields are the ones from the previous template.
2 solutions :
Maybe related to #23
A list of cards can be Loaded / Saved (JSON Format ?).
Independent to the Template
One can edit or upload a new template file to the UI.
The list of cards can then be processed to this new template.
It could be good to use the components of KnockoutJS to ensure a better code architecture.
The fields, the different parts of the UI (fields, canvas, list, ...) could all be divided into component.
Need to think about it.
Following the completion of Issue #28, the wiki needs to be updated with a documentation about how to add custom fonts to a template.
FabricJS have export actions to JSON / Svg and Image formats.
Following the completion of Issue #10
Need to write documentation on how to use variables in the canvas.
In addition to the "Text input" fields, we should be able to have select with options
The list of cards needs to have "Add" and "Remove" Actions, as well as a proper field for the name.
Currently, the text replacement in a template is made with a variable like this :
"text" : "$myVariable
The variable replaces all the text, and it's not possible to create a field with the concatenation of two variables
"text" : "$myName + $myLevel"
or with a variable following / preceding some text
"text" : "$myName [$myRole]"
Some regexp should be used to get a better system than pure text replace. Maybe having the format of the variable changed :
One should be able to access the template and set values depending on values of the Card.
Some editable fields would be better displayed if grouped together
Will need a web designer to help me get a responsive, modern, attractive and user-friendly UI.
If you want to help, you're welcome !
A list of cards to be exported to a PDF, ready to print, at the wanted size.
jsPdf could be useful for this.
In a template, a field should be set to be the "Name" field, used in the list of cards.
Default is the "name" field (if exists), or the first one.
This functionality should be then used to have an "ID" field, as a better list will not need a "Name" field (see #19)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.