step 1 for update for .08 milestone

docs/file_explorer.md

@@ -1,18 +1,20 @@
 File Explorer
 =============
 
+To get to the file explorers - click the file explorers icon.
+
+![](images/a-file-explorer1.png)
+
 The file explorer lists by default all the files stored in your browser.
 You can see them in the browser folder. You can always rename, remove or
 add new files to the file explorer.
 
-![image](images/remix_file_explorer_browser.png)
-
 Note that clearing the browser storage will permanently delete all the
 solidity files you wrote. To avoid this, you can use Remixd, which
 enables you to store and sync files in the browser with your local
 computer (for more information see ../tutorial\_remixd\_filesystem)
 
-![image](images/remix_file_explorer_menu.png)
+![](images/a-file-explorer-buttons.png)
 
 We will start by reviewing at the icons at the top left - from left to
 the right:

docs/index.rst

@@ -30,30 +30,43 @@ Useful links:
    :maxdepth: 2
    :caption: Quick start
 
+   layout
+   file_explorer
+   plugin_manager
+   settings_tab
+   terminal
+   run_tab
+   javascript_vm
+   udapp
+
+.. toctree::
+   :maxdepth: 2
+   :caption: Running remix locally
+
    packages
+
+.. toctree::
+   :maxdepth: 2
+   :caption: Tour of typical modules
+
    solidity_editor
    compile_tab
-   quickstart_javascript_vm
+   contract_metadata
-   settings_tab
+   debugger_tab
+   analysis_tab
    
 
 .. toctree::
    :maxdepth: 2
-   :caption: Deploy and test
+   :caption: Testing
 
-   run_tab
-   udapp
-   contract_metadata
    unittesting_tab
 
 .. toctree::
    :maxdepth: 2
    :caption: Other Remix features
 
-   file_explorer
+   tutorial_remixd_filesystem
-   debugger_tab
-   analysis_tab
-   terminal
 
 .. toctree::
    :maxdepth: 2
@@ -61,7 +74,6 @@ Useful links:
 
    workshop_Building_smart_contracts_with_Remix
    tutorial_eattheblock
-   tutorial_remixd_filesystem
    tutorial_debug
    tutorial_import
    tutorial_mist

docs/javascript_vm.md

