fixed minor grammatical and spelling mistakes

README.md

@@ -47,33 +47,33 @@ To install Docker for Mac [click here](https://docs.docker.com/docker-for-mac/in
 ### Setup Authentication for Docker Environment
 1. Go to Github Developer Applications and create a new application. [here](https://github.com/settings/developers)
 
-2. For local deployments,the following should be used in the options:
+2. For local deployments, the following should be used in the options:
     * Application name: Fabrik
     * Homepage URL: http://0.0.0.0:8000
     * Application description: Fabrik
     * Authorization callback URL: http://0.0.0.0:8000/accounts/github/login/callback/
 
 3. Github will provide you with a Client ID and a Secret Key. Save these.
 
-4. Create a superuser in django service of docker container
+4. Create a superuser in Django service of Docker container
 
     ```
-    docker-compose run django python manage.py createsuperuser
+    docker-compose run Django python manage.py createsuperuser
     ```
 
-    Note: Before creating the superuser, make sure that django service of docker image is running. This can be done by executing ``` docker-compose up ``` followed by ``` Ctrl + C ``` to save docker configuration.
+    Note: Before creating the superuser, make sure that Django service of docker image is running. This can be done by executing ``` docker-compose up ``` followed by ``` Ctrl + C ``` to save docker configuration.
 
 5. Open http://0.0.0.0:8000/admin and login with the credentials from step 4.
 
-6. Setting up Social Accounts in django admin
+6. Setting up Social Accounts in Django admin
 
     * Under ``` Social Accounts ```, open ``` Social applications ``` and click on ``` Add Social Application ```.
 
-    * Choose  the ``` Provider ``` of social application as ``` Github ``` and  name it ``` Github ```.
+    * Choose the ``` Provider ``` of the social application as ``` Github ``` and name it ``` Github ```.
 
-    * Add the sites available to the right side, so github is allowed for the current site.
+    * Add the sites available to the right side, so GitHub is allowed for the current site.
 
-    * Copy and paste your ``` Client ID ``` and ``` Secret Key ``` into the apppropriate fields and Save.
+    * Copy and paste your ``` Client ID ``` and ``` Secret Key ``` into the appropriate fields and Save.
 
 7. Go to ``` Sites ``` tab and update the ``` Domain name ``` to ``` 0.0.0.0:8000 ```.
 
@@ -135,7 +135,7 @@ To install Docker for Mac [click here](https://docs.docker.com/docker-for-mac/in
 
 5. If you already have Caffe, Keras and TensorFlow installed on your computer, skip this step.
 * For Linux users
-    * Install Caffe, Keras and Tensorflow
+    * Install Caffe, Keras, and Tensorflow
 
         ```
         cd Fabrik/requirements
@@ -216,9 +216,9 @@ To install Docker for Mac [click here](https://docs.docker.com/docker-for-mac/in
     celery -A ide worker --app=ide.celery_app  --loglevel=info
     ```
 
-    The celery worker needs to be run in parallel to the django server in a separate terminal.
+    The celery worker needs to be run in parallel to the Django server in a separate terminal.
 
-10. Start django application
+10. Start Django application
 
     ```
     python manage.py runserver
@@ -237,7 +237,7 @@ To install Docker for Mac [click here](https://docs.docker.com/docker-for-mac/in
 
 3. Github will provide you with a client ID and secret Key, save these.
 
-4. Create a superuser in django
+4. Create a superuser in Django
 
     ```
     python manage.py createsuperuser
@@ -253,17 +253,17 @@ To install Docker for Mac [click here](https://docs.docker.com/docker-for-mac/in
 
 7. Login with the credentials from step 4.
 
-8. Setting up Social Accounts in django admin :
+8. Setting up Social Accounts in Django admin :
 
     * Under ```Social Accounts``` open ``` Social applications ```, click on ``` Add Social Application ```.
 
-    * Choose  the ``` Provider ``` of social application as ``` Github ``` &  name it ``` Github ```.
+    * Choose the ``` Provider ``` of the social application as ``` Github ``` &  name it ``` Github ```.
 
-    * Add the sites available to the right side, so github is allowed for the current site. This should be `localhost:8000` for local deployment.
+    * Add the sites available to the right side, so GitHub is allowed for the current site. This should be `localhost:8000` for local deployment.
 
     * Copy and paste your ``` Client ID ``` and ``` Secret Key ``` into the appropriate fields and Save.
 
-9. From the django admin home page, go to `Sites` under the `Sites` category and update ``` Domain name ``` to ``` localhost:8000 ```.
+9. From the Django admin home page, go to `Sites` under the `Sites` category and update ``` Domain name ``` to ``` localhost:8000 ```.
 
 Note: For testing, you will only need one authentication backend. However, if you want to try out Google's authentication,
 then, you will need to follow the same steps as above, but switch out the Github for Google.

docs/graphvis_research/README.md

@@ -1,15 +1,15 @@
 # Research about adding support for exporting model graphs from Fabrik
 Attached code requires [common dependencies](../../requirements/common.txt), plus `networkx` and `pydot` Python packages.
 ## Problem
-Currently there's no tools for drawing Fabrik neural network diagram directly, without need to do it by hand. This research observes some ways to implement such function.
+Currently, there are no tools for drawing Fabrik neural network diagram directly, without the need to do it by hand. This research observes some ways to implement such function.
 ## Observations
 During research, I managed to found some ways. They even can be divided into two groups.
 ### Based on deep learning frameworks
-These methods share the common weakness: they cannot draw unsupported layers. For example, Keras cannot draw LRN layer. Also they could be implemented in backend only.
+These methods share the common weakness: they cannot draw unsupported layers. For example, Keras cannot draw LRN layer. Also, they could be implemented in backend only.
 
-Note that all tools can implemented with algorithms of conversion Fabrik net to framework model directly, without creating model files.
+Note that all tools can implement with algorithms of conversion Fabrik net to framework model directly, without creating model files.
 #### Keras
-Keras have its own utilities, described in its [documentation](https://keras.io/visualization/). All methods are based on [Pydot](https://github.com/pydot/pydot) library, a Python interface of [Graphviz](http://graphviz.org/). One of the utilities is used in the `print_keras_model.py`. Below there is VQI model representation drawn by Keras.
+Keras has its own utilities, described in its [documentation](https://keras.io/visualization/). All methods are based on [Pydot](https://github.com/pydot/pydot) library, a Python interface of [Graphviz](http://graphviz.org/). One of the utilities is used in the `print_keras_model.py`. Below there is VQI model representation drawn by Keras.
 
 ![](KerasVis.png)
 To get similar with this or other model type:
@@ -26,19 +26,19 @@ python ~/caffe/caffe/python/draw_net.py ../../example/caffe/<desired_prototxt_mo
 #### Tensorflow
 Tensorflow has Tensorboard for graph visualisations. Still cannot see the way how to use it for creating an image, not interactive page.
 
-Also Tensorflow method cannot be used for recurrent layers due to weird representation of them in `.pbtxt`.
+Also, the Tensorflow method cannot be used for recurrent layers due to the weird representation of them in `.pbtxt`.
 ### Based on Fabrik's frontend
-These ones mostly for frontend representation. Also they depends only on Fabrik represen
+These ones mostly for frontend representation. Also, they depend only on Fabrik represent
 #### Creating an extension
-If we decided to create an extension for Fabrik, we could obtain DOM of the graph that already represented and convert it to image. There are a [JS library](https://github.com/tsayen/dom-to-image) for doing such things. Resulted image will look like a large screenshot of Fabrik net.
+If we decided to create an extension for Fabrik, we could obtain DOM of the graph that already represented and converts it to an image. There is a [JS library](https://github.com/tsayen/dom-to-image) for doing such things. The resulted image will look like a large screenshot of Fabrik net.
 #### Implementing using JSON representation
 If we dig inside Fabrik a little deeper, we find out that Fabrik stores neural network inside state as JS object. There are obtained sample net representation in `state_net.json`. It's Lenet MNIST with some layers deleted.
 
-The only step to do is to draw graph based on this data. There are lots of ways, including [NN-SVG](https://github.com/zfrenchee/NN-SVG). Also a lot of different [JS libraries](https://stackoverflow.com/questions/7034/graph-visualization-library-in-javascript) and [other tools](https://www.quora.com/What-tools-are-good-for-drawing-neural-network-architecture-diagrams). In order to keep it simple, I created `draw_graph.py` that outputs pictured neural network with layer types and shapes. It uses [networkx](https://networkx.github.io/) for storing graph and pydot for visualisation, so it looks like Caffe's and Keras' network diagrams.
+The only step to do is to draw a graph based on this data. There are lots of ways, including [NN-SVG](https://github.com/zfrenchee/NN-SVG). Also a lot of different [JS libraries](https://stackoverflow.com/questions/7034/graph-visualization-library-in-javascript) and [other tools](https://www.quora.com/What-tools-are-good-for-drawing-neural-network-architecture-diagrams). In order to keep it simple, I created `draw_graph.py` that outputs pictured neural network with layer types and shapes. It uses [networkx](https://networkx.github.io/) for storing graph and pydot for visualization, so it looks like Caffe's and Keras' network diagrams.
 
 ![](PureVis.png)
 ## Conclusion
-Framework-based are easy to implement, but have a lot of disadvantages. Also these cannot be customized (Caffe looks prettier because of color though). DOM-based also slow, non-customizable and is workaround, not real solution. However, JSON representation-based can be fast and output any form that we want, depending on library we desire.
+Framework-based are easy to implement but have a lot of disadvantages. Also, these cannot be customized (Caffe looks prettier because of color though). DOM-based also slow, non-customizable and is a workaround, not a real solution. However, JSON representation-based can be fast and output any form that we want, depending on the library we desire.
 
 ## References
 - [Keras](https://keras.io/)

docs/source/UIDocumentation.md

@@ -3,7 +3,7 @@ Frontend Design
 ### Architecture
 ```app.js``` hosts the main app and calls ```content.js```, which loads up the main app. This file contains a few functions:
 ### ```content.js```
-(The top most bullet contains the name of the method and the inner bullets are params.)
+(The topmost bullet contains the name of the method and the inner bullets are params.)
 * ```openModal```
 * ```closeModal```
 * ```addNewLayer``` - invoked by ```handleClick``` and passed in a JS object with layer information. 
@@ -12,7 +12,7 @@ Frontend Design
   * layerId
 * ```changeHoveredLayer``` - changes which layer has the hover class on it, which outlines layer to emphasize a "hover"
   * layerId
-* ```modifyLayer``` - modifies layer, passed in layer is the new layer, and layer id is the id it needs to be replaced at. 
+* ```modifyLayer``` - modifies a layer, passed in the layer is the new layer, and layer id is the id it needs to be replaced at. 
   * layer
   * layerId
 * ```modifyLayerParams``` - modify layer params based on layer and layerId, invoked by setParams
@@ -28,7 +28,7 @@ Frontend Design
 * ```loadLayerShapes``` - AJAXs to backend to model parameters
 * ```exportNet``` - AJAXs to backend and then passes back error/success
   * framework
-* ```importNet``` - AJAXs to backend and then passes back error/success
+* ```importNet``` - AJAXs to the backend and then passes back error/success
   * framework
   * id
 * ```initialiseImportedNet``` - starts prepping layer to be displayed by Fabrik, positions layers
@@ -54,7 +54,7 @@ Frontend Design
 * ```saveDb```
 * ```loadDb```
   * id
-* ```infoModal``` - sets info into state, and then open's modal
+* ```infoModal``` - sets info into the state, and then open's modal
 * ```toggleSidebar```
 * ```zooModal```
 * ```handleClick``` - handles a click based on an event handles connections and adding layers. 
@@ -83,18 +83,18 @@ Frontend Design
 * ```drop```
   * event
 ```canvas.js``` also contains the code that decides whether a node's line needs to be rerouted if it is cutting through another node. 
-### ```canvas.js```'s placement algorithm
+### ```canvas.js``` placement algorithm
 The method it uses is the following:
 ```checkIfCuttingLine``` is passed in a positional block that includes x and y coordinates (it assumes a px is at the end of each x and y) for each endpoint of the line it is checking. 
 Specifically, it is checking if the line formed with the coordinates in the positional block will cut into any other nodes between them.
 
-```checkIfCuttingLine``` creates then creates an equation from the x and y points by calculating the slope and using point slope form. 
+```checkIfCuttingLine``` creates then creates an equation from the x and y points by calculating the slope and using point-slope form. 
 
 After this, it calls ```getBetween``` to get the nodes between the x and y coordinates of the created line. 
 
-The ```getBetween``` also serves the purpose of returning which direction in which the majority of the blocks between are. This is purely for performance, otherwise it would be seperated into a seperate function. 
+The ```getBetween``` also serves the purpose of returning which direction in which the majority of the blocks between are. This is purely for performance, otherwise, it would be separated into a separate function. 
 
-After ```getBetween``` returns with the id's of the nodes are between the x and y coordinate pair, check if cutting line loops through them to check whether or not the resultant line will cut through the in between node.
+After ```getBetween``` returns with the id's of the nodes are between the x and y coordinate pair, check if cutting line loops through them to check whether or not the resultant line will cut through the in-between node.
 
 If it does, it will return the direction the line needs to be shifted to the parent function, ```checkIfCuttingNet```, to iterate once again 80 pixels to either the left or right (depending on the return.) 
 
@@ -110,14 +110,14 @@ If it does, it will return the direction the line needs to be shifted to the par
 ```pane.js``` invokes ```paneElement.js``` to render out each element. 
 ```toggleClass``` toggles classes for the dropdown on the sidebar for layer selection. 
 ### ```paneElement.js``` 
-```paneElement.js``` renders out each element of the pane, it is invoked by ```pane.js```
+```paneElement.js``` render out each element of the pane, it is invoked by ```pane.js```
 ```pane.js``` renders out all of the layers for selection by the user.
 ### ```tabs.js```
 ```tabs.js``` contains no methods and is used to switch between Train and Test layers. 
 ### ```layer.js```
 ```layer.js``` contains no methods. It is invoked by the ```canvas.js``` and it displays the actual layering on the jsplumb container. The position of each layer is set in the state of the layer. 
 ### ```jsplumb.js```
-The ```jsplumb.js``` file contains code that handles the arrangement and the dragging/connecting of the layers. A new custom connector is created. There is an if function to check whether the node it is connecting is needing to be routed through an extension. A global variable stores this information, and the actual calculation is handled in ```checkIfCuttingNet``` and ```checkIfCuttingLine```. The global variable contains the amount of pixels it needs to move over, and it will contain direction it needs to go in (based on whether it is positive or 
+The ```jsplumb.js``` file contains code that handles the arrangement and the dragging/connecting of the layers. A new custom connector is created. There is an if function to check whether the node it is connecting is needing to be routed through an extension. A global variable stores this information, and the actual calculation is handled in ```checkIfCuttingNet``` and ```checkIfCuttingLine```. The global variable contains the number of pixels it needs to move over, and it will contain direction it needs to go in (based on whether it is positive or 
 negative.)
 
 Please refer to the jsplumb documentation here to learn more about this API set. https://jsplumbtoolkit.com/docs.html
@@ -136,9 +136,9 @@ The method change is used to change the state of checkboxes, and it is passed in
 ### ```modelElement.js``` 
 ```modelElement.js``` contains the component that renders out each model in the model zoo. It includes logic that onClick will trigger an importNet, as defined in ```content.js```.
 ### ```modelZoo.js```
-```modelZoo.js``` contains the rendering of the modelZoo, it invokes modelElement to render the actual listing of the model.
+```modelZoo.js``` contains the rendering of the model zoo, it invokes modelElement to render the actual listing of the model.
 ### ```netLayout_vertical.js``` and ```netLayout.js```
-Both of these files contain code that determines positioning and layout of net. It is invoked by ```content.js```
+Both of these files contain code that determines the positioning and layout of the net. It is invoked by ```content.js```
 ### ```setParams.js```
 Contains the following methods:
 * ```changeProps```
@@ -152,9 +152,9 @@ Contains the following methods:
     * e
 
 ### ```setParams.js``` 
-allows users to change layer parameters and reads paramters through ```data.js```
+allows users to change layer parameters and reads parameters through ```data.js```
 ### ```tooltip.js``` and ```tooltipData.js```
-Both of these files contains code for tooltips and the ```tooltipData.js``` contains the actual tooltips that are rendered.
+Both of these files contain code for tooltips and the ```tooltipData.js``` contains the actual tooltips that are rendered.
 
 note: tooltips are "hover" messages, they tell more information about something when a user hovers over an object.