{ "info": { "author": "Alexander Neumann", "author_email": "aleneum@gmail.com", "bugtrack_url": null, "classifiers": [ "License :: OSI Approved :: MIT License", "Programming Language :: Python :: 2", "Programming Language :: Python :: 2.7", "Programming Language :: Python :: 3", "Programming Language :: Python :: 3.3", "Programming Language :: Python :: 3.4", "Programming Language :: Python :: 3.5", "Programming Language :: Python :: 3.6", "Programming Language :: Python :: 3.7" ], "description": "# transitions-gui - A frontend for [transitions](https://github.com/pytransitions/transitions) state machines \n\nAn extension for the [transitions](https://github.com/pytransitions/transitions) state machine package.\n`transitions-gui` uses [tornado](https://www.tornadoweb.org) as a web server and [cytoscape](http://js.cytoscape.org) for graph drawing and manipulation. For information about the javascript workflow head to [frontend](./frontend).\nThe server (including the state machine) and client (your web browser) communicate via [WebSockets](https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API).\n\n***\n**Feedback wanted**: Things do not work out of the box? You are not a big fan of the chosen icons, colours, layouts or styles? Now is the time to speak up and file a [new issue](https://github.com/aleneum/transitions-gui/issues/new).\n***\n\n## Installation\n\nInstall `transitions-gui` from [PyPI](https://pypi.org/project/transitions-gui/)\n\n```bash\npip install transitions-gui\n```\n\nor clone the GitHub repo\n\n```bash\n# clone the repository\ngit clone https://github.com/pytransitions/transitions-gui.git\ncd transitions-gui\n# install transitions-gui and all dependencies\npython setup.py install\n```\n\n## Quickstart\n\nLet's begin by creating a simple circular state machine.\nRunning `python examples/simple.py` will execute the following code:\n\n```python\nfrom transitions_gui import WebMachine\nimport time\n\nstates = ['A', 'B', 'C', 'D', 'E', 'F']\n# initializing the machine will also start the server (default port is 8080)\nmachine = WebMachine(states=states, initial='A', name=\"Simple Machine\",\n ordered_transitions=True,\n ignore_invalid_triggers=True,\n auto_transitions=False)\n\ntry:\n while True:\n time.sleep(5)\n machine.next_state()\nexcept KeyboardInterrupt: # Ctrl + C will shutdown the machine\n machine.stop_server()\n```\n\nThis will create a simple transitions state machine 'ordered' (as in circular) transitions. The name of the machine will be *Simple Machine* and it will act as its own model which is the default behaviour. The initial state is state *A* and every 5 seconds, the state will be changed. Next, open your favourite yet up-to-date web browser and head to [localhost:8080](http://localhost:8080). You should see something similar to this:\n![initial view](https://raw.githubusercontent.com/aleneum/transitions-gui/0.0.5/doc/img/initial-view.png)\n\nThe GUI is rather simplistic and contains only two buttons which you can see on the top left:\n\n* ![pencil](https://raw.githubusercontent.com/aleneum/transitions-gui/0.0.5/doc/img/pencil.png) - toggles between *Event Mode* and *Edit Mode*\n* ![save](https://raw.githubusercontent.com/aleneum/transitions-gui/0.0.5/doc/img/save.png) - saves the current layout\n\n### Event Mode\n\nThe GUI always starts in *Event Mode* which is represented by the pencil's *white* background. In this mode, the graph can be moved around by clicking and dragging but nodes cannot be moved individually. Clicking an edge/transition in *Event Mode* will dispatch the related trigger to the machine. Give it a try! Clicking any edge should trigger an instant state change. Since all edges trigger the `next_state` event it does not matter which edge you click here.\n\n### Edit Mode\n\nNow let's rearrange some state nodes, shall we? Click the pencil symbol to switch to *Edit Mode* (the pencil's background changes its background) and start dragging that nodes like this:\n\n![](https://raw.githubusercontent.com/aleneum/transitions-gui/0.0.5/doc/img/edit-view.png)\n\nIn *Edit Mode* clicking edges will not trigger an event. However, the machine's model state will be updated regardlessly.\nWhen you are done, switch back to *Event Mode*. Or don't. The mode does not matter for the next step. We will save that layout for the next time we want to run our state machine. Clicking the save button () will store the nodes' current positions in the browser's local storage. Layouts are stored by their name. If you plan to use `transitions-gui` with multiple state machines, it is recommended to make them distinguishable by name. Now reload your browser tab. Your node arangement should be recreated.\nDragging nodes around will not alter the saved layout unless you save it again.\n\n### About layouts\n\nWhen a transition state machine configuration is sent to the browser, the browser will determine the layout based on the following priority list:\n\n* value of the passed URL argument `layout`\n* layout stored in the browsers local storage\n* default layout\n - the machine contains *nested states* -> `dagre`\n - otherwise -> `concentric`\n\n`transitions-gui` might not choose the right layout for your graph right away. By passing different layout values, you can check which arrangement suits your needs the best. Additionally, you can 'reset' the layout if you want your graph to be automatically arranged again. When `layout=` is passed, the manually stored arrangement is ignored. Check the simple machine with an improved version of the CoSE arangement by opening the GUI with [localhost:8080?layout=bilkent](http://localhost:8080?layout=bilkent). This should look like this:\n\n![bilkent](https://raw.githubusercontent.com/aleneum/transitions-gui/0.0.5/doc/img/load-layout.png)\n\nThe currently supported layout values are:\n\n* dagre ([src](https://github.com/cytoscape/cytoscape.js-dagre))\n* concentric ([src](http://js.cytoscape.org/#layouts/concentric))\n* bilkent ([src](https://github.com/cytoscape/cytoscape.js-cose-bilkent))\n\nThis functionality is provided by [cytoscape.js](http://js.cytoscape.org/). If you think `transitions-gui` should support more layouts, feel free to open an issue to propose your favourite layout.\n\n## I have a [bug report/issue/question]...\n\nFor bug reports and other issues, please open an issue on GitHub.\n\n\n", "description_content_type": "text/markdown", "docs_url": null, "download_url": "https://github.com/pytransitions/transitions-gui/archive/0.0.5.tar.gz", "downloads": { "last_day": -1, "last_month": -1, "last_week": -1 }, "home_page": "http://github.com/pytransitions/transitions-gui", "keywords": "", "license": "MIT", "maintainer": "", "maintainer_email": "", "name": "transitions-gui", "package_url": "https://pypi.org/project/transitions-gui/", "platform": "", "project_url": "https://pypi.org/project/transitions-gui/", "project_urls": { "Download": "https://github.com/pytransitions/transitions-gui/archive/0.0.5.tar.gz", "Homepage": "http://github.com/pytransitions/transitions-gui" }, "release_url": "https://pypi.org/project/transitions-gui/0.0.5/", "requires_dist": null, "requires_python": "", "summary": "A frontend for the state machine library transitions", "version": "0.0.5" }, "last_serial": 5705465, "releases": { "0.0.5": [ { "comment_text": "", "digests": { "md5": "6cd8cfc1e61c526e532e44cbcab85258", "sha256": "cf3b98748707d4b1e213fcbcd1da1156278c7f6f01e49ead33688ad34f53c5d3" }, "downloads": -1, "filename": "transitions_gui-0.0.5-py2.py3-none-any.whl", "has_sig": false, "md5_digest": "6cd8cfc1e61c526e532e44cbcab85258", "packagetype": "bdist_wheel", "python_version": "py2.py3", "requires_python": null, "size": 755216, "upload_time": "2019-08-20T20:26:03", "url": "https://files.pythonhosted.org/packages/f8/cf/5b5f425123914b702138effe2da3ba0228cea81dcafbec7feb78d60cdb7e/transitions_gui-0.0.5-py2.py3-none-any.whl" }, { "comment_text": "", "digests": { "md5": "c968116cf4e45b91fd26eabe5b3edbb8", "sha256": "5de9b6b94600fb7a6419085b15d0c3362bf6fc3946850d4024a993b2567d9f6f" }, "downloads": -1, "filename": "transitions-gui-0.0.5.tar.gz", "has_sig": false, "md5_digest": "c968116cf4e45b91fd26eabe5b3edbb8", "packagetype": "sdist", "python_version": "source", "requires_python": null, "size": 1439855, "upload_time": "2019-08-20T20:26:08", "url": "https://files.pythonhosted.org/packages/e5/1b/b6be14f796b4836e9ff93d1c435853a5e9ef7b7936001cda7bf31248ba8e/transitions-gui-0.0.5.tar.gz" } ] }, "urls": [ { "comment_text": "", "digests": { "md5": "6cd8cfc1e61c526e532e44cbcab85258", "sha256": "cf3b98748707d4b1e213fcbcd1da1156278c7f6f01e49ead33688ad34f53c5d3" }, "downloads": -1, "filename": "transitions_gui-0.0.5-py2.py3-none-any.whl", "has_sig": false, "md5_digest": "6cd8cfc1e61c526e532e44cbcab85258", "packagetype": "bdist_wheel", "python_version": "py2.py3", "requires_python": null, "size": 755216, "upload_time": "2019-08-20T20:26:03", "url": "https://files.pythonhosted.org/packages/f8/cf/5b5f425123914b702138effe2da3ba0228cea81dcafbec7feb78d60cdb7e/transitions_gui-0.0.5-py2.py3-none-any.whl" }, { "comment_text": "", "digests": { "md5": "c968116cf4e45b91fd26eabe5b3edbb8", "sha256": "5de9b6b94600fb7a6419085b15d0c3362bf6fc3946850d4024a993b2567d9f6f" }, "downloads": -1, "filename": "transitions-gui-0.0.5.tar.gz", "has_sig": false, "md5_digest": "c968116cf4e45b91fd26eabe5b3edbb8", "packagetype": "sdist", "python_version": "source", "requires_python": null, "size": 1439855, "upload_time": "2019-08-20T20:26:08", "url": "https://files.pythonhosted.org/packages/e5/1b/b6be14f796b4836e9ff93d1c435853a5e9ef7b7936001cda7bf31248ba8e/transitions-gui-0.0.5.tar.gz" } ] }