[mirotalk] - add docs

.gitignore

@@ -16,6 +16,3 @@ package-lock.json
 
 # personal env
 .env
-
-# personal doc
-doc

README.md

@@ -158,11 +158,11 @@ $ docker-compose down
 </details>
 
 <details>
-<summary>Https</summary>
+<summary>Ngrok - Https</summary>
 
 <br/>
 
-You can start videoconferencing directly from your Local PC, and be reachable from any device outside your network, simply using a service like [ngrok](https://ngrok.com/) by editing the [Ngrok part](https://github.com/miroslavpejic85/mirotalk/blob/master/.env.template#L1) on `.env` file, or expose it directly on [HTTPS](app/ssl/README.md)
+You can start videoconferencing directly from your Local PC, and be reachable from any device outside your network, simply by following [these documentation](docs/ngrok.md), or expose it directly on [HTTPS](app/ssl/README.md)
 
 </details>
 
@@ -238,6 +238,15 @@ If you want to deploy a MiroTalk P2P instance on your dedicated server, or for o
 
 </details>
 
+<details>
+<summary>Self Hosting</summary>
+
+<br/>
+
+Follow [this documentation](docs/self-hosting.md).
+
+</details>
+
 <details>
 <summary>Credits</summary>
 
@@ -282,11 +291,13 @@ For a MiroTalk license under conditions other than AGPLv3, please contact us at
 </details>
 
 <details open>
-<summary>Sponsors</summary>
+<summary>Support the project</summary>
 
 <br/>
 
-Support this project by [becoming a sponsor](https://github.com/sponsors/miroslavpejic85). Your logo will show up here with a link to your website.
+Do you find MiroTalk useful?
+
+Support the project by [becoming a backer or sponsor](https://github.com/sponsors/miroslavpejic85). Your logo will show up here with a link to your website.
 
 [![BroadcastX](public/sponsors/BroadcastX.png)](https://broadcastx.de/)
 

docs/ngrok.md

@@ -0,0 +1,32 @@
+## MiroTalk P2P - Ngrok
+
+If you want to expose MiroTalk P2P from your `Local PC` to outside in `HTTPS`, you need to do 1 thing
+
+Edit the Ngrok part on `.env` file
+
+```bash
+# 1. Goto https://ngrok.com
+# 2. Get started for free
+# 3. Copy YourNgrokAuthToken: https://dashboard.ngrok.com/get-started/your-authtoken
+
+NGROK_ENABLED=true
+NGROK_AUTH_TOKEN=YourNgrokAuthToken
+```
+
+Then, when you run it with `npm start`, you should see in the console log this line:
+
+```bash
+server_tunnel: 'https://xxxxxxxxxxxxxxxxxx.ngrok.io'
+```
+
+So open it in your browser, join in the room, share it to whom you want and wait participants to join.
+
+<br/>
+
+## Do you find MiroTalk useful?
+
+Show your appreciation by becoming a [backer or sponsor](https://github.com/sponsors/miroslavpejic85)
+
+Thank you for your support! ❤️
+
+---

docs/self-hosting.md

@@ -0,0 +1,197 @@
+## MiroTalk P2P - Self Hosting
+
+Requirments:
+
+-   Recommended: [Hetzner](https://www.hetzner.com/cloud) (`CPX11` it's enough, OS: `Ubuntu 20.04`)
+-   [Node.js](https://nodejs.org/en/) at least 12x, better `16.15.1 LTS`
+-   Set own TURN server (recommended) or use third party STUN/TURN servers (configurable on `.env` file)
+-   Your domain example: `your.domain.name` (Set a DNS A record for that domain that point to Your Server public IPv4)
+
+Install the requirements (Note: Many of the installation steps require `root` or `sudo` access)
+
+```bash
+# Install NodeJS 16.X and npm
+$ sudo apt update
+$ sudo apt -y install curl dirmngr apt-transport-https lsb-release ca-certificates
+$ curl -sL https://deb.nodesource.com/setup_16.x | sudo -E bash -
+$ sudo apt-get install -y nodejs
+$ npm install -g npm@latest
+```
+
+Quick start
+
+```bash
+# Clone MiroTalk P2P repo
+$ git clone https://github.com/miroslavpejic85/mirotalk.git
+# Go to mirotalk dir
+$ cd mirotalk
+# Copy .env.template to .env and edit it if needed
+$ cp .env.template .env
+# Install dependencies
+$ npm install
+# Start the server
+$ npm start
+```
+
+Check if is correctly installed: https://your.domain.name:3000
+
+Using [PM2](https://pm2.keymetrics.io) to run it as deamon
+
+```bash
+$ npm install -g pm2
+$ pm2 start app/src/server.js
+```
+
+If you want to use Docker
+
+```bash
+# Install docker and docker-compose
+$ sudo apt install docker.io
+$ sudo apt install docker-compose
+
+# Copy .env.template to .env and edit it if needed
+$ cp .env.template .env
+# Build or rebuild services
+$ docker-compose build
+# Create and start containers
+$ docker-compose up -d
+```
+
+Check if is correctly installed: https://your.domain.name:3000
+
+In order to use it without the port number at the end, and to have encrypted communications, we going to install [nginx](https://www.nginx.com) and [certbot](https://certbot.eff.org)
+
+```bash
+# Install Nginx
+$ sudo apt-get install nginx
+
+# Install Certbot (SSL certificates) : https://certbot.eff.org
+$ sudo snap install core; sudo snap refresh core
+$ sudo snap install --classic certbot
+$ sudo ln -s /snap/bin/certbot /usr/bin/certbot
+
+# Setup Nginx sites
+$ sudo vim /etc/nginx/sites-enabled/default
+
+#---
+
+# HTTP — redirect all traffic to HTTPS
+server {
+    if ($host = your.domain.name) {
+        return 301 https://$host$request_uri;
+    }
+        listen 80;
+        listen [::]:80  ;
+    server_name your.domain.name;
+    return 404;
+}
+
+#---
+
+# Check if all configured correctly
+$ sudo nginx -t
+
+# Active https for your domain name (follow the instruction)
+$ sudo certbot certonly --nginx
+
+# Add let's encrypt part on nginx config
+$ sudo vim /etc/nginx/sites-enabled/default
+
+#---
+
+# MiroTalk P2P - HTTPS — proxy all requests to the Node app
+server {
+	# Enable HTTP/2
+	listen 443 ssl http2;
+	listen [::]:443 ssl http2;
+	server_name your.domain.name;
+
+	# Use the Let’s Encrypt certificates
+	ssl_certificate /etc/letsencrypt/live/your.domain.name/fullchain.pem;
+	ssl_certificate_key /etc/letsencrypt/live/your.domain.name/privkey.pem;
+
+	location / {
+		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+		proxy_set_header Host $host;
+		proxy_pass http://localhost:3000/;
+		proxy_http_version 1.1;
+		proxy_set_header Upgrade $http_upgrade;
+		proxy_set_header Connection "upgrade";
+	}
+}
+
+#---
+
+# Check if all configured correctly
+$ sudo nginx -t
+
+# Restart nginx
+$ service nginx restart
+$ service nginx status
+
+# Auto renew SSL certificate
+$ sudo certbot renew --dry-run
+
+# Show certificates
+$ sudo certbot certificates
+```
+
+Check Your MiroTalk P2P instance: https://your.domain.name
+
+## Update script
+
+In order to have always Your MiroTalk P2P updated to latest, we going to create a script
+
+```bash
+# Create a file p2pUpdate.sh
+$ vim p2pUpdate.sh
+```
+
+If you use `PM2`, paste this:
+
+```bash
+#!/bin/bash
+
+cd mirotalk
+git pull
+pm2 stop app/src/server.js
+sudo npm install
+pm2 start app/src/server.js
+```
+
+If you use `Docker`, paste this:
+
+```bash
+#!/bin/bash
+
+cd mirotalk
+git pull
+docker-compose down
+docker-compose build
+docker images |grep '<none>' |awk '{print $3}' |xargs docker rmi
+docker-compose up -d
+```
+
+Make the script executable
+
+```bash
+$ chmod +x ./p2pUpdate.sh
+```
+
+Follow the commits of the MiroTalk P2P project [here](https://github.com/miroslavpejic85/mirotalk/commits/master)
+
+To update Your MiroTalk P2P instance at latest commit, execute:
+
+```bash
+./p2pUpdate.sh
+```
+
+<br />
+
+## Do you find MiroTalk useful?
+
+Show your appreciation by becoming a [backer or sponsor](https://github.com/sponsors/miroslavpejic85)
+
+Thank you for your support! ❤️
+
+---

public/js/client.js

@@ -482,7 +482,7 @@ function setButtonsToolTip() {
     setTippy(receiveHideBtn, 'Hide file transfer', 'right-start');
     // video URL player
     setTippy(videoUrlCloseBtn, 'Close the video player', 'right-start');
-    setTippy(msgerVideoUrlBtn, 'Share YouTube video to all participants', 'right-start');
+    setTippy(msgerVideoUrlBtn, 'Share YouTube video to all participants', 'top');
 }
 
 /**