From 694b58ead1c89d5ac48e5d19b92dffcf62913c35 Mon Sep 17 00:00:00 2001
From: TimRudy <3942818+TimRudy@users.noreply.github.com>
Date: Fri, 31 Jan 2025 14:20:19 -0500
Subject: [PATCH 1/2] Add prettier - first batch, .htmls

- also remove some unused dependencies in .js
---
 .github/workflows/prettier-pr.yml             |  54 ++
 .jshintrc                                     |  48 +-
 .prettierignore                               |   6 +
 .prettierrc                                   |   4 +
 Gruntfile.js                                  |   5 +-
 app/index.html                                | 891 +++++++++---------
 app/package.json                              |   4 +-
 .../collectionManager2/collectionManager.html |  28 +-
 .../plugins/collectionManager2/manifest.json  |  55 +-
 .../plugins/example-plugin/index.html         |  72 +-
 .../plugins/example-plugin/manifest.json      |  10 +-
 app/resources/plugins/icerok/index.html       |  84 +-
 app/resources/plugins/icerok/manifest.json    |  12 +-
 app/resources/plugins/launchBar/launchBar.js  |   6 +-
 app/resources/plugins/launchBar/mainBar.html  |   2 +-
 app/resources/plugins/launchBar/manifest.json |  30 +-
 .../plugins/launchBar/views/plugin-list.html  |   6 +-
 app/resources/viewers/markdown/js/readme.js   |  43 +-
 app/resources/viewers/markdown/readme.html    |  12 +-
 app/resources/viewers/plain/output.html       |  21 +-
 app/resources/viewers/plain/pcf.html          |  22 +-
 app/resources/viewers/svg/pinout.html         |  20 +-
 app/resources/viewers/system/js/system.js     | 123 +--
 app/resources/viewers/system/system.html      |  43 +-
 app/resources/viewers/table/rules.html        |  47 +-
 app/scripts/services/collections.js           |  18 +-
 app/scripts/services/compiler.js              |  12 +-
 app/scripts/services/drivers.js               |  25 +-
 app/scripts/services/utils.js                 |   1 -
 app/views/advanced.html                       |  26 +-
 app/views/languages.html                      |  92 +-
 app/views/menu.html                           | 725 ++++++++------
 app/views/uithemes.html                       |  12 +-
 app/views/version.html                        | 135 +--
 package.json                                  |   6 +-
 35 files changed, 1519 insertions(+), 1181 deletions(-)
 create mode 100644 .github/workflows/prettier-pr.yml
 create mode 100644 .prettierignore
 create mode 100644 .prettierrc

diff --git a/.github/workflows/prettier-pr.yml b/.github/workflows/prettier-pr.yml
new file mode 100644
index 000000000..b27a68e9c
--- /dev/null
+++ b/.github/workflows/prettier-pr.yml
@@ -0,0 +1,54 @@
+name: Prettier hook for PRs
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened, closed]
+    branches: [develop, master]
+  push:
+    branches: [develop, master]
+
+jobs:
+  ci-pr:
+    # Run on any change from PR or direct push, but don't run on a cancel PR
+    if: github.event_name != 'pull_request' || (
+        github.event.action == 'opened' ||
+        github.event.action == 'synchronize' ||
+        github.event.action == 'reopened' && github.event.before != github.event.after ||
+        github.event.action == 'closed' && github.event.pull_request.merged == true
+      )
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "latest"
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Confirm code format
+        run: npm prettier
+
+      - name: Commit changes
+        run: |
+          git config --global user.name "maria[bot]"
+          git config --global user.email "maria[bot]@users.noreply.github.com"
+          git add .
+          git commit -m "Auto-format code with prettier" || echo "No changes to commit"
+          git push
+
+  ci-close-pr:
+    # Run on a cancel PR
+    if: github.event_name == 'pull_request' && github.event.pull_request.merged == false
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Just report closed, nothing to do
+        run: |
+          echo PR #${{ github.event.number }} has been closed, not merged
diff --git a/.jshintrc b/.jshintrc
index 045136980..3a8941c3c 100644
--- a/.jshintrc
+++ b/.jshintrc
@@ -1,6 +1,6 @@
 {
- "esversion": 11,
-    "node": true,
+  "esversion": 11,
+  "node": true,
   "browser": true,
   "bitwise": true,
   "camelcase": true,
@@ -21,27 +21,27 @@
   "-W069": true,
   "-W083": true,
   "-W084": true,
-  "globals": { 
-    "iceStudio":false,
-    "Icestudio":false,
-    "iceStudioReady":false,
-    "domCache":false,
-    "iprof":false,
-    "IceProfiler":false,
-    "IceBlock":false,
-    "subModuleActive":false,
-    "ICEpm":false,
-    "IcePlugManager":false,
-    "iceConsole":false,
-    "IceLogger":false,
-    "IceEventBus":false,
-    "IceTemplateSystem":false,
-    "IceParametricHelper":false,
-    "Mustache":false,
-    "jexcel":false,
-    "nw":false,
-    "Snap":false,
-    "mina":false,
+  "globals": {
+    "iceStudio": false,
+    "Icestudio": false,
+    "iceStudioReady": false,
+    "domCache": false,
+    "iprof": false,
+    "IceProfiler": false,
+    "IceBlock": false,
+    "subModuleActive": false,
+    "ICEpm": false,
+    "IcePlugManager": false,
+    "iceConsole": false,
+    "IceLogger": false,
+    "IceEventBus": false,
+    "IceTemplateSystem": false,
+    "IceParametricHelper": false,
+    "Mustache": false,
+    "jexcel": false,
+    "nw": false,
+    "Snap": false,
+    "mina": false,
     "$": false,
     "angular": false,
     "console": false,
@@ -55,7 +55,7 @@
     "ace": false,
     "g": false,
     "V": false,
-    "IceCollection":false,
+    "IceCollection": false,
     "IceHD": false,
     "WafleModal": false
   }
diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 000000000..46d7aba94
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1,6 @@
+resources/libs/vendor/
+resources/fonts/
+*.md
+icerok/vendor/sweetalert2.min.js
+icerok/css/*.min.css
+Gruntfile.js
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 000000000..30b4336be
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,4 @@
+{
+  "quoteProps": "consistent",
+  "trailingComma": "es5"
+}
diff --git a/Gruntfile.js b/Gruntfile.js
index e217ce3df..2af3eb5fc 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -824,7 +824,7 @@ module.exports = function (grunt) {
       },
 
       //-- Download NWjs for ARM arquitecture, as it is not part of the
-      //-- oficial NWjs project
+      //-- official NWjs project
       //-- It is downloaded during the ARM build process
       //-- Only ARM
       nwjsAarch64: {
@@ -1234,8 +1234,7 @@ module.exports = function (grunt) {
             path: MAC_EXEC_FILE,
           },
         ],
-        /* -- For code oficial packages of Icestudio, for developers maintain commented
-
+        /* -- For code official packages of Icestudio, for developers maintain commented
         "code-sign": {
           "signing-identity": "XXXX",
         }
diff --git a/app/index.html b/app/index.html
index 2ddfed62f..fbadf9665 100644
--- a/app/index.html
+++ b/app/index.html
@@ -1,79 +1,80 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
+  <!----------------------------------------------------------------------->
+  <!-- INDEX HTML FILE --- Initial ENTRY POINT                           -->
+  <!----------------------------------------------------------------------->
+  <!-- Start sequence:                                                   -->
+  <!--   * NW is executed. Icestudio is a NWjs application.              -->
+  <!--   * NW creates the main display window  (a browser)               -->
+  <!--   * NW loads this file into the window (index.html)               -->
+  <!--   * index.html is processed and executed                          -->
+  <!----------------------------------------------------------------------->
+  <!-- index.html structure:                                             -->
+  <!--   * CSS is loaded (for both internal and external dependencies)   -->
+  <!--   * js files are loaded (both internal and external js files)     -->
+  <!--   * The body contains the structure of the Icestudio GUI          -->
+  <!----------------------------------------------------------------------->
+  <!-- When the js files are executed, there is already a nw window      -->
+  <!--   available                                                       -->
+  <!-- All the js files have access to the nw object (which gives access -->
+  <!-- to the nw API                                                     -->
+  <!----------------------------------------------------------------------->
+  <!-- JS ENTRY POINT:                                                   -->
+  <!--   Icestudio depends on many .js files. The main JS file, which is -->
+  <!--   initially executed, is app.js                                   -->
+  <!-- If you want to understand the icestudio code, first have a look   -->
+  <!-- to this index.html and then continue with app.js                  -->
+  <!----------------------------------------------------------------------->
+  <!-- NW documentation:                                                 -->
+  <!-- https://nwjs.readthedocs.io/en/latest/                            -->
+  <!----------------------------------------------------------------------->
+
+  <!----------------------------------------------------------------------->
+  <!-- OVERRIDE NPM PACKAGES WITH LOCAL COPY OF OBSOLETE PACKAGES        -->
+  <!----------------------------------------------------------------------->
+  <!--                                                                   -->
+  <!-- Only needed files are copied from npm package. The code are       -->
+  <!-- copied to resources/libs/vendor/package_dir  directory            -->
+  <!--                                                                   -->
+  <!--  NPM Package and version             Local package_dir            -->
+  <!--  -----------------------             -----------------            -->
+  <!--                                                                   -->
+  <!-- "jointjs": "~2.0.1"              ==>    jointjs                   -->
+  <!-- "bootstrap": "~3.3.7"            ==>    boostrap                  -->
+  <!-- "svg-pan-zoom": "~3.4.1"         ==>    svg-pan-zoom              -->
+  <!-- "angular": "~1.6.9"              ==>    angular                   -->
+  <!-- "angular-gettext": "2.4.2"       ==>    angular-gettext           -->
+  <!-- "angular-route": "~1.6.9"        ==>    angular-route             -->
+  <!-- "angular-ui-bootstrap": "~1.3.3" ==>    angular-ui-bootstrap      -->
+  <!--                                                                   -->
+  <!----------------------------------------------------------------------->
+
+  <head>
+    <title>Icestudio</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+
+    <!-- critical css, should be loaded as soon as possible -->
+    <style>
+      body {
+        margin: 0;
+        padding: 0;
+        overflow: hidden;
+      }
+      /* -- Splash screen  */
+      #main-icestudio-load-wrapper {
+        position: absolute;
+        top: 0;
+        left: 0;
+        z-index: 9999999999999999;
+        width: 100%;
+        height: 100vh;
+        overflow: hidden;
+        background-color: #305eac;
+        opacity: 1;
+        transition: opacity 1s ease;
+      }
 
-    <!----------------------------------------------------------------------->
-    <!-- INDEX HTML FILE --- Initial ENTRY POINT                           -->
-    <!----------------------------------------------------------------------->
-    <!-- Start sequence:                                                   -->
-    <!--   * NW is executed. Icestudio is a NWjs application.              -->
-    <!--   * NW creates the main display window  (a browser)               -->
-    <!--   * NW loads this file into the window (index.html)               -->
-    <!--   * index.html is processed and executed                          -->
-    <!----------------------------------------------------------------------->
-    <!-- index.html structure:                                             -->
-    <!--   * CSS is loaded (for both internal and external dependencies)   -->
-    <!--   * js files are loaded (both internal and external js files)     -->
-    <!--   * The body contains the structure of the Icestudio GUI          -->
-    <!----------------------------------------------------------------------->
-    <!-- When the js files are executed, there is already a nw window      -->
-    <!--   available                                                       -->
-    <!-- All the js files have access to the nw object (which gives access -->
-    <!-- to the nw API                                                     -->
-    <!----------------------------------------------------------------------->
-    <!-- JS ENTRY POINT:                                                   -->
-    <!--   Icestudio depends on many .js files. The main JS file, which is -->
-    <!--   initially executed, is app.js                                   -->
-    <!-- If you want to understand the icestudio code, first have a look   -->
-    <!-- to this index.html and then continue with app.js                  -->
-    <!----------------------------------------------------------------------->
-    <!-- NW documentation:                                                 -->
-    <!-- https://nwjs.readthedocs.io/en/latest/                            -->
-    <!----------------------------------------------------------------------->
-
-    <!----------------------------------------------------------------------->
-    <!-- OVERRIDE NPM PACKAGES WITH LOCAL COPY OF OBSOLETE PACKAGES        -->
-    <!----------------------------------------------------------------------->
-    <!--                                                                   -->
-    <!-- Only needed files are copied from npm package. The code are       -->
-    <!-- copied to resources/libs/vendor/package_dir  directory            -->
-    <!--                                                                   -->
-    <!--  NPM Package and version             Local package_dir            -->
-    <!--  -----------------------             -----------------            -->
-    <!--                                                                   -->
-    <!-- "jointjs": "~2.0.1"              ==>    jointjs                   --> 
-    <!-- "bootstrap": "~3.3.7"            ==>    boostrap                  -->
-    <!-- "svg-pan-zoom": "~3.4.1"         ==>    svg-pan-zoom              -->
-    <!-- "angular": "~1.6.9"              ==>    angular                   -->
-    <!-- "angular-gettext": "2.4.2"       ==>    angular-gettext           -->
-    <!-- "angular-route": "~1.6.9"        ==>    angular-route             -->
-    <!-- "angular-ui-bootstrap": "~1.3.3" ==>    angular-ui-bootstrap      -->
-    <!--                                                                   -->
-    <!----------------------------------------------------------------------->
-    
-    <head>
-        <title>Icestudio</title>
-        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-
-        <!-- critical css, should be loaded as soon as possible -->
-        <style>
-body{
-    margin:0;padding:0; overflow: hidden;
-}
-/* -- Splash screen  */
-#main-icestudio-load-wrapper {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 9999999999999999;
-    width: 100%;
-    height: 100vh;
-    overflow: hidden;
-    background-color: #305eac;
-    opacity: 1;
-    transition: opacity 1s ease;
-}
-
-    #main-icestudio-load-wrapper img {
+      #main-icestudio-load-wrapper img {
         position: absolute;
         top: 0;
         left: 0;
@@ -81,13 +82,9 @@
         bottom: 0;
         margin: auto;
         width: 100%;
-    }
-
-
-
+      }
 
-
-    #main-icestudio-load-wrapper--bar {
+      #main-icestudio-load-wrapper--bar {
         position: absolute;
         bottom: 0;
         left: 0;
@@ -95,393 +92,413 @@
         height: 24px;
         animation: progres 3s infinite linear;
         background-color: white;
-    }
+      }
 
-    @keyframes progres {
+      @keyframes progres {
         0% {
-            width: 0%;
+          width: 0%;
         }
 
         25% {
-            width: 50%;
+          width: 50%;
         }
 
         50% {
-            width: 75%;
+          width: 75%;
         }
 
         75% {
-            width: 85%;
+          width: 85%;
         }
 
         100% {
-            width: 100%;
+          width: 100%;
         }
-    }
+      }
 
-    #main-icestudio-load-wrapper.fade-loaded {
+      #main-icestudio-load-wrapper.fade-loaded {
         opacity: 0;
+      }
 
-    }
-
-    #main-icestudio-load-wrapper.loaded {
+      #main-icestudio-load-wrapper.loaded {
         display: none;
-    }
+      }
 
-    #main-icestudio-wrapper {
+      #main-icestudio-wrapper {
         position: relative;
         display: block;
         width: 100%;
         height: 100vh;
         overflow: hidden;
-    }
-    /*
+      }
+      /*
 #main-icestudio-wrapper.loaded {
     display: block;
 }*/
 
+      .splash-img-center,
+      .splash-img-container {
+        overflow: hidden;
+        width: 100%;
+        height: 100vh;
+      }
 
