Version 2.1.0

.gitattributes

@@ -0,0 +1 @@
+*.htm linguist-detectable=false

README.md

@@ -4,6 +4,8 @@
 
 ![codeWe](https://github.com/allEyezOnCode/CodeWe/blob/master/imgs/ex.gif?raw=True "codeWe - exemple")
 
+---
+
 ## Installation
 
 ### Classic installation
@@ -19,7 +21,7 @@ The first step is to clone this repository.
 Open a terminal and run:
 
 ```bash
-git clone https://github.com/allEyezOnCode/CodeWe.git
+git clone https://github.com/CodeWe-projet/CodeWe.git
 ```
 
 Next step is to install depedencies
@@ -47,17 +49,54 @@ To run the server, run a shell in the `CodeWe/src` folder and run:
 node ./src/server.js
 ```
 
-## Next features
-
-* Document with privileges (anon auth, and jwt usage)
-* New programming langages
-* More options
-* Server montioring with prometheus and grafana
+---
 
 ## Contribution
 
 Feel free to contribute, open an issue, then fork the repo and submit a PR.
 
+
 ## Licence
 
-This project is under MIT licence. The full licence can be read [here](https://github.com/allEyezOnCode/CodeWe).
+This project is under MIT licence. The full licence can be read [here](https://github.com/CodeWe-projet/CodeWe/blob/master/LICENCE.md).
+
+---
+
+## Next features
+
+* Document with privileges (anon auth, and jwt usage)
+
+
+## Changelog
+
+### Version [2.1.0](https://github.com/CodeWe-projet/CodeWe/pull/40)
+#### Back-end
+* Preparing the back-end for authentication.
+* New prometheus gauges and counter.
+
+#### Front-end
+* Adding support of 20+ languages.
+* Allow sharing URL by QR Code.
+* Customize tabulation size.
+* Remove line and others major bugfixes.
+
+### Version [2.0.1](https://github.com/CodeWe-projet/CodeWe/pull/26)
+#### Back-end
+* Ability to redirect an http port to the main https port.
+* Update configuration.
+* Minor bug fixes.
+
+#### Front-end
+* Update legal content.
+* Major bug fixes.
+
+### Version [2.0.0](https://github.com/CodeWe-projet/CodeWe/tree/ad25d132ab92c0b9de227c9aedf04bda3f19681b)
+#### Back-end
+* Rewriting of the back end in nodejs.
+
+#### Front-end
+* Report issue button.
+* Minor bug fixes.
+
+### 1.0.0
+* Initialisation of project using python and Flask for backend.

src/config/langages.js

@@ -0,0 +1,25 @@
+module.exports = [
+    "python",
+    "c",
+    "c++",
+    "c#",
+    "javascript",
+    "java",
+    "haskell",
+    "smalltalk",
+    "coffescript",
+    "css",
+    "d",
+    "go",
+    "haskell",
+    "html",
+    "json",
+    "lua",
+    "php",
+    "r",
+    "ruby",
+    "scheme",
+    "shell",
+    "sql",
+    'oz',
+];

src/db/MongoDB.js

@@ -1,8 +1,10 @@
 const { MongoClient, ObjectID } = require("mongodb");
 var crypto = require('crypto');
 const { nanoid } = require('nanoid');
+const languages = require('../config/langages');
 const configs = require('../config/config');
 const utils = require('../utils');
+const prom = require('../socket/prom')
 
 const baseCode = [
     {uuid: utils.uuid(Math.random().toString(), 10), content: 'def main(text: str) -> None:'},
@@ -12,7 +14,6 @@ const baseCode = [
     {uuid: utils.uuid(Math.random().toString(), 10), content: '    main(\'Hello World !\')'}
 ];
 
-
 class MongoDB {
     constructor (url) {
         this.client = new MongoClient(url, {
@@ -35,7 +36,7 @@ class MongoDB {
         }
     }
 
-    async createDocument (language) {
+    async createDocument (documentLanguage) {
         let doc = {
             content: baseCode,
             creationDate: Date.now(),
@@ -45,7 +46,7 @@ class MongoDB {
             editors: [],
             documentLink: '',
             linkView: '',
-            language: language,
+            language: documentLanguage,
             tab: 4
         };
         try {
@@ -173,7 +174,7 @@ class MongoDB {
     }
 
     async changeLanguage(documentLink, newLanguage) {
-        if (["python"].includes(newLanguage)) {
+        if (languages.includes(newLanguage)) {
             return this.changeParam(documentLink, 'language', newLanguage);
         }
     }
@@ -216,6 +217,7 @@ class MongoDB {
                     case 'new-line':
                         results = await this.newLine(documentLink, data.previous, data.id, data.content);
                         if (!results) success = false;
+                        prom.total_new_lines.inc();
                         break;
                     case 'delete-line':
                         results = await this.deleteLine(documentLink, data.id);

src/publics/css/base.less

@@ -2,7 +2,7 @@
 |      Generic      |
 \*******************/
 
-@background-color: #222;
+@background-color: #222222;
 @color: #fff;
 @font: sans-serif;
 @absolute-color: #d5e6ed;

src/publics/css/editor.less

@@ -1,3 +1,7 @@
+@background-color: #222222;
+@color: #fff;
+@header-height: 60px;
+
 /******************\
 |      Header      |
 \******************/
@@ -57,3 +61,70 @@ section#editor{
     background-color: red;
     border-radius: 10px;
 }
+
+/*******************\
+|  Navigation Bar   |
+\*******************/
+
+#customise{
+    position: fixed;
+    top: 1.1 * @header-height;
+    right: 0;
+    width: 20%;
+    height: 100%;
+    max-width: 300px;
+    min-width: 200px;
+    padding: 20px;
+    background-color: darken(@background-color, 2%);
+    border-left: 1px solid #111111;
+    z-index: 5;
+
+    ul{
+        list-style: none;
+
+        li{
+            padding-bottom: 20px;
+
+            h3{
+                padding: 5px 0;
+                color: darken(@color, 50%);
+                letter-spacing: 3px;
+                border-bottom: 1px solid lighten(@background-color, 10%);
+                display: inline;
+            }
+
+            > :not(h3){
+                padding: 7px;
+                margin-top: 20px;
+                border-radius: 10px;
+            }
+
+            select,
+            input{
+                color: @color;
+                background-color: lighten(@background-color, 5%);
+                border-color: @background-color;
+                width: 90%;
+            }
+
+            #qrcode{
+                background-color: white;
+                display: inline-block;
+
+                canvas{
+                    width: 128px;
+                    height: 128px;
+                    margin: 10px;
+                    background-color: white;
+                    image-rendering: optimizeSpeed;             /*                     */
+                    image-rendering: -moz-crisp-edges;          /* Firefox             */
+                    image-rendering: -o-crisp-edges;            /* Opera               */
+                    image-rendering: -webkit-optimize-contrast; /* Chrome (and Safari) */
+                    image-rendering: pixelated;                 /* Chrome as of 2019   */
+                    image-rendering: optimize-contrast;         /* CSS3 Proposed       */
+                    -ms-interpolation-mode: nearest-neighbor;   /* IE8+                */
+                }
+            }
+        }
+    }
+}

src/publics/js/dev/component/custom.js

@@ -1,3 +1,62 @@
 /**
- * Tab customization (allow convert current file)
+ * Tab customization
  */
+
+import {editor, socket} from "/js/dev/page/editor.js";
+import {patterns} from "/js/dev/page/editor/prism/patterns.js";
+import PrismCustom from "/js/dev/page/editor/prism/prismCustom.js";
+
+export default class Customize{
+    /** Init the customize object
+     * @param {Editable} editable
+     */
+    constructor(editable) {
+        this.editable = editable;
+
+        document.getElementById('option-language').addEventListener('change', e => {
+            language = e.target.value.toLowerCase();
+            this.editable.updateAllHighlighting();
+            socket.send('language', {language});
+        });
+
+        document.addEventListener('socket.receive.language', e => {
+            if(Object.keys(patterns).includes(e.detail.language.toLowerCase())){
+                language = e.detail.language.toLowerCase();
+                document.getElementById('option-language').value = language;
+                this.editable.updateAllHighlighting();
+            }
+        });
+
+        for(const lang of Object.keys(patterns)){
+            const option = document.createElement('option');
+            option.innerText = lang;
+            if(lang === language) option.selected = true;
+            document.getElementById('option-language').appendChild(option);
+        }
+
+        document.getElementById('option-space-size').addEventListener('change', e => {
+            editor.tab.setSize(e.target.value);
+
+            for(const child of this.editable.editable.children){
+                child.innerText = editor.tab.updateText(child.innerText);
+                new PrismCustom(child, language).apply();
+            }
+
+            socket.send('changeTabSize', {size: e.target.value});
+        });
+
+        document.getElementById('option-space-size').value = this.editable.tab.size;
+
+        document.addEventListener('socket.receive.changeTabSize', e => {
+            if(e.detail.size && Number.isInteger(parseInt(e.detail.size))){
+                editor.tab.setSize(e.detail.size);
+                document.getElementById('option-space-size').value = e.detail.size;
+
+                for(const child of this.editable.editable.children){
+                    child.innerText = editor.tab.updateText(child.innerText);
+                    new PrismCustom(child, language).apply();
+                }
+            }
+        });
+    }
+}

src/publics/js/dev/page/editor.js

@@ -5,19 +5,28 @@
  * @date Last modification on 16/11/2020
  * @version 1.0.1
  */
+import Customize from "/js/dev/component/custom.js";
 import Cursor from "/js/dev/page/editor/cursor.js";
 import download from "/js/dev/page/editor/download.js";
 import Editable from "/js/dev/page/editor/editable.js";
+import {patterns} from "/js/dev/page/editor/prism/patterns.js";
 import PrismCustom from "/js/dev/page/editor/prism/prismCustom.js";
 import EditorSocket from "/js/dev/page/editor/socket.js";
 import _ from "/js/dev/utils/element.js";
+import qrCode from "/js/dev/utils/qrcode/qrcode-m-2.js";
 
 export const socket = new EditorSocket(doc_id);
 export const editor = new Editable(_.id('editor'));
 export const cursor = new Cursor(_.id('editor'));
 
+download(_.id('download'), _.id('editor'));
+
+if(!Object.keys(patterns).includes(language)) language = 'generic';
+
 for(const child of _.id('editor').children){
-    new PrismCustom(child, 'python').ApplyWithCaret();
+    new PrismCustom(child, language).apply();
 }
 
-download(_.id('download'), _.id('editor'));
+export const customize = new Customize(editor);
+
+qrCode('qrcode', document.documentURI.replace('/editor/', '/e/'));