readme

browser/vue-flow/src/assets/doc/appinfo.md

@@ -15,6 +15,6 @@
 * **Links**: Press `shift` and Drag from a node/socket to a socket highlighted in green
 * **Links(alternative)**: Toggle socket visualisation in the panel and Drag from a socket to a socket highlighted in green
 * **Remove Link**: Simple click on the link when it turns red
-* **Create a portal**: Drag an output socket from a node to an empty space check <a href="readme#portals" target="_blank">portals</a> on readme for further information
+* **Create a portal**: Drag an output socket from a node to an empty space check <a href="readme#portal-from" target="_blank">portals</a> on readme for further information
 
 <small>&copy; Luis Figueiredo (luisf@hexasoftware.com)</small>

browser/vue-flow/src/assets/doc/readme.md

@@ -2,6 +2,8 @@
 
 General purpose graph package for Go
 
+[changelog](#changelog)
+
 ## Initial Idea
 
 `possibilities`
@@ -106,14 +108,12 @@ registry.Describer(
 
 ![fig3](img/describing.jpg)
 
-### Results
-
 ![fig4](img/runningsplit.jpg)
 ![fig5](img/runningjoin.jpg)
 
-### Special Operations
+## Special Operations
 
-#### f.In
+### f.In
 
 Uses an argument passed through the process function
 
@@ -123,50 +123,60 @@ res, err := op.Process("arg")
 // res will be "arg"
 ```
 
-#### f.Var
+```go
+op := f.Op("sum",f.In(0),f.In(1)
+res, err := op.Process(1,2)
+// res will be the sum the inputs 1 and 2
+```
+
+### f.Var
 
-Variable that stores data in the flow (for future serialization) it can be
-restored
+_Var_ creates an operation that loads data from the flow, if there is no data
+the second parameter will be used for variable initialization
 
 ```go
 f.Var("myvar", "initial value or operation")
 ```
 
-#### f.SetVar
+### f.SetVar
 
-Set var creates an operation that sets a variable to the result of the operation
+_SetVar_ creates an operation that sets a variable to the result of the operation
 passed as the argument
 
 ```go
 f.SetVar("myvar", operation)
 ```
 
-### UI Special nodes
+## UI Special nodes
 
-#### Input
+### Input
 
 Same as f.In where a property must be set to indicate which argument this
 node refers to
 
-#### Output
+### Var
 
-Flow-UI only output is a special node that indicates the overall flow output,
-the UI contains a RUN button that will be visible if there is an output node and
-the flow will be executed from the output node.
+Same as f.Var passing the variable name as a property of the node
 
-There can be only one output node
+### SetVar
 
-#### Var
+Same as f.SetVar passing the variable name as a property of the node
 
-Same as f.Var passing the variable name as a property of the node
+### Output
 
-#### SetVar
+> Flow-UI only
 
-Same as f.SetVar passing the variable name as a property of the node
+Output is a special node that indicates the overall flow output,
+the UI contains a RUN button that will be visible if there is an output node and
+the flow will be executed from the output node.
+
+There can be only one output node
+
+### Portal From
 
-#### Portals
+> Flow-UI only
 
-UI Only: Portals are helper nodes that allows to connect areas of UI without
+Portals are helper nodes that allows to connect areas of UI without
 crossing any links, right click in a node and choose create portal or drag a
 link from an output socket to an empty area, this will create a portal from the
 node
@@ -177,6 +187,16 @@ node
 
 ## TODO
 
+### Readme
+
+> this is a simple markdown which is rendered to html during compile time with
+> webpack using markdown-loader and highlight-loader, the left menu is generated by analysing
+> the html h1,h2,h3,h4 tags
+
+* Fix any typos bad English etc...
+* Create an explanation of the project inspiration/goals
+* describe milestones
+
 ### UX/UI
 
 * UX/UI: Create Undo behaviour, Possibly easy since this is using vuex (centralized state management)
@@ -185,6 +205,8 @@ node
 * UX/UI: Implement touch;
 * UX/UI: Drop link in node to link to the next compatible input;
 * UX/UI: Find a way to highlight/linked portals for easy user reference
+* UX/UI: Multiple selection inspecting [idea](#multiple-node-editing)
+* UX/UI: Dynamic Context menu
 * ~~UX/UI: Portals to clean graph crossing~~ (testing);
 * ~~UX/UI: `Shift` key to merge group selections~~;
 
@@ -208,6 +230,8 @@ node
 
 ### Matching types
 
+> TODO
+
 in UI we can create a state such as draggingType{in:'io.Writer'} which basically
 each node can figure a match for each socket
 
@@ -218,17 +242,57 @@ type
 
 ### Generating code
 
+> TODO
+
 generate code based on a flow should be simple as we have the function signatures
 
 ### Portals
 
-> Testing phase
+> Testing
 
 Named portal would connect a node to another without any link, this way we can
 have clean links without crossovers
 
 ### Recursive registering
 
+> TODO
+
 Since an operation can be run with op.Process(inputs...) we can simple do
 registry.Add(op.Process) to register a flow as an operation, UI doesn't retain
 the registry/flow yet
+
+### Multiple node editing
+
+> TODO
+
+While on multiple selection the inspector can show common properties and editing
+those will affect all nodes in the selection, RUN would be disabled in multiple
+selection
+
+### Dynamic context menu
+
+> TODO
+
+Right now the context menu works while right clicking in a node,
+would be good to have the same by right clicking in other subjects:
+
+* **Link**
+  * Delete
+* **Trigger**
+  * toggle On: error
+  * toggle On: success
+* **Editor**
+  * toggle Show Detail
+  * toggle Show Activity
+  * toggle Show Triggers
+  * Reset view
+
+## Changelog
+
+13/02/2018
+
+* **Selection**: Animated selection areas to improve visibility
+* **Portal node**: dragging from a output socket to an empty area will create a portal
+* **Portal node**: Improved backend portal handling
+* **Dark**: Improved styling in the dark mode
+* **Editor**: Shift now increases zoom speed, added small transition to smooth zoom

browser/vue-flow/src/components/app-readme.vue

@@ -129,6 +129,7 @@ export default {
   padding-left:10%;
   padding-right: calc(100% - 1200px);
   padding-right: 20%;
+  padding-bottom:100vh;
 }
 
 </style>