-    .splash-img-center,    .splash-img-container{
-        overflow:hidden;
-        width:100%;
-        height:100vh;
-    }
-
-    .spinner-wrapper {
-        width:100%;
-        height:100vh;
-        position:fixed;
-        overflow:hidden;
-        top:0;left:0;
-        z-index:999;
-        display:none;
-    }
-    body.waiting .spinner-wrapper{
-        display:block;
-    }
-    .spinner-wrapper--bg{
-        width:100%;
-        height:100vh;
-        position:absolute;
-        top:0;left:0;
-        overflow:hidden;
-        z-index:0;
-        background-color:#7ccff4;
-        opacity:0.4;
-    }
-    .spinner-wrapper--container{
-        position:absolute;
-        top:0;left:0;right:0;bottom:0;
-        margin:auto;
-        width:80px;
-        height:80px;
-        z-index:1;
-    }
-        </style> 
-
-
-
-
-        <!-- ************************************************************** -->
-        <!-- ******      External Styles                          ********* -->
-        <!-- ************************************************************** -->
-
-        <!-- Jointjs: Visualize and interact with diagrams and graphs       -->
-        <!-- https://www.jointjs.com/opensource                             -->
-        <link rel="stylesheet" href="resources/libs/vendor/jointjs/joint.css" />
-
-        <!-- Bootstrap: Build fast, responsive sites with Bootstrap         -->
-        <!-- https://getbootstrap.com/                                      -->
-        <link rel="stylesheet" href="resources/libs/vendor/bootstrap/css/bootstrap.min.css" />
-
-        <!-- Select2: The jQuery replacement for select boxes               -->
-        <!-- https://select2.org/                                           -->
-        <link rel="stylesheet" href="node_modules/select2/dist/css/select2.min.css" />
-
-        <!-- Alertifyjs: A javascript framework for developing pretty       -->
-        <!-- browser dialogs and notifications                              -->
-        <!-- https://alertifyjs.com/                                        -->
-        <link rel="stylesheet" href="node_modules/alertifyjs/build/css/alertify.min.css" />
-        <link rel="stylesheet" href="node_modules/alertifyjs/build/css/themes/default.min.css" />
-
-        <!-- Jexcel:  is a lightweight Vanilla JavaScript plugin to create  -->
-        <!-- amazing web-based interactive HTML tables and spreadsheets     -->
-        <!-- compatible with other spreadsheet software                     -->
-        <!-- https://github.com/jspreadsheet/ce                             -->
-        <link rel="stylesheet" href="node_modules/jspreadsheet-ce/dist/jspreadsheet.css" />
-
-        <!-- jSuites: jSuites is a collection of lightweight common         -->
-        <!-- required javascript web components                             -->
-        <!-- https://github.com/jsuites/jsuites                             -->
-        <link rel="stylesheet" href="node_modules/jsuites/dist/jsuites.css" />
-
-        <!-- sweetAlert                                                     -->
-        <!-- Beautiful popups                                               -->
-        <link rel="stylesheet" href="node_modules/sweetalert2/dist/sweetalert2.min.css" />
-
-        <!-- ************************************************************** -->
-        <!-- ****    ICESTUDIO STYLES (Internal)                       **** -->
-        <!-- ************************************************************** -->
-        <!-- Fonts -->
-        <link rel="stylesheet" href="resources/fonts/Lato2OFLWeb/Lato/latofonts.css" />
-        <link rel="stylesheet" href="resources/fonts/fontawesome-free-5.15.1-web/css/all.min.css" />
-
-        <!-- Style for the markdown -->
-        <link rel="stylesheet" href="resources/viewers/markdown/css/github-markdown.css" />
-
-
-
-
-        <!-- FPGA resources style -->
-        <link rel="stylesheet" href="styles/design.css" />
-
-        <!-- Main UI -->
-        <link rel="stylesheet" href="styles/main.css" />
-
-        <!-- Main UI -->
-        <link rel="stylesheet" href="styles/ics-wm.css" />
-
-        <!-- Menu -->
-        <link rel="stylesheet" href="styles/menu.css" />
-
-        <!-- Version window -->
-        <link rel="stylesheet" href="styles/version.css" />
-
-    </head>
-
-    <!---------------------------------------------------------------->
-    <!-- ICESTUDIO GUI STRUCTURE                                    -->
-    <!---------------------------------------------------------------->
-
-    <!-- The ng-app directive tells Angularjs that this is the root -->
-    <!-- element of the Angularjs application                       -->
-    <body ng-app="icestudio">
-
-        <!------------------------------------------------------->
-        <!-- Initial load screen                               -->
-        <!-- It is shown every time a new Icestudio window     -->
-        <!-- is open (including the initial one)               -->
-        <!------------------------------------------------------->
-        <div id="main-icestudio-load-wrapper">
-            <div id="main-icestudio-load-wrapper--bar"></div>
-
-            <div class="splash-img-container">
-                <div class="splash-img-center">
-                    <img src="resources/images/icestudio-github.svg" alt="icestudio splash">
-                </div>
-            </div>
+      .spinner-wrapper {
+        width: 100%;
+        height: 100vh;
+        position: fixed;
+        overflow: hidden;
+        top: 0;
+        left: 0;
+        z-index: 999;
+        display: none;
+      }
+      body.waiting .spinner-wrapper {
+        display: block;
+      }
+      .spinner-wrapper--bg {
+        width: 100%;
+        height: 100vh;
+        position: absolute;
+        top: 0;
+        left: 0;
+        overflow: hidden;
+        z-index: 0;
+        background-color: #7ccff4;
+        opacity: 0.4;
+      }
+      .spinner-wrapper--container {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        margin: auto;
+        width: 80px;
+        height: 80px;
+        z-index: 1;
+      }
+    </style>
+
+    <!-- ************************************************************** -->
+    <!-- ******      External Styles                          ********* -->
+    <!-- ************************************************************** -->
+
+    <!-- Jointjs: Visualize and interact with diagrams and graphs       -->
+    <!-- https://www.jointjs.com/opensource                             -->
+    <link rel="stylesheet" href="resources/libs/vendor/jointjs/joint.css" />
+
+    <!-- Bootstrap: Build fast, responsive sites with Bootstrap         -->
+    <!-- https://getbootstrap.com/                                      -->
+    <link
+      rel="stylesheet"
+      href="resources/libs/vendor/bootstrap/css/bootstrap.min.css"
+    />
+
+    <!-- Select2: The jQuery replacement for select boxes               -->
+    <!-- https://select2.org/                                           -->
+    <link
+      rel="stylesheet"
+      href="node_modules/select2/dist/css/select2.min.css"
+    />
+
+    <!-- Alertifyjs: A javascript framework for developing pretty       -->
+    <!-- browser dialogs and notifications                              -->
+    <!-- https://alertifyjs.com/                                        -->
+    <link
+      rel="stylesheet"
+      href="node_modules/alertifyjs/build/css/alertify.min.css"
+    />
+    <link
+      rel="stylesheet"
+      href="node_modules/alertifyjs/build/css/themes/default.min.css"
+    />
+
+    <!-- Jexcel:  is a lightweight Vanilla JavaScript plugin to create  -->
+    <!-- amazing web-based interactive HTML tables and spreadsheets     -->
+    <!-- compatible with other spreadsheet software                     -->
+    <!-- https://github.com/jspreadsheet/ce                             -->
+    <link
+      rel="stylesheet"
+      href="node_modules/jspreadsheet-ce/dist/jspreadsheet.css"
+    />
+
+    <!-- jSuites: jSuites is a collection of lightweight common         -->
+    <!-- required javascript web components                             -->
+    <!-- https://github.com/jsuites/jsuites                             -->
+    <link rel="stylesheet" href="node_modules/jsuites/dist/jsuites.css" />
+
+    <!-- sweetAlert                                                     -->
+    <!-- Beautiful popups                                               -->
+    <link
+      rel="stylesheet"
+      href="node_modules/sweetalert2/dist/sweetalert2.min.css"
+    />
+
+    <!-- ************************************************************** -->
+    <!-- ****    ICESTUDIO STYLES (Internal)                       **** -->
+    <!-- ************************************************************** -->
+    <!-- Fonts -->
+    <link
+      rel="stylesheet"
+      href="resources/fonts/Lato2OFLWeb/Lato/latofonts.css"
+    />
+    <link
+      rel="stylesheet"
+      href="resources/fonts/fontawesome-free-5.15.1-web/css/all.min.css"
+    />
+
+    <!-- Style for the markdown -->
+    <link
+      rel="stylesheet"
+      href="resources/viewers/markdown/css/github-markdown.css"
+    />
+
+    <!-- FPGA resources style -->
+    <link rel="stylesheet" href="styles/design.css" />
+
+    <!-- Main UI -->
+    <link rel="stylesheet" href="styles/main.css" />
+
+    <!-- Main UI -->
+    <link rel="stylesheet" href="styles/ics-wm.css" />
+
+    <!-- Menu -->
+    <link rel="stylesheet" href="styles/menu.css" />
+
+    <!-- Version window -->
+    <link rel="stylesheet" href="styles/version.css" />
+  </head>
+
+  <!---------------------------------------------------------------->
+  <!-- ICESTUDIO GUI STRUCTURE                                    -->
+  <!---------------------------------------------------------------->
+
+  <!-- The ng-app directive tells Angularjs that this is the root -->
+  <!-- element of the Angularjs application                       -->
+  <body ng-app="icestudio">
+    <!------------------------------------------------------->
+    <!-- Initial load screen                               -->
+    <!-- It is shown every time a new Icestudio window     -->
+    <!-- is open (including the initial one)               -->
+    <!------------------------------------------------------->
+    <div id="main-icestudio-load-wrapper">
+      <div id="main-icestudio-load-wrapper--bar"></div>
+
+      <div class="splash-img-container">
+        <div class="splash-img-center">
+          <img
+            src="resources/images/icestudio-github.svg"
+            alt="icestudio splash"
+          />
         </div>
-
-        <!-------------------------------------------------------->
-        <!-- ICESTUDIO MAIN WINDOW                              -->
-        <!-------------------------------------------------------->
-        <div id="main-icestudio-wrapper">
-
-            <!-- SPINNER: Normally hidden                    -->
-            <!-- It is used for showing activity to the user -->
-            <!-- The main interface is disabled and only the -->
-            <!-- animation is shown                          -->
-            <div class="spinner-wrapper">
-                <div class="spinner-wrapper--bg"></div>
-                <div class="spinner-wrapper--container">
-                    <div class="sk-cube-grid">
-                        <div class="sk-cube sk-cube1"></div>
-                        <div class="sk-cube sk-cube2"></div>
-                        <div class="sk-cube sk-cube3"></div>
-                        <div class="sk-cube sk-cube4"></div>
-                        <div class="sk-cube sk-cube5"></div>
-                        <div class="sk-cube sk-cube6"></div>
-                        <div class="sk-cube sk-cube7"></div>
-                        <div class="sk-cube sk-cube8"></div>
-                        <div class="sk-cube sk-cube9"></div>
-                    </div>
-                </div>
-            </div>
-
-            <!-- ICESTUDIO MENU BAR, located at the top          -->
-            <!-- Associated to app/scripts/controllers/menu.js   -->
-            <div ng-include="'views/menu.html'"></div>
-
-            <!-- The rest of ICESTUDIO GUI:                      -->
-            <!--  * Information banners                          -->
-            <!--  * Label Finder popUp menu                      -->
-            <!--  * Basic Toolbox pop up menu                    -->
-            <!--  * PAPER: Main design board                     -->
-            <!--  * Bottom toolbar                               -->
-            <!----------------------------------------------------->
-            <!-- Associated to app/scripts/controllers/design.js -->
-            <div ng-include="'views/design.html'"></div>
-
+      </div>
+    </div>
+
+    <!-------------------------------------------------------->
+    <!-- ICESTUDIO MAIN WINDOW                              -->
+    <!-------------------------------------------------------->
+    <div id="main-icestudio-wrapper">
+      <!-- SPINNER: Normally hidden                    -->
+      <!-- It is used for showing activity to the user -->
+      <!-- The main interface is disabled and only the -->
+      <!-- animation is shown                          -->
+      <div class="spinner-wrapper">
+        <div class="spinner-wrapper--bg"></div>
+        <div class="spinner-wrapper--container">
+          <div class="sk-cube-grid">
+            <div class="sk-cube sk-cube1"></div>
+            <div class="sk-cube sk-cube2"></div>
+            <div class="sk-cube sk-cube3"></div>
+            <div class="sk-cube sk-cube4"></div>
+            <div class="sk-cube sk-cube5"></div>
+            <div class="sk-cube sk-cube6"></div>
+            <div class="sk-cube sk-cube7"></div>
+            <div class="sk-cube sk-cube8"></div>
+            <div class="sk-cube sk-cube9"></div>
+          </div>
         </div>
