Add logic for demo server (#444)

frontend/src/audio/ui/AudioPanel.vue

@@ -80,13 +80,14 @@ export default {
       },
       audioData: {},
       data: [],
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   created() {
     this.getOriginAudioData();
   },
   mounted() {
-    if (this.running) {
+    if (this.running && !this.isDemo) {
       this.startInterval();
     }
   },
@@ -97,7 +98,7 @@ export default {
 
   watch: {
     running: function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
     currentIndex: function(index) {
       if (this.data && this.data[index]) {

frontend/src/audio/ui/Config.vue

@@ -20,6 +20,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -44,6 +45,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {

frontend/src/high-dimensional/HighDimensional.vue

@@ -49,6 +49,7 @@ export default {
       },
       embeddingData: [],
       showLoading: false,
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   created() {
@@ -61,7 +62,7 @@ export default {
       }
     });
 
-    if (this.config.running) {
+    if (this.config.running && !this.isDemo) {
       this.startInterval();
     }
   },
@@ -79,7 +80,7 @@ export default {
       this.fetchDatasets();
     },
     'config.running': function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
   },
   mounted() {

frontend/src/high-dimensional/ui/Config.vue

@@ -54,6 +54,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -78,6 +79,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {

frontend/src/histogram/ui/Chart.vue

@@ -66,6 +66,7 @@ export default {
     return {
       originData: [],
       isExpand: false,
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   watch: {
@@ -76,7 +77,7 @@ export default {
       this.initChartOption();
     },
     running: function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
     isExpand: function(val) {
       this.expandArea(val);
@@ -85,7 +86,7 @@ export default {
   mounted() {
     let tagInfo = this.tagInfo;
     this.initChart(tagInfo);
-    if (this.running) {
+    if (this.running && !this.isDemo) {
       this.startInterval();
     }
   },

frontend/src/histogram/ui/Config.vue

@@ -32,6 +32,7 @@
       class="visual-dl-page-run-toggle"
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       dark
       block
@@ -64,6 +65,7 @@ export default {
           value: 'offset',
         },
       ],
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {

frontend/src/images/ui/Config.vue

@@ -25,6 +25,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -49,6 +50,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {

frontend/src/images/ui/Image.vue

@@ -93,13 +93,14 @@ export default {
       data: [],
       height: defaultImgHeight,
       weight: defaultImgWidth,
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   created() {
     this.getOriginChartsData();
   },
   mounted() {
-    if (this.running) {
+    if (this.running && !this.isDemo) {
       this.startInterval();
     }
   },
@@ -110,7 +111,7 @@ export default {
 
   watch: {
     running: function(val) {
-      val ? this.startInterval() : this.stopInterval();
+      (val && !this.isDemo) ? this.startInterval() : this.stopInterval();
     },
     currentIndex: function(index) {
       /* eslint-disable fecs-camelcase */

frontend/src/scalars/ui/Config.vue

@@ -64,11 +64,11 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
       block
-      v-if="!isDemo"
     >
       {{ config.running ? 'Running' : 'Stopped' }}
     </v-btn>

frontend/src/texts/ui/Config.vue

@@ -22,6 +22,7 @@
     <v-btn
       :color="config.running ? 'primary' : 'error'"
       v-model="config.running"
+      v-if="!isDemo"
       @click="toggleAllRuns"
       class="visual-dl-page-run-toggle"
       dark
@@ -46,6 +47,7 @@ export default {
   },
   data() {
     return {
+      isDemo: process.env.NODE_ENV === 'demo',
     };
   },
   methods: {