Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/sass-loader

src/_store/account.module.js

@@ -118,7 +118,7 @@ const actions = {
             .then(
                 ok => {
                     commit('restoreSuccess');
-                    systemConfigs.isWaitingRestoring = false;
+                    systemConfigs.awaitingRestore = false;
                 },
                 error => commit('restoreFailure', error)
             );

src/_store/system.module.js

@@ -21,7 +21,7 @@ const state = {
         launchLock: null,
         promoCodePolicy: null,
         requireSendMetrics: null,
-        isWaitingRestoring: false,
+        awaitingRestore: false,
         support: {},
         securityLevels: null
     },

src/account/DevicesPage.vue

@@ -13,7 +13,8 @@
 <!--                    <th nowrap="nowrap">{{messages.label_field_device_enabled}}</th>-->
                     <th>{{messages.label_field_device_vpn_config}}</th>
                     <th nowrap="nowrap">{{messages.label_field_device_certificate}}</th>
-                    <th nowrap="nowrap">{{messages.label_field_security_level}}</th>
+                    <th nowrap="nowrap">{{messages.label_field_device_security_level}}</th>
+                    <th nowrap="nowrap">{{messages.label_field_device_connection}}</th>
 <!--                    <th>{{messages.label_field_device_ctime}}</th>-->
                     <th>{{messages.label_field_device_help}}</th>
                     <th><!-- delete --></th>
@@ -59,7 +60,7 @@
                             {{messages.message_device_vpn_unavailable}}
                         </div>
                     </td>
-                    <td nowrap="nowrap">
+                    <td>
                         <a :href="'/api/auth/cacert?deviceType='+device.deviceType">
                             {{messages.message_download_ca_cert}}
                         </a>
@@ -72,6 +73,38 @@
                             </select>
                         </form>
                     </td>
+                    <td class="device-connection-status">
+                        <div v-if="device.status.ip">
+                            {{device.status.ip}}
+                            <div v-if="device.status.location">
+                                <hr/>
+                                <span v-if="device.status.location.city && device.status.location.region && device.status.location.country">{{device.status.location.city}}, {{device.status.location.region}}, {{messages['country_'+device.status.location.country]}}</span>
+                                <span v-else-if="device.status.location.region && device.status.location.country">{{device.status.location.region}}, {{messages['country_'+device.status.location.country]}}</span>
+                                <span v-else-if="device.status.location.city && device.status.location.country">{{device.status.location.city}}, {{messages['country_'+device.status.location.country]}}</span>
+                                <span v-else-if="device.status.location.country">{{messages['country_'+device.status.location.country]}}</span>
+                                <span v-else-if="device.status.location.city && device.status.location.region">{{device.status.location.city}}, {{device.status.location.region}}</span>
+                                <span v-else-if="device.status.location.region">{{device.status.location.region}}</span>
+                                <span v-else-if="device.status.location.city">{{device.status.location.city}}</span>
+                            </div>
+                        </div>
+                        <div v-if="device.status.bytesSent || device.status.bytesReceived">
+                            <hr/>
+                            <div v-if="device.status.bytesSent">
+                                {{device.status.bytesSent}}{{device.status.sentUnits}} {{messages.label_field_device_transfer_sent}}
+                            </div>
+                            <div v-if="device.status.bytesReceived">
+                                {{device.status.bytesReceived}}{{device.status.receivedUnits}} {{messages.label_field_device_transfer_received}}
+                            </div>
+                        </div>
+                        <div v-if="device.status.lastHandshakeTime">
+                            <hr/>
+                            {{messages.label_field_device_connection_handshake}}:
+                            <span v-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>
+                            <span v-else-if="device.status.lastHandshakeSeconds">{{device.status.lastHandshakeSeconds}}{{messages.units_seconds_short}}</span>
+                            {{messages.label_field_device_connection_handshake_ago}}
+                        </div>
+                    </td>
 <!--                    <td nowrap="nowrap">{{messages.label_device_ctime_format.parseDateMessage(device.ctime, messages)}}</td>-->
                     <td>
                         <div v-if="displayDeviceHelp[device.uuid] === true" class="device-help-div">

src/account/NetworkPage.vue

@@ -119,17 +119,19 @@
             <div v-if="errors.has('node')" class="invalid-feedback d-block">{{ errors.first('node') }}</div>
             <div v-if="errors.has('accountPlan')" class="invalid-feedback d-block">{{ errors.first('accountPlan') }}</div>
 
-            <div v-if="network.state !== 'stopping' && backups && backups.length > 0" style="border: 2px solid #000;">
-                <button @click="stopNet()" class="btn btn-danger" :disabled="loading && loading.stopping">
-                    {{messages.link_network_action_stop}}
-                </button>
-                <img v-show="loading && loading.stopping" :src="loadingImgSrc" />
-                {{messages.link_network_action_stop_description}}
+            <span v-if="network.state !== 'stopping' && network.state !== 'stopped' && backups && backups.length > 0">
+                <div style="border: 2px solid #000;">
+                    <button @click="stopNet()" class="btn btn-danger" :disabled="loading && loading.stopping">
+                        {{messages.link_network_action_stop}}
+                    </button>
+                    <img v-show="loading && loading.stopping" :src="loadingImgSrc" />
+                    {{messages.link_network_action_stop_description}}
 
-                <!-- the next condition is to prevent this info shown twice on this page -->
-                <span v-if="!isSelfNetAndRunning" v-html="latestBackupInfoHtml"></span>
-            </div>
-            <br/>
+                    <!-- the next condition is to prevent this info shown twice on this page -->
+                    <span v-if="!isSelfNetAndRunning" v-html="latestBackupInfoHtml"></span>
+                </div>
+                <br/>
+            </span>
             <div style="border: 2px solid #000;">
                 <button @click="deleteNet()" class="btn btn-danger" :disabled="loading && loading.deleting">
                     {{messages.link_network_action_delete}}
@@ -203,7 +205,7 @@
                     let lastBackup = this.backups[0];
                     return '<hr/>' + this.messages.label_latest_backup
                            + " " + lastBackup.label + " <i>" + lastBackup.status + "</i> "
-                           + this.messages.date_format_app_data_epoch_time.parseDateMessage(lastBackup.creationTime,
+                           + this.messages.date_format_app_data_epoch_time.parseDateMessage(lastBackup.ctime,
                                                                                             this.messages);
                 }
             },
