Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into fix/missing-functionalities

src/_components/modals/LaunchBubbleSettingsModal.vue

@@ -2,10 +2,10 @@
 <template>
   <modal
     name="advanced-settings"
-    :adaptive="true"
     width="90%"
     :maxWidth="600"
     height="auto"
+    scrollable
   >
     <a class="close-btn" @click="hide">
       <i class="fa fa-times"></i>
@@ -295,6 +295,12 @@
   right: 20px;
   font-size: 20px;
 }
+
+.vm--modal {
+  max-width: 600px;
+  left: 50% !important;
+  transform: translate(-50%, 0) !important;
+}
 </style>
 
 <script>

src/_pages/main/account/Devices.vue

@@ -228,8 +228,11 @@
               <div v-if="device.status.lastHandshakeTime">
                 <hr />
                 {{ messages.label_field_device_connection_handshake }}:
+                <span v-if="device.status.lastHandshakeDay">
+                  {{ device.status.lastHandshakeDays }}{{ messages.units_days }}
+                </span>
                 <span
-                  v-if="
+                  v-else-if="
                     device.status.lastHandshakeHours &&
                       device.status.lastHandshakeMinutes
                   "

src/_pages/main/bubble/LaunchBubble.vue

@@ -17,7 +17,13 @@
       class="d-flex flex-column align-items-center justify-content-center mt-5 mx-auto launch-bubble-wrapper"
     >
       <div ref="lottie" class="lottie"></div>
-      <Button color="default" width="80%" height="60" @click="launchBubble">
+      <Button
+        color="default"
+        width="80%"
+        height="60"
+        @click="launchBubble"
+        :disabled="loading()"
+      >
         {{ messages.button_label_launch_bubble }}
       </Button>
 
@@ -161,7 +167,11 @@ export default {
 
     initDefaults() {
       const currentUser = util.currentUser();
-      this.getAllAccountPaymentMethods({userId: currentUser.uuid, messages: this.messages, errors: this.errors});
+      this.getAllAccountPaymentMethods({
+        userId: currentUser.uuid,
+        messages: this.messages,
+        errors: this.errors,
+      });
     },
 
     findRegion(uuid) {

src/_pages/main/bubble/LaunchingBubble.vue

@@ -24,7 +24,11 @@
       >
         <!-- adapted from: https://code-boxx.com/simple-vanilla-javascript-progress-bar/ -->
         <div v-if="stats.percent" class="progress-wrap">
-          <div class="progress-bar" :style="'width: '+stats.percent+'%'" :id="'progressBar_'+networkId"></div>
+          <div
+            class="progress-bar"
+            :style="'width: ' + stats.percent + '%'"
+            :id="'progressBar_' + networkId"
+          ></div>
           <div class="progress-text">
             {{
               messages.label_percent.parseMessage(this, {
@@ -38,7 +42,7 @@
         </div>
         <hr />
       </div>
-      <Button color="default" width="195" height="60">
+      <Button color="default" width="195" height="60" @click="deleteNet">
         {{ messages.button_cancel_lauch_bubble }}
       </Button>
     </div>
@@ -118,6 +122,9 @@ export default {
       refresher: null,
       networkId: this.$route.params.id,
       lottie: null,
+      timerID: null,
+      frameNumber: 0,
+      targetFrameNumber: 0,
     };
   },
 
@@ -148,6 +155,17 @@ export default {
       autoplay: false,
       path: '/launching-bubble.json',
     });
+    this.frameNumber = 0;
+    this.targetFrameNumber = 20;
+
+    setTimeout(() => {
+      this.timerID = setInterval(() => {
+        if (this.frameNumber < this.targetFrameNumber) {
+          console.log(this.frameNumber);
+          this.frameNumber++;
+        }
+      }, 100);
+    }, 2000);
   },
 
   beforeDestroy() {
@@ -245,6 +263,18 @@ export default {
         }
       }
     },
+
+    deleteNet() {
+      if (confirm(this.messages.confirmation_network_action_delete)) {
+        this.errors.clear();
+        this.deleteNetwork({
+          userId: this.user.uuid,
+          networkId: this.networkId,
+          messages: this.messages,
+          errors: this.errors,
+        });
+      }
+    },
   },
 
   watch: {
@@ -283,6 +313,7 @@ export default {
           this.stats.messageKey.startsWith('meter_completed_');
         if ((this.statsError && !isStatsErrorRetry) || isStatsCompleted) {
           this.clearRefresherInterval(this.refresher);
+          this.$router.push(`/bubble/${this.networkId}`);
         }
       } else {
         // status not found for our network
@@ -290,10 +321,7 @@ export default {
       }
 
       if (this.stats) {
-        this.lottie.goToAndStop(
-          (this.lottie.totalFrames / 100) * this.stats.percent,
-          true
-        );
+        this.targetFrameNumber = 20 + (30 / 100) * this.stats.percent;
       }
     },
 
@@ -302,6 +330,13 @@ export default {
         this.$router.replace({ path: '/bubbles' });
       }
     },
+
+    frameNumber() {
+      this.lottie.goToAndStop(this.frameNumber, true);
+      if (this.frameNumber >= 50) {
+        clearInterval(this.timerID);
+      }
+    },
   },
 };
 </script>