@@ -0,0 +1,104 @@
+Using the JavaScript VM
+========================
+
+There are 3 type of environments Remix can be plugged to:
+`Javascript VM`, `Injected provider`, or `Web3 provider`. (for details see [Running transactions](http://remix.readthedocs.io/en/latest/run_tab.html))
+
+Both `Web3 provider` and `Injected provider` require the use of an
+external tool.
+
+The external tool for `Web3 provider` is an Ethereum node the tools for
+`Injected provider` are Mist or Metamask.
+
+The `JavaScript VM` mode is convenient because each execution runs in
+your browser. Thus reloading the page will restart Remix with an empty
+state.
+
+So for performance purposes, it might also be better to use an external
+node.
+
+Selecting the VM mode
+---------------------
+
+Make sure the VM mode is selected. All accounts displayed in `Accounts`
+should have 100 ether.
+
+Sample contract
+---------------
+
+``` {.sourceCode .none}
+pragma solidity ^0.4.16;
+
+contract testContract {
+
+    uint value;
+    function testContract(uint _p) {
+        value = _p;
+    }
+
+    function setP(uint _n) payable {
+        value = _n;
+    }
+
+    function setNP(uint _n) {
+        value = _n;
+    }
+
+    function get () constant returns (uint) {
+        return value;
+    }
+}
+```
+
+This contract is very basic. The goal is to quickly start to create and
+to interact with a sample contract.
+
+Deploying an instance
+---------------------
+
+The `Compile tab` displays information related to the current contract
+(note that there can be more than one) (see ../compile\_tab).
+
+Moving on, in the `Run tab` select, `JavaScript VM` to specify that you
+are going to deploy an instance of the contract in the `JavaScript VM`
+state.
+
+![image](images/remix_quickstart_javascriptvm_creation.png)
+
+The constructor of `testContract` needs a parameter (of type `uint`).
+Give any value and click on `Create`.
+
+The transaction which deploys the instance of `testContract` is created.
+
+In a "normal" blockchain, it can take several seconds to execute. This
+is the time for the transaction to be mined. However, because we are
+using the `JavaScript VM`, our execution is immediate.
+
+The terminal will inform you about the transaction. You can see details
+there and start debugging.
+
+The newly created instance is displayed in the `run tab`.
+
+![image](images/remix_quickstart_javascriptvm_creationTransaction.png)
+
+Interacting with an instance
+----------------------------
+
+This new instance contains 3 actions which corresponds to the 3
+functions (`setP`, `setPN`, `get`). Clicking on `SetP` or `SetPN` will
+create a new transaction.
+
+Note that `SetP` is `payable` (red action) : it is possible to send
+value (Ether) to the contract.
+
+`SetPN` is not payable (light red action) : it is not possible to send
+value (Ether) to the contract.
+
+Clicking on `get` will not execute a transaction (blue action). It is
+not necessary to do so because `get` does not modify the state (variable
+`value`) of this instance.
+
+As `get` is `constant` you can see the return value just below the
+action.
+
+![image](images/remix_quickstart_javascriptvm_callinginstance.png)

docs/layout.md

@@ -0,0 +1,41 @@
+Remix-IDE Layout
+==============
+
+The new structure
+--------------------
+![](images/a-layout1a.png)
+
+1. Icon Panel - click to change which plugin appears in the Swap Panel
+2. Swap Panel - Most but not all plugins will have their GUI here.
+3. Main Panel - In the old layout this was just for editing files.  In the tabs can be plugins or files for the IDE to compile.
+4. Terminal - where you will see the results of your interactions with the GUI's.  Also you can run scripts here.
+
+Icon Panel at Page Load
+-----------------------
+When you load remix - the icon panel show these icons by default.
+
+![](images/a-icons-at-load.png)
+
+Everything in remix is now a plugin...  so the **Plugin Manager** is very important.
+In the old layout, each basic task in remix was separated into the tabs.  Now these tabs are plugins.  
+
+But to load up 5 or 6 of plugins each time the page load can be **tedious**.  So learn about the **Environmentse**.
+
+Homepage
+--------
+![](images/a-home-page.png)
+The homepage is located on a tab in the Main Panel.  You can also get there from the top of the settings screen in the swap panel.
+
+### Environments
+Clicking on one of the environment buttons loads up a collection of plugins.  We currently have a **Solidity** Button and a **Vyper** button.  In the future you will be able to save your own environment.
+
+To see all the plugins go to the **plugin manager** - by selecting the plug in the icon panel. 
+![](images/a-plug.png) 
+
+The environment buttons are time & sanity savers - so you don't need to go to the plugin manager to get started everytime you load the page.   
+
+
+Plugin Manager
+---------------
+
+In order to make remix flexible for integrating changes into its functionality, we've now made everything a plugin.  This means that you need to go turn off and turn on all the plugins.

docs/quickstart_javascript_vm.md

@@ -1,5 +1,5 @@
-Quick Start using the JavaScript VM
+Using the JavaScript VM
-===================================
+========================
 
 There are 3 type of environments Remix can be plugged to:
 `Javascript VM`, `Injected provider`, or `Web3 provider`. (for details see [Running transactions](http://remix.readthedocs.io/en/latest/run_tab.html))

docs/run_tab.md

@@ -1,5 +1,5 @@
-Running transactions
+Running & Depolying transactions
-====================
+================================
 
 The Run tab is an important section of Remix. It allows you to send
 transactions to the current environment.

docs/settings_tab.md

@@ -1,9 +1,11 @@
 Settings
 ========
 
-This section displays the current compiler version and allows one to change to another version.
+To get to **Settings** click the gear a the very bottom of the icon panel. 
 
-![image](images/remix_settingstab.png)
+You can find a link to the homepage (if you closed it) as well as a link to our Gitter Channel and for you aesthetes out there, we now have a rather large list of themes.  
+
+![](images/a-settings.png)
 
 Another important settings: