renusify 1.0.5 → 1.0.8

package/components/chat/index.vue

@@ -1,119 +1,114 @@
 <template>
-    <div :class="$r.prefix+'chat'">
-        <div class="chat-header" v-if="title">{{title}}</div>
-        <message-list ref="msgList" @see="$emit('see', $event)" :messages="msgs" :myself="myself"
-                      :participants="participants"
-                      :newMsg="newMsg"
-                      :hideBottomBtn="hideBottomBtn"
-        >
-        </message-list>
-        <r-chat-input v-if="!hideSend"
-                      @update:model-value="onMsgSubmit"
-                      :send-by-enter="sendByEnter"
-                      :maxLenMsg="maxLenMsg"
-                      :placeholder="placeholder"
-                      :uploadLink="uploadLink"
-                      :maxFileSize="maxFileSize"
-                      :canFile="canFile"
-        ></r-chat-input>
-    </div>
+  <div :class="$r.prefix+'chat'">
+    <div class="chat-header" v-if="title">{{ title }}</div>
+    <message-list ref="msgList" @see="$emit('see', $event)" :messages="msgs" :myself="myself"
+                  :participants="participants"
+                  :newMsg="newMsg"
+                  :hideBottomBtn="hideBottomBtn"
+    >
+    </message-list>
+    <r-chat-input v-if="!hideSend"
+                  @update:model-value="onMsgSubmit"
+                  :send-by-enter="sendByEnter"
+                  :maxLenMsg="maxLenMsg"
+                  :placeholder="placeholder"
+                  :uploadLink="uploadLink"
+                  :maxFileSize="maxFileSize"
+                  :canFile="canFile"
+    ></r-chat-input>
+  </div>
 </template>
 <script>
-    import MessageList from "./MessageList";
-    import RChatInput from "./chatInput";
+import MessageList from "./MessageList";
+import RChatInput from "./chatInput";
 
-    export default {
-        name: 'r-chat',
-        components: {RChatInput, MessageList},
-        props: {
-            sendByEnter: Boolean,
-            placeholder: {type: String, default: 'type here'},
-            hideBottomBtn: Boolean,
-            hideSend: Boolean,
-            maxLenMsg: {type: Number, default: 200},
-            newMsg: {
-                type: Object, default: () => {
-                    return {
-                        num: 0,
-                        first_id: null
-                    }
-                }
-            },
-            participants: {
-                type: Object,
-                required: true
-            },
-            messages: {
-                type: Array,
-                required: true
-            },
-            myself: {
-                type: Object,
-                required: true
-            },
-            title: String,
-            canFile: Boolean,
-            maxFileSize: {type:Number,default:1024*1024},
-            uploadLink: {
-                type: String,
-                default:'/storage/chat'
-            },
-        },
-        data() {
-            return {
-                timeout_id: null
-            }
-        },
-        computed: {
-            msgs() {
-                let res = []
-                this.messages.forEach((msg, i) => {
-                    let m = Object.assign({}, msg)
-                    delete m.user_id
-                    if (res[res.length - 1] && msg.user_id === res[res.length - 1].user_id) {
-                        res[res.length - 1]['list'].push(m)
-                    } else {
-                        res.push({
-                            '_id': i,
-                            'user_id': msg.user_id,
-                            'list': [m]
-                        })
-                    }
-                })
-                return res
-            }
-        },
-        methods: {
-            onMsgSubmit: function (message) {
-                let d=message
-                 d.id= this.$helper.uniqueId(16)
-                 d.created_at= new Date()
+export default {
+  name: 'r-chat',
+  components: {RChatInput, MessageList},
+  props: {
+    sendByEnter: Boolean,
+    placeholder: {type: String, default: 'type here'},
+    hideBottomBtn: Boolean,
+    hideSend: Boolean,
+    maxLenMsg: {type: Number, default: 200},
+    newMsg: {
+      type: Object, default: () => {
+        return {
+          num: 0,
+          first_id: null
+        }
+      }
+    },
+    participants: {
+      type: Object,
+      required: true
+    },
+    messages: {
+      type: Array,
+      required: true
+    },
+    myself: {
+      type: Object,
+      required: true
+    },
+    title: String,
+    canFile: Boolean,
+    maxFileSize: {type: Number, default: 1024 * 1024},
+    uploadLink: {
+      type: String,
+      default: '/storage/chat'
+    },
+  },
+  data() {
+    return {
+      timeout_id: null
+    }
+  },
+  computed: {
+    msgs() {
+      let res = []
+      this.messages.forEach((msg, i) => {
+        let m = Object.assign({}, msg)
+        delete m.user_id
+        if (res[res.length - 1] && msg.user_id === res[res.length - 1].user_id) {
+          res[res.length - 1]['list'].push(m)
+        } else {
+          res.push({
+            '_id': i,
+            'user_id': msg.user_id,
+            'list': [m]
+          })
+        }
+      })
+      return res
+    }
+  },
+  methods: {
+    onMsgSubmit: function (message) {
+      let d = message
+      d.id = this.$helper.uniqueId(16)
+      d.created_at = new Date()
 
-                this.$emit("msg-submit", d)
-                clearTimeout(this.timeout_id)
-                this.timeout_id = setTimeout(() => {
-                    this.$refs.msgList.goToBottom()
-                }, 100)
-            }
-        },
+      this.$emit("msg-submit", d)
+      clearTimeout(this.timeout_id)
+      this.timeout_id = setTimeout(() => {
+        this.$refs.msgList.goToBottom()
+      }, 100)
     }
+  },
+}
 </script>
 <style lang="scss">
-    @import "../../style/include";
+@import "../../style/include";
 
-    .#{$prefix}chat {
-        position: relative;
-        display: flex;
-        width: 100%;
-        height: 100%;
-        flex-direction: column;
-        align-items: stretch;
-        overflow: hidden;
-        @include light() {
-            background: var(--color-background-two-light);
-        }
-        @include dark() {
-            background: var(--color-background-two-dark);
-        }
-    }
+.#{$prefix}chat {
+  position: relative;
+  display: flex;
+  width: 100%;
+  height: 100%;
+  flex-direction: column;
+  align-items: stretch;
+  overflow: hidden;
+  background: var(--color-background-two);
+}
 </style>

