Merge pull request #97 from KNowledgeOnWebScale/development

Release 1.0.0

Author: TiboStr

.github/workflows/continuous-integration-workflow.yml

@@ -0,0 +1,22 @@
+name: GitHub Pages CI
+on: push
+
+jobs:
+  build-test-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Set-up Node
+        uses: actions/setup-node@v1
+        with:
+          node-version: "18.x"
+      - run: npm ci
+      - run: npm run build
+      - name: Deploy
+        uses: crazy-max/ghaction-github-pages@v1
+        with:
+          target_branch: gh-pages
+          build_dir: build
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

CHANGELOG.md

@@ -0,0 +1,61 @@
+# Changelog
+
+Dates are DD-MM-YYYY
+
+## [0.1.0] - 04-08-2022
+
+First ever release. You can make flows from JSON or YAML.
+
+## [1.0.0] - 12-08-2022
+
+### Added
+
+- Issue #10: There is support for vgroups and hgroups in combination with `autoLayout`.
+- Issue #11: Created a file [DEVELOPMENT.md] to keep [README.md] end-user-friendly.
+- Issue #12: You can set the contents of the example buttons via the configs.
+- Issue #18: Set the size of an arrowhead.
+- Issue #19: You can import and export figure configurations.
+- Issue #22: There is a button to import the positions of all nodes of the flow.
+- Issue #30: There is a switch button to auto-sync all the changes you make in the editors.
+- Issue #34: You can use define for nodes and edges.
+- Issue #35: Nodes can have a dashed stroke (just like edges already could).
+- Issue #59: There is a button to export the raw ReactFlow config.
+- Issue #73: Support for adding encoding data in the URL. If you encode data in the URL, the flow shows up in full
+  screen, so you can embed the flow in an `iframe`.
+- Issue #79: There is a switch to snap the nodes to the grid.
+- Issue #80: You can place text on top of a node.
+
+### Changed
+
+- Issue #4: Global settings have nested objects 'graph', 'node' and 'edge'.
+- Issue #5: You can generate documentation (see DEVELOPMENT.md for more info)
+- Issue #5: edgeColor -> color and edgeThickness -> thickness.
+- Issue #20: Changed layout of the editors. The editors are on the left, so you don't need to scroll in order to see the
+  generated flow.
+- Issue #21: If you use images with different dimensions than the width and height of the node, the imaged is not sliced
+  anymore.
+- Issue #24: There is a better separation of UI and non-UI code.
+- Issue #25: Transferred the repo from https://github.com/TiboStr to https://github.com/KNowledgeOnWebScale.
+- Issue #31: There is a GitHub action that deploys a new version of this project to GitHub Pages on every `git push`.
+  The new link (after the transferation done in issue #25)
+  is https://knowledgeonwebscale.github.io/dataflow-visualization/.
+-
+
+### Fixes
+
+- Issue #40: If you changed the color of an edge, all the markers with no color specified, changed to that color.
+- Issue #69: Title and label in a node that was no parent, did not work.
+
+Kept [README] en [DEVELOPMENT] up to date with all the new changes and additions.
+
+## Unreleased
+
+* /
+
+[DEVELOPMENT.md]: DEVELOPMENT.md
+
+[DEVELOPMENT]: DEVELOPMENT.md
+
+[README.md]: README.md
+
+[README]: README.md

DEVELOPMENT.md

@@ -0,0 +1,49 @@
+# Development
+
+This document is aimed at developers.
+
+### How to autogenerate the documentation
+
+In [index.js](src/index.js) set the variable `download` to `true`. Rerun the application and set the variable to `false`
+again. You will notice there were three JSON files downloaded. Paste the contents of these files in the accompanying
+files in the directory [schemas/schemas](schemas/schemas). Open your terminal, `cd` to `/schemas` and
+run `node JSONSchemaMarkdown.js`. The new markdowns will be generated, [README.md](README.md) already links to these
+files.
+
+You might ask why not introduce a command, e.g. `npm build docs` that launches a separate script. The reason is that
+React can't write to files and the separate script would need the schemas being built
+in [schemaValidation.js](src/lib/schemaValidation.js). In order for that script to import a JavaScript file used in 
+React, someone should mess with webpack. To the person who will do this, good luck!
+
+### How to add shapes/images
+
+As mentioned in the documentation, the value of `image` can be a predefined value or a URL. If you want to add your own
+predefined
+image, edit the hashmap `SHAPES` in the file [nodeUtil.js](./src/components/node/nodeUtil.js). Pull requests are always
+welcome.
+
+### How to add examples
+
+When using this application, you'll notice there are buttons to load examples. These buttons load in the
+files [exampleData1.js](./src/data/examples/exampleData1.js), [exampleData2.js](./src/data/examples/exampleData2.js) ...
+So if you want to
+add
+an example, just create another file. In this file, you should have a JSON object for the global defaults, an array of
+nodes
+and an array of edges. Optionally, you can set a title as well. This will be the text inside the button (so the contents
+of the buttons don't have to be `example x`). If your file is ready, import everything
+in [examples.js](./src/data/examples.js) and add your imports to the array `examples`. A button to load in
+your example will automatically show up if you restart the application.
+
+### Permalink
+
+There is a button to get a link to your flow. There are two formats for a link.
+
+1) `https://knowledgeonwebscale.github.io/dataflow-visualization/#/customdata?globaldefaults=...&nodes=...&edges=...`
+    * The query parameters are the URI-encoded values of what's inside the editors.
+2) `https://knowledgeonwebscale.github.io/dataflow-visualization/#/rawdata?nodes=...&edges=...`
+    * The query parameters are the URI-encoded values of the raw data of the flow. Remember, there is a button to export
+      the raw data.
+
+If you press the button to copy the permalink to your clipboard, you get whichever link is shortest. 
+

LICENSE.md

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 Tibo Stroo
+Copyright (c) 2022 KNowledge on Web Scale
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal