Added support for POPUP gadget in launcher

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_appcache.xml

@@ -182,6 +182,8 @@ gadget_erp5_label_field.html\n
 gadget_erp5_label_field.js\n
 gadget_erp5_notification.html\n
 gadget_erp5_notification.js\n
+gadget_erp5_popup.html\n
+gadget_erp5_popup.js\n
 gadget_erp5_page_action.html\n
 gadget_erp5_page_action.js\n
 gadget_erp5_page_export.html\n
@@ -386,7 +388,7 @@ NETWORK:\n
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>965.19284.27735.63931</string> </value>
+                <value> <string>969.16049.29484.11946</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -404,7 +406,7 @@ NETWORK:\n
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1517844236.51</float>
+                        <float>1532944412.48</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_launcher_html.html

@@ -44,6 +44,10 @@
           data-gadget-scope="notification"
           data-gadget-sandbox="public"></div>
 
+       <div data-gadget-url="gadget_erp5_popup.html"
+          data-gadget-scope="popup"
+          data-gadget-sandbox="public"></div>
+
       <div data-gadget-url="${translation_gadget}"
           data-gadget-scope="translation_gadget"
           data-gadget-sandbox="public"></div>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_launcher_html.xml

@@ -236,7 +236,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>965.19244.9866.14694</string> </value>
+                <value> <string>968.54671.14652.65092</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -254,7 +254,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1517843980.1</float>
+                        <float>1531350333.5</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_launcher_js.js

@@ -374,6 +374,12 @@
       ]);
     })
 
+    .allowPublicAcquisition('popupshow', function (argument_list) {
+      return RSVP.all([
+        route(this, "popup", 'display_popup', argument_list)
+      ]);
+    })
+
     .allowPublicAcquisition('isDesktopMedia', function (argument_list) {
       return window.matchMedia("(min-width: 85em)").matches;
     })

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_launcher_js.xml

@@ -230,7 +230,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>966.11431.6711.50466</string> </value>
+                <value> <string>968.55010.57056.26112</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -248,7 +248,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1521043696.52</float>
+                        <float>1531350348.55</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt

@@ -997,9 +997,6 @@ div[data-gadget-scope='header'] .ui-header {
       @media @desktop {
         .renderDesktopSubLink();
       }
-      &.ui-icon-warning {
-        background-color: @coloraccent;
-      }
     }
   }
 
@@ -1492,11 +1489,6 @@ div[data-gadget-scope='header'] .ui-header {
 
     }
   }
-  .ui-icon-warning {
-    color: @coloraccent;
-    // Link is disabled in this case
-    opacity: 1;
-  }
 }
 
 /**********************************************
@@ -1524,9 +1516,107 @@ div[data-gadget-scope='header'] .ui-header {
   }
 }
 
+/**********************************************
+* POPUP
+**********************************************/
+@color_1: #FFFFFF;
+@color_2: #ffffff;
+@background_color_1: rgba(0,0,0,0.5);
+@background_color_2: rgba(255, 255, 255, 1);
+@background_color_3: #f4511e;
+@background_color_4: #085078;
+
+@keyframes overlayanimation {
+	0% {
+		margin-left: 100%;
+		transform: translateX(0%);
+	}
+	100% {
+		margin-left: 50%;
+		transform: translateX(-50%);
+	}
+}
+@media screen and (min-width: 320px) and (max-width: 400px) {
+	div[data-gadget-scope='popup'] {
+		div.overlay {
+			width: 320px;
+		}
+	}
+}
+@media screen and (min-width: 400px) {
+	div[data-gadget-scope='popup'] {
+		div.overlay {
+			width: 400px;
+		}
+	}
+}
+div[data-gadget-scope='popup'] {
+	background-color: @background_color_1;
+	visibility: hidden;
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	width: 100%;
+	height: 100%;
+	text-align: center;
+	z-index: 99998;
+	div.overlay {
+		margin: 100px auto;
+		padding: 0px;
+		padding-top: 0px;
+		text-align: center;
+		background-color: @background_color_2;
+		border: 1px solid #111111;
+		box-shadow: 2px 2px 40px #222;
+		animation: overlayanimation 0.2s ease-out;
+	}
+	form {
+		width: auto;
+		height: auto;
+		margin: 0 auto;
+		padding: 10px;
+		padding-top: 0px;
+		position: relative;
+	}
+	button {
+		display: inline-block;
+		background-color: @background_color_3;
+		border: none;
+		color: @color_1;
+		text-align: center;
+		font-size: 15px;
+		padding: 10px;
+		width: 100px;
+		cursor: pointer;
+		margin: 5px;
+		margin-top: 15px;
+	}
+	h3 {
+		font-size: 15px;
+		background-color: @background_color_4;
+		color: @color_2;
+		height: 30px;
+		line-height: 30px;
+		text-align: center;
+		border-bottom: 1px solid #000000;
+	}
+	span {
+		font-size: 45px;
+		overflow: hidden;
+	}
+}
+div[data-gadget-scope='popup'].visible {
+	visibility: visible;
+}
+
+
+
 /**********************************************
 * Listbox
 **********************************************/
+
 div[data-gadget-scope='erp5_searchfield'] {
   padding-top: @margin-size;
 
@@ -1904,9 +1994,6 @@ div[data-gadget-scope='notification'] {
       .ui-controlgroup-controls {
         button, a {
           .renderTabletHeaderButton();
-          &.ui-icon-warning {
-            background-color: @coloraccent;
-          }
         }
       }
 
@@ -1964,6 +2051,13 @@ div[data-gadget-scope='maximize'] button {
   }
 }
 
+.ui-icon-warning {
+  background-color: @coloraccent !important;
+  &::before {
+    content: "\f071";
+  }
+}
+
 .ui-icon-spinner {
   // Don't fade spinner
   opacity: 1;
@@ -2306,9 +2400,6 @@ div[data-gadget-scope='maximize'] button {
 .ui-icon-eye-slash::before {
   content: "\f070";
 }
-.ui-icon-warning::before {
-  content: "\f071";
-}
 .ui-icon-low-vision::before {
   content: "\f2a8";
 }