renusify 1.0.3 → 1.0.4

package/directive/touch/index.js

@@ -30,11 +30,12 @@ function touchstart(event, wrapper) {
     wrapper.startY = touch.clientY
     wrapper.moveX = touch.clientX
     wrapper.moveY = touch.clientY
+    wrapper.current = {x: touch.clientX - wrapper.clientRect['left'], y: touch.clientY - wrapper.clientRect['top']}
     event['touch'] = wrapper
     wrapper.start && wrapper.start(wrapper)
 
-    document.ontouchmove= e => touchmove(e, wrapper)
-    document.ontouchend= e => touchend( e, wrapper)
+    document.ontouchmove = e => touchmove(e, wrapper)
+    document.ontouchend = e => touchend(e, wrapper)
 }
 
 function mousestart(event, wrapper) {
@@ -44,10 +45,11 @@ function mousestart(event, wrapper) {
     wrapper.startY = touch.clientY
     wrapper.moveX = touch.clientX
     wrapper.moveY = touch.clientY
+    wrapper.current = {x: touch.clientX - wrapper.clientRect['left'], y: touch.clientY - wrapper.clientRect['top']}
     event['touch'] = wrapper
     wrapper.start && wrapper.start(wrapper)
-    document.onmousemove= e => mousemove(e, wrapper)
-    document.onmouseup= e => mouseend( e, wrapper)
+    document.onmousemove = e => mousemove(e, wrapper)
+    document.onmouseup = e => mouseend(e, wrapper)
 }
 
 function touchend(event, wrapper) {
@@ -55,6 +57,8 @@ function touchend(event, wrapper) {
         return null
     }
     wrapper.selected = false
+    const touch = event.changedTouches[0]
+    wrapper.current = {x: touch.clientX - wrapper.clientRect['left'], y: touch.clientY - wrapper.clientRect['top']}
     event['touch'] = wrapper
     wrapper.end && wrapper.end(wrapper)
     handleGesture(wrapper)
@@ -63,8 +67,8 @@ function touchend(event, wrapper) {
     wrapper.moveX = 0
     wrapper.moveY = 0
 
-    document.ontouchmove=null
-    document.ontouchend=null
+    document.ontouchmove = null
+    document.ontouchend = null
 }
 
 function mouseend(event, wrapper) {
@@ -73,6 +77,7 @@ function mouseend(event, wrapper) {
     }
 
     wrapper.selected = false
+    wrapper.current = {x: event.clientX - wrapper.clientRect['left'], y: event.clientY - wrapper.clientRect['top']}
     event['touch'] = wrapper
     wrapper.end && wrapper.end(wrapper)
     handleGesture(wrapper)
@@ -82,8 +87,8 @@ function mouseend(event, wrapper) {
     wrapper.moveX = 0
     wrapper.moveY = 0
 
-    document.onmousemove=null
-    document.onmouseup=null
+    document.onmousemove = null
+    document.onmouseup = null
 }
 
 function touchmove(event, wrapper) {
@@ -93,6 +98,7 @@ function touchmove(event, wrapper) {
         return null
     }
     const touch = event.changedTouches[0]
+    wrapper.current = {x: touch.clientX - wrapper.clientRect['left'], y: touch.clientY - wrapper.clientRect['top']}
     wrapper.moveX = touch.clientX
     wrapper.moveY = touch.clientY
     event['touch'] = wrapper
@@ -109,6 +115,7 @@ function mousemove(event, wrapper) {
         return null
     }
     const touch = event
+    wrapper.current = {x: event.clientX - wrapper.clientRect['left'], y: event.clientY - wrapper.clientRect['top']}
     wrapper.moveX = touch.clientX
     wrapper.moveY = touch.clientY
     event['touch'] = wrapper
@@ -121,6 +128,8 @@ function mousemove(event, wrapper) {
 function createHandlers(value) {
     const wrapper = {
         selected: false,
+        clientRect: value['clientRect'],
+        current: {x: 0, y: 0},
         startX: 0,
         startY: 0,
         goX: 0,
@@ -143,21 +152,25 @@ function createHandlers(value) {
 
 function mounted(el, binding) {
     const value = binding.value
+    el.timeout_touch = setTimeout(() => {
+        value['clientRect'] = el.getBoundingClientRect()
+        const options = value.options || {
+            passive: true
+        }
 
-    const options = value.options || {
-        passive: true
-    }
+        el.eventsHandler = createHandlers(value)
+        keys(el.eventsHandler).forEach(eventName => {
+            el.addEventListener(eventName, el.eventsHandler[eventName], options)
+        })
+    }, 1000)
 
-    el.eventsHandler= createHandlers(value)
-    keys(el.eventsHandler).forEach(eventName => {
-        el.addEventListener(eventName, el.eventsHandler[eventName], options)
-    })
 }
 
 function unmounted(el, binding) {
-    if (!el.eventsHandler){
-            return
-        }
+    clearTimeout(el.timeout_touch)
+    if (!el.eventsHandler) {
+        return
+    }
     keys(el.eventsHandler).forEach(eventName => {
         el.removeEventListener(eventName, el.eventsHandler[eventName])
     })

package/index.js

@@ -114,10 +114,17 @@ export default {
         app.config.globalProperties.$v = (names) => valid.checkType(names)
 
         // install components
-        register(app, options['components'] || []);
+        const required_directive = register(app, options['components'] || []);
 
+        if (options['directives']) {
+            options['directives'].forEach((i) => {
+                if (!required_directive.includes(i)) {
+                    required_directive.push(i)
+                }
+            })
+        }
         // install directives
-        registers(app, options['directives'] || []);
+        registers(app, required_directive);
 
         // renusify storage
         app.config.globalProperties.$storage = Storage

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "renusify",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Vue3 Framework",
   "keywords": [
     "vuejs",

package/tools/helper.js

@@ -363,4 +363,27 @@ export function download(url, fileName = 'download') {
         tag.remove()
     };
     xhr.send();
+}
+
+export function setCookie(cname, cvalue, exsec) {
+    const d = new Date();
+    d.setTime(d.getTime() + (exsec * 1000));
+    let expires = "expires=" + d.toUTCString();
+    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
+}
+
+export function getCookie(cname) {
+    let name = cname + "=";
+    let decodedCookie = decodeURIComponent(document.cookie);
+    let ca = decodedCookie.split(';');
+    for (let i = 0; i < ca.length; i++) {
+        let c = ca[i];
+        while (c.charAt(0) === ' ') {
+            c = c.substring(1);
+        }
+        if (c.indexOf(name) === 0) {
+            return c.substring(name.length, c.length);
+        }
+    }
+    return "";
 }

package/components/form/colorPicker/Box.vue

@@ -1,85 +0,0 @@
-<template>
-  <div class="color-type">
-    <span class="name">
-      {{ name }}
-    </span>
-    <input v-model="modelColor" class="value" />
-  </div>
-</template>
-
-<script >
-import { computed } from 'vue'
-
-export default
-        {
-  props: {
-    name: {
-      type: String,
-      default: '',
-    },
-    color: {
-      type: String,
-      default: '',
-    },
-  },
-  emits: ['inputColor'],
-  setup(props, { emit }) {
-    const modelColor = computed({
-      get() {
-        return props.color || ''
-      },
-      set(val) {
-        emit('inputColor', val)
-      },
-    })
-    return {
-      modelColor,
-    }
-  },
-}
-</script>
-
-<style lang="scss">
-  @import "../../../style/include";
-.color-type {
-  display: flex;
-  margin-top: 8px;
-  font-size: 12px;
-  .name {
-    width: 60px;
-    height: 30px;
-    float: left;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-  .value {
-    flex: 1;
-    height: 30px;
-    min-width: 100px;
-    padding: 0 12px;
-    border: 0;
-    box-sizing: border-box;
-  }
-  @include light(){
-    .name {
-    color: #999;
-    background: #e7e8e9;
-  }
-  .value {
-    color: #666;
-    background: #eceef0;
-  }
-  }
-  @include dark(){
-    .name {
-    color: #999;
-    background: #252930;
-  }
-  .value {
-    color: #fff;
-    background: #2e333a;
-  }
-  }
-}
-</style>