-
-        <!-------------------------------------------------------------------->
-        <!-- IMPORTANT! The javascript files should be loaded at the end    -->
-        <!-- of the BODY, and in this order. DO NOT CHANGE THEIR LOCATION   -->
-        <!-- In this index file                                             -->
-        <!-------------------------------------------------------------------->
-
-        <!-- ************************************************************** -->
-        <!-- ******      External Javascript modules              ********* -->
-        <!-- ************************************************************** -->
-
-        <!-- jquery: jQuery is a fast, small, and feature-rich JavaScript   -->
-        <!-- library                                                        -->
-        <!-- https://jquery.com/                                            -->
-        <script src="node_modules/jquery/dist/jquery.min.js"></script>
-
-        
-        <!-- underscore: a JavaScript library that provides a whole mess of -->
-        <!-- useful functional programming helpers without extending any    -->
-        <!-- built-in objects                                               -->
-        <!-- https://underscorejs.org/                                      -->
-        <script src="node_modules/underscore/underscore.js"></script>
-
-        <!-- backbone: Give your JS App some Backbone with Models, Views,   -->
-        <!-- Collections, and Events.                                       -->
-        <!-- https://backbonejs.org/                                        -->
-        <script src="node_modules/backbone/backbone.js"></script>
-
-        <!-- lodash: A modern JavaScript utility library delivering         -->
-        <!-- modularity, performance & extras.                              -->
-        <!-- https://lodash.com/                                            -->
-        <script src="resources/libs/vendor/lodash/index.js"></script>
-
-        <!-- Jointjs: Visualize and interact with diagrams and graphs       -->
-        <!-- https://www.jointjs.com/opensource                             -->
-        <script src="resources/libs/vendor/jointjs/joint.js"></script>
-
-        <!-- Bootstrap: Build fast, responsive sites with Bootstrap         -->
-        <!-- https://getbootstrap.com/                                      -->
-        <script src="resources/libs/vendor/bootstrap/js/bootstrap.js"></script>
-
-        <!-- Select2: The jQuery replacement for select boxes               -->
-        <!-- https://select2.org/                                           -->
-        <script src="node_modules/select2/dist/js/select2.full.js"></script>
-
-        <!-- Ace is a code editor written in JavaScript                     -->
-        <!-- https://github.com/ajaxorg/ace-builds                          -->
-        <script src="node_modules/ace-builds/src-min-noconflict/ace.js"></script>
-        <script src="node_modules/ace-builds/src-min-noconflict/theme-chrome.js"></script>
-        <script src="node_modules/ace-builds/src-min-noconflict/mode-verilog.js"></script>
-
-        <!-- async: Higher-order functions and common patterns for          -->
-        <!-- asynchronous code                                              -->
-        <!-- https://caolan.github.io/async/v3/                             -->
-        <script src="node_modules/async/dist/async.min.js"></script>
-
-        <!-- svg-pan-zoom: Simple pan/zoom solution for SVGs in HTML. It    -->
-        <!-- adds events listeners for mouse scroll, double-click and pan   -->
-        <!-- https://github.com/bumbu/svg-pan-zoom#readme                   -->
-        <script src="resources/libs/vendor/svg-pan-zoom/svg-pan-zoom.min.js"></script>
-
-        <!-- Alertifyjs: A javascript framework for developing pretty       -->
-        <!-- browser dialogs and notifications                              -->
-        <!-- https://alertifyjs.com/                                        -->
-        <script src="node_modules/alertifyjs/build/alertify.js"></script>
-
-        <!-- jSuites: a collection of lightweight common required           -->
-        <!-- javascript web components                                      -->
-        <!-- https://www.npmjs.com/package/jsuites                          -->
-        <script src="node_modules/jsuites/dist/jsuites.js"></script>
-
-        <!-- jexcel: Jspreadsheet CE is a lightweight Vanilla JavaScript    -->
-        <!-- plugin to create amazing web-based interactive HTML tables     -->
-        <!-- and spreadsheets compatible with other spreadsheet software    -->
-        <!-- https://github.com/jspreadsheet/ce                             -->
-        <script src="node_modules/jspreadsheet-ce/dist/index.js"></script>
-
-        <!-- mustache: a logic-less template syntax. It can be used for     -->
-        <!-- html, config files, source code - anything. It works by        -->
-        <!-- expanding tags in a template using values provided in a hash   -->
-        <!-- object                                                         -->
-        <!-- https://github.com/janl/mustache.js                            -->
-        <script src="node_modules/mustache/mustache.min.js"></script>
-
-        <!-- ************************************************************** -->
-        <!-- ******      ICESTUDIO Javascript modules             ********* -->
-        <!-- ************************************************************** -->
-
-        <!-- New components (Refactored) -->
-        <script src="resources/libs/Icestudio/Core/IceBlock.js"></script>
-        <script src="resources/libs/Icestudio/Core/IceCollection.js"></script>
-        <script src="resources/libs/Icestudio/Fuse/IceHD.js"></script>
-        <script src="resources/libs/Icestudio/Network/WafleRemoteFile.js"></script>
-        <script src="resources/libs/Icestudio/GUI/WafleTemplate.js"></script>
-        <script src="resources/libs/Icestudio/GUI/Widgets/WafleUIWindow.js"></script>
-        <script src="resources/libs/Icestudio/GUI/Widgets/WafleUITree.js"></script>
-        <script src="resources/libs/Icestudio/GUI/WafleGUI.js"></script>
-        <script src="resources/libs/Icestudio/GUI/WafleModal.js"></script>
-        <script src="resources/libs/Icestudio/GUI/WafleWindowManager.js"></script>
-        <script src="resources/libs/Icestudio/Log/IceLogger.js"></script>
-        <script src="resources/libs/Icestudio/Crypto/UniqueIdGenerator.js"></script>
-        <script src="resources/libs/Icestudio/Plugin/WaflePlugin.js"></script>
-        <script src="resources/libs/Icestudio/Plugin/WaflePluginExtService.js"></script>
-        <script src="resources/libs/Icestudio/Plugin/WaflePluginExtWindow.js"></script>
-        <script src="resources/libs/Icestudio/Plugin/WaflePluginExtEmbeddedWindowed.js"></script>
-        <script src="resources/libs/Icestudio/Plugin/WaflePluginExtEmbedded.js"></script>
-        <script src="resources/libs/Icestudio/Services/WafleEventBus.js"></script>
-        <script src="resources/libs/Icestudio/Services/WaflePluginManager.js"></script>
-        <script src="resources/libs/Icestudio/Icestudio.js"></script>
-        <script src="resources/libs/iceprofiler.js"></script>
-        <script src="resources/libs/iceparametrichelper.js"></script>
-
-        <!-- https://angularjs.org/                                         -->
-        <script src="resources/libs/vendor/angular/angular.min.js"></script>
-        <script src="resources/libs/vendor/angular-route/angular-route.min.js"></script>
-        <script src="resources/libs/vendor/angular-ui-bootstrap/ui-bootstrap-tpls.js"></script>
-        <script src="resources/libs/vendor/angular-gettext/angular-gettext.min.js"></script>
-
-    
-        <!-- https://sweetalert2.github.io/                                       -->
-        <script src="node_modules/sweetalert2/dist/sweetalert2.all.min.js"></script>
-
-        <!---------------------------------------------->
-        <!-- Icestudio app ENTRY POINT                -->
-        <!---------------------------------------------->
-        <script src="scripts/app.js"></script>
-
-
-        <!---------------------------------------------->
-        <!-- Icestudio javascript modules             -->
-        <!---------------------------------------------->
-        <!-- Definition of external modules -->
-        <script src="scripts/factories/error.js"></script>
-        <script src="scripts/factories/joint.js"></script>
-        <script src="scripts/factories/node.js"></script>
-        <script src="scripts/factories/window.js"></script>
-
-        <!-- js files associated to html code     -->
-        <!-- They contain the callback functions  -->
-        <script src="scripts/controllers/design.js"></script>
-        <script src="scripts/controllers/menu.js"></script>
-
-        <!-- Special menus  -->
-        <script src="scripts/directives/menuboard.js"></script>
-        <script src="scripts/directives/menutree.js"></script>
-
-        <!-- js files related to joint (the graphical library)  -->
-        <!-- used for drawing the circuits                      -->
-        <script src="scripts/graphics/joint.command.js"></script>
-        <script src="scripts/graphics/joint.connectors.js"></script>
-        <script src="scripts/graphics/joint.routers.js"></script>
-        <script src="scripts/graphics/joint.selection.js"></script>
-        <script src="scripts/graphics/joint.shapes.js"></script>
-
-        <!-- Other internal support libraries -->
-        <script src="scripts/services/blockforms.js"></script>
-        <script src="scripts/services/boards.js"></script>
-        <script src="scripts/services/utils.js"></script>
-        <script src="scripts/services/blocks.js"></script>
-        <script src="scripts/services/forms.js"></script>
-        <script src="scripts/services/common.js"></script>
-        <script src="scripts/services/compiler.js"></script>
-        <script src="scripts/services/drivers.js"></script>
-        <script src="scripts/services/graph.js"></script>
-        <script src="scripts/services/profile.js"></script>
-        <script src="scripts/services/project.js"></script>
-        <script src="scripts/services/collections.js"></script>
-        <script src="scripts/services/shortcuts.js"></script>
-        <script src="scripts/services/tools.js"></script>
-
-    </body>
+      </div>
+
+      <!-- ICESTUDIO MENU BAR, located at the top          -->
+      <!-- Associated to app/scripts/controllers/menu.js   -->
+      <div ng-include="'views/menu.html'"></div>
+
+      <!-- The rest of ICESTUDIO GUI:                      -->
+      <!--  * Information banners                          -->
+      <!--  * Label Finder popUp menu                      -->
+      <!--  * Basic Toolbox pop up menu                    -->
+      <!--  * PAPER: Main design board                     -->
+      <!--  * Bottom toolbar                               -->
+      <!----------------------------------------------------->
+      <!-- Associated to app/scripts/controllers/design.js -->
+      <div ng-include="'views/design.html'"></div>
+    </div>
+
+    <!-------------------------------------------------------------------->
+    <!-- IMPORTANT! The javascript files should be loaded at the end    -->
+    <!-- of the BODY, and in this order. DO NOT CHANGE THEIR LOCATION   -->
+    <!-- In this index file                                             -->
+    <!-------------------------------------------------------------------->
+
+    <!-- ************************************************************** -->
+    <!-- ******      External Javascript modules              ********* -->
+    <!-- ************************************************************** -->
+
+    <!-- jquery: jQuery is a fast, small, and feature-rich JavaScript   -->
+    <!-- library                                                        -->
+    <!-- https://jquery.com/                                            -->
+    <script src="node_modules/jquery/dist/jquery.min.js"></script>
+
+    <!-- underscore: a JavaScript library that provides a whole mess of -->
+    <!-- useful functional programming helpers without extending any    -->
+    <!-- built-in objects                                               -->
+    <!-- https://underscorejs.org/                                      -->
+    <script src="node_modules/underscore/underscore.js"></script>
+
+    <!-- backbone: Give your JS App some Backbone with Models, Views,   -->
+    <!-- Collections, and Events.                                       -->
+    <!-- https://backbonejs.org/                                        -->
+    <script src="node_modules/backbone/backbone.js"></script>
+
+    <!-- lodash: A modern JavaScript utility library delivering         -->
+    <!-- modularity, performance & extras.                              -->
+    <!-- https://lodash.com/                                            -->
+    <script src="resources/libs/vendor/lodash/index.js"></script>
+
+    <!-- Jointjs: Visualize and interact with diagrams and graphs       -->
+    <!-- https://www.jointjs.com/opensource                             -->
+    <script src="resources/libs/vendor/jointjs/joint.js"></script>
+
+    <!-- Bootstrap: Build fast, responsive sites with Bootstrap         -->
+    <!-- https://getbootstrap.com/                                      -->
+    <script src="resources/libs/vendor/bootstrap/js/bootstrap.js"></script>
+
+    <!-- Select2: The jQuery replacement for select boxes               -->
+    <!-- https://select2.org/                                           -->
+    <script src="node_modules/select2/dist/js/select2.full.js"></script>
+
+    <!-- Ace is a code editor written in JavaScript                     -->
+    <!-- https://github.com/ajaxorg/ace-builds                          -->
+    <script src="node_modules/ace-builds/src-min-noconflict/ace.js"></script>
+    <script src="node_modules/ace-builds/src-min-noconflict/theme-chrome.js"></script>
+    <script src="node_modules/ace-builds/src-min-noconflict/mode-verilog.js"></script>
+
+    <!-- async: Higher-order functions and common patterns for          -->
+    <!-- asynchronous code                                              -->
+    <!-- https://caolan.github.io/async/v3/                             -->
+    <script src="node_modules/async/dist/async.min.js"></script>
+
+    <!-- svg-pan-zoom: Simple pan/zoom solution for SVGs in HTML. It    -->
+    <!-- adds events listeners for mouse scroll, double-click and pan   -->
+    <!-- https://github.com/bumbu/svg-pan-zoom#readme                   -->
+    <script src="resources/libs/vendor/svg-pan-zoom/svg-pan-zoom.min.js"></script>
+
+    <!-- Alertifyjs: A javascript framework for developing pretty       -->
+    <!-- browser dialogs and notifications                              -->
+    <!-- https://alertifyjs.com/                                        -->
+    <script src="node_modules/alertifyjs/build/alertify.js"></script>
+
+    <!-- jSuites: a collection of lightweight common required           -->
+    <!-- javascript web components                                      -->
+    <!-- https://www.npmjs.com/package/jsuites                          -->
+    <script src="node_modules/jsuites/dist/jsuites.js"></script>
+
+    <!-- jexcel: Jspreadsheet CE is a lightweight Vanilla JavaScript    -->
+    <!-- plugin to create amazing web-based interactive HTML tables     -->
+    <!-- and spreadsheets compatible with other spreadsheet software    -->
+    <!-- https://github.com/jspreadsheet/ce                             -->
+    <script src="node_modules/jspreadsheet-ce/dist/index.js"></script>
+
+    <!-- mustache: a logic-less template syntax. It can be used for     -->
+    <!-- html, config files, source code - anything. It works by        -->
+    <!-- expanding tags in a template using values provided in a hash   -->
+    <!-- object                                                         -->
+    <!-- https://github.com/janl/mustache.js                            -->
+    <script src="node_modules/mustache/mustache.min.js"></script>
+
+    <!-- ************************************************************** -->
+    <!-- ******      ICESTUDIO Javascript modules             ********* -->
+    <!-- ************************************************************** -->
+
+    <!-- New components (Refactored) -->
+    <script src="resources/libs/Icestudio/Core/IceBlock.js"></script>
+    <script src="resources/libs/Icestudio/Core/IceCollection.js"></script>
+    <script src="resources/libs/Icestudio/Fuse/IceHD.js"></script>
+    <script src="resources/libs/Icestudio/Network/WafleRemoteFile.js"></script>
+    <script src="resources/libs/Icestudio/GUI/WafleTemplate.js"></script>
+    <script src="resources/libs/Icestudio/GUI/Widgets/WafleUIWindow.js"></script>
+    <script src="resources/libs/Icestudio/GUI/Widgets/WafleUITree.js"></script>
+    <script src="resources/libs/Icestudio/GUI/WafleGUI.js"></script>
+    <script src="resources/libs/Icestudio/GUI/WafleModal.js"></script>
+    <script src="resources/libs/Icestudio/GUI/WafleWindowManager.js"></script>
+    <script src="resources/libs/Icestudio/Log/IceLogger.js"></script>
+    <script src="resources/libs/Icestudio/Crypto/UniqueIdGenerator.js"></script>
+    <script src="resources/libs/Icestudio/Plugin/WaflePlugin.js"></script>
+    <script src="resources/libs/Icestudio/Plugin/WaflePluginExtService.js"></script>
+    <script src="resources/libs/Icestudio/Plugin/WaflePluginExtWindow.js"></script>
+    <script src="resources/libs/Icestudio/Plugin/WaflePluginExtEmbeddedWindowed.js"></script>
+    <script src="resources/libs/Icestudio/Plugin/WaflePluginExtEmbedded.js"></script>
+    <script src="resources/libs/Icestudio/Services/WafleEventBus.js"></script>
+    <script src="resources/libs/Icestudio/Services/WaflePluginManager.js"></script>
+    <script src="resources/libs/Icestudio/Icestudio.js"></script>
+    <script src="resources/libs/iceprofiler.js"></script>
+    <script src="resources/libs/iceparametrichelper.js"></script>
+
+    <!-- https://angularjs.org/                                         -->
+    <script src="resources/libs/vendor/angular/angular.min.js"></script>
+    <script src="resources/libs/vendor/angular-route/angular-route.min.js"></script>
+    <script src="resources/libs/vendor/angular-ui-bootstrap/ui-bootstrap-tpls.js"></script>
+    <script src="resources/libs/vendor/angular-gettext/angular-gettext.min.js"></script>
+
+    <!-- https://sweetalert2.github.io/                                       -->
+    <script src="node_modules/sweetalert2/dist/sweetalert2.all.min.js"></script>
+
+    <!---------------------------------------------->
+    <!-- Icestudio app ENTRY POINT                -->
+    <!---------------------------------------------->
+    <script src="scripts/app.js"></script>
+
+    <!---------------------------------------------->
+    <!-- Icestudio javascript modules             -->
+    <!---------------------------------------------->
+    <!-- Definition of external modules -->
+    <script src="scripts/factories/error.js"></script>
+    <script src="scripts/factories/joint.js"></script>
+    <script src="scripts/factories/node.js"></script>
+    <script src="scripts/factories/window.js"></script>
+
+    <!-- js files associated to html code     -->
+    <!-- They contain the callback functions  -->
+    <script src="scripts/controllers/design.js"></script>
+    <script src="scripts/controllers/menu.js"></script>
+
+    <!-- Special menus  -->
+    <script src="scripts/directives/menuboard.js"></script>
+    <script src="scripts/directives/menutree.js"></script>
+
+    <!-- js files related to joint (the graphical library)  -->
+    <!-- used for drawing the circuits                      -->
+    <script src="scripts/graphics/joint.command.js"></script>
+    <script src="scripts/graphics/joint.connectors.js"></script>
+    <script src="scripts/graphics/joint.routers.js"></script>
+    <script src="scripts/graphics/joint.selection.js"></script>
+    <script src="scripts/graphics/joint.shapes.js"></script>
+
+    <!-- Other internal support libraries -->
+    <script src="scripts/services/blockforms.js"></script>
+    <script src="scripts/services/boards.js"></script>
+    <script src="scripts/services/utils.js"></script>
+    <script src="scripts/services/blocks.js"></script>
+    <script src="scripts/services/forms.js"></script>
+    <script src="scripts/services/common.js"></script>
+    <script src="scripts/services/compiler.js"></script>
+    <script src="scripts/services/drivers.js"></script>
+    <script src="scripts/services/graph.js"></script>
+    <script src="scripts/services/profile.js"></script>
+    <script src="scripts/services/project.js"></script>
+    <script src="scripts/services/collections.js"></script>
+    <script src="scripts/services/shortcuts.js"></script>
+    <script src="scripts/services/tools.js"></script>
+  </body>
 </html>
diff --git a/app/package.json b/app/package.json
index f4a65ee8c..909bf30e1 100644
--- a/app/package.json
+++ b/app/package.json
@@ -17,7 +17,9 @@
   "updatecheck": "https://raw.githubusercontent.com/FPGAwars/icestudio/develop/app/package.json",
   "license": "GPL-2.0",
   "main": "index.html",