@@ -339,6 +341,7 @@
         beforeDestroy () {
             this.clearRefresherInterval(this.refresher);
             this.clearRefresherInterval(this.stopRefresher);
+            this.restoreKey = null;
         },
         watch: {
             network (net) {

src/app/App.vue

@@ -92,7 +92,7 @@ export default {
         },
         locales () { return this.configs.locales; },
         path () { return this.$route.path; },
-        isInRestoringMode () { return this.configs ? this.configs.isWaitingRestoring : undefined; }
+        isInRestoringMode () { return this.configs ? this.configs.awaitingRestore : undefined; }
     },
     methods: {
         ...mapActions({ clearAlert: 'alert/clear' }),

src/auth/RegisterPage.vue

@@ -25,33 +25,6 @@
                 <div v-if="submitted && errors.has('promoCode')" class="invalid-feedback d-block">{{ errors.first('promoCode') }}</div>
                 <small><a :href="messages.message_request_promoCode_link">{{messages.message_request_promoCode}}</a></small>
             </div>
-
-<!--            <div v-if="plan" class="form-group">-->
-<!--                <label htmlFor="paymentMethod">{{messages.field_label_paymentMethod}}</label>-->
-<!--                <div v-if="typeof payMethods === 'undefined' || payMethods === null || payMethods.length === 0" class="invalid-feedback d-block">-->
-<!--                    <h5>{{messages.err_noPaymentMethods}}</h5>-->
-<!--                </div>-->
-<!--                <div v-else-if="payMethods.length > 1">-->
-<!--                        <span v-for="pm in payMethods">-->
-<!--                            <button v-if="!pm.driverClass.endsWith('NoopCloud')" class="btn btn-primary" :disabled="loading()" @click="setPaymentMethod(pm)">{{messages['payment_description_'+pm.paymentMethodType]}}</button>-->
-<!--                        </span>-->
-<!--                </div>-->
-
-<!--                <div v-for="pm in payMethods">-->
-<!--                    <div v-if="selectedPaymentMethod !== null && selectedPaymentMethod.driverClass !== null && selectedPaymentMethod.driverClass === pm.driverClass">-->
-<!--                        <router-view name="pay_stripe" v-if="pm.driverClass.endsWith('StripePaymentDriver')"></router-view>-->
-<!--                        <router-view name="pay_invite" v-else-if="pm.driverClass.endsWith('CodePaymentDriver')"></router-view>-->
-<!--                        <router-view name="pay_free" v-else-if="pm.driverClass.endsWith('FreePaymentDriver')"></router-view>-->
-<!--                        &lt;!&ndash; <router-view name="pay_unknown" v-else></router-view> &ndash;&gt;-->
-<!--                    </div>-->
-<!--                </div>-->
-<!--                <div v-if="submitted && errors.has('paymentInfo')" class="invalid-feedback d-block">{{ errors.first('paymentInfo') }}</div>-->
-<!--                <div v-if="submitted && errors.has('paymentMethod')" class="invalid-feedback d-block">{{ errors.first('paymentMethod') }}</div>-->
-<!--                <div v-if="submitted && errors.has('paymentMethodInfo')" class="invalid-feedback d-block">{{ errors.first('paymentMethodInfo') }}</div>-->
-<!--                <div v-if="submitted && errors.has('paymentMethodType')" class="invalid-feedback d-block">{{ errors.first('paymentMethodType') }}</div>-->
-<!--                <div v-if="submitted && errors.has('paymentMethodService')" class="invalid-feedback d-block">{{ errors.first('paymentMethodService') }}</div>-->
-<!--            </div>-->
-
             <div class="form-group">
                 <label for="user.agreeToTerms" v-html="messages.field_label_agreeToTerms"></label>
                 <input type="checkbox" id="user.agreeToTerms" v-model="user.agreeToTerms">

src/auth/RestorePage.vue

@@ -5,7 +5,7 @@
 
         <div v-if="!configs"><img :src="loadingImgSrc" /></div>
 
-        <div v-else-if="!configs.isWaitingRestoring" class="alert alert-info">
+        <div v-else-if="!configs.awaitingRestore" class="alert alert-info">
             {{ messages.message_restore_not_applicable }}<hr/>
             <a href="/">{{ messages.message_back_to_root }}</a>
         </div>

src/index.html

@@ -108,6 +108,9 @@
         .bubble-field-help {
             font-size: small;
         }
+        .device-connection-status {
+            font-size: x-small;
+        }
         .bubble-app-icon {
             font-size: x-large;
         }