package/components/chip/style.scss

@@ -1,4 +1,5 @@
 @import "renusify/style/_include.scss";
+
 $chip-avatar-size: 24px !default;
 $chip-close-size: 18px !default;
 $chip-icon-margin-after: 8px !default;
@@ -16,26 +17,26 @@ $chip-transition-duration: 0.28s !default;
 $chip-transition-fn: map-get($transition, 'fast-out-slow-in') !default;
 $icon-outlined-border-width: thin !default;
 $icon-sizes: (
-  'x-small': (
-    'font-size': 10,
-    'height': 16
-  ),
-  'small': (
-    'font-size': 12,
-    'height': 24
-  ),
-  'default': (
-    'font-size': 14,
-    'height': 32
-  ),
-  'large': (
-    'font-size': 16,
-    'height': 54
-  ),
-  'x-large': (
-    'font-size': 18,
-    'height': 66
-  )
+        'x-small': (
+                'font-size': 10,
+                'height': 16
+        ),
+        'small': (
+                'font-size': 12,
+                'height': 24
+        ),
+        'default': (
+                'font-size': 14,
+                'height': 32
+        ),
+        'large': (
+                'font-size': 16,
+                'height': 54
+        ),
+        'x-large': (
+                'font-size': 18,
+                'height': 66
+        )
 ) !default;
 
 