-  "permissions": ["desktopCapture"],
+  "permissions": [
+    "desktopCapture"
+  ],
   "chromium-args": "--enable-experimental-web-platform-features --enable-media-stream --enable-usermedia-screen-capturing --disable-backgrounding-occluded-window --allow-file-access-from-files --disable-web-security",
   "development": {
     "mode": false
diff --git a/app/resources/plugins/collectionManager2/collectionManager.html b/app/resources/plugins/collectionManager2/collectionManager.html
index 08bdfcb9b..479ce9502 100644
--- a/app/resources/plugins/collectionManager2/collectionManager.html
+++ b/app/resources/plugins/collectionManager2/collectionManager.html
@@ -1,16 +1,16 @@
 <div class="playground">
-    <div id="cm2-root" class="wrapper">
-        <div class="lds-grid">
-            <div></div>
-            <div></div>
-            <div></div>
-            <div></div>
-            <div></div>
-            <div></div>
-            <div></div>
-            <div></div>
-            <div></div>
-        </div>
-        <div class="cm-loader--status">Indexing Database</div>
+  <div id="cm2-root" class="wrapper">
+    <div class="lds-grid">
+      <div></div>
+      <div></div>
+      <div></div>
+      <div></div>
+      <div></div>
+      <div></div>
+      <div></div>
+      <div></div>
+      <div></div>
     </div>
-</div>
\ No newline at end of file
+    <div class="cm-loader--status">Indexing Database</div>
+  </div>
+</div>
diff --git a/app/resources/plugins/collectionManager2/manifest.json b/app/resources/plugins/collectionManager2/manifest.json
index 3b1d55a46..815046735 100644
--- a/app/resources/plugins/collectionManager2/manifest.json
+++ b/app/resources/plugins/collectionManager2/manifest.json
@@ -1,30 +1,29 @@
 {
-    "manifest_ver": "1.0",
-    "id":"collectionManager2",
-    "name": "Collection Manager",
-    "author":{
-        "name":"Carlos Venegas",
-        "twitter": "@cavearr"
+  "manifest_ver": "1.0",
+  "id": "collectionManager2",
+  "name": "Collection Manager",
+  "author": {
+    "name": "Carlos Venegas",
+    "twitter": "@cavearr"
+  },
+  "version": "1.0",
+  "launchAtStartup": false,
+  "icon": "icon.svg",
+  "multipleInstances": false,
+  "gui": {
+    "type": "embedded",
+    "windowed": "true",
+    "layout": ["collectionManager.html"],
+    "style": ["css/style.css"],
+    "styleThemed": {
+      "dark": ["css/dark/dark.css"],
+      "light": ["css/light/light.css"]
     },
-    "version":"1.0",
-    "launchAtStartup":false,
-    "icon": "icon.svg",
-    "multipleInstances": false,
-    "gui":{
-        "type":"embedded",
-        "windowed":"true",
-        "layout":["collectionManager.html"],
-        "style":["css/style.css"],
-        "styleThemed":{"dark":["css/dark/dark.css"],
-                        "light":["css/light/light.css"]
-        },
-        "styleHost":["css/host.css"],
-        "scripts":["js/events.js","js/collectionManager.js"],
-        "views":[]
-    },
-    "config":{
-        "fontSize":{"label": "Font size",
-                     "type": "integer",
-                     "default":12}
-    }
-}
\ No newline at end of file
+    "styleHost": ["css/host.css"],
+    "scripts": ["js/events.js", "js/collectionManager.js"],
+    "views": []
+  },
+  "config": {
+    "fontSize": { "label": "Font size", "type": "integer", "default": 12 }
+  }
+}
diff --git a/app/resources/plugins/example-plugin/index.html b/app/resources/plugins/example-plugin/index.html
index 3654f5c05..92752e785 100644
--- a/app/resources/plugins/example-plugin/index.html
+++ b/app/resources/plugins/example-plugin/index.html
@@ -1,42 +1,36 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en" dir="ltr">
-
-<head>
-  <title>Icestudio Plugin Sample</title>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-
-  <!-- External style sheet -->
-  <link rel="stylesheet" href="style.css">
-
-</head>
-
-<body>
-  <h1>This is an Icestudio Plugin Sample</h1>
-  <img src="img/icestudio-logo.png">
-  <img src="img/fpgawars-logo.png">
-
-  <script>
-
-    function callbackTest(){
-      console.log('Test from callback generated in '+pluginID);
-    }
-
-    function onIcestudioPluginLoaded() {
-
+  <head>
+    <title>Icestudio Plugin Sample</title>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+    <!-- External style sheet -->
+    <link rel="stylesheet" href="style.css" />
+  </head>
+
+  <body>
+    <h1>This is an Icestudio Plugin Sample</h1>
+    <img src="img/icestudio-logo.png" />
+    <img src="img/fpgawars-logo.png" />
+
+    <script>
+      function callbackTest() {
+        console.log('Test from callback generated in ' + pluginID);
+      }
+
+      function onIcestudioPluginLoaded() {
         console.log('Plugin loaded');
-        iceStudio.bus.events.subscribe('callbackTest',callbackTest);
-    }
-
-    function onClose(){
-      alert('Bye!')
-    }
-
-    function onLoad(){
-      alert('Inicializando');
-
-    }
-  </script>
-</body>
-
+        iceStudio.bus.events.subscribe('callbackTest', callbackTest);
+      }
+
+      function onClose() {
+        alert('Bye!');
+      }
+
+      function onLoad() {
+        alert('Inicializando');
+      }
+    </script>
+  </body>
 </html>
diff --git a/app/resources/plugins/example-plugin/manifest.json b/app/resources/plugins/example-plugin/manifest.json
index a8a503927..d2630f1be 100644
--- a/app/resources/plugins/example-plugin/manifest.json
+++ b/app/resources/plugins/example-plugin/manifest.json
@@ -1,7 +1,7 @@
 {
-    "manifest_ver": "1.0",
-    "id": "example-plugin",
-    "name": "Plugin example",
-    "icon": "img/icestudio-logo.png",
-    "launchAtStartup": false
+  "manifest_ver": "1.0",
+  "id": "example-plugin",
+  "name": "Plugin example",
+  "icon": "img/icestudio-logo.png",
+  "launchAtStartup": false
 }
diff --git a/app/resources/plugins/icerok/index.html b/app/resources/plugins/icerok/index.html
index 5cc932938..777486591 100644
--- a/app/resources/plugins/icerok/index.html
+++ b/app/resources/plugins/icerok/index.html
@@ -1,45 +1,55 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
+  <head>
+    <title>IceRok :: Icestudio => Sigrok pulseview</title>
+    <link rel="stylesheet" href="css/loading.min.css" />
+    <link rel="stylesheet" href="css/ldbtn.min.css" />
+    <link rel="stylesheet" href="css/style.css" />
+  </head>
 
-<head>
-  <title>IceRok :: Icestudio => Sigrok pulseview</title>
-  <link rel="stylesheet" href="css/loading.min.css">
-  <link rel="stylesheet" href="css/ldbtn.min.css">
-  <link rel="stylesheet" href="css/style.css">
-</head>
-
-<body>
-  <div id="logo">
-    <img src="assets/icon.svg" />
-  </div>
+  <body>
+    <div id="logo">
+      <img src="assets/icon.svg" />
+    </div>
 
-  <div id="text-connections">
-    <p>1) Install <a class="external-link" href="https://sigrok.org/wiki/Downloads">Pulseview</a> (if you don’t have installed).</p>
-    <p>2) Download probes from <a  class="external-link" href="https://github.com/FPGAwars/iceRok">icerok</a> and import as block in yout design.</p>
-    <p>3) Enjoy!</p>
-  </div>
-  <div id="connections">
-    <div id="connections-serial">
-      <p>Select your serial device:</p>
-      <select id="serial-devices" class="select-lg"></select>
-      <div id="serial-connect" class="btn ld-ext-right"><span id="serial-connect-label">Start Capture</span>
-        <div class="ld ld-ring ld-spin" style="color:#fff"></div>
+    <div id="text-connections">
+      <p>
+        1) Install
+        <a class="external-link" href="https://sigrok.org/wiki/Downloads"
+          >Pulseview</a
+        >
+        (if you don’t have installed).
+      </p>
+      <p>
+        2) Download probes from
+        <a class="external-link" href="https://github.com/FPGAwars/iceRok"
+          >icerok</a
+        >
+        and import as block in yout design.
+      </p>
+      <p>3) Enjoy!</p>
+    </div>
+    <div id="connections">
+      <div id="connections-serial">
+        <p>Select your serial device:</p>
+        <select id="serial-devices" class="select-lg"></select>
+        <div id="serial-connect" class="btn ld-ext-right">
+          <span id="serial-connect-label">Start Capture</span>
+          <div class="ld ld-ring ld-spin" style="color: #fff"></div>
+        </div>
       </div>
     </div>
+    <div id="logo-community">
+      <img src="assets/fpgawars.png" />
+    </div>
 
-  </div>
-  <div id="logo-community">
-    <img src="assets/fpgawars.png" />
-  </div>
-
-  <div id="event-bus"></div>
-
-  <script src="js/vendor/sweetalert2.min.js"></script>
-  <script src="js/vendor/chrome/tcp-server.js"></script>
-  <script src="js/likeJQueryButFast.js"></script>
-  <script src="js/SerialManager.js"></script>
-  <script src="js/iceRok.js"></script>
-  <script src="js/index.js"></script>
-</body>
+    <div id="event-bus"></div>
 
+    <script src="js/vendor/sweetalert2.min.js"></script>
+    <script src="js/vendor/chrome/tcp-server.js"></script>
+    <script src="js/likeJQueryButFast.js"></script>
+    <script src="js/SerialManager.js"></script>
+    <script src="js/iceRok.js"></script>
+    <script src="js/index.js"></script>
+  </body>
 </html>
diff --git a/app/resources/plugins/icerok/manifest.json b/app/resources/plugins/icerok/manifest.json
index eabdc54ed..e367d9934 100644
--- a/app/resources/plugins/icerok/manifest.json
+++ b/app/resources/plugins/icerok/manifest.json
@@ -1,8 +1,8 @@
 {
-    "manifest_ver": "1.0",
-    "id": "icerok",
-    "name": "IceRok",
-    "icon": "assets/icon.svg",
-    "width": 840,
-    "height": 375
+  "manifest_ver": "1.0",
+  "id": "icerok",
+  "name": "IceRok",
+  "icon": "assets/icon.svg",
+  "width": 840,
+  "height": 375
 }
diff --git a/app/resources/plugins/launchBar/launchBar.js b/app/resources/plugins/launchBar/launchBar.js
index 8adbb7d96..83983e034 100644
--- a/app/resources/plugins/launchBar/launchBar.js
+++ b/app/resources/plugins/launchBar/launchBar.js
@@ -1,7 +1,5 @@
-
 registerEvents();
 
 //Getting environment config
