Skip to content

Commit

Permalink
updates to file explorer
Browse files Browse the repository at this point in the history
  • Loading branch information
ryestew authored and LianaHus committed Mar 2, 2021
1 parent cc9ef77 commit 139db22
Show file tree
Hide file tree
Showing 7 changed files with 40 additions and 15 deletions.
46 changes: 34 additions & 12 deletions docs/file_explorer.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,14 @@ To get to the File Explorers module - click the file explorers icon.

![](images/a-file-explorer1.png)

The basic files explorer lists all the files stored in your browser's **browser storage**.
You can see them in the **browser** folder.
By default Remix IDE **ONLY** stores files in your browser's local storage. It is possible to go beyond this default behavior - see the **Important Note** below.

The files explorer's **browser folder** has a sample project in it. The files stored in your browser's **browser storage**.

If, when you open Remix IDE, you do not see the sample project (like in the image above), they will appear when all the files in the File Explorer are erased or when the cache is cleared.

**Important Note:** Clearing the browser storage will **permanently delete** all the
solidity files stored there. This is an inherent limitation of a browser-based IDE. However, if you want to store files outside of the browser and on your computer's filesystem, use [Remixd](remixd.html) or use the [desktop version of Remix-IDE](https://github.com/ethereum/remix-desktop/releases/). RemixD enables you to have access to a selected folder on your hard drive. Remix Desktop is a version of Remix-IDE in an Electron app.
solidity files stored there. This is an inherent limitation of a browser-based IDE. However, if you want to store files outside of the browser and on your computer's filesystem, use [RemixD](remixd.html) or use the [desktop version of Remix-IDE](https://github.com/ethereum/remix-desktop/releases/). RemixD enables you to have access to a selected folder on your hard drive. Remix Desktop is a version of Remix-IDE in an Electron app. Furthermore you can use the DGIT plugin to save a git repo of your files in IPFS.

You can rename, remove or
add new files to the file explorer.
Expand All @@ -25,35 +28,54 @@ The icons to the right of the **browser** file explorer in the image above only
Create new File
---------------

The icon marked **B.** above. Creates a new file.
Click on the new file icon, an input for a new the file’s name will appear in the **Explorer**. Once a name is entered, the new empty file will open in the Editor.

![](images/a-file-explorer-new-file2.png)

When you click on the new file icon, the new file will be placed in the currently selected folder. If a file and not a folder is selected then the new file will be placed in that file’s folder. And if nothing is selected, then the file will be placed in the root of the browser folder. Or to be brief — just be mindful of what folder it lands in.

Create a folder
---------------

The icon marked **C.** above. Creates a new folder in **browser** file explorer.

Publish to Gist
---------------

The icon marked **C.** above. Publishes all files from the browser folder to a gist. Only file in the root of **browser** will be published. Files in subfolders will not be publish to the Gist.
Gist API has changed in 2018 and **requires** users to be authenticated to be able to publish a gist.
The icon marked **D.** above. Publishes all files from the browser folder to a gist. Only file in the root of **browser** will be published. Files in subfolders will not be publish to the Gist.
Gist API **requires** users to be authenticated to be able to publish a gist.

Click [this link](https://github.com/settings/tokens) to Github tokens setup and select Generate new token. Then check the **Create gists** checkbox and generate a new token.

Take the token and paste it in Remix's **Settings** module in the **Github Access Token** section. And then click Save. Now you should be able to use the feature.
Take the token and paste it in Remix's **Settings** module in the **Github Access Token** section. And then click Save. For the moment, after saving, in order for the token to be registered, you will need to refresh Remix. In an upcoming release, it will not be necessary to do the refresh.

Create a folder
Upload to Browser Storage
---------------

The icon marked **D.** above. Creates a new folder in **browser** file explorer.
Click the icon marked **E.** to upload a file from your computer's file system to your browser's local storage.

Context Menu (Right Click)
-----------------------------
Right click on a file or a folder and the **context menu** will appear.
Right Click on a File
----------------------

![](images/a-file-ex-rt-click.png)

Right clicking on a file will give you a context menu — offering you the possibility to delete or rename the file.

You can rename or delete a selected file or a folder. You can also create a folder.

Right Click on a Folder
------------------------
To create a file with the context menu, right click on a folder to get the **Create File** option. A file will be created inside that folder.

![](images/a-file-ex-rt-click-folder.png)

The functionality of the context menu also works with RemixD (which gives you have access to a folder on your hard drive).

**Note:** When working with RemixD, you need to open and close the **localhost** folder to refresh the view.

Right Click on a Script
------------------------

![](images/a-file-ex-rt-click-script.png)

Right click on any file with a .js extension will gives the **run** option in the context menu. The **run** shortcut is equivalent to getting the script file to be the active tab in the editor and then running the command `remix.exeCurrent()` in the console.
Binary file added docs/images/a-file-ex-rt-click-script.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified docs/images/a-file-ex-rt-click.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified docs/images/a-file-explorer-buttons.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/a-file-explorer-new-file2.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified docs/images/a-file-explorer1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 6 additions & 3 deletions docs/remixd.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,15 +10,18 @@ To give the Remix-ide (the web app) access to a folder on your local computer, y
The code of `remixd` is
[here](https://github.com/ethereum/remix-project/tree/master/libs/remixd) .

### remixd Installation
### Remixd Installation
`remixd` can be globally installed using the following command:
`npm install -g @remix-project/remixd`

Or just install it in the directory of your choice by removing the -g flag:
`npm install @remix-project/remixd`

**NOTE: The npm address of remixd has moved - it had been in its own repo but now it is under remix-project.**
Please update to the latest remixd by:
**NOTE: The npm address as well as the github repo of remixd have changed - in both cases moving under **remix-project**.
- In github remixd moved to https://github.com/ethereum/remix-project/tree/master/libs/remixd.
- In NPM the new address is remix-project/remixd.

### Update to the latest Remixd
1. uninstall the old one: npm uninstall -g remixd
2. install the new: npm install -g @remix-project/remixd
### remixd Command
Expand Down

0 comments on commit 139db22

Please sign in to comment.