From f3c040fb1a1ff40c595cc342f5f3bb610bff58ac Mon Sep 17 00:00:00 2001
From: "francesco.guerrieri" <fguerrieri1987@gmail.com>
Date: Mon, 27 Apr 2020 14:29:58 +0200
Subject: [PATCH 1/7] first commit paddle. create component

---
 Thermo.Active/wwwroot/assets/styles/base/paddle.less              | 0
 .../wwwroot/src/app_modules_thermo/components/paddle/burger.ts    | 0
 .../wwwroot/src/app_modules_thermo/components/paddle/burger.vue   | 0
 .../wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts   | 0
 .../wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue  | 0
 5 files changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 Thermo.Active/wwwroot/assets/styles/base/paddle.less
 create mode 100644 Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
 create mode 100644 Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
 create mode 100644 Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
 create mode 100644 Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue

diff --git a/Thermo.Active/wwwroot/assets/styles/base/paddle.less b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
new file mode 100644
index 00000000..e69de29b
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
new file mode 100644
index 00000000..e69de29b
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
new file mode 100644
index 00000000..e69de29b
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
new file mode 100644
index 00000000..e69de29b
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
new file mode 100644
index 00000000..e69de29b

From 6dfee4a431c410cc89b0c727c3e4dc6c8e81b2cf Mon Sep 17 00:00:00 2001
From: "francesco.guerrieri" <fguerrieri1987@gmail.com>
Date: Mon, 27 Apr 2020 14:30:15 +0200
Subject: [PATCH 2/7] first commit paddle. create component

---
 .../wwwroot/assets/styles/base/paddle.less    | 123 ++++++++++++++++++
 Thermo.Active/wwwroot/src/App.ts              |   4 +
 Thermo.Active/wwwroot/src/App.vue             |  12 ++
 .../components/paddle/burger.ts               |  13 ++
 .../components/paddle/burger.vue              |  12 ++
 .../components/paddle/sidebar.ts              |  12 ++
 .../components/paddle/sidebar.vue             |  12 ++
 7 files changed, 188 insertions(+)

diff --git a/Thermo.Active/wwwroot/assets/styles/base/paddle.less b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
index e69de29b..6af64d47 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/paddle.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
@@ -0,0 +1,123 @@
+// out: false, sourceMap: false, main: ../style.less
+@import "grid-system.less";
+@import "colors.less";
+@import "fonts.less";
+
+
+    .hidden {
+        visibility: hidden;
+    }
+
+    button {
+        cursor: pointer;
+    }
+
+    /* remove blue outline */
+    button:focus {
+        outline: 0;
+    }
+
+    .burger-button {
+        position: relative;
+        height: 30px;
+        width: 32px;
+        display: block;
+        z-index: 999;
+        border: 0;
+        border-radius: 0;
+        background-color: transparent;
+        pointer-events: all;
+        transition: transform .6s cubic-bezier(.165,.84,.44,1);
+    }
+
+    .burger-bar {
+        background-color: #130f40;
+        position: absolute;
+        top: 50%;
+        right: 6px;
+        left: 6px;
+        height: 2px;
+        width: auto;
+        margin-top: -1px;
+        transition: transform .6s cubic-bezier(.165,.84,.44,1),opacity .3s cubic-bezier(.165,.84,.44,1),background-color .6s cubic-bezier(.165,.84,.44,1);
+    }
+
+    .burger-bar--1 {
+        -webkit-transform: translateY(-6px);
+        transform: translateY(-6px);
+    }
+
+    .burger-bar--2 {
+        transform-origin: 100% 50%;
+        transform: scaleX(.8);
+    }
+
+    .burger-button:hover .burger-bar--2 {
+        transform: scaleX(1);
+    }
+
+    .no-touchevents .burger-bar--2:hover {
+        transform: scaleX(1);
+    }
+
+    .burger-bar--3 {
+        transform: translateY(6px);
+    }
+
+    #burger.active .burger-button {
+        transform: rotate(-180deg);
+    }
+
+    #burger.active .burger-bar {
+        background-color: #fff;
+    }
+
+    #burger.active .burger-bar--1 {
+        transform: rotate(45deg)
+    }
+
+    #burger.active .burger-bar--2 {
+        opacity: 0;
+    }
+
+    #burger.active .burger-bar--3 {
+        transform: rotate(-45deg)
+    }
+
+
+
+
+
+    .slide-enter-active,
+    .slide-leave-active
+    {
+        transition: transform 0.2s ease;
+    }
+
+    .slide-enter,
+    .slide-leave-to {
+        transform: translateX(-100%);
+        transition: all 150ms ease-in 0s
+    }
+
+    .sidebar-backdrop {
+        background-color: rgba(0,0,0,.5);
+        width: 100vw;
+        height: 100vh;
+        position: fixed;
+        top: 0;
+        left: 0;
+        cursor: pointer;
+    }
+
+    .sidebar-panel {
+        overflow-y: auto;
+        background-color: #130f40;
+        position: fixed;
+        left: 0;
+        top: 0;
+        height: 100vh;
+        z-index: 999;
+        padding: 3rem 20px 2rem 20px;
+        width: 300px;
+    }
diff --git a/Thermo.Active/wwwroot/src/App.ts b/Thermo.Active/wwwroot/src/App.ts
index a07e2fcd..5c6f93b3 100644
--- a/Thermo.Active/wwwroot/src/App.ts
+++ b/Thermo.Active/wwwroot/src/App.ts
@@ -10,6 +10,8 @@ import { ModalContainer, ModalNcContainer } from "./modules/base-components";
 import { ModalHelper } from "@/components/modals"
 import { store, appModelActions, machineStatusActions } from "@/store";
 import { underTheHood } from "@/app_modules/under-the-hood";
