johnl4 / diaspora

Diaspora RPG tools

Diaspora

Diaspora tools

Angular Web app to generate clusters

In the AngularClusterGenerator directory. This is where most of my effort recently has gone.

cluster-gen

(In ClusterGenerator folder.)

usage: cluster-gen.py [-h] [--legend] ...

Diaspora cluster generator

positional arguments:
  systemNames  Unique first letters of star system names

optional arguments:
  -h, --help   show this help message and exit
  --legend     Include a legend of colors in the generated graph

A Python 3 script.

Get Python at http://python.org.

The output (captured from stdout with a redirect) is intended for processing with GraphViz (specifically, neato).

Get GraphViz at http://graphviz.org.

Sample command-line usage (I used CygWin (http://cygwin.org), but regular Windows should work, too.

python3 cluster-gen.py A B C D E F > sample-cluster.dot
/usr/local/GraphViz-2.30.1/bin/neato.exe -Tpdf -osample-cluster.pdf sample-cluster.dot

Then you have a PDF file you can view.

You can edit the .dot file (it's just text) and comment out (using //) the "legend".

Or, if you want a PNG:

/usr/local/GraphViz-2.30.1/bin/neato.exe -Tpng -osample-cluster-no-legend.png sample-cluster-no-legend.dot

diaspora's Issues

Find a way to run C code on back-end server

Need a server with GraphViz installed?

Note that the eventual plan is to run Mogensen's map generator, so you'll need a server at some point, no matter what.

Bring in either Material Design or Polymer for popups and/or better table layout

(Not sure why I created this item. For the "info" popup on the high/low slipknots option?)

Rather than code up my own popup (which I suppose I could do), maybe we should use MD or Polymer for it.

Note that these might actually be a replacement for Bootstrap.

Actually, looks like Angular Material might be the way to go (note that it's in beta for Angular 2, so maybe stick with MDL for now?)

Hmm... looks like nothing does popups. :( Still need to cogitate on this.

Observables don't always update when first logging in

Need to start a discussion on some Firebase forum, I think.

Encode/escape strings in XML

Disallow double quotes, at least.

Consider using encodeURIComponent()

Serializer(s) called way too many times

Really, we only need to call the serializer when the tab is clicked. Is this a job for routing?

Web-server-ify this puppy

Find a way to put this up on a web server. (Preferably my Raspberry Pi! Ha!)

Might need to translate to Java (since, at the moment, the only web server I have on the Pi is TJWS).

"Help" popup for "high/low slipknots" checkbox

Find a way to put text nodes in, describing the systems.

No reason we can't have the node text (aspects, text descriptions, 7.5 yards if not the whole 9) right on the graph. Maybe in teeny-tiny print (or a big, gigantico SVG graph, or something).

Aspects and Notes entry fields

Notes will be plain text, for the moment.

Probably should put Notes field in new table row under row containing other starsystem attributes.

Use ng-container to put in two table rows.

Deserialize XML

Requires input text field or file upload option.

Also requires a service to get XML? (Separate work item?)

Make sure slipstream rule is implemented correctly

If there are multiple "best" and "worst" systems, choose from each randomly.

Write an initial login page

Now that we're about to write data to some web server somewhere, we need authentication so we can keep the entire world from griefing us by filling up our database with porn. For FireBase, this requires authentication to at least try to slow that firehose down.

The preferred way to do the login is by redirect, and we can't (at present) redirect into the middle of our page flow, so we need to authenticate before we even start.

Note: Can probably use localStorage to stuff the data we need to save into the browser, and retrieve it after the redirect (should probably clear it after saving it to the d/b, to prevent confusion). Or use timestamps for both, to figure out which one is more recent (timestamp on same browser for both pieces of datga).

Shortcut keys (at least for saving)

Hook up params screen to model, so it survives tabbing out/back in again

Read-only HTML of complete cluster suitable for printing

May be obviated by #34.

Make "Go" button flip over to Cluster Details tab automatically

Figure out how to use ng cli to deploy app to github pages (at which point you can announce this app to the community)

After persistence is working, it'll be time to deploy and publicize and get comments.

Turn comments in XML schema definition into annotations

No need to have comments. Make them actual annotations, since they specify more info about validating XML documents against this schema.

Show connections between systems

Totally left that part out. Oops.

Disable "Go" button if form is invalid.

(Regardless of pristine-ness.)

Params tab should auto-focus on first input field

Make "enter" key work in numSystems field

Probably requires turning the Go button into a submit button and writing some sort of onSubmit() function to prevent it from actually trying to post the form to a server.

High/Low slipknots

Spiffy SVG icons for each system, showing Tech, Env, Resources

Octagons. Bold sides starting at bottom for tech, color on bottom half for resources, color on top half for environment. Either blend colors algorithmically or allow user to specify result of blend.

Use data uri in cytoscape for node images.

Different colors

Current color basis is R, G, B, nice and orthogonal. This makes addition easy for determining node colors based on tech (blue), environment (green) and resources (red).

However, it'd be nice to have a different color basis, say yellow for tech, blue for environment, green for resources. Or something. That makes it tricky to add up RGB, we really need to find a way to average our location in some space determined by the three colors plus a "magnitude" sorta direction (all attributes low vs. all attributes high).

F'rinstance: tech: yellow, environment: blue; resources: red. Mix like paint, not light. Less is white, more is black. Fix lettering for dark backgrounds?

Reload XML saved to Firebase

Create model; share between tab views

Input params (# systems) goes into model in "Params" tab, individual clusters come out in "Cluster" tab.

Databases to investigate

• couch
• pouch
• redid
• firebase
• rethinkdb
• gunndb

Show validation errors on text, out-of-range inputs

Need visual indicator of error, plus explanation of error (small text under? tooltip?)

Create a persistence service

Could be done with popup dialog into/from which user copies XML saved locally.

Could be firebase connection with credentials cached locally?

Note: made a lot of progress on this, but I don't consider it done, since we're not really using it to save and retrieve the cluster.

Enable deep-linking to tabs, with unique cluster names

Will enable sharing.

Will also require allowing world-readable (or -editable) cluster, so unauthenticated users can at least read the clusters.

Connect to FireBase (set up an account, figure out how to use)

Make node labels in .dot files more accessible

Currently, node labels are represented by "\N". This is more cryptic than it needs to be. Just put the node label in (e.g., label="A\nT2 E0 R-1").

Rename Angular notes.txt to notes.org, so GitHub shows it better.

Consider simple markdown for notes, including ability to link to other documents

User might prefer to use a real document editor (e.g., google docs) to write up star systems. Allow links to those docs.

Move XML deserialization code to ClusterSerializerXml class

Serialization/deserialization belongs in an external class, I think.

Put visible "required" indicator on numSystem on initial form load

Ideally, we'd have some spiffy icon in the input field that appears either when the field is required and doesn't have a value, or when it's in error (which would cover the first case).

Requires getting a reference to the Angular control and switching class or visibility attributes based on the validation state of the control.

Collapsible "notes" table row or Editable read-only row

Don't take up space with an empty row. Put an "edit" button on the row, maybe.

Making the entire row readonly or editable may obviate issue #33.

Export cluster graph as JSON into cluster XML

Make parameterless navigation to 'details' screen work

Currently, the no-param version of the '/details' url is failing because there's no route in app.module.

Also make available traditional cluster layout

All in a row.

Next system link: straight line.
Skip system link: unbundled Bezier, offset once.
Skip 2nd system link: unbundled Bezier, offset twice.

Alternate offset up/down.

May need to change screen layout to make a long strip available for linear layout.

Generate GraphViz dot(1) output

See http://www.graphviz.org/.

Requires establishing connectivity (subissue 1) and handling high/low slipknot option (subissue 2).

Change XML serialization to separate starsystem id and name.

We need to have the id be the array index (i.e., 0-based sequence number) and let the name be an arbitrary string.

This will also make it easier to deserialize slipstreams that point to systems that do not yet exist.

Export cluster graph as PNG

Make "connected throw" comments in .dot XML elements, for easier parsing

Maybe at some point, I'll scribble a tool that joins two clusters using those comments (since some "connected" throws at the end of the sequence can be "wasted" (no more systems to connect to, even though the throw was high)). So, the wasted "connected" throws can be considered single-ended, unbound links, knowwhutimean?

Merge ng2 final cli 19 branch down to main

Move icons down and to the right one pixel to prevent clipping

SVG paths need to be moved because it looks like the icons are getting clipped one pixel's worth. (Also icons need to grow bigger by one pixel.)

Implement "Delete" function for Firebase data

English-ify allowedNumericValues specification, for better UI display

Need to turn "error, enter a number in the allowed range ([1,26];30;(40,50]) into "...allowed range (between 1 and 26; 30; or between 40 (exclusive) and 50)".

Or some such.

Hook up D3 or Cytoscape.js and do auto-layout (may obviate need for GraphViz)

http://js.cytoscape.org/