Coder Social home page Coder Social logo

gulix / geckos Goto Github PK

View Code? Open in Web Editor NEW
49.0 11.0 18.0 6.51 MB

An online Card Editor with Templates

Home Page: http://gulix.github.io/geckos/

License: Other

CSS 13.68% HTML 15.91% JavaScript 69.93% Visual Basic 0.49%
card gaming jquery fabricjs json generator

geckos's Issues

Repeating group of fields

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 general Layout / Design

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 !

Description of the Template

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.

Options field with multi-selection

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.

Better Image input

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.

Setting a new Template : existing cards are still linked to the old one

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 :

  • keep the card and update it to the new fields. If some have the same name, values is kept.
  • remove all the old cards

Maybe related to #23

Template chooses the "Name" field

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)

Symbols used inside text

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

What about the KnockoutJS components ?

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.

From Kitchensink to Geckos

Adding an entry in the wiki explaining how to push a design from kitchensink (FabricJS editor) to Geckos.

Text Replacement in template more flexible

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 : $myVariable$

About box

An about box, with credits, links to the frameworks & libraries used, and so on, needs to be made.

Rich Text field

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.

Pre-installed list of Templates

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

General UI of the page

The UI of the page needs to be refreshed, with good CSS rules to give the identity of the product.

Validating the template when it is updated

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)

Having a true list / Datagrid of cards

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).

Better Options field

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.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.