A web-based frontend for Retroshare which communicates with the client through the JSON API.
qmake
(optional)Note: The Web Interface is shipped by default in the latest release of Retroshare. If you want to customise it or contribute to it then proceed with the following steps.
First, you need to download and install the web interface javascript code itself:
Clone the repo: You can clone using git, or download the zip file and extract it
git clone https://github.com/Retroshare/RSNewWebUI
cd RSNewWebUI
Build the files:
If you have qmake
installed, you just need to run it in the base directory:
qmake .
If you do not have qmake
, go to webui-src/make-src/
and run the build
script. Note that qmake is enough to do the build.
cd webui-src/make-src
sh build.sh
cd webui-src\make-src\
./build.bat
If you are on older versions of Retroshare then it needs to be compiled with non-default options as follows:
qmake CONFIG+="debug rs_jsonapi rs_webui"
make
See the RetroShare repo for more detailed instructions on compiling RetroShare. You should afterwards see a tab 'JSON API' and a tab 'Web Interface' in the Preferences.
You need to enable the JSON API, through which the web interface communicates with the client:
Preferences > JSON API
.Preferences > Webinterface
.If necessary, point the Web interface directory to the place where the webui
files are compiled. This is usually RSNewWebUI/webui/
.
In any case, click on "Apply settings" after making the changes. If everything
goes ok, you should see a new token webui:[your password]
under the
Authenticated Tokens section in the JSON API preferences page.
This is the default link to access the WebInterface.
Open this link your browser ->
https://localhost:9092/index.html.
Note: If you changed the port in the JSON API preferences pages, the port in the above line needs to be changed accordingly.
The Web interface is only accessible from localhost (127.0.0.1). If you want to access the web interface of a headless retroshare server, then you need to create a SSH tunnel as follows:
ssh login@server -L 9092:localhost:9092 -N
After that, the Web interface of the Retroshare running on 'server' is tunneled to your local machine and accessible through localhost:9092.
Running a headless retroshare server is one possibility. The Webinterface however does not allow you to create new nodes. Therefore the steps are:
./retroshare-service/src/retroshare-service -U list -W
After that follow instructions to launch your profile (you need to choose a webui password and enter the ID and login password of your node).
For contributing, It is recommended that you read this entire section to have a better idea.
Follow these steps to setup the project and make it ready for contribution/customisation :
cd
into the cloned repo:
cd RSNewWebUI
pnpm install
Run this command to watch for any changes in the scss
files and compile them
to css.
pnpm watch
You can now start to edit the source code. But you must run the below command
to see the changes reflected in the browser everytime you edit the code for
webui which is in the webui-src/app/
directory.
qmake .
Linting and formatting can be done with editor/IDE plugins.
Or to do it manually,
Install prettier
and eslint
(required for linting & formatting code):
npm install -g prettier eslint
Next, run the following in the webui-src
directory:
To run the linter: eslint app
To run the formatter: prettier -c app
Now, While contributing you can checkout these resources as you might need to look up for these often.
You can list files with @jsonapi in libretroshare/src/retroshare of retroshare:
grep -c "@jsonapi" *.h|grep -v ":0"
And, that's it. You are more than welcome to contribute to this project. If you have any questions/difficulties in setting up or running the project, you can raise an issue and we will be more than willing to help you out.
Please create an issue concisely describing the bug you faced, or the feature you would like to see implemented.
Whether you are a JavaScript developer or a Web designer, you can help make the web interface better. Get in touch with us on the Developer forums in Retroshare.