@@ -53,19 +54,12 @@ $icon-sizes: (
   transition-timing-function: $chip-transition-fn;
   vertical-align: middle;
 
-  @include light() {
-    border-color: var(--color-divider-light);
-    color:var(--color-text-primary-light);
-    &:not(.chip-active) {
-    background:var(--color-chips-light);
-  }
-  }
-  @include dark() {
-    border-color: var(--color-divider-dark);
-    color:var(--color-text-primary-dark);
-    &:not(.chip-active) {
-    background:var(--color-chips-dark);
-  }
+
+  border-color: var(--color-divider);
+  color: var(--color-text-primary);
+
+  &:not(.chip-active) {
+    background: #e0e0e0;
   }
 
   @include states();

package/components/codeEditor/index.vue

@@ -62,11 +62,11 @@ export default {
     }
   },
   mounted() {
-    this.get_code('codeSlot', this.runnable)
+    this.get_code('codeSlot')
   },
   beforeUpdate() {
     if (this.show === 'code' && !this.edited) {
-      this.get_code('codeSlot', this.runnable)
+      this.get_code('codeSlot')
     }
   },
   methods: {
@@ -190,14 +190,25 @@ export default {
       let temp = this.code.querySelector('.code-template')
 
       if (temp && temp.childNodes.length > 0) {
-        this.template = this.toHTML(temp.childNodes[0].nodeValue).children[0]
+        for (let i = 0; i < temp.childNodes.length; i++) {
+          if (temp.childNodes[i].nodeName === "#comment") {
+            this.template = this.toHTML(temp.childNodes[i].nodeValue).children[0]
+            break
+          }
+        }
       }
 
       let script = this.code.querySelector('.code-script')
       if (script && script.childNodes.length > 0) {
-        this.script = script.childNodes[0].nodeValue
+        for (let i = 0; i < script.childNodes.length; i++) {
+          if (script.childNodes[i].nodeName === "#comment") {
+            this.script = script.childNodes[i].nodeValue
+            break
+          }
+        }
       }
 
+
       if (this.template || this.script) {
         this.$refs.codeViewTemplate.innerHTML = this.buildHtml(this.template)
         this.$refs.codeViewScript.innerHTML = this.buildScript(this.script)
@@ -341,6 +352,8 @@ export default {
       res = this.$helper.replacer(res, ' let ', ' <span class="color-orange code-editor-span">let</span> ')
       res = this.$helper.replacer(res, ' const ', ' <span class="color-orange code-editor-span">const</span> ')
       res = this.$helper.replacer(res, ' return ', ' <span class="color-orange code-editor-span">return</span> ')
+      res = this.$helper.replacer(res, ' true', ' <span class="color-orange code-editor-span">true</span>')
+      res = this.$helper.replacer(res, ' false', ' <span class="color-orange code-editor-span">false</span>')
       res = this.$helper.replacer(res, ' this.', ' <span class="color-orange code-editor-span">this</span>.')
 
       return res
@@ -378,30 +391,31 @@ export default {
 @import "../../style/include";
 
 .#{$prefix}code-editor {
+  direction: ltr;
+  text-align: left;
   position: relative;
   white-space: break-spaces;
-  caret-color: white !important;
+  caret-color: white;
+  background-color: #15212e;
+  color: #fff;
+  padding: 10px;
 
   .code-script, .code-template {
-    padding: 10px;
-  }
-
-  .code-action {
-    color: #ffffff;
-    background: #283739;
+    padding: 0 20px;
   }
 
   .code-wrapper {
     direction: ltr;
     text-align: left;
-    background: #283739;
-    color: #ffffff;
     padding: 10px;
   }
 
   .code-compile {
-    border: 1px solid #444444;
+    background-color: #fafafa;
     min-height: 300px;
+    padding: 10px;
+    margin: 0 -10px -10px -10px;
+    color: black;
   }
 
   .color-func {
@@ -438,4 +452,4 @@ export default {
     color: #898d8c;
   }
 }
-</style>
+</style>

package/components/codeEditor/run.vue

@@ -12,7 +12,7 @@ export default {
   },
   methods: {
     strToObj2(str) {
-      str = this.$helper.replacer(str, ' ', '')
+      str = str.trim()
       str = this.$helper.replacer(str, "\n", '')
       str = this.$helper.replacer(str, "\r", '')
       let open = 0

package/components/container/style.scss

@@ -1,4 +1,5 @@
 @import "renusify/style/_include.scss";
+
 .#{$prefix}container {
   max-width: 100%;
   padding: $container-padding-x;
@@ -32,11 +33,11 @@
   }
 
   &-dense {
-    margin-right: div($form-grid-gutter , -2);
-    margin-left: div($form-grid-gutter ,-2) ;
+    margin-right: div($form-grid-gutter, -2);
+    margin-left: div($form-grid-gutter, -2);
 
     .col {
-      padding:div($form-grid-gutter , 2) !important;
+      padding: div($form-grid-gutter, 2) !important;
     }
   }
 }
@@ -68,18 +69,15 @@ $divider-inset-margin: 72px !default;
   height: 0px;
   max-height: 0px;
   transition: inherit;
-  @include dark(){
-    border-top: solid thin var(--color-divider-dark)
-  }
-  @include light(){
-    border-top: solid thin var(--color-divider-light)
-  }
+
+  border-top: solid thin var(--color-divider);
+
   &.divider-inset:not(.divider-vertical) {
     max-width: calc(100% - #{$divider-inset-margin});
 
-      margin-left: $divider-inset-margin;
+    margin-left: $divider-inset-margin;
 
-      margin-right: $divider-inset-margin;
+    margin-right: $divider-inset-margin;
 
   }
 

package/components/form/camInput.vue

@@ -344,7 +344,7 @@ export default {
 
 .#{$prefix}cam-input {
   video {
-    border: 1px solid var(--color-border-light);
+    border: 1px solid var(--color-border);
   }
 
   .self-view {