src/account/AppConfigPage.vue

@@ -199,7 +199,7 @@
             actionIsAvailable(action, row) {
                 if (typeof action.when === 'undefined' || action.when === null) return true;
                 try {
-                    return safeEval(action.when, {'item': row}) === true;
+                    return safeEval(action.when, {'item': row, 'account': this.user}) === true;
                 } catch (e) {
                     console.log('actionIsAvailable: error evaluating when='+action.when+' for item='+JSON.stringify(row)+': '+e);
                     return false;

src/account/AppPage.vue

@@ -145,7 +145,7 @@
             viewIsAvailable(view) {
                 if (typeof view.when === 'undefined' || view.when === null) return true;
                 try {
-                    return safeEval(view.when, {'configs': this.configs}) === true;
+                    return safeEval(view.when, {'configs': this.configs, 'account': this.user}) === true;
                 } catch (e) {
                     console.log('viewIsAvailable: error evaluating when='+view.when+': '+e);
                     return false;
@@ -171,9 +171,10 @@
                     const allConfigViews = a.dataConfig.configViews;
                     const appConfigViews = [];
                     for (let i=0; i<allConfigViews.length; i++) {
-                        if (typeof allConfigViews[i].root !== 'undefined' && allConfigViews[i].root !== null && allConfigViews[i].root === true) {
-                            if (this.viewIsAvailable(allConfigViews[i])) {
-                                appConfigViews.push(allConfigViews[i]);
+                      let configView = allConfigViews[i];
+                      if (typeof configView.root !== 'undefined' && configView.root !== null && configView.root === true) {
+                            if (this.viewIsAvailable(configView)) {
+                                appConfigViews.push(configView);
                             }
                         }
                     }

src/account/DevicesPage.vue

@@ -99,7 +99,8 @@
                         <div v-if="device.status.lastHandshakeTime">
                             <hr/>
                             {{messages.label_field_device_connection_handshake}}:
-                            <span v-if="device.status.lastHandshakeHours && device.status.lastHandshakeMinutes">{{device.status.lastHandshakeHours}}{{messages.units_hours_short}}, {{device.status.lastHandshakeMinutes}}{{messages.units_minutes_short}}</span>
+                            <span v-if="device.status.lastHandshakeDays">{{device.status.lastHandshakeDays}}{{messages.units_days}}</span>
+                            <span v-else-if="device.status.lastHandshakeHours && device.status.lastHandshakeMinutes">{{device.status.lastHandshakeHours}}{{messages.units_hours_short}}, {{device.status.lastHandshakeMinutes}}{{messages.units_minutes_short}}</span>
                             <span v-else-if="device.status.lastHandshakeHours">{{device.status.lastHandshakeHours}}{{messages.units_hours_short}}</span>
                             <span v-else-if="device.status.lastHandshakeMinutes && device.status.lastHandshakeSeconds">{{device.status.lastHandshakeMinutes}}{{messages.units_minutes_short}}, {{device.status.lastHandshakeSeconds}}{{messages.units_seconds_short}}</span>
                             <span v-else-if="device.status.lastHandshakeMinutes">{{device.status.lastHandshakeMinutes}}{{messages.units_minutes_short}}</span>

src/account/NewNetworkPage.vue

@@ -104,14 +104,15 @@
                 <div v-if="showForkOption">
                 <!-- network type -->
                 <div class="form-group">
-                    <label for="networkType">{{messages.field_label_network_type}}</label>
-                    <select v-model="networkType" name="networkType" class="form-control">
-                        <option value="bubble">{{messages.field_label_network_type_regular}}</option>
-                        <option value="fork">{{messages.field_label_network_type_fork}}</option>
+                    <label for="launchType">{{messages.field_label_network_type}}</label>
+                    <select v-model="accountPlan.launchType" name="launchType" class="form-control">
+                        <option value="node">{{messages.field_label_network_type_regular}}</option>
+                        <option value="fork_sage">{{messages.field_label_network_type_fork_sage}}</option>
+                        <option value="fork_node">{{messages.field_label_network_type_fork_node}}</option>
                     </select>
                 </div>
                 <!-- fork host -->
-                <div v-if="networkType === 'fork'" class="form-group">
+                <div v-if="accountPlan.launchType === 'fork_sage' || accountPlan.launchType === 'fork_node'" class="form-group">
                     <label for="forkHost">{{messages.field_label_network_fork_host}}</label>
                     <input type="text" v-model="accountPlan.forkHost" name="forkHost" class="form-control" :class="{ 'is-invalid': submitted && errors.has('forkHost') }" />
                     <div v-if="submitted && errors.has('forkHost')" class="invalid-feedback d-block">{{ errors.first('forkHost') }}</div>
@@ -149,7 +150,7 @@
             </div>
             <div>
                 {{messages['plan_description_'+accountPlan.plan]}}
-                <div v-if="networkType === 'fork'"><hr/>{{messages.message_plan_fork_apps}}</div>
+                <div v-if="accountPlan.launchType === 'fork_sage' || accountPlan.launchType === 'fork_node'"><hr/>{{messages.message_plan_fork_apps}}</div>
                 <div v-else-if="selectedPlan && selectedPlan.apps && selectedPlan.apps.length > 0">
                     <div v-if="typeof selectedPlan.maxAccounts !== 'undefined' && selectedPlan.maxAccounts !== null && selectedPlan.maxAccounts === 1">&bullet; {{messages.message_plan_max_accounts_one}}</div>
                     <div v-else-if="typeof selectedPlan.maxAccounts !== 'undefined' && selectedPlan.maxAccounts !== null && selectedPlan.maxAccounts > 1">&bullet; {{messages.message_plan_max_accounts_multiple.parseExpression({max: selectedPlan.maxAccounts})}}</div>
@@ -283,7 +284,7 @@
 <!--                <p>{{messages.field_label_sync_account_description}}</p>-->
 <!--            </div>-->
             <!-- launch lock -->
-<!--            <div class="form-group" v-if="networkType !== 'fork'">-->
+<!--            <div class="form-group" v-if="accountPlan.launchType !== 'fork_sage' && accountPlan.launchType !== 'fork_node'">-->
 <!--                <label for="launchLock">{{messages.field_label_launch_lock}}</label>-->
 <!--                <input type="checkbox" id="launchLock" v-model="accountPlan.launchLock">-->
 <!--                <div v-if="submitted && errors.has('launchLock')" class="invalid-feedback d-block">{{ errors.first('launchLock') }}</div>-->
@@ -393,12 +394,12 @@
                     },
                     sshKey: '',
                     forkHost: '',
+                    launchType: 'node',
                     syncAccount: true,
                     launchLock: false,
                     sendErrors: true,
                     sendMetrics: true
                 },
-                networkType: 'bubble',
                 cloudRegionUuid: null,
                 regions: [],
                 customize: {