+import Burger from "@/app_modules_thermo/components/paddle/burger.vue";
+import Sidebar from "@/app_modules_thermo/components/paddle/sidebar.vue";
 
 
 import * as iziToast from "izitoast";
@@ -30,6 +32,8 @@ declare var cmsClient;
     appFooter: Footer,
     modalContainer: ModalContainer,
     modalNcContainer: ModalNcContainer,
+    burger: Burger,
+    sidebar: Sidebar,
     alarmList,
     underTheHood,
   }
diff --git a/Thermo.Active/wwwroot/src/App.vue b/Thermo.Active/wwwroot/src/App.vue
index c8bf1de2..e12a01dd 100644
--- a/Thermo.Active/wwwroot/src/App.vue
+++ b/Thermo.Active/wwwroot/src/App.vue
@@ -12,6 +12,18 @@
       </div>
       <div id="main-view-handler" ref="main-view-handler" @click="toggleMainView()"  :class="{liftedUp : isMainViewLiftedUp,liftedDw : !isMainViewLiftedUp,'blur':(applyBlur || applyBlurNc)}">
 
+      <nav class="main-nav">
+        <burger></burger>
+      </nav>
+
+      <sidebar>
+        <ul class="sidebar-panel-nav">
+          <!-- <li><a href="#home">Home</a></li>
+          <li><a href="#about">About</a></li>
+          <li><a href="#contact">Contact</a></li> -->
+        </ul>
+      </sidebar>
+
       <vue-gesture :type="'swipedown'" :call="toggleMainView" :onmove="movepanel" :onstart="onstartdrag" :onstop="onstopdrag">
         <div class="handle" :title="'header_tooltip_close_uth' | localize('Close under-the-hood area')" >
             <i class="fa fa-angle-double-down"></i>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
index e69de29b..f3d832c6 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
@@ -0,0 +1,13 @@
+import Vue from "vue";
+import Component from "vue-class-component";
+
+@Component({name: 'burger'})
+export default class Burger extends Vue{
+
+    isBurgerActive: boolean = false;
+
+    toggle() {
+        debugger
+        this.isBurgerActive = !this.isBurgerActive;
+    }
+}
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
index e69de29b..f1630633 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
@@ -0,0 +1,12 @@
+<template>
+    <div id="burger" :class="{ 'active' : isBurgerActive }" @click.prevent="toggle">
+        <slot>
+            <button type="button" class="burger-button" title="Menu">
+                <span class="burger-bar burger-bar--1"></span>
+                <span class="burger-bar burger-bar--2"></span>
+                <span class="burger-bar burger-bar--3"></span>
+            </button>
+        </slot>
+    </div>
+</template>
+<script lang="ts" src="./burger.ts"/>
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
index e69de29b..e671e703 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
@@ -0,0 +1,12 @@
+import Vue from "vue";
+import Component from "vue-class-component";
+
+@Component({name: 'sidebar'})
+export default class Sidebar extends Vue{
+
+    isPanelOpen: boolean = true;
+
+    closeSidebarPanel() {
+        this.isPanelOpen = false;
+    }
+}
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
index e69de29b..e53c8834 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
@@ -0,0 +1,12 @@
+<template>
+    <div class="sidebar">
+        <div class="sidebar-backdrop" @click="closeSidebarPanel" v-if="isPanelOpen"></div>
+        <transition name="slide">
+            <div v-if="isPanelOpen"
+                 class="sidebar-panel">
+                <slot></slot>
+            </div>
+        </transition>
+    </div>
+</template>
+<script lang="ts" src="./sidebar.ts" />
\ No newline at end of file

From 88257068aea5b62f9c4e59799084194d752e0f09 Mon Sep 17 00:00:00 2001
From: Alessio <alessiogiombetti@live.it>
Date: Mon, 27 Apr 2020 16:36:31 +0200
Subject: [PATCH 3/7] add store

---
 .../wwwroot/src/store/paddle.store.ts          | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)
 create mode 100644 Thermo.Active/wwwroot/src/store/paddle.store.ts