-iceStudio.bus.events.publish('pluginManager.getEnvironment'); 
-iceStudio.bus.events.publish('pluginManager.getPluginList'); 
-
+iceStudio.bus.events.publish('pluginManager.getEnvironment');
+iceStudio.bus.events.publish('pluginManager.getPluginList');
diff --git a/app/resources/plugins/launchBar/mainBar.html b/app/resources/plugins/launchBar/mainBar.html
index 587d053eb..052359ed6 100644
--- a/app/resources/plugins/launchBar/mainBar.html
+++ b/app/resources/plugins/launchBar/mainBar.html
@@ -1 +1 @@
-<div id="launchbar-wrapper"></div><!--/END id="launchar"-->
\ No newline at end of file
+<div id="launchbar-wrapper"></div>
diff --git a/app/resources/plugins/launchBar/manifest.json b/app/resources/plugins/launchBar/manifest.json
index 5300efff2..35d3b5c3c 100644
--- a/app/resources/plugins/launchBar/manifest.json
+++ b/app/resources/plugins/launchBar/manifest.json
@@ -1,16 +1,16 @@
 {
-    "manifest_ver": "1.0",
-    "id":"launchBar",
-    "name": "Launch bar for plugins",
-    "icon": "img/icestudio-logo.png",
-    "launchAtStartup":true,
-    "gui":{
-        "type":"embedded",
-        "layout":["mainBar.html"],
-        "style":["css/style.css"],
-        "styleHost":["css/host.css"],
-        "scripts":["js/render.js","js/events.js","launchBar.js"],
-        "views":["views/plugin-list.html"]
-    },
-    "capability":["core"]
-}
\ No newline at end of file
+  "manifest_ver": "1.0",
+  "id": "launchBar",
+  "name": "Launch bar for plugins",
+  "icon": "img/icestudio-logo.png",
+  "launchAtStartup": true,
+  "gui": {
+    "type": "embedded",
+    "layout": ["mainBar.html"],
+    "style": ["css/style.css"],
+    "styleHost": ["css/host.css"],
+    "scripts": ["js/render.js", "js/events.js", "launchBar.js"],
+    "views": ["views/plugin-list.html"]
+  },
+  "capability": ["core"]
+}
diff --git a/app/resources/plugins/launchBar/views/plugin-list.html b/app/resources/plugins/launchBar/views/plugin-list.html
index 9bbfebba3..85aa5fe3c 100644
--- a/app/resources/plugins/launchBar/views/plugin-list.html
+++ b/app/resources/plugins/launchBar/views/plugin-list.html
@@ -1,3 +1,5 @@
 {{#pluginList}}
-    <div class="launcher" data-pluginid="{{id}}" title="{{{name}}}"><img class="launcher-icon" src="{{icon}}" alt="{{{name}}}"></div>
-{{/pluginList}}
\ No newline at end of file
+<div class="launcher" data-pluginid="{{id}}" title="{{{name}}}">
+  <img class="launcher-icon" src="{{icon}}" alt="{{{name}}}" />
+</div>
+{{/pluginList}}
diff --git a/app/resources/viewers/markdown/js/readme.js b/app/resources/viewers/markdown/js/readme.js
index e81474ae5..1c823e9ed 100644
--- a/app/resources/viewers/markdown/js/readme.js
+++ b/app/resources/viewers/markdown/js/readme.js
@@ -5,32 +5,37 @@ const openurl = require('openurl');
 const fs = require('fs');
 
 function getURLParameter(name) {
-    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+  return (
+    decodeURIComponent(
+      (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(
+        location.search
+      ) || [null, ''])[1].replace(/\+/g, '%20')
+    ) || null
+  );
 }
 
 var renderer = new marked.Renderer();
 renderer.link = function (href, title, text) {
-    var out = '<a href="javascript:void(0);"';
-    if (title) {
+  var out = '<a href="javascript:void(0);"';
+  if (title) {
     out += ' title="' + title + '"';
-    }
-    out += ' onclick="openurl.open(\'' + href + '\')"';
-    out += '>' + text + '</a>';
-    return out;
+  }
+  out += ' onclick="openurl.open(\'' + href + '\')"';
+  out += '>' + text + '</a>';
+  return out;
 };
 
-window.onload = function() {
-    
-    const options = { renderer: renderer };
+window.onload = function () {
+  const options = { renderer: renderer };
 
-    //-- Get the readme filename
-    const readme_filename = getURLParameter('readme');
-    
-    //-- Read the readme file
-    const text = fs.readFileSync(readme_filename,'utf8'); 
+  //-- Get the readme filename
+  const readme_filename = getURLParameter('readme');
 
-    //-- Render de markdown file
-    if (text) {
-      document.getElementById('content').innerHTML = marked(text, options);
-    }
+  //-- Read the readme file
+  const text = fs.readFileSync(readme_filename, 'utf8');
+
+  //-- Render de markdown file
+  if (text) {
+    document.getElementById('content').innerHTML = marked(text, options);
+  }
 };
diff --git a/app/resources/viewers/markdown/readme.html b/app/resources/viewers/markdown/readme.html
index 05bf3ad07..9bef35acf 100644
--- a/app/resources/viewers/markdown/readme.html
+++ b/app/resources/viewers/markdown/readme.html
@@ -1,24 +1,20 @@
-<!DOCTYPE html>
+<!doctype html>
 
 <html lang="en">
-
   <head>
-    <meta charset="utf-8"/>
-    <link rel="stylesheet" href="css/github-markdown.css">
-    <link rel="stylesheet" href="css/readme.css">
+    <meta charset="utf-8" />
+    <link rel="stylesheet" href="css/github-markdown.css" />
+    <link rel="stylesheet" href="css/readme.css" />
     <script src="js/readme.js"></script>
   </head>
 
   <body>
     <article class="markdown-body">
-
       <!-- The markdown is displayed on this div block  
            If there are no errors                       -->
       <div id="content">
         <b>Sorry, README.md file does not exist</b>
       </div>
-
     </article>
   </body>
-
 </html>
diff --git a/app/resources/viewers/plain/output.html b/app/resources/viewers/plain/output.html
index badbc2628..8423629a8 100644
--- a/app/resources/viewers/plain/output.html
+++ b/app/resources/viewers/plain/output.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <style type="text/css">
@@ -12,10 +12,15 @@
         top: 0;
         left: 0;
         resize: none;
-        color: #FFF;
+        color: #fff;
         background-color: #222;
         font-size: 14px;
-      	font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace;
+        font-family:
+          Courier New,
+          Courier,
+          Lucida Sans Typewriter,
+          Lucida Typewriter,
+          monospace;
         box-sizing: border-box;
       }
     </style>
@@ -25,9 +30,15 @@
     <script>
       'use strict';
       function getURLParameter(name) {
-        return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+        return (
+          decodeURIComponent(
+            (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(
+              location.search
+            ) || [null, ''])[1].replace(/\+/g, '%20')
+          ) || null
+        );
       }
-      window.onload = function() {
+      window.onload = function () {
         var content = getURLParameter('content');
         document.getElementById('content').value = content;
       };
diff --git a/app/resources/viewers/plain/pcf.html b/app/resources/viewers/plain/pcf.html
index 8eed3c5ec..30c65652e 100644
--- a/app/resources/viewers/plain/pcf.html
+++ b/app/resources/viewers/plain/pcf.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <style type="text/css">
@@ -13,7 +13,12 @@
         left: 0;
         resize: none;
         font-size: 14px;
-      	font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace;
+        font-family:
+          Courier New,
+          Courier,
+          Lucida Sans Typewriter,
+          Lucida Typewriter,
+          monospace;
         box-sizing: border-box;
       }
     </style>
@@ -26,9 +31,15 @@
     <script>
       'use strict';
       function getURLParameter(name) {
-        return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+        return (
+          decodeURIComponent(
+            (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(
+              location.search
+            ) || [null, ''])[1].replace(/\+/g, '%20')
+          ) || null
+        );
       }
-      window.onload = function() {
+      window.onload = function () {
         var board = getURLParameter('board');
         var data = '../../boards/' + board + '/pinout.pcf';
         var xmlhttp = new XMLHttpRequest();
@@ -37,8 +48,7 @@
         var text = xmlhttp.responseText;
         if (text) {
           document.getElementById('pcf').value = text;
-        }
-        else {
+        } else {
           document.getElementById('pcf').style.visibility = 'hidden';
         }
       };
diff --git a/app/resources/viewers/svg/pinout.html b/app/resources/viewers/svg/pinout.html
index d273cdccd..8ef8b4efa 100644
--- a/app/resources/viewers/svg/pinout.html
+++ b/app/resources/viewers/svg/pinout.html
@@ -1,16 +1,24 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <script src="lib/svg-pan-zoom.js"></script>
     <style type="text/css">
-      body { overflow:hidden; }
+      body {
+        overflow: hidden;
+      }
     </style>
   </head>
   <body>
     <script>
       'use strict';
       function getURLParameter(name) {
-        return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+        return (
+          decodeURIComponent(
+            (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(
+              location.search
+            ) || [null, ''])[1].replace(/\+/g, '%20')
+          ) || null
+        );
       }
       function loadEmbedSVG() {
         var board = getURLParameter('board');
@@ -22,15 +30,15 @@
         embed.setAttribute('type', 'image/svg+xml');
         embed.setAttribute('src', data);
         document.body.appendChild(embed);
-        setTimeout(function() {
+        setTimeout(function () {
           svgPanZoom('#pinout', {
             controlIconsEnabled: true,
             minZoom: 1,
-            maxZoom: 5
+            maxZoom: 5,
           });
         }, 300);
       }
-      window.onload = function() {
+      window.onload = function () {
         loadEmbedSVG();
       };
     </script>
diff --git a/app/resources/viewers/system/js/system.js b/app/resources/viewers/system/js/system.js
index 4933af101..e909341b8 100644
--- a/app/resources/viewers/system/js/system.js
+++ b/app/resources/viewers/system/js/system.js
@@ -1,70 +1,71 @@
 function getURLParameter(name) {
-    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+  return (
+    decodeURIComponent(
+      (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(
+        location.search
+      ) || [null, ''])[1].replace(/\+/g, '%20')
+    ) || null
+  );
 }
 
-window.onload = function() {
-    
-    console.log("System info window opened");
+window.onload = function () {
+  console.log('System info window opened');
 
-    //-- Get the parameters
-    const version = getURLParameter('version');
-    const base_dir = getURLParameter('base_dir');
-    const icestudio_dir = getURLParameter('icestudio_dir');
-    const profile_path = getURLParameter('profile_path');
-    const apio_home_dir = getURLParameter('apio_home_dir');
-    const env_dir = getURLParameter('env_dir');
-    const env_bin_dir = getURLParameter('env_bin_dir');
-    const env_pip = getURLParameter('env_pip');
-    const apio_cmd = getURLParameter('apio_cmd');
-    const app = getURLParameter('app');
-    const app_dir = getURLParameter('app_dir');
-    
-    
-    //-- Get the HTML elements for displaying the info
-    const disp_version = document.getElementById('disp_version');
-    const disp_arch = document.getElementById('disp_arch');
-    const disp_platform = document.getElementById('disp_platform');
+  //-- Get the parameters
+  const version = getURLParameter('version');
+  const base_dir = getURLParameter('base_dir');
+  const icestudio_dir = getURLParameter('icestudio_dir');
+  const profile_path = getURLParameter('profile_path');
+  const apio_home_dir = getURLParameter('apio_home_dir');
+  const env_dir = getURLParameter('env_dir');
+  const env_bin_dir = getURLParameter('env_bin_dir');
+  const env_pip = getURLParameter('env_pip');
+  const apio_cmd = getURLParameter('apio_cmd');
+  const app = getURLParameter('app');
+  const app_dir = getURLParameter('app_dir');
 
-    const disp_base_dir = document.getElementById('disp_base_dir');
-    const disp_icestudio_dir = document.getElementById('disp_icestudio_dir');
-    const disp_profile_path = document.getElementById('disp_profile_path');
-    const disp_apio_home_dir = document.getElementById('disp_apio_home_dir');
-    const disp_env_dir = document.getElementById('disp_env_dir');
-    const disp_env_bin_dir = document.getElementById('disp_env_bin_dir');
-    const disp_env_pip = document.getElementById('disp_env_pip');
-    const disp_apio_cmd = document.getElementById('disp_apio_cmd');
-    const disp_app = document.getElementById('disp_app');
-    const disp_app_dir = document.getElementById('disp_app_dir');
+  //-- Get the HTML elements for displaying the info
+  const disp_version = document.getElementById('disp_version');
+  const disp_arch = document.getElementById('disp_arch');
+  const disp_platform = document.getElementById('disp_platform');
 
+  const disp_base_dir = document.getElementById('disp_base_dir');
+  const disp_icestudio_dir = document.getElementById('disp_icestudio_dir');
+  const disp_profile_path = document.getElementById('disp_profile_path');
+  const disp_apio_home_dir = document.getElementById('disp_apio_home_dir');
+  const disp_env_dir = document.getElementById('disp_env_dir');
+  const disp_env_bin_dir = document.getElementById('disp_env_bin_dir');
+  const disp_env_pip = document.getElementById('disp_env_pip');
+  const disp_apio_cmd = document.getElementById('disp_apio_cmd');
+  const disp_app = document.getElementById('disp_app');
+  const disp_app_dir = document.getElementById('disp_app_dir');
 
-    //-- Display the information
-    disp_version.innerHTML += version;
-    disp_arch.innerHTML += process.arch;
-    disp_platform.innerHTML += process.platform;
+  //-- Display the information
+  disp_version.innerHTML += version;
+  disp_arch.innerHTML += process.arch;
+  disp_platform.innerHTML += process.platform;
 
-    disp_base_dir.innerHTML += base_dir;
-    disp_icestudio_dir.innerHTML += icestudio_dir;
-    disp_profile_path.innerHTML += profile_path;
-    disp_apio_home_dir.innerHTML += apio_home_dir;
-    disp_env_dir.innerHTML += env_dir;
-    disp_env_bin_dir.innerHTML += env_bin_dir;
-    disp_env_pip.innerHTML += env_pip;
-    disp_apio_cmd.innerHTML += apio_cmd;
-    disp_app.innerHTML += app;
-    disp_app_dir.innerHTML += app_dir;
-   
-    
-    //-- Debug
-    console.log("Version: " + version + "---");
-    console.log("BASE_DIR: " + base_dir + "---");
-    console.log("ICESTUDIO_DIR: " + icestudio_dir + "---");
-    console.log("PROFILE_PATH: " + profile_path + "---");
-    console.log("APIO_HOME_DIR: " + apio_home_dir + "---");
-    console.log("ENV_DIR: " + env_dir + "---");
-    console.log("ENV_BIN_DIR: " + env_bin_dir + "---");
-    console.log("ENV_PIP: " + env_pip + "---");
-    console.log("APIO_CMD: " + apio_cmd + "---");
-    console.log("APP: " + app + "---");
-    console.log("APP_DIR: " + app_dir + "---");
-};
+  disp_base_dir.innerHTML += base_dir;
+  disp_icestudio_dir.innerHTML += icestudio_dir;
+  disp_profile_path.innerHTML += profile_path;
+  disp_apio_home_dir.innerHTML += apio_home_dir;
+  disp_env_dir.innerHTML += env_dir;
+  disp_env_bin_dir.innerHTML += env_bin_dir;
+  disp_env_pip.innerHTML += env_pip;
+  disp_apio_cmd.innerHTML += apio_cmd;
+  disp_app.innerHTML += app;
+  disp_app_dir.innerHTML += app_dir;
 
+  //-- Debug
+  console.log('Version: ' + version + '---');
+  console.log('BASE_DIR: ' + base_dir + '---');
+  console.log('ICESTUDIO_DIR: ' + icestudio_dir + '---');
+  console.log('PROFILE_PATH: ' + profile_path + '---');
+  console.log('APIO_HOME_DIR: ' + apio_home_dir + '---');
+  console.log('ENV_DIR: ' + env_dir + '---');
+  console.log('ENV_BIN_DIR: ' + env_bin_dir + '---');
+  console.log('ENV_PIP: ' + env_pip + '---');
+  console.log('APIO_CMD: ' + apio_cmd + '---');
+  console.log('APP: ' + app + '---');
+  console.log('APP_DIR: ' + app_dir + '---');
+};
diff --git a/app/resources/viewers/system/system.html b/app/resources/viewers/system/system.html
index 0ebca12fb..db62d0ebd 100644
--- a/app/resources/viewers/system/system.html
+++ b/app/resources/viewers/system/system.html
@@ -1,33 +1,32 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="css/style.css">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="css/style.css" />
     <script src="js/system.js" defer></script>
-</head>
-<body>
+  </head>
+  <body>
     <h3>Icestudio version: <span id="disp_version"></span></h3>
     <h3>Computer:</h3>
     <ul>
-        <li>Architecture: <span id="disp_arch"></span> </li>
-        <li>Platform: <span id="disp_platform"></span></li>
+      <li>Architecture: <span id="disp_arch"></span></li>
+      <li>Platform: <span id="disp_platform"></span></li>
     </ul>
 
     <h3>PATHs:</h3>
     <ul>
-        <li>BASE_DIR: <span id="disp_base_dir"></span></li>
-        <li>ICESTUDIO_DIR: <span id="disp_icestudio_dir"></span></li>
-        <li>PROFILE_PATH: <span id="disp_profile_path"></span></li>
-        <li>APIO_HOME_DIR: <span id="disp_apio_home_dir"></span></li>
-        <li>ENV_DIR: <span id="disp_env_dir"></span></li>
-        <li>ENV_BIN_DIR: <span id="disp_env_bin_dir"></span></li>
-        <li>ENV_PIP: <span id="disp_env_pip"></span></li>
-        <li>APIO_CMD: <span id="disp_apio_cmd"></span></li>
-        <li>APP: <span id="disp_app"></span></li>
-        <li>APP_DIR: <span id="disp_app_dir"></span></li>
+      <li>BASE_DIR: <span id="disp_base_dir"></span></li>
+      <li>ICESTUDIO_DIR: <span id="disp_icestudio_dir"></span></li>
+      <li>PROFILE_PATH: <span id="disp_profile_path"></span></li>
+      <li>APIO_HOME_DIR: <span id="disp_apio_home_dir"></span></li>
+      <li>ENV_DIR: <span id="disp_env_dir"></span></li>
+      <li>ENV_BIN_DIR: <span id="disp_env_bin_dir"></span></li>
+      <li>ENV_PIP: <span id="disp_env_pip"></span></li>
+      <li>APIO_CMD: <span id="disp_apio_cmd"></span></li>
+      <li>APP: <span id="disp_app"></span></li>
+      <li>APP_DIR: <span id="disp_app_dir"></span></li>
     </ul>
-
-</body>
+  </body>
 </html>
diff --git a/app/resources/viewers/table/rules.html b/app/resources/viewers/table/rules.html
index b042f1183..e98091845 100644
--- a/app/resources/viewers/table/rules.html
+++ b/app/resources/viewers/table/rules.html
@@ -1,18 +1,23 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <style type="text/css">
       body {
-        overflow:hidden;
+        overflow: hidden;
       }
       #rules {
         width: 100%;
         height: 100%;
         position: absolute;
         margin: 20px;
-        resize:none;
+        resize: none;
         font-size: 14px;
-        font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace;
+        font-family:
+          Courier New,
+          Courier,
+          Lucida Sans Typewriter,
+          Lucida Typewriter,
+          monospace;
       }
     </style>
   </head>
@@ -21,31 +26,47 @@
     <script>
       'use strict';
       function getURLParameter(name) {
-        return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+        return (
+          decodeURIComponent(
+            (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(
+              location.search
+            ) || [null, ''])[1].replace(/\+/g, '%20')
+          ) || null
+        );
       }
-      window.onload = function() {
-        var rules =  decodeURIComponent(getURLParameter('rules'));
-        
+      window.onload = function () {
+        var rules = decodeURIComponent(getURLParameter('rules'));
+
         rules = JSON.parse(rules);
-        var i, text = '';
+        var i,
+          text = '';
         text += '<h3>Input rules</h3>\n';
         text += '<ul>\n';
         for (i in rules.input) {
           var input = rules.input[i];
-          text += '<li>Input <b>' + input.port + '</b> ports &rarr; FPGA pin <b>' + input.pin + '</b></li>\n';
+          text +=
+            '<li>Input <b>' +
+            input.port +
+            '</b> ports &rarr; FPGA pin <b>' +
+            input.pin +
+            '</b></li>\n';
         }
         text += '</ul>\n';
         text += '<h3>Output rules</h3>\n';
         text += '<ul>\n';
         for (i in rules.output) {
           var output = rules.output[i];
-          text += '<li>FPGA pin <b>' + output.pin + '</b> &rarr; value <b>' + output.bit + '</b></li>\n';
+          text +=
+            '<li>FPGA pin <b>' +
+            output.pin +
+            '</b> &rarr; value <b>' +
+            output.bit +
+            '</b></li>\n';
         }
         text += '</ul>\n';
         if (text) {
           document.getElementById('rules').innerHTML = text;
-        }
-        else {
+        } else {
           document.getElementById('rules').style.visibility = 'hidden';
         }
       };
diff --git a/app/scripts/services/collections.js b/app/scripts/services/collections.js
index a215c1c79..64f29537b 100644
--- a/app/scripts/services/collections.js
+++ b/app/scripts/services/collections.js
@@ -2,14 +2,16 @@
 'use strict';
 /*jshint unused:false*/
 
-angular.module('icestudio')
-  .service('collections', function (utils,
-    common,
-    profile,
-    gettextCatalog,
-    nodePath,
-    $exceptionHandler) {
-    
+angular
+  .module('icestudio')
+  .service(
+    'collections',
+    function (
+      common,
+      profile,
+      gettextCatalog,
+      $exceptionHandler
+    ) {
 
      let iceColl= new IceCollection({
       location :{ default: common.DEFAULT_COLLECTION_DIR,
diff --git a/app/scripts/services/compiler.js b/app/scripts/services/compiler.js
index f1095540b..026d6937d 100644
--- a/app/scripts/services/compiler.js
+++ b/app/scripts/services/compiler.js
@@ -2,14 +2,10 @@
 
 'use strict';
 
-angular.module('icestudio')
-  .service('compiler', function (common,
-    utils,
-    blocks,
-    nodeSha1,
-    _package) {
-
-    let  currentLibrary=false;
+angular
+  .module('icestudio')
+  .service('compiler', function (common, utils, blocks, _package) {
+    let currentLibrary = false;
     this.generate = function (target, project, opt) {
       var content = '';
       var files = [];
diff --git a/app/scripts/services/drivers.js b/app/scripts/services/drivers.js
index 3b7840d84..544c7b1b3 100644
--- a/app/scripts/services/drivers.js
+++ b/app/scripts/services/drivers.js
@@ -1,16 +1,5 @@
 'use strict';
 
-angular.module('icestudio')
-  .service('drivers', function (gettextCatalog,
-    profile,
-    common,
-    gui,
-    utils,
-    nodePath,
-    nodeSudo,
-    nodeChildProcess,
-    $rootScope) {
-
     //--------------------------------------
     //-- Enable de Drivers
     //--
@@ -34,6 +23,20 @@ angular.module('icestudio')
           console.warn('No valid selected board interface');
       }
     };
+angular
+  .module('icestudio')
+  .service(
+    'drivers',
+    function (
+      gettextCatalog,
+      profile,
+      common,
+      gui,
+      utils,
+      nodeSudo,
+      nodeChildProcess,
+      $rootScope
+    ) {
 
 
     //----------------------------------------------
diff --git a/app/scripts/services/utils.js b/app/scripts/services/utils.js
index 7d0f9dd65..1bc14b2d8 100644
--- a/app/scripts/services/utils.js
+++ b/app/scripts/services/utils.js
@@ -6,7 +6,6 @@ angular.module('icestudio')
     common,
     blocks,
     _package,
-    window,
     nodeFs,
     nodeFse,
     nodePath,
diff --git a/app/views/advanced.html b/app/views/advanced.html
index 130ed4f5d..34855b74f 100644
--- a/app/views/advanced.html
+++ b/app/views/advanced.html
@@ -7,15 +7,17 @@
 
 <!-- To include more features, you should edit this file -->
 
-<!DOCTYPE html>
+<!doctype html>
 
 <li>
   <!-- Edit/Preferences/Advanced features/Board rules -->
   <a href ng-click="toggleBoardRules()">
     {{ 'Board rules' | translate }}&ensp;
 
-    <span ng-show="profile.data.boardRules" 
-          class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.boardRules"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 
@@ -24,21 +26,23 @@
   <a href ng-click="toggleInoutPorts()">
     {{ 'Allow tri-state connections' | translate }}&ensp;
 
-    <span ng-show="profile.data.allowInoutPorts"
-          class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.allowInoutPorts"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 
 <!-- Edit/Preferences/Advanced features/External plugins -->
 <li>
   <a href ng-click="setExternalPlugins()">
-      {{ 'External plugins' | translate }}</a>
+    {{ 'External plugins' | translate }}</a
+  >
 </li>
 
 <!-- Edit/Preferences/Advanced features/Python environment -->
 <li>
-  <a href ng-click="setPythonEnv()">
-      {{ 'Python environment' | translate }}</a>
+  <a href ng-click="setPythonEnv()"> {{ 'Python environment' | translate }}</a>
 </li>
 
 <!-- Edit/Preferences/Advanced features/Remote hostname -->
@@ -46,7 +50,9 @@
   <a href ng-click="setRemoteHostname()">
     {{ 'Remote hostname' | translate }}&ensp;
 
-    <span ng-show="profile.data.remoteHostname" 
-          class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.remoteHostname"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
diff --git a/app/views/languages.html b/app/views/languages.html
index ae0b44d4c..89241f4ac 100644
--- a/app/views/languages.html
+++ b/app/views/languages.html
@@ -8,112 +8,166 @@
 
 <!-- If you want to include new languages, you should edit this file -->
 
-<!DOCTYPE html>
+<!doctype html>
 <li>
   <a href ng-click="selectLanguage('en')">
     {{ 'English' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'en'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'en'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('es_ES')">
     {{ 'Spanish' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'es_ES'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'es_ES'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('fr_FR')">
     {{ 'French' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'fr_FR'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'fr_FR'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('it_IT')">
     {{ 'Italian' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'it_IT'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'it_IT'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('de_DE')">
     {{ 'German' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'de_DE'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'de_DE'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('nl_NL')">
     {{ 'Dutch' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'nl_NL'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'nl_NL'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('el_GR')">
     {{ 'Greek' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'el_GR'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'el_GR'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('tr_TR')">
     {{ 'Turkish' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'tr_TR'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'tr_TR'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('cs_CZ')">
     {{ 'Czech' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'cs_CZ'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'cs_CZ'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('uk_UA')">
     {{ 'Ukrainian' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'uk_UA'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'uk_UA'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('ru_RU')">
     {{ 'Russian' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'ru_RU'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'ru_RU'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('gl_ES')">
     {{ 'Galician' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'gl_ES'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'gl_ES'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('eu_ES')">
     {{ 'Basque' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'eu_ES'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'eu_ES'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('ca_ES')">
     {{ 'Catalonian' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'ca_ES'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'ca_ES'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('zh_CN')">
     {{ 'Chinese' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'zh_CN'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'zh_CN'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('zh_TW')">
     {{ 'Taiwanese' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'zh_TW'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'zh_TW'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('ko_KR')">
     {{ 'Korean' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'ko_KR'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'ko_KR'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 <li>
   <a href ng-click="selectLanguage('ja_JP')">
     {{ 'Japanese' | translate }}&ensp;
-    <span ng-show="profile.data.language == 'ja_JP'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.language == 'ja_JP'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
diff --git a/app/views/menu.html b/app/views/menu.html
index f47f72f6f..ba2584c88 100644
--- a/app/views/menu.html
+++ b/app/views/menu.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 
 <!-- ICESTUDIO MENU. Located at the top bar -->
 
@@ -14,82 +14,130 @@
 -->
 
 <div ng-controller="MenuCtrl">
-
-  <div id="menu" 
-       ondragstart="{return false;}"
-       ondrop="{return false;}">
-
+  <div id="menu" ondragstart="{return false;}" ondrop="{return false;}">
     <!-- File selector for loading .ice files in Icestudio -->
     <!-- It is normally hidden.                            -->
-    <input id="input-open-project" type="file" accept=".ice" class="hidden"/>
-
-
-    <input id="input-save-project" type="file" accept=".ice" class="hidden" 
-           nwworkingdir="{{workingdir}}" nwsaveas="{{project.name}}.ice"/>
-   
-    <input id="input-add-as-block" type="file" 
-           accept=".ice,.iceb" 
-           class="hidden" multiple/>
-
-    <input id="input-export-verilog" type="file" accept=".v" class="hidden"
-           nwworkingdir="{{workingdir}}" nwsaveas="{{ project.name }}.v"/>
-    <input id="input-export-pcf" type="file" accept=".pcf" class="hidden"  
-           nwworkingdir="{{workingdir}}" nwsaveas="{{ project.name }}.pcf"/>
-    <input id="input-export-testbench" type="file" accept=".v" class="hidden"  
-           nwworkingdir="{{workingdir}}" nwsaveas="{{ project.name }}_tb.v"/>
-    <input id="input-export-gtkwave" type="file" accept=".gtkw" 
-           class="hidden"  
-           nwworkingdir="{{workingdir}}" 
-           nwsaveas="{{ project.name }}_tb.gtkw"/>
-    <input id="input-export-blif" type="file" accept=".blif" class="hidden"  
-           nwworkingdir="{{workingdir}}" nwsaveas="{{ project.name }}.blif"/>
-    <input id="input-export-asc" type="file" accept=".asc" class="hidden"
-           nwworkingdir="{{workingdir}}" nwsaveas="{{ project.name }}.asc"/>
-    <input id="input-export-bin" type="file" accept=".bin" class="hidden"  
-           nwworkingdir="{{workingdir}}" nwsaveas="{{ project.name }}.bin"/>
-
-    <input id="input-add-collection" type="file" accept=".zip" 
-           class="hidden" multiple/>
-          
-    <input id="input-import-verilog" type="file" accept=".v" class="hidden"/>
+    <input id="input-open-project" type="file" accept=".ice" class="hidden" />
+
+    <input
+      id="input-save-project"
+      type="file"
+      accept=".ice"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{project.name}}.ice"
+    />
+
+    <input
+      id="input-add-as-block"
+      type="file"
+      accept=".ice,.iceb"
+      class="hidden"
+      multiple
+    />
+
+    <input
+      id="input-export-verilog"
+      type="file"
+      accept=".v"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}.v"
+    />
+    <input
+      id="input-export-pcf"
+      type="file"
+      accept=".pcf"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}.pcf"
+    />
+    <input
+      id="input-export-testbench"
+      type="file"
+      accept=".v"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}_tb.v"
+    />
+    <input
+      id="input-export-gtkwave"
+      type="file"
+      accept=".gtkw"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}_tb.gtkw"
+    />
+    <input
+      id="input-export-blif"
+      type="file"
+      accept=".blif"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}.blif"
+    />
+    <input
+      id="input-export-asc"
+      type="file"
+      accept=".asc"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}.asc"
+    />
+    <input
+      id="input-export-bin"
+      type="file"
+      accept=".bin"
+      class="hidden"
+      nwworkingdir="{{workingdir}}"
+      nwsaveas="{{ project.name }}.bin"
+    />
+
+    <input
+      id="input-add-collection"
+      type="file"
+      accept=".zip"
+      class="hidden"
+      multiple
+    />
+
+    <input id="input-import-verilog" type="file" accept=".v" class="hidden" />
 
     <!-- Top navigation bar -->
-    <nav class="navbar navbar-default navbar-static-top ice-bar" 
-         role="navigation">
-
+    <nav
+      class="navbar navbar-default navbar-static-top ice-bar"
+      role="navigation"
+    >
       <div class="collapse navbar-collapse">
-
         <!-- Menus on the left side of the Menu bar: FILE, Edit, View,
              Select, Tools and Help   -->
         <ul class="nav navbar-nav">
-
-
           <!-- FILE Menu -->
-          <li uib-dropdown ng-mouseover="showMenu('file')" 
-              ng-mouseleave="hideMenu('file')"
-              ng-click="fixMenu('file')" 
-              is-open="status.file">
-
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('file')"
+            ng-mouseleave="hideMenu('file')"
+            ng-click="fixMenu('file')"
+            is-open="status.file"
+          >
             <!-- Text displayed. Default in English. If available, 
                  the translation to the current language is shown -->
-            <a href uib-dropdown-toggle>{{ 'File' | translate }}
+            <a href uib-dropdown-toggle
+              >{{ 'File' | translate }}
               <span class="caret"></span>
-           </a>
+            </a>
 
             <ul uib-dropdown-menu style="min-width: 230px">
-
               <!-- File/New -->
               <li>
                 <!-- When the button is clicked, the function newProject()
                      is called. It is located in the 
                      app/scripts/controllers/menu.js file-->
                 <a href ng-click="newProject()">
-                    {{ 'New' | translate }}
+                  {{ 'New' | translate }}
 
-                    <!-- Add the shortcut tip to the right -->
-                    <span class="shortcut">
-                      {{ 'newProject' | shortcut }}
-                    </span>
+                  <!-- Add the shortcut tip to the right -->
+                  <span class="shortcut"> {{ 'newProject' | shortcut }} </span>
                 </a>
               </li>
 
@@ -97,19 +145,18 @@
               <li>
                 <a href ng-click="openProjectDialog()">
                   {{ 'Open' | translate }}...
-                  <span class="shortcut">
-                    {{ 'openProject' | shortcut }}
-                  </span>
+                  <span class="shortcut"> {{ 'openProject' | shortcut }} </span>
                 </a>
               </li>
 
               <!-- File/Open Recent Sub-menu -->
-              <li class="dropdown-submenu" 
-                  uib-dropdown>
+              <li class="dropdown-submenu" uib-dropdown>
                 <a href uib-dropdown-toggle>{{ 'Open Recent' | translate }}</a>
                 <ul uib-dropdown-menu>
                   <!-- Dynamic list of recently opened projects -->
-                  <li ng-repeat="project in recentProjects track by project.path">
+                  <li
+                    ng-repeat="project in recentProjects track by project.path"
+                  >
                     <a href ng-click="openProject(project.path)">
                       {{ truncatePath(project.path) }}
                     </a>
@@ -120,8 +167,7 @@
 
                   <!-- Option to clear the recently opened projects -->
                   <li>
-                    <a href 
-                       ng-click="clearRecentProjects()">
+                    <a href ng-click="clearRecentProjects()">
                       {{ 'Clear Recently Opened' | translate }}...
                     </a>
                   </li>
@@ -144,15 +190,17 @@
 
                 <!-- It is a Sub-menu. The examples form the current selected
                      collection are shown -->
-                <menutree data="common.selectedCollection.content.examples"
-                          callback="openProject(path)">
+                <menutree
+                  data="common.selectedCollection.content.examples"
+                  callback="openProject(path)"
+                >
                 </menutree>
               </li>
 
               <!-- File/Add as Block -->
               <li>
                 <a href ng-click="addAsBlock()">
-                   {{ 'Add as block' | translate }}...
+                  {{ 'Add as block' | translate }}...
                 </a>
               </li>
 
@@ -163,9 +211,7 @@
               <li>
                 <a href ng-click="saveProject()">
                   {{ 'Save' | translate }}
-                  <span class="shortcut">
-                    {{ 'saveProject' | shortcut }}
-                 </span>
+                  <span class="shortcut"> {{ 'saveProject' | shortcut }} </span>
                 </a>
               </li>
 
@@ -175,7 +221,8 @@
                   {{ 'Save as' | translate }}...
                   <span class="shortcut">
                     {{ 'saveProjectAs' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
@@ -183,19 +230,19 @@
 
               <!-- File/Export Sub-menu -->
               <li class="dropdown-submenu" uib-dropdown>
-
                 <a href uib-dropdown-toggle>{{ 'Export' | translate }}...</a>
                 <ul uib-dropdown-menu>
                   <li>
                     <a href ng-click="exportVerilog()">
-                      {{ 'Verilog' }} (Obsolete)</a>
+                      {{ 'Verilog' }} (Obsolete)</a
+                    >
                   </li>
                   <li>
                     <a href ng-click="exportPCF()">{{ 'PCF' }} (Obsolete)</a>
                   </li>
                   <li>
                     <a href ng-click="exportTestbench()">
-                        {{ 'Testbench' | translate }}
+                      {{ 'Testbench' | translate }}
                     </a>
                   </li>
                   <li>
@@ -203,16 +250,15 @@
                   </li>
                   <li class="divider"></li>
                   <li>
-                    <a href ng-click="exportBLIF()">
-                      {{ 'BLIF' }} (Obsolete)</a>
+                    <a href ng-click="exportBLIF()"> {{ 'BLIF' }} (Obsolete)</a>
                   </li>
                   <li>
-                    <a href ng-click="exportASC()">
-                       {{ 'ASC' }} (Obsolete)</a>
+                    <a href ng-click="exportASC()"> {{ 'ASC' }} (Obsolete)</a>
                   </li>
                   <li>
                     <a href ng-click="exportBitstream()">
-                       {{ 'Bitstream' }} (Obsolete)</a>
+                      {{ 'Bitstream' }} (Obsolete)</a
+                    >
                   </li>
                 </ul>
               </li>
@@ -224,35 +270,31 @@
               <li>
                 <a href ng-click="quit()">
                   {{ 'Quit' | translate }}
-                  <span class="shortcut">
-                    {{ 'quit' | shortcut }}
-                  </span>
+                  <span class="shortcut"> {{ 'quit' | shortcut }} </span>
                 </a>
               </li>
             </ul>
           </li>
 
           <!-- EDIT Menu -->
-          <li uib-dropdown 
-              ng-mouseover="showMenu('edit')" 
-              ng-mouseleave="hideMenu()" 
-              ng-click="fixMenu('edit')" 
-              is-open="status.edit">
-
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('edit')"
+            ng-mouseleave="hideMenu()"
+            ng-click="fixMenu('edit')"
+            is-open="status.edit"
+          >
             <a href uib-dropdown-toggle>
               {{ 'Edit' | translate }}
               <span class="caret"></span>
             </a>
 
             <ul uib-dropdown-menu style="min-width: 200px">
-
               <!-- Edit/Undo -->
               <li>
                 <a href ng-click="undoGraph()">
                   {{ 'Undo' | translate }}
-                  <span class="shortcut">
-                    {{ 'undoGraph' | shortcut }}
-                  </span>
+                  <span class="shortcut"> {{ 'undoGraph' | shortcut }} </span>
                 </a>
               </li>
 
@@ -262,7 +304,8 @@
                   {{ 'Redo' | translate }}
                   <span class="shortcut">
                     {{ 'redoGraph' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
@@ -274,7 +317,8 @@
                   {{ 'Cut' | translate }}
                   <span class="shortcut">
                     {{ 'cutSelected' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Edit/Copy -->
@@ -283,7 +327,8 @@
                   {{ 'Copy' | translate }}
                   <span class="shortcut">
                     {{ 'copySelected' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Edit/Paste -->
@@ -302,7 +347,8 @@
                   {{ 'Clone' | translate }}
                   <span class="shortcut">
                     {{ 'pasteAndCloneSelected' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Edit/Duplicate -->
@@ -311,7 +357,8 @@
                   {{ 'Duplicate' | translate }}
                   <span class="shortcut">
                     {{ 'duplicateSelected' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Edit/Delete -->
@@ -320,16 +367,15 @@
                   {{ 'Delete' | translate }}
                   <span class="shortcut">
                     {{ 'removeSelected' | shortcut }}
-                  </span></a>
+                  </span></a
+                >
               </li>
 
               <!-- Edit/Select all -->
               <li>
                 <a href ng-click="selectAll()">
                   {{ 'Select all' | translate }}
-                  <span class="shortcut">
-                    {{ 'selectAll' | shortcut }}
-                  </span>
+                  <span class="shortcut"> {{ 'selectAll' | shortcut }} </span>
                 </a>
               </li>
 
@@ -340,9 +386,7 @@
               <li>
                 <a href ng-click="fitContent()">
                   {{ 'Fit content' | translate }}
-                  <span class="shortcut">
-                    {{ 'fitContent' | shortcut }}
-                  </span>
+                  <span class="shortcut"> {{ 'fitContent' | shortcut }} </span>
                 </a>
               </li>
 
@@ -360,31 +404,29 @@
               <li>
                 <a href ng-click="showToolBox()">
                   {{ 'Toolbox' | translate }}
-                  <span class="shortcut">
-                    {{ 'showToolBox' | shortcut }}
-                  </span>
+                  <span class="shortcut"> {{ 'showToolBox' | shortcut }} </span>
                 </a>
               </li>
-<!--------------------------------------------------------------------------->
+              <!--------------------------------------------------------------------------->
 
               <!-- Divisor line between sections of the menu -->
               <li class="divider"></li>
 
               <!-- Edit/Preferences Sub-Menu -->
               <li class="dropdown-submenu" uib-dropdown>
-                <a href uib-dropdown-toggle>
-                   {{ 'Preferences' | translate }}</a>
+                <a href uib-dropdown-toggle> {{ 'Preferences' | translate }}</a>
 
                 <ul uib-dropdown-menu>
-
                   <!-- Edit/Preferences/Language sub-menu -->
                   <li class="dropdown-submenu" uib-dropdown>
                     <a href uib-dropdown-toggle>
-                       {{ 'Language' | translate }}</a>
+                      {{ 'Language' | translate }}</a
+                    >
 
-                    <ul uib-dropdown-menu 
-                        ng-include="'views/languages.html'">
-                    </ul>
+                    <ul
+                      uib-dropdown-menu
+                      ng-include="'views/languages.html'"
+                    ></ul>
                   </li>
 
                   <!-- Divisor line between sections of the menu -->
@@ -393,11 +435,13 @@
                   <!-- Edit/Preferences/UI theme sub-menu -->
                   <li class="dropdown-submenu" uib-dropdown>
                     <a href uib-dropdown-toggle>
-                       {{ 'UI theme' | translate }}
+                      {{ 'UI theme' | translate }}
                     </a>
 
-                    <ul uib-dropdown-menu 
-                        ng-include="'views/uithemes.html'"></ul>
+                    <ul
+                      uib-dropdown-menu
+                      ng-include="'views/uithemes.html'"
+                    ></ul>
                   </li>
 
                   <!-- Divisor line between sections of the menu -->
@@ -406,11 +450,13 @@
                   <!-- Edit/Preferences/Advanced features sub-menu -->
                   <li class="dropdown-submenu" uib-dropdown>
                     <a href uib-dropdown-toggle>
-                       {{ 'Advanced features' | translate }}
+                      {{ 'Advanced features' | translate }}
                     </a>
 
-                    <ul uib-dropdown-menu 
-                        ng-include="'views/advanced.html'"></ul>
+                    <ul
+                      uib-dropdown-menu
+                      ng-include="'views/advanced.html'"
+                    ></ul>
                   </li>
 
                   <!-- Divisor line between sections of the menu -->
@@ -419,47 +465,53 @@
                   <!-- Edit/Preferences/External collections -->
                   <li>
                     <a href ng-click="setExternalCollections()">
-                       {{ 'External collections' | translate }}</a>
+                      {{ 'External collections' | translate }}</a
+                    >
                   </li>
 
                   <!-- Edit/Preferences/Logging enable -->
                   <li>
                     <a href ng-click="toggleLoggingEnabled()">
                       {{ 'Logging enabled' | translate }}&ensp;
-                      <span ng-show="profile.data.loggingEnabled" 
-                            class="glyphicon glyphicon-ok-circle"></span>
+                      <span
+                        ng-show="profile.data.loggingEnabled"
+                        class="glyphicon glyphicon-ok-circle"
+                      ></span>
                     </a>
                   </li>
 
                   <!-- Edit/Preferences/Logging file -->
-                   <li>
+                  <li>
                     <a href ng-click="setLoggingFile()">
-                       {{ 'Logging file' | translate }}</a>
+                      {{ 'Logging file' | translate }}</a
+                    >
                   </li>
-                  
                 </ul>
               </li>
 
               <!-- Edit/Preferences/Project information -->
               <li>
                 <a href ng-click="setProjectInformation()">
-                   {{ 'Project information' | translate }}</a>
+                  {{ 'Project information' | translate }}</a
+                >
               </li>
             </ul>
           </li>
 
           <!-- VIEW Menu -->
-          <li uib-dropdown 
-              ng-mouseover="showMenu('view')" 
-              ng-mouseleave="hideMenu()" 
-              ng-click="fixMenu('view')" 
-              is-open="status.view">
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('view')"
+            ng-mouseleave="hideMenu()"
+            ng-click="fixMenu('view')"
+            is-open="status.view"
+          >
             <a href uib-dropdown-toggle>
-               {{ 'View' | translate }}
-               <span class="caret"></span></a>
+              {{ 'View' | translate }}
+              <span class="caret"></span
+            ></a>
 
             <ul uib-dropdown-menu>
-
               <!-- View/PCF -->
               <li>
                 <a href ng-click="showPCF()">{{ 'PCF' }}</a>
@@ -473,32 +525,37 @@
               <!-- View/Datasheet -->
               <li>
                 <a href ng-click="showDatasheet()">
-                   {{ 'Datasheet' | translate }}</a>
+                  {{ 'Datasheet' | translate }}</a
+                >
               </li>
 
               <!-- View/Board rules -->
               <li>
                 <a href ng-click="showBoardRules()">
-                   {{ 'Board rules' | translate }}</a>
+                  {{ 'Board rules' | translate }}</a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
               <li class="divider"></li>
               <li>
                 <a href ng-click="showCollectionData()">
-                   {{ 'Collection info' | translate }}</a>
+                  {{ 'Collection info' | translate }}</a
+                >
               </li>
 
-              <!-- View/Command output -->  
+              <!-- View/Command output -->
               <li>
                 <a href ng-click="showCommandOutput()">
-                   {{ 'Command output' | translate }}</a>
+                  {{ 'Command output' | translate }}</a
+                >
               </li>
 
               <!-- View/System Info -->
               <li>
                 <a href ng-click="showSystemInfo()">
-                   {{ 'System info' | translate }}</a>
+                  {{ 'System info' | translate }}</a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
@@ -509,100 +566,134 @@
                 <a href ng-click="toggleFPGAResources()">
                   {{ 'FPGA resources' | translate }}&ensp;
 
-                  <span ng-show="profile.data.showFPGAResources" 
-                        class="glyphicon glyphicon-ok-circle"></span>
+                  <span
+                    ng-show="profile.data.showFPGAResources"
+                    class="glyphicon glyphicon-ok-circle"
+                  ></span>
                 </a>
               </li>
             </ul>
           </li>
 
           <!-- SELECT Menu -->
-          <li uib-dropdown 
-              ng-mouseover="showMenu('select')" 
-              ng-mouseleave="hideMenu()" 
-              ng-click="fixMenu('select')" 
-              is-open="status.select">
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('select')"
+            ng-mouseleave="hideMenu()"
+            ng-click="fixMenu('select')"
+            is-open="status.select"
+          >
             <a href uib-dropdown-toggle>
-              {{ 'Select' | translate }}<span class="caret"></span></a>
+              {{ 'Select' | translate }}<span class="caret"></span
+            ></a>
 
             <ul uib-dropdown-menu>
               <li class="dropdown-submenu" uib-dropdown>
-
                 <!-- Select/Board sub-menu -->
                 <a href uib-dropdown-toggle>{{ 'Board' | translate }}</a>
 
                 <ul uib-dropdown-menu class="dropdown-overflow">
-                   <li><a><b>HX1K</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'HX1K'" board="board"></menuboard>
-                   </li>
-                   <li><a><b>HX8K</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'HX8K'" board="board"></menuboard>
-                   </li>
-				           <li><a><b>LP1K</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'LP1K'" board="board"></menuboard>
-                   </li>
-                   <li><a><b>LP8K</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'LP8K'" board="board"></menuboard>
-                   </li>
-                   <li><a><b>U4K</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'U4K'" board="board"></menuboard>
-                   </li>
-                   <li><a><b>UP5K</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'UP5K'" board="board"></menuboard>
-                   </li>
-                   <li><a><b>ECP5</b></a></li>
-                   <li ng-repeat="board in common.boards">
-                     <menuboard type="'ECP5'" board="board"></menuboard>
-                   </li>
-                 </ul>
+                  <li>
+                    <a><b>HX1K</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'HX1K'" board="board"></menuboard>
+                  </li>
+                  <li>
+                    <a><b>HX8K</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'HX8K'" board="board"></menuboard>
+                  </li>
+                  <li>
+                    <a><b>LP1K</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'LP1K'" board="board"></menuboard>
+                  </li>
+                  <li>
+                    <a><b>LP8K</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'LP8K'" board="board"></menuboard>
+                  </li>
+                  <li>
+                    <a><b>U4K</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'U4K'" board="board"></menuboard>
+                  </li>
+                  <li>
+                    <a><b>UP5K</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'UP5K'" board="board"></menuboard>
+                  </li>
+                  <li>
+                    <a><b>ECP5</b></a>
+                  </li>
+                  <li ng-repeat="board in common.boards">
+                    <menuboard type="'ECP5'" board="board"></menuboard>
+                  </li>
+                </ul>
               </li>
 
               <!-- Select/Collection sub-menu -->
               <li class="dropdown-submenu" uib-dropdown>
-                <a href uib-dropdown-toggle>
-                   {{ 'Collection' | translate }}</a>
+                <a href uib-dropdown-toggle> {{ 'Collection' | translate }}</a>
 
                 <ul uib-dropdown-menu>
-
                   <!-- Default collection obsolete... -->
                   <!-- Will be removed in the future...  -->
                   <li ng-init="collection = common.defaultCollection">
-                    <a href ng-click="selectCollection(collection)" 
-                       ng-show="collection.name == ''">
+                    <a
+                      href
+                      ng-click="selectCollection(collection)"
+                      ng-show="collection.name == ''"
+                    >
                       {{ 'Default' | translate }}&ensp;
-                      <span ng-show="common.selectedCollection.name == ''" 
-                            class="glyphicon glyphicon-ok-circle"></span>
+                      <span
+                        ng-show="common.selectedCollection.name == ''"
+                        class="glyphicon glyphicon-ok-circle"
+                      ></span>
                     </a>
                   </li>
-                  <li class="divider" 
-                      ng-show="common.internalCollections.length > 0"></li>
+                  <li
+                    class="divider"
+                    ng-show="common.internalCollections.length > 0"
+                  ></li>
 
                   <!-- Internal collections -->
                   <li ng-repeat="collection in common.internalCollections">
-                    <a href ng-click="selectCollection(collection)" 
-                       ng-hide="collection.name == ''">
+                    <a
+                      href
+                      ng-click="selectCollection(collection)"
+                      ng-hide="collection.name == ''"
+                    >
                       {{ collection.name }}&ensp;
-                      <span 
-                        ng-show="common.selectedCollection.path == collection.path" 
-                        class="glyphicon glyphicon-ok-circle"></span>
+                      <span
+                        ng-show="common.selectedCollection.path == collection.path"
+                        class="glyphicon glyphicon-ok-circle"
+                      ></span>
                     </a>
                   </li>
 
                   <!-- External collection -->
-                  <li class="divider" 
-                      ng-show="common.externalCollections.length > 0"></li>
+                  <li
+                    class="divider"
+                    ng-show="common.externalCollections.length > 0"
+                  ></li>
                   <li ng-repeat="collection in common.externalCollections">
-                    <a href ng-click="selectCollection(collection)" 
-                       ng-hide="collection.name == ''">
+                    <a
+                      href
+                      ng-click="selectCollection(collection)"
+                      ng-hide="collection.name == ''"
+                    >
                       {{ collection.name }}&ensp;
-                      <span 
-                        ng-show="common.selectedCollection.path == collection.path" class="glyphicon glyphicon-ok-circle"></span>
+                      <span
+                        ng-show="common.selectedCollection.path == collection.path"
+                        class="glyphicon glyphicon-ok-circle"
+                      ></span>
                     </a>
                   </li>
                 </ul>
@@ -611,79 +702,98 @@
           </li>
 
           <!-- TOOLS Menu -->
-          <li uib-dropdown 
-              ng-mouseover="showMenu('tools')" 
-              ng-mouseleave="hideMenu()" 
-              ng-click="fixMenu('tools')" 
-              is-open="status.tools">
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('tools')"
+            ng-mouseleave="hideMenu()"
+            ng-click="fixMenu('tools')"
+            is-open="status.tools"
+          >
             <a href uib-dropdown-toggle>
-               {{ 'Tools' | translate }}
-               <span class="caret"></span></a>
+              {{ 'Tools' | translate }}
+              <span class="caret"></span
+            ></a>
 
             <!-- Tools/Verify -->
             <ul uib-dropdown-menu style="min-width: 190px">
               <li>
                 <a href ng-click="verifyCode()">
-                   {{ 'Verify' | translate }}
-                   <span class="shortcut">
-                      {{ 'verifyCode' | shortcut }}</span></a>
+                  {{ 'Verify' | translate }}
+                  <span class="shortcut">
+                    {{ 'verifyCode' | shortcut }}</span
+                  ></a
+                >
               </li>
 
               <!-- Tools/Build -->
               <li>
                 <a href ng-click="buildCode()">
-                   {{ 'Build' | translate }}
-                   <span class="shortcut">
-                    {{ 'buildCode' | shortcut }}</span></a>
+                  {{ 'Build' | translate }}
+                  <span class="shortcut"> {{ 'buildCode' | shortcut }}</span></a
+                >
               </li>
 
               <!-- Tools/Upload-->
               <li>
                 <a href ng-click="uploadCode()">
-                   {{ 'Upload' | translate }}
-                    <span class="shortcut">
-                      {{ 'uploadCode' | shortcut }}</span></a>
+                  {{ 'Upload' | translate }}
+                  <span class="shortcut">
+                    {{ 'uploadCode' | shortcut }}</span
+                  ></a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
               <li class="divider" ng-if="common.showToolchain()"></li>
 
               <!-- Tools/Toolchains sub-menu-->
-              <li class="dropdown-submenu" 
-                  uib-dropdown ng-if="common.showToolchain()">
-                <a href uib-dropdown-toggle>
-                   {{ 'Toolchain' | translate }}</a>
+              <li
+                class="dropdown-submenu"
+                uib-dropdown
+                ng-if="common.showToolchain()"
+              >
+                <a href uib-dropdown-toggle> {{ 'Toolchain' | translate }}</a>
 
                 <ul uib-dropdown-menu>
-
                   <!-- Tools/Toolchains/Install (update)-->
                   <li ng-class="toolchain.disabled ? 'disabled' : ''">
-                    <a href ng-hide="toolchain.installed" 
-                       ng-click="tools.installToolchain()">
+                    <a
+                      href
+                      ng-hide="toolchain.installed"
+                      ng-click="tools.installToolchain()"
+                    >
                       {{ 'Install (Stable)' | translate }}
                     </a>
-                    <a href ng-show="toolchain.installed" 
-                       ng-click="tools.updateToolchain()">
+                    <a
+                      href
+                      ng-show="toolchain.installed"
+                      ng-click="tools.updateToolchain()"
+                    >
                       {{ 'Update (Latest stable)' | translate }}
                     </a>
                   </li>
 
                   <!-- Tools/Toolchain/Remove -->
-                  <li ng-class="(toolchain.disabled || !toolchain.installed) ? 'disabled' : ''">
-                    <a href 
-                       ng-click="(toolchain.disabled || !toolchain.installed) ? '' : tools.removeToolchain()">
+                  <li
+                    ng-class="(toolchain.disabled || !toolchain.installed) ? 'disabled' : ''"
+                  >
+                    <a
+                      href
+                      ng-click="(toolchain.disabled || !toolchain.installed) ? '' : tools.removeToolchain()"
+                    >
                       {{ 'Remove' | translate }}
                     </a>
                   </li>
 
                   <!-- Tools/Toolchain/Install development -->
                   <li>
-                    <a href 
-                       ng-show="toolchain.installed" 
-                       ng-click="tools.installToolchainDev()">
+                    <a
+                      href
+                      ng-show="toolchain.installed"
+                      ng-click="tools.installToolchainDev()"
+                    >
                       {{ 'Install Development version' | translate }}
                     </a>
-
                   </li>
 
                   <!-- Divisor line between sections of the menu -->
@@ -697,12 +807,13 @@
               </li>
 
               <!-- Tools/Drivers sub-menu -->
-              <li class="dropdown-submenu" 
-                  uib-dropdown ng-if="common.showDrivers()">
-                <a href uib-dropdown-toggle>
-                   {{ 'Drivers' | translate }}</a>
+              <li
+                class="dropdown-submenu"
+                uib-dropdown
+                ng-if="common.showDrivers()"
+              >
+                <a href uib-dropdown-toggle> {{ 'Drivers' | translate }}</a>
                 <ul uib-dropdown-menu>
-
                   <!-- Tools/Drivers/Enable -->
                   <li>
                     <a href ng-click="tools.enableDrivers()">
@@ -724,13 +835,10 @@
 
               <!-- Tools/Collections sub-menu -->
               <li class="dropdown-submenu" uib-dropdown>
-                <a href uib-dropdown-toggle>
-                   {{ 'Collections' | translate }}</a>
+                <a href uib-dropdown-toggle> {{ 'Collections' | translate }}</a>
 
-               
                 <ul uib-dropdown-menu>
-
-                   <!-- Tools/Collections/Add -->
+                  <!-- Tools/Collections/Add -->
                   <li>
                     <a href ng-click="addCollections()">
                       {{ 'Add' | translate }}
@@ -746,14 +854,17 @@
 
                   <!-- Tools/Collection/Remove sub-menu-->
                   <li class="dropdown-submenu" uib-dropdown>
-                    <a href uib-dropdown-toggle>
-                      {{ 'Remove' | translate }}</a>
-                    <ul uib-dropdown-menu
-                        ng-show="common.internalCollections.length > 0">
+                    <a href uib-dropdown-toggle> {{ 'Remove' | translate }}</a>
+                    <ul
+                      uib-dropdown-menu
+                      ng-show="common.internalCollections.length > 0"
+                    >
                       <li ng-repeat="collection in common.internalCollections">
-                        <a href 
-                           ng-click="removeCollection(collection)" 
-                           ng-if="collection.name != ''">
+                        <a
+                          href
+                          ng-click="removeCollection(collection)"
+                          ng-if="collection.name != ''"
+                        >
                           {{ collection.name | translate }}
                         </a>
                       </li>
@@ -769,33 +880,37 @@
                 </ul>
               </li>
               <li class="divider"></li>
- <li>
+              <li>
                 <a href ng-click="takeSnapshotPNG()">
-                   {{ 'Take PNG' | translate }}
-                   <span class="shortcut">
-                      {{ 'takeSnapshotPNG' | shortcut }}</span></a>
+                  {{ 'Take PNG' | translate }}
+                  <span class="shortcut">
+                    {{ 'takeSnapshotPNG' | shortcut }}</span
+                  ></a
+                >
               </li>
-<li>
+              <li>
                 <a href ng-click="takeSnapshotVideo()">
-                   {{ 'Take Video' | translate }}
-                   <span class="shortcut">
-                      {{ 'takeSnapshotVideo' | shortcut }}</span></a>
+                  {{ 'Take Video' | translate }}
+                  <span class="shortcut">
+                    {{ 'takeSnapshotVideo' | shortcut }}</span
+                  ></a
+                >
               </li>
-
-
-
             </ul>
           </li>
 
           <!-- BASIC Menu -->
-          <li uib-dropdown
-              ng-mouseover="showMenu('basic')" 
-              ng-mouseleave="hideMenu()" 
-              ng-click="fixMenu('basic')" 
-              is-open="status.basic">
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('basic')"
+            ng-mouseleave="hideMenu()"
+            ng-click="fixMenu('basic')"
+            is-open="status.basic"
+          >
             <a href uib-dropdown-toggle>
               {{ 'Basic' | translate }}
-              <span class="caret"></span></a>
+              <span class="caret"></span
+            ></a>
 
             <ul uib-dropdown-menu>
               <li>
@@ -807,8 +922,7 @@
                   <div class="marker marker-blue"></div>
                   {{ 'Output' | translate }}
                 </a>
-                <a href 
-                  ng-click="project.addBasicBlock('basic.outputLabel')">
+                <a href ng-click="project.addBasicBlock('basic.outputLabel')">
                   <div class="marker marker-fuchsia"></div>
                   {{ 'Input label' | translate }}
                 </a>
@@ -824,7 +938,7 @@
 
                 <a href ng-click="project.addBasicBlock('basic.constant')">
                   <div class="marker marker-orange"></div>
-                   {{ 'Constant' | translate }}
+                  {{ 'Constant' | translate }}
                 </a>
                 <a href ng-click="project.addBasicBlock('basic.memory')">
                   <div class="marker marker-orange"></div>
@@ -832,23 +946,24 @@
                 </a>
                 <a href ng-click="project.addBasicBlock('basic.code')">
                   <div class="marker marker-blue"></div>
-                   {{ 'Code' | translate }}
+                  {{ 'Code' | translate }}
                 </a>
                 <a href ng-click="project.addBasicBlock('basic.info')">
                   <div class="marker marker-gray"></div>
-                   {{ 'Information' | translate }}
+                  {{ 'Information' | translate }}
                 </a>
               </li>
             </ul>
           </li>
 
-
           <!-- HELP Menu -->
-          <li uib-dropdown 
-              ng-mouseover="showMenu('help')" 
-              ng-mouseleave="hideMenu()" 
-              ng-click="fixMenu('help')" 
-              is-open="status.help">
+          <li
+            uib-dropdown
+            ng-mouseover="showMenu('help')"
+            ng-mouseleave="hideMenu()"
+            ng-click="fixMenu('help')"
+            is-open="status.help"
+          >
             <a href uib-dropdown-toggle>
               {{ 'Help' | translate }}
               <span class="caret"></span>
@@ -857,9 +972,12 @@
             <ul uib-dropdown-menu>
               <!-- HELP/View license -->
               <li disabled>
-                <a href ng-click="openUrl(
+                <a
+                  href
+                  ng-click="openUrl(
                   'https://www.gnu.org/licenses/old-licenses/gpl-2.0.html',
-                  $event)">
+                  $event)"
+                >
                   {{ 'View license' | translate }}
                 </a>
               </li>
@@ -873,8 +991,8 @@
 
               <!-- Show the current Version -->
               <li class="disabled">
-                <a href>{{ 'Version' | translate }} 
-                        {{ common.ICESTUDIO_VERSION }}
+                <a href
+                  >{{ 'Version' | translate }} {{ common.ICESTUDIO_VERSION }}
                 </a>
               </li>
 
@@ -883,18 +1001,24 @@
 
               <!-- HELP/Documentation -->
               <li>
-                <a href ng-click=
-                  "openUrl('https://github.com/FPGAwars/icestudio/wiki',
-                   $event)">
-                  {{ 'Documentation' | translate }}</a>
+                <a
+                  href
+                  ng-click="openUrl('https://github.com/FPGAwars/icestudio/wiki',
+                   $event)"
+                >
+                  {{ 'Documentation' | translate }}</a
+                >
               </li>
 
               <!-- HELP/Source code -->
               <li>
-                <a href ng-click=
-                   "openUrl('https://github.com/FPGAwars/icestudio',
-                   $event)">
-                   {{ 'Source code' | translate }}</a>
+                <a
+                  href
+                  ng-click="openUrl('https://github.com/FPGAwars/icestudio',
+                   $event)"
+                >
+                  {{ 'Source code' | translate }}</a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
@@ -902,10 +1026,13 @@
 
               <!-- Help/Community forum -->
               <li>
-                <a href ng-click=
-                   "openUrl('https://groups.google.com/forum/#!forum/fpga-wars-explorando-el-lado-libre',
-                    $event)">
-                    {{ 'Community forum' | translate }}</a>
+                <a
+                  href
+                  ng-click="openUrl('https://groups.google.com/forum/#!forum/fpga-wars-explorando-el-lado-libre',
+                    $event)"
+                >
+                  {{ 'Community forum' | translate }}</a
+                >
               </li>
 
               <!-- Divisor line between sections of the menu -->
@@ -914,20 +1041,16 @@
               <!-- Help/About -->
               <li>
                 <a href ng-click="about()">
-                  {{ 'About Icestudio' | translate }}</a>
+                  {{ 'About Icestudio' | translate }}</a
+                >
               </li>
             </ul>
           </li>
-
         </ul>
-
       </div>
-
     </nav>
-
   </div>
 
-<!-- HTML file with the Version notes --> 
-<div ng-include="'views/version.html'"></div>
+  <!-- HTML file with the Version notes -->
+  <div ng-include="'views/version.html'"></div>
 </div>
-
diff --git a/app/views/uithemes.html b/app/views/uithemes.html
index a1774eed1..2ca158ce7 100644
--- a/app/views/uithemes.html
+++ b/app/views/uithemes.html
@@ -8,13 +8,16 @@
 
 <!-- If you want to include new themes, you should edit this file -->
 
-<!DOCTYPE html>
+<!doctype html>
 
 <li>
   <!-- Edit/Preferences/UI theme/Dark -->
   <a href ng-click="selectTheme('dark')">
     {{ 'Dark (default)' | translate }}&ensp;
-    <span ng-show="profile.data.uiTheme == 'dark'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.uiTheme == 'dark'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
 
@@ -22,6 +25,9 @@
   <!-- Edit/Preferences/UI theme/Light -->
   <a href ng-click="selectTheme('light')">
     {{ 'Light' | translate }}&ensp;
-    <span ng-show="profile.data.uiTheme == 'light'" class="glyphicon glyphicon-ok-circle"></span>
+    <span
+      ng-show="profile.data.uiTheme == 'light'"
+      class="glyphicon glyphicon-ok-circle"
+    ></span>
   </a>
 </li>
diff --git a/app/views/version.html b/app/views/version.html
index 11a01a408..97221e561 100644
--- a/app/views/version.html
+++ b/app/views/version.html
@@ -1,83 +1,94 @@
-<!DOCTYPE html>
+<!doctype html>
 
 <!-- This page is initially hidden -->
 <div id="version-info-tab" class="hidden">
-
   <div class="version-info-tab--bg"></div>
   <div class="version-info-tab--body">
     <div class="version-info-tab--body--content">
+      <p>
+        <a
+          ng-click="openUrl('https://github.com/FPGAwars/icestudio/wiki', $event)"
+          href="https://github.com/FPGAwars/icestudio/wiki"
+        >
+          <img
+            class="img-responsive"
+            src="resources/images/icestudio-github.svg"
+          />
+        </a>
+      </p>
 
-        <p>
-          <a ng-click=
-             "openUrl('https://github.com/FPGAwars/icestudio/wiki', $event)"
-             href="https://github.com/FPGAwars/icestudio/wiki">
-              <img class="img-responsive" 
-                   src="resources/images/icestudio-github.svg">
-          </a>
-        </p>
-
-        <h1>Icestudio {{ version }} (WIP)</h1>
-        <hr>
-        <h2> {{ 'Welcome to Icestudio!' | translate }}</h2>
+      <h1>Icestudio {{ version }} (WIP)</h1>
+      <hr />
+      <h2>{{ 'Welcome to Icestudio!' | translate }}</h2>
 
-        <p> {{ 'You can read the release notes on the' | translate }}
-          <a ng-click="openUrl(
+      <p>
+        {{ 'You can read the release notes on the' | translate }}
+        <a
+          ng-click="openUrl(
              'https://github.com/FPGAwars/icestudio/wiki/Release-history',
               $event)"
-             href=
-             "https://github.com/FPGAwars/icestudio/wiki/Release-history">
-             {{ 'Release History WIKI' | translate }}
-          </a>
-        </p>
+          href="https://github.com/FPGAwars/icestudio/wiki/Release-history"
+        >
+          {{ 'Release History WIKI' | translate }}
+        </a>
+      </p>
 
-        <h2>{{ 'Acknowledgment' | translate }}</h2>
+      <h2>{{ 'Acknowledgment' | translate }}</h2>
 
-        <p> 
-          {{ 'This release has been possible thanks to the great work done by an emerging team from' | translate }}
-          <a href="https://groups.google.com/g/fpga-wars-explorando-el-lado-libre"
-            target="_blank">
-            {{ 'FPGAwars community.' | translate }}
-          </a>
-          {{ 'Thank you very much!' | translate }}
-        </p>
+      <p>
+        {{ 'This release has been possible thanks to the great work done by an
+        emerging team from' | translate }}
+        <a
+          href="https://groups.google.com/g/fpga-wars-explorando-el-lado-libre"
+          target="_blank"
+        >
+          {{ 'FPGAwars community.' | translate }}
+        </a>
+        {{ 'Thank you very much!' | translate }}
+      </p>
 
-        <br>
-        <p>  {{ 'Icestudio is part of' | translate }}
-          <a ng-click="openUrl('https://fpgawars.github.io')"
-		     href="https://fpgawars.github.io">
-            {{ 'FPGAwars community' | translate }}
-          </a>
-        </p>
+      <br />
+      <p>
+        {{ 'Icestudio is part of' | translate }}
+        <a
+          ng-click="openUrl('https://fpgawars.github.io')"
+          href="https://fpgawars.github.io"
+        >
+          {{ 'FPGAwars community' | translate }}
+        </a>
+      </p>
 
-        <p> <a ng-click="openUrl('https://fpgawars.github.io', $event)"
-                href="https://fpgawars.github.io">
-              <img class="img-responsive"
-                 src="resources/images/fgpawars-banner.svg">
-            </a>
-        </p>
+      <p>
+        <a
+          ng-click="openUrl('https://fpgawars.github.io', $event)"
+          href="https://fpgawars.github.io"
+        >
+          <img
+            class="img-responsive"
+            src="resources/images/fgpawars-banner.svg"
+          />
+        </a>
+      </p>
     </div>
 
     <div class="version-info-tab--options">
+      <!-- Check button -->
+      <div class="version-info-tab--options--group">
+        <input type="checkbox" id="version-info-tab--no-display" />
+        <label for="version-info-tab--no-display">
+          {{ 'Don’t display' | translate }}
+        </label>
+      </div>
 
-        <!-- Check button -->
-        <div class="version-info-tab--options--group">
-          <input type="checkbox" id="version-info-tab--no-display">
-            <label for="version-info-tab--no-display">
-              {{ 'Don’t display' | translate }}
-            </label>
-        </div>
-
-        <!-- Close button -->
-        <div class="version-info-tab--options--group"></div>
-        <div class="version-info-tab--options--group util--text-align-right">
-
-          <!-- Callback function. It call when the close button -->
-          <!--    is pressed                                    -->
-          <button ng-click="closeVersionInfoWindow()">
-            {{ 'Close' | translate }}
-          </button>
-        </div>
+      <!-- Close button -->
+      <div class="version-info-tab--options--group"></div>
+      <div class="version-info-tab--options--group util--text-align-right">
+        <!-- Callback function. It call when the close button -->
+        <!--    is pressed                                    -->
+        <button ng-click="closeVersionInfoWindow()">
+          {{ 'Close' | translate }}
+        </button>
+      </div>
     </div>
-
   </div>
 </div>
diff --git a/package.json b/package.json
index 6106144d1..b77755cc1 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "buildOSXARM64": "grunt dist --platform=darwin --cpu=arm64",
     "preptext": "grunt gettext && scripts/update_translations.sh",
     "compiletext": "grunt compiletext",
+    "prettier": "prettier --write .",
     "jshint": "grunt jshint",
     "clean": "grunt clean",
     "getcollection": "grunt getcollection",
@@ -43,9 +44,10 @@
     "grunt-shell": "^3.0.1",
     "grunt-wget": "^0.1.3",
     "grunt-zip": "^0.18.2",
-    "npm-platform-dependencies": "0.1.0",
+    "npm-platform-dependencies": "^0.1.0",
     "nw": "0.94.0",
-    "nw-builder": "^4.5.4"
+    "nw-builder": "^4.5.4",
+    "prettier": "^3.4.2"
   },
   "darwinDependencies": {
     "fs-xattr": "^0.4.0",

From 7e46fdb3806b2a38f3ba605aadf488046713acd2 Mon Sep 17 00:00:00 2001
From: TimRudy <3942818+TimRudy@users.noreply.github.com>
Date: Fri, 31 Jan 2025 15:01:58 -0500
Subject: [PATCH 2/2] Fix incorrect HTML tag

---
 app/views/design.html | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/app/views/design.html b/app/views/design.html
index 793404ff3..0c6ebcd13 100644
--- a/app/views/design.html
+++ b/app/views/design.html
@@ -57,9 +57,7 @@
     <div class="lFinder-exact--option" title="{{'Exact match' | translate}}"></div>
 
     <!-- Input text field -->
-    <input type="text" class="lFinder-field">
-      <span class="items-found">0/0</span>
-    </input>
+    <input type="text" class="lFinder-field" />
 
     <!-- Find button -->
     <div class="lFinder-find" translate>Find</div>
@@ -78,7 +76,7 @@
 
       <!-- New name text entry -->
       <span class="lFinder-name" translate>New Name:</span>
-      <input class="lFinder-name--field"></input>
+      <input class="lFinder-name--field" />
 
       <!-- Replace one button -->
       <div class="lFinder-replace--name" translate>Replace One</div>