diff --git a/Thermo.Active/wwwroot/src/store/paddle.store.ts b/Thermo.Active/wwwroot/src/store/paddle.store.ts
new file mode 100644
index 00000000..c604095d
--- /dev/null
+++ b/Thermo.Active/wwwroot/src/store/paddle.store.ts
@@ -0,0 +1,18 @@
+
+export const paddleStore={
+    state:{
+        isNavOpen:false
+    },
+    mutations: {
+        toggleNav(store){
+            store.isNavOpen = !store.isNavOpen
+        }
+    },
+    actions:{
+        Toggle(context){
+            context.commit("toggleNav");
+        }
+    }
+}
+
+

From 2be6c229d77aa398760fa676cab3d4653dc291df Mon Sep 17 00:00:00 2001
From: Alessio <alessiogiombetti@live.it>
Date: Mon, 27 Apr 2020 17:08:05 +0200
Subject: [PATCH 4/7] fix store

---
 .../wwwroot/assets/styles/base/layout.less    |   1 +
 .../wwwroot/assets/styles/base/paddle.less    | 111 +++++++++------
 Thermo.Active/wwwroot/assets/styles/style.css | 128 ++++++++++++++++++
 Thermo.Active/wwwroot/src/App.vue             |   5 +-
 .../components/paddle/burger.ts               |  10 +-
 .../components/paddle/burger.vue              |   2 +-
 .../components/paddle/sidebar.ts              |   7 +-
 .../components/paddle/sidebar.vue             |   3 +-
 .../wwwroot/src/store/paddle.store.ts         |   8 +-
 9 files changed, 222 insertions(+), 53 deletions(-)

diff --git a/Thermo.Active/wwwroot/assets/styles/base/layout.less b/Thermo.Active/wwwroot/assets/styles/base/layout.less
index f04c8c32..e7f95591 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/layout.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/layout.less
@@ -6,6 +6,7 @@
 @import "formato.less";
 @import "slider.less";
 @import "tastierino.less";
+@import "paddle.less";
 @import "arretramento-riscaldi.less";
 @import "setup.less";
 @import "ciclo.less";
diff --git a/Thermo.Active/wwwroot/assets/styles/base/paddle.less b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
index 6af64d47..5df95499 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/paddle.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
@@ -3,6 +3,77 @@
 @import "colors.less";
 @import "fonts.less";
 
+html {
+    height: 100%;
+    overflow:hidden;
+  }
+ 
+  body {
+    border: 0; margin: 0; padding: 0;
+    font-family: 'Lato';
+    height: 100%;
+    background: rgb(101,31,87);
+    background: linear-gradient(45deg, rgba(101,31,87,1) 0%, rgba(225,113,87,1) 48%, rgba(249,248,113,1) 100%);
+  }
+ 
+  .logo {
+    align-self: center;
+    color: #fff;
+    font-weight: bold;
+    font-family: 'Lato'
+  }
+ 
+  .main-nav {
+    display: flex;
+    justify-content: space-between;
+    padding: 0.5rem 0.8rem;
+  }
+ 
+  ul.sidebar-panel-nav {
+    list-style-type: none;
+  }
+ 
+  ul.sidebar-panel-nav > li > a {
+    color: #fff;
+    text-decoration: none;
+    font-size: 1.5rem;
+    display: block;
+    padding-bottom: 0.5em;
+  }
+
+  .slide-enter-active,
+    .slide-leave-active
+    {
+        transition: transform 0.2s ease;
+    }
+
+    .slide-enter,
+    .slide-leave-to {
+        transform: translateX(-100%);
+        transition: all 150ms ease-in 0s
+    }
+
+    .sidebar-backdrop {
+        background-color: rgba(0,0,0,.5);
+        width: 100vw;
+        height: 100vh;
+        position: fixed;
+        top: 0;
+        left: 0;
+        cursor: pointer;
+    }
+
+    .sidebar-panel {
+        overflow-y: auto;
+        background-color: #130f40;
+        position: fixed;
+        left: 0;
+        top: 0;
+        height: 100vh;
+        z-index: 999;
+        padding: 3rem 20px 2rem 20px;
+        width: 300px;
+    }
 
     .hidden {
         visibility: hidden;
@@ -82,42 +153,4 @@
 
     #burger.active .burger-bar--3 {
         transform: rotate(-45deg)
-    }
-
-
-
-
-
-    .slide-enter-active,
-    .slide-leave-active
-    {
-        transition: transform 0.2s ease;
-    }
-
-    .slide-enter,
-    .slide-leave-to {
-        transform: translateX(-100%);
-        transition: all 150ms ease-in 0s
-    }
-
-    .sidebar-backdrop {
-        background-color: rgba(0,0,0,.5);
-        width: 100vw;
-        height: 100vh;
-        position: fixed;
-        top: 0;
-        left: 0;
-        cursor: pointer;
-    }
-
-    .sidebar-panel {
-        overflow-y: auto;
-        background-color: #130f40;
-        position: fixed;
-        left: 0;
-        top: 0;
-        height: 100vh;
-        z-index: 999;
-        padding: 3rem 20px 2rem 20px;
-        width: 300px;
-    }
+    }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/assets/styles/style.css b/Thermo.Active/wwwroot/assets/styles/style.css
index 9802d2cd..75346a50 100644
--- a/Thermo.Active/wwwroot/assets/styles/style.css
+++ b/Thermo.Active/wwwroot/assets/styles/style.css
@@ -4072,6 +4072,134 @@
   grid-column: 0.8;
   grid-row: 0.5;
 }
+html {
+  height: 100%;
+  overflow: hidden;
+}
+body {
+  border: 0;
+  margin: 0;
+  padding: 0;
+  font-family: 'Lato';
+  height: 100%;
+  background: #651f57;
+  background: linear-gradient(45deg, #651f57 0%, #e17157 48%, #f9f871 100%);
+}
+.logo {
+  align-self: center;
+  color: #fff;
+  font-weight: bold;
+  font-family: 'Lato';
+}
+.main-nav {
+  display: flex;
+  justify-content: space-between;
+  padding: 0.5rem 0.8rem;
+}
+ul.sidebar-panel-nav {
+  list-style-type: none;
+}
+ul.sidebar-panel-nav > li > a {
+  color: #fff;
+  text-decoration: none;
+  font-size: 1.5rem;
+  display: block;
+  padding-bottom: 0.5em;
+}
+.slide-enter-active,
+.slide-leave-active {
+  transition: transform 0.2s ease;
+}
+.slide-enter,
+.slide-leave-to {
+  transform: translateX(-100%);
+  transition: all 150ms ease-in 0s;
+}
+.sidebar-backdrop {
+  background-color: rgba(0, 0, 0, 0.5);
+  width: 100vw;
+  height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  cursor: pointer;
+}
+.sidebar-panel {
+  overflow-y: auto;
+  background-color: #130f40;
+  position: fixed;
+  left: 0;
+  top: 0;
+  height: 100vh;
+  z-index: 999;
+  padding: 3rem 20px 2rem 20px;
+  width: 300px;
+}
+.hidden {
+  visibility: hidden;
+}
+button {
+  cursor: pointer;
+}
+/* remove blue outline */
+button:focus {
+  outline: 0;
+}
+.burger-button {
+  position: relative;
+  height: 30px;
+  width: 32px;
+  display: block;
+  z-index: 999;
+  border: 0;
+  border-radius: 0;
+  background-color: transparent;
+  pointer-events: all;
+  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
+}
+.burger-bar {
+  background-color: #130f40;
+  position: absolute;
+  top: 50%;
+  right: 6px;
+  left: 6px;
+  height: 2px;
+  width: auto;
+  margin-top: -1px;
+  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
+}
+.burger-bar--1 {
+  -webkit-transform: translateY(-6px);
+  transform: translateY(-6px);
+}
+.burger-bar--2 {
+  transform-origin: 100% 50%;
+  transform: scaleX(0.8);
+}
+.burger-button:hover .burger-bar--2 {
+  transform: scaleX(1);
+}
+.no-touchevents .burger-bar--2:hover {
+  transform: scaleX(1);
+}
+.burger-bar--3 {
+  transform: translateY(6px);
+}
+#burger.active .burger-button {
+  transform: rotate(-180deg);
+}
+#burger.active .burger-bar {
+  background-color: #fff;
+}
+#burger.active .burger-bar--1 {
+  transform: rotate(45deg);
+}
+#burger.active .burger-bar--2 {
+  opacity: 0;
+}
+#burger.active .burger-bar--3 {
+  transform: rotate(-45deg);
+}
 .modal.estrazione-info {
   width: 560px;
   height: 411px;
diff --git a/Thermo.Active/wwwroot/src/App.vue b/Thermo.Active/wwwroot/src/App.vue
index e12a01dd..386991bf 100644
--- a/Thermo.Active/wwwroot/src/App.vue
+++ b/Thermo.Active/wwwroot/src/App.vue
@@ -7,7 +7,6 @@
       <under-the-hood :class="{'blur':(applyBlur || applyBlurNc)}"></under-the-hood>
       <div id="main-view" ref="main-view" :class="{liftedUp : isMainViewLiftedUp,'blur':(applyBlur || applyBlurNc)}" >
         <router-view  :class="{'blur':applyBlurInternal}" />
-
         <modal-container name="modal" container-name="modal-internal" :inform-hmi="false" ></modal-container>
       </div>
       <div id="main-view-handler" ref="main-view-handler" @click="toggleMainView()"  :class="{liftedUp : isMainViewLiftedUp,liftedDw : !isMainViewLiftedUp,'blur':(applyBlur || applyBlurNc)}">
@@ -18,9 +17,9 @@
 
       <sidebar>
         <ul class="sidebar-panel-nav">
-          <!-- <li><a href="#home">Home</a></li>
+          <li><a href="#home">Home</a></li>
           <li><a href="#about">About</a></li>
-          <li><a href="#contact">Contact</a></li> -->
+          <li><a href="#contact">Contact</a></li>
         </ul>
       </sidebar>
 
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
index f3d832c6..3e780a7e 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
@@ -1,13 +1,15 @@
 import Vue from "vue";
 import Component from "vue-class-component";
+import { paddleStore, paddleActions } from '@/store/paddle.store';
 
 @Component({name: 'burger'})
 export default class Burger extends Vue{
 
-    isBurgerActive: boolean = false;
+    isBurgerActive(){
+        return paddleStore.state.isNavOpen;
+    }
 
-    toggle() {
-        debugger
-        this.isBurgerActive = !this.isBurgerActive;
+    togglePaddle() { 
+        paddleActions.Toggle(paddleStore);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
index f1630633..1ef2ebbe 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
@@ -1,5 +1,5 @@
 <template>
-    <div id="burger" :class="{ 'active' : isBurgerActive }" @click.prevent="toggle">
+    <div id="burger" :class="{ 'active' : isBurgerActive }" @click.prevent="togglePaddle">
         <slot>
             <button type="button" class="burger-button" title="Menu">
                 <span class="burger-bar burger-bar--1"></span>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
index e671e703..0146df71 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
@@ -1,12 +1,15 @@
 import Vue from "vue";
 import Component from "vue-class-component";
+import { paddleStore, paddleActions } from '@/store/paddle.store';
 
 @Component({name: 'sidebar'})
 export default class Sidebar extends Vue{
 
-    isPanelOpen: boolean = true;
+    isPanelOpen(){
+        return paddleStore.state.isNavOpen;
+    }
 
     closeSidebarPanel() {
-        this.isPanelOpen = false;
+        paddleActions.Toggle(paddleStore);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
index e53c8834..0d39c16e 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
@@ -2,8 +2,7 @@
     <div class="sidebar">
         <div class="sidebar-backdrop" @click="closeSidebarPanel" v-if="isPanelOpen"></div>
         <transition name="slide">
-            <div v-if="isPanelOpen"
-                 class="sidebar-panel">
+            <div v-if="isPanelOpen" class="sidebar-panel">
                 <slot></slot>
             </div>
         </transition>
diff --git a/Thermo.Active/wwwroot/src/store/paddle.store.ts b/Thermo.Active/wwwroot/src/store/paddle.store.ts
index c604095d..2a2ccd2d 100644
--- a/Thermo.Active/wwwroot/src/store/paddle.store.ts
+++ b/Thermo.Active/wwwroot/src/store/paddle.store.ts
@@ -1,5 +1,6 @@
+import Vue from 'vue';
 
-export const paddleStore={
+export const paddleStore= Vue.observable({
     state:{
         isNavOpen:false
     },
@@ -13,6 +14,9 @@ export const paddleStore={
             context.commit("toggleNav");
         }
     }
-}
+})
+
+export const paddleActions = paddleStore.actions;
+
 
 

From b86c338b14fc4817803b68e486440927a0bd14fc Mon Sep 17 00:00:00 2001
From: "francesco.guerrieri" <fguerrieri1987@gmail.com>
Date: Tue, 28 Apr 2020 17:04:42 +0200
Subject: [PATCH 5/7] fix store paddle

---
 .../wwwroot/assets/styles/base/paddle.less          | 13 +++++++++----
 Thermo.Active/wwwroot/assets/styles/style.css       |  9 +++++----
 Thermo.Active/wwwroot/src/App.vue                   | 13 ++++++-------
 .../app_modules_thermo/components/paddle/burger.ts  |  4 ++--
 .../app_modules_thermo/components/paddle/sidebar.ts |  2 +-
 Thermo.Active/wwwroot/src/store/paddle.store.ts     | 11 ++++++++---
 6 files changed, 31 insertions(+), 21 deletions(-)

diff --git a/Thermo.Active/wwwroot/assets/styles/base/paddle.less b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
index 5df95499..3f303985 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/paddle.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
@@ -24,9 +24,14 @@ html {
   }
  
   .main-nav {
-    display: flex;
-    justify-content: space-between;
+    // display: flex;
+    // justify-content: space-between;
+    // padding: 0.5rem 0.8rem;
+    // float: left;
     padding: 0.5rem 0.8rem;
+    position: absolute;
+    bottom: 0;
+    right: 0;
   }
  
   ul.sidebar-panel-nav {
@@ -67,7 +72,7 @@ html {
         overflow-y: auto;
         background-color: #130f40;
         position: fixed;
-        left: 0;
+        right: 0;
         top: 0;
         height: 100vh;
         z-index: 999;
@@ -93,7 +98,7 @@ html {
         height: 30px;
         width: 32px;
         display: block;
-        z-index: 999;
+        z-index: 9999;
         border: 0;
         border-radius: 0;
         background-color: transparent;
diff --git a/Thermo.Active/wwwroot/assets/styles/style.css b/Thermo.Active/wwwroot/assets/styles/style.css
index 75346a50..532937ca 100644
--- a/Thermo.Active/wwwroot/assets/styles/style.css
+++ b/Thermo.Active/wwwroot/assets/styles/style.css
@@ -4092,9 +4092,10 @@ body {
   font-family: 'Lato';
 }
 .main-nav {
-  display: flex;
-  justify-content: space-between;
   padding: 0.5rem 0.8rem;
+  position: absolute;
+  bottom: 0;
+  right: 0;
 }
 ul.sidebar-panel-nav {
   list-style-type: none;
@@ -4128,7 +4129,7 @@ ul.sidebar-panel-nav > li > a {
   overflow-y: auto;
   background-color: #130f40;
   position: fixed;
-  left: 0;
+  right: 0;
   top: 0;
   height: 100vh;
   z-index: 999;
@@ -4150,7 +4151,7 @@ button:focus {
   height: 30px;
   width: 32px;
   display: block;
-  z-index: 999;
+  z-index: 9999;
   border: 0;
   border-radius: 0;
   background-color: transparent;
diff --git a/Thermo.Active/wwwroot/src/App.vue b/Thermo.Active/wwwroot/src/App.vue
index 386991bf..81a772df 100644
--- a/Thermo.Active/wwwroot/src/App.vue
+++ b/Thermo.Active/wwwroot/src/App.vue
@@ -11,6 +11,12 @@
       </div>
       <div id="main-view-handler" ref="main-view-handler" @click="toggleMainView()"  :class="{liftedUp : isMainViewLiftedUp,liftedDw : !isMainViewLiftedUp,'blur':(applyBlur || applyBlurNc)}">
 
+      <vue-gesture :type="'swipedown'" :call="toggleMainView" :onmove="movepanel" :onstart="onstartdrag" :onstop="onstopdrag">
+        <div class="handle" :title="'header_tooltip_close_uth' | localize('Close under-the-hood area')" >
+            <i class="fa fa-angle-double-down"></i>
+        </div>
+      </vue-gesture>
+      </div>
       <nav class="main-nav">
         <burger></burger>
       </nav>
@@ -22,13 +28,6 @@
           <li><a href="#contact">Contact</a></li>
         </ul>
       </sidebar>
-
-      <vue-gesture :type="'swipedown'" :call="toggleMainView" :onmove="movepanel" :onstart="onstartdrag" :onstop="onstopdrag">
-        <div class="handle" :title="'header_tooltip_close_uth' | localize('Close under-the-hood area')" >
-            <i class="fa fa-angle-double-down"></i>
-        </div>
-      </vue-gesture>
-      </div>
       <app-footer :class="{'blur':(applyBlur || applyBlurNc)}"></app-footer>
 
     </div>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
index 3e780a7e..3dd569a4 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
@@ -1,6 +1,6 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import { paddleStore, paddleActions } from '@/store/paddle.store';
+import paddleStore, { paddleActions } from '@/store/paddle.store';
 
 @Component({name: 'burger'})
 export default class Burger extends Vue{
@@ -9,7 +9,7 @@ export default class Burger extends Vue{
         return paddleStore.state.isNavOpen;
     }
 
-    togglePaddle() { 
+    togglePaddle() {
         paddleActions.Toggle(paddleStore);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
index 0146df71..b59aea70 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
@@ -1,6 +1,6 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import { paddleStore, paddleActions } from '@/store/paddle.store';
+import paddleStore, { paddleActions } from '@/store/paddle.store';
 
 @Component({name: 'sidebar'})
 export default class Sidebar extends Vue{
diff --git a/Thermo.Active/wwwroot/src/store/paddle.store.ts b/Thermo.Active/wwwroot/src/store/paddle.store.ts
index 2a2ccd2d..eb7336d2 100644
--- a/Thermo.Active/wwwroot/src/store/paddle.store.ts
+++ b/Thermo.Active/wwwroot/src/store/paddle.store.ts
@@ -1,6 +1,9 @@
 import Vue from 'vue';
+import Vuex from 'vuex'
 
-export const paddleStore= Vue.observable({
+Vue.use(Vuex)
+
+const paddleStore={
     state:{
         isNavOpen:false
     },
@@ -14,9 +17,11 @@ export const paddleStore= Vue.observable({
             context.commit("toggleNav");
         }
     }
-})
+}
 
-export const paddleActions = paddleStore.actions;
+export const paddleActions = paddleStore.actions; 
+
+export default new Vuex.Store(paddleStore);
 
 
 

From 1ab581bd436a3dea1778a215d2acbe439f165a07 Mon Sep 17 00:00:00 2001
From: "francesco.guerrieri" <fguerrieri1987@gmail.com>
Date: Wed, 29 Apr 2020 10:39:13 +0200
Subject: [PATCH 6/7] fix store

---
 .../src/app_modules/alarms/components/alarms-list.ts  |  2 +-
 .../app_modules_thermo/components/paddle/burger.ts    |  8 +++++---
 .../app_modules_thermo/components/paddle/sidebar.ts   |  8 +++++---
 Thermo.Active/wwwroot/src/store/app.store.ts          |  3 +++
 Thermo.Active/wwwroot/src/store/index.ts              |  3 +++
 Thermo.Active/wwwroot/src/store/paddle.store.ts       | 11 +++++------
 6 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/Thermo.Active/wwwroot/src/app_modules/alarms/components/alarms-list.ts b/Thermo.Active/wwwroot/src/app_modules/alarms/components/alarms-list.ts
index b7c65ea8..9498dd8f 100644
--- a/Thermo.Active/wwwroot/src/app_modules/alarms/components/alarms-list.ts
+++ b/Thermo.Active/wwwroot/src/app_modules/alarms/components/alarms-list.ts
@@ -133,7 +133,7 @@ export default class alarmsList extends Vue {
 
   public get opened(): boolean {
     return this.$store.state.alarms.opened;
-  }
+  } 
 
   public get serviceOpened(): boolean {
     return this.$store.state.alarms.serviceOpened;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
index 3dd569a4..1aa02b33 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
@@ -1,15 +1,17 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import paddleStore, { paddleActions } from '@/store/paddle.store';
+import {paddleActions } from '@/store';
 
 @Component({name: 'burger'})
 export default class Burger extends Vue{
 
     isBurgerActive(){
-        return paddleStore.state.isNavOpen;
+        debugger
+        return this.$store.state.paddle.isNavOpen;
     }
 
     togglePaddle() {
-        paddleActions.Toggle(paddleStore);
+        debugger
+        paddleActions.Toggle(this.$store.state.paddle);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
index b59aea70..8171782c 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
@@ -1,15 +1,17 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import paddleStore, { paddleActions } from '@/store/paddle.store';
+import { paddleActions } from '@/store/paddle.store';
 
 @Component({name: 'sidebar'})
 export default class Sidebar extends Vue{
 
     isPanelOpen(){
-        return paddleStore.state.isNavOpen;
+        debugger
+        return this.$store.state.paddle.isNavOpen;
     }
 
     closeSidebarPanel() {
-        paddleActions.Toggle(paddleStore);
+        debugger
+        paddleActions.Toggle(this.$store.state.paddle);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/store/app.store.ts b/Thermo.Active/wwwroot/src/store/app.store.ts
index a8fe29a1..1c3f4dd0 100644
--- a/Thermo.Active/wwwroot/src/store/app.store.ts
+++ b/Thermo.Active/wwwroot/src/store/app.store.ts
@@ -4,6 +4,7 @@ import Vuex, { Store } from 'vuex'
 import { machineInfoStore, MachineInfoModel } from "./machineInfo.store";
 import { machineStatusStore, MachineStatusModel } from "./machineStatus.store";
 import { alarmsStore, AlarmsModel } from "./alarms.store";
+import { paddleStore, PaddleModel } from "./paddle.store";
 import { processStore, RunningProcessModel } from "./runningProcess.store";
 import { localizationStore, LocalizationModel, localizationModelActions } from "./localization.store";
 import { toolingStore, ToolingStoreModel } from "./tooling.store";
@@ -25,6 +26,7 @@ export interface AppModel {
   isMainViewLiftedUp: boolean;
   isFavSoftkeySelection: boolean;
 
+  paddle: PaddleModel;
   machineInfo: MachineInfoModel;
   machineStatus: MachineStatusModel;
 
@@ -68,6 +70,7 @@ const _store = {
 
   modules: {
     // Sottomoduli dello store
+    paddle: paddleStore,
     machineInfo: machineInfoStore,
     machineStatus: machineStatusStore,
     process: processStore,
diff --git a/Thermo.Active/wwwroot/src/store/index.ts b/Thermo.Active/wwwroot/src/store/index.ts
index f7e6e9a6..6860fe59 100644
--- a/Thermo.Active/wwwroot/src/store/index.ts
+++ b/Thermo.Active/wwwroot/src/store/index.ts
@@ -1,5 +1,6 @@
 import { store, AppModel, appModelActions } from "./app.store";
 import { machineInfoActions, MachineInfoModel } from "./machineInfo.store";
+import { paddleActions, PaddleModel } from "./paddle.store"
 import { machineStatusActions, MachineStatusModel, buttonStatus } from "./machineStatus.store";
 import { AlarmsModel, alarmsModelActions, alarmsStore, AlarmModel } from "./alarms.store";
 import { processModelActions, processStore, RunningProcessModel } from "./runningProcess.store";
@@ -14,6 +15,8 @@ export {
     machineInfoActions,
     MachineInfoModel,
     machineStatusActions,
+    paddleActions,
+    PaddleModel,
     MachineStatusModel,
     AlarmsModel,
     alarmsModelActions,
diff --git a/Thermo.Active/wwwroot/src/store/paddle.store.ts b/Thermo.Active/wwwroot/src/store/paddle.store.ts
index eb7336d2..6424a573 100644
--- a/Thermo.Active/wwwroot/src/store/paddle.store.ts
+++ b/Thermo.Active/wwwroot/src/store/paddle.store.ts
@@ -1,12 +1,12 @@
-import Vue from 'vue';
-import Vuex from 'vuex'
 
-Vue.use(Vuex)
+export interface PaddleModel {
+    isNavOpen: boolean
+  }
 
-const paddleStore={
+export const paddleStore={
     state:{
         isNavOpen:false
-    },
+    } as PaddleModel,
     mutations: {
         toggleNav(store){
             store.isNavOpen = !store.isNavOpen
@@ -21,7 +21,6 @@ const paddleStore={
 
 export const paddleActions = paddleStore.actions; 
 
-export default new Vuex.Store(paddleStore);
 
 
 

From 684f59587868052a35fd50ea08b87179e86b1c36 Mon Sep 17 00:00:00 2001
From: Alessio <alessiogiombetti@live.it>
Date: Wed, 29 Apr 2020 11:08:24 +0200
Subject: [PATCH 7/7] fix store

---
 .../src/app_modules_thermo/components/paddle/burger.ts    | 8 ++++----
 .../src/app_modules_thermo/components/paddle/burger.vue   | 2 +-
 .../src/app_modules_thermo/components/paddle/sidebar.ts   | 8 ++++----
 .../src/app_modules_thermo/components/paddle/sidebar.vue  | 4 ++--
 Thermo.Active/wwwroot/src/store/paddle.store.ts           | 4 ++--
 5 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
index 1aa02b33..3d15b9fb 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.ts
@@ -1,17 +1,17 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import {paddleActions } from '@/store';
+import {paddleActions} from '@/store/paddle.store.ts';
 
 @Component({name: 'burger'})
 export default class Burger extends Vue{
 
     isBurgerActive(){
-        debugger
+        
         return this.$store.state.paddle.isNavOpen;
     }
 
     togglePaddle() {
-        debugger
-        paddleActions.Toggle(this.$store.state.paddle);
+        
+        paddleActions.Toggle(this.$store);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
index 1ef2ebbe..f8db1648 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/burger.vue
@@ -1,5 +1,5 @@
 <template>
-    <div id="burger" :class="{ 'active' : isBurgerActive }" @click.prevent="togglePaddle">
+    <div id="burger" :class="{ 'active' : isBurgerActive() }" @click="togglePaddle()">
         <slot>
             <button type="button" class="burger-button" title="Menu">
                 <span class="burger-bar burger-bar--1"></span>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
index 8171782c..c89058a2 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.ts
@@ -1,17 +1,17 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import { paddleActions } from '@/store/paddle.store';
+import {paddleActions} from '@/store/paddle.store';
 
 @Component({name: 'sidebar'})
 export default class Sidebar extends Vue{
 
     isPanelOpen(){
-        debugger
+        
         return this.$store.state.paddle.isNavOpen;
     }
 
     closeSidebarPanel() {
-        debugger
-        paddleActions.Toggle(this.$store.state.paddle);
+        
+        paddleActions.Toggle(this.$store);
     }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
index 0d39c16e..7b76dfad 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
@@ -1,8 +1,8 @@
 <template>
     <div class="sidebar">
-        <div class="sidebar-backdrop" @click="closeSidebarPanel" v-if="isPanelOpen"></div>
+        <div class="sidebar-backdrop" @click="closeSidebarPanel()" v-if="isPanelOpen()"></div>
         <transition name="slide">
-            <div v-if="isPanelOpen" class="sidebar-panel">
+            <div v-if="isPanelOpen()" class="sidebar-panel">
                 <slot></slot>
             </div>
         </transition>
diff --git a/Thermo.Active/wwwroot/src/store/paddle.store.ts b/Thermo.Active/wwwroot/src/store/paddle.store.ts
index 6424a573..f74b748e 100644
--- a/Thermo.Active/wwwroot/src/store/paddle.store.ts
+++ b/Thermo.Active/wwwroot/src/store/paddle.store.ts
@@ -8,8 +8,8 @@ export const paddleStore={
         isNavOpen:false
     } as PaddleModel,
     mutations: {
-        toggleNav(store){
-            store.isNavOpen = !store.isNavOpen
+        toggleNav(state){
+            state.isNavOpen=!state.isNavOpen
         }
     },
     actions:{