添加新的元素

src/components/Element/ButtonElement.vue

@@ -1,219 +1,342 @@
 <template>
-  <div class='wrap' @mouseover="mouseover" @mouseleave="mouseleave"  @dragstart="dragstart" @mousedown="mousedown" @mouseup="mouseup">
+  <div class='wrap' @mouseover="mouseover" @mouseleave="mouseleave" @dragstart="dragstart" @mousedown="mousedown"
+    @mouseup="mouseup">
     <template v-if="!element.eleCanvas">
-      <img :style="{'z-index':1,width:'100%',height:'100%','border-radius': element.circular+'%'}" :src="element.imgSrc&&element.imgSrc.indexOf('http://dm.static.elab-plus.com')>-1?element.imgSrc.replace('http://dm.static.elab-plus.com','https://dm.static.elab-plus.com'):element.imgSrc">
+      <img :style="{'z-index':1,width:'100%',height:'100%','border-radius': element.circular+'%'}"
+        :src="element.imgSrc&&element.imgSrc.indexOf('http://dm.static.elab-plus.com')>-1?element.imgSrc.replace('http://dm.static.elab-plus.com','https://dm.static.elab-plus.com'):element.imgSrc">
 
-      <img  src="https://dm.static.elab-plus.com/launchTemplate/0a3b783c-c54a-4e13-ba50-8f0ac6bb35f4-%E6%92%AD%E6%94%BE.png"
-            v-show="element.videoEditable" style="z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);display: block"/>
-    </template>
-    <elab-background-canvas v-else-if="element.eleCanvas=='WaterRipple'" :width="element.width" :height="element.height" :cstyle="`position:absolute;z-index: 1;border-radius:${element.circular+'%'}`" :type="element.eleCanvas" :picSrc="element.imgSrc&&element.imgSrc.indexOf('http://dm.static.elab-plus.com')>-1?element.imgSrc.replace('http://dm.static.elab-plus.com','https://dm.static.elab-plus.com'):element.imgSrc"></elab-background-canvas>
+      <img
+        src="https://dm.static.elab-plus.com/launchTemplate/0a3b783c-c54a-4e13-ba50-8f0ac6bb35f4-%E6%92%AD%E6%94%BE.png"
+        v-show="element.videoEditable"
+        style="z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);display: block" />
 
-    <Operate v-show="showOperate || show|| $store.state.editor.complexEditorElement.indexOf(element)>-1" @mousedown.native.stop="scaleMousedown" @mouseup.native.stop="scaleMouseup" @mousemove.native.stop="scaleMousemove"
+      <section class="content">
+        <!-- 默认属性动画 -->
+        <div :class="'animated ' + this.element['animatedName']" :style="styleAnime" v-if="element['animatedFont']">
+          <myfont :duration="element.duration" :delay="element.delay" :loop="element.loop"
+            :fonts="element.text.replace(/\n/g,'^').split('')" :class="element['animatedFont']"
+            :fontstyle="element['animatedFont']" :highLightDelimitId="isOverView?'':element.nodeId"
+            :elabEditable="element['elabEditable']||true" :style="styleBasic">{{ element.text }}</myfont>
+        </div>
+        <div :class="'animated ' + this.element['animatedName']" :style="styleAnime"
+          v-else-if="this.element['animatedType']==0">
+          <div :highLightDelimitId="isOverView?'':element.nodeId" :elabEditable="element['elabEditable']||true"
+            :style="styleBasic" :class="this.element['animatedFont'] ">{{ element.text }}</div>
+        </div>
+        <div :class="'animated ' + this.element['animatedName']" :style="styleAnime" v-else>
+          <div :highLightDelimitId="isOverView?'':element.nodeId" :elabEditable="element['elabEditable']||true"
+            :style="styleBasic" :class="this.element['animatedFont'] ">{{ element.text }}</div>
+        </div>
+      </section>
+    </template>
+    <elab-background-canvas v-else-if="element.eleCanvas=='WaterRipple'" :width="element.width" :height="element.height"
+      :cstyle="`position:absolute;z-index: 1;border-radius:${element.circular+'%'}`" :type="element.eleCanvas"
+      :picSrc="element.imgSrc&&element.imgSrc.indexOf('http://dm.static.elab-plus.com')>-1?element.imgSrc.replace('http://dm.static.elab-plus.com','https://dm.static.elab-plus.com'):element.imgSrc">
+    </elab-background-canvas>
 
-    />
+    <Operate v-show="showOperate || show|| $store.state.editor.complexEditorElement.indexOf(element)>-1"
+      @mousedown.native.stop="scaleMousedown" @mouseup.native.stop="scaleMouseup"
+      @mousemove.native.stop="scaleMousemove" />
   </div>
 </template>
 
 <script>
-    import Operate from '../Operate'
-    import appConst from '../../util/appConst'
-    import elabBackgroundCanvas from '../../util/canvas/elabBackgroundCanvas'
-    var body = document.body;
+  import Operate from '../Operate'
+  import appConst from '../../util/appConst'
+  import myfont from '../font/font'
+  import elabBackgroundCanvas from '../../util/canvas/elabBackgroundCanvas'
+  var body = document.body;
 
-    export default{
-      props: {
-        element: {
-          type: Object,
-          require: true
-        },
-        showOperate: {
-          type: Boolean
-        },
-        stopEvent: {
-          type: Boolean
-        },
-        type: ''
+  export default {
+    props: {
+      element: {
+        type: Object,
+        require: true
       },
-      data () {
-        return {
-          left: 0,
-          top: 0,
-          width: 0,
-          height: 0,
-          currentX: 0,
-          currentY: 0,
-          flag: false,
-          scaleFlag: false,
-          direction: '',
-          http: appConst.BACKEND_DOMAIN,
-          show:false
-        }
+      showOperate: {
+        type: Boolean
       },
-      mounted(){
-        window.addEventListener("mouseup",()=>{
-
-          this.$store.state.user.operationFlag=true;
-          this.flag = false
-          this.scaleFlag = false
-        })
+      stopEvent: {
+        type: Boolean
       },
-      methods: {
-        // 处理元素拖动
-        move () {
-          var body = document.body;
-          // var editor = document.querySelector('.editor')
-          document.querySelector('body').onmousemove = (event) => {
-            var e = event || window.event
-            if (this.flag && !this.scaleFlag) {
-              let nowX = e.clientX
-              let nowY = e.clientY
-              let disX = nowX - this.currentX
-              let disY = nowY - this.currentY
-              if(this.$store.state.editor.complexEditorElement.indexOf(this.element)>-1&&this.$store.state.editor.complexEditorElement.length>1){
-                this.$store.state.editor.complexEditorElement.forEach((ele,index)=>{
-                  ele['top'] = disY + this.startTopArr[index]
-                  ele['left'] = ele.type=='frame'?0:disX + this.startLeftArr[index]
-                });
-                return;
-              }
-              this.element.top = parseInt(this.top) + disY
-              this.element.left = parseInt(this.left) + disX
+      type: ''
+    },
+    data() {
+      return {
+        left: 0,
+        top: 0,
+        width: 0,
+        height: 0,
+        currentX: 0,
+        currentY: 0,
+        flag: false,
+        scaleFlag: false,
+        direction: '',
+        http: appConst.BACKEND_DOMAIN,
+        show: false
+      }
+    },
+    mounted() {
+      window.addEventListener("mouseup", () => {
+
+        this.$store.state.user.operationFlag = true;
+        this.flag = false
+        this.scaleFlag = false
+      })
+    },
+    methods: {
+      // 处理元素拖动
+      move() {
+        var body = document.body;
+        // var editor = document.querySelector('.editor')
+        document.querySelector('body').onmousemove = (event) => {
+          var e = event || window.event
+          if (this.flag && !this.scaleFlag) {
+            let nowX = e.clientX
+            let nowY = e.clientY
+            let disX = nowX - this.currentX
+            let disY = nowY - this.currentY
+            if (this.$store.state.editor.complexEditorElement.indexOf(this.element) > -1 && this.$store.state.editor.complexEditorElement.length > 1) {
+              this.$store.state.editor.complexEditorElement.forEach((ele, index) => {
+                ele['top'] = disY + this.startTopArr[index]
+                ele['left'] = ele.type == 'frame' ? 0 : disX + this.startLeftArr[index]
+              });
+              return;
             }
+            this.element.top = parseInt(this.top) + disY
+            this.element.left = parseInt(this.left) + disX
           }
-        },
-        // 处理元素伸缩
-        scaleMousemove () {
-          document.querySelector('.editor').onmouseup = (event) => {
-            this.scaleFlag = false
+        }
+      },
+      // 处理元素伸缩
+      scaleMousemove() {
+        document.querySelector('.editor').onmouseup = (event) => {
+          this.scaleFlag = false
+        }
+        document.querySelector('.editor').onmousemove = (event) => {
+          var e = event || window.event
+          if (this.scaleFlag) {
+            let nowX = e.clientX
+            let nowY = e.clientY
+            let disX = nowX - this.currentX
+            let disY = nowY - this.currentY
+            let ratio = this.width / this.height
+            switch (this.direction) {
+              // 左边
+              case 'w':
+                this.element.width = parseInt(this.width) - disX
+                // this.element.height = parseInt(((this.width) - disX)/ratio)
+                this.element.left = parseInt(this.left) + disX
+                break
+              // 右边
+              case 'e':
+                this.element.width = parseInt(this.width) + disX
+                // this.element.height = parseInt(((this.width) + disX)/ratio)
+                break
+              // 上边
+              case 'n':
+                this.element.height = parseInt(this.height) - disY
+                // this.element.width = parseInt(((this.height) - disY)*ratio)
+                this.element.top = parseInt(this.top) + disY
+                break
+              // 下边
+              case 's':
+                this.element.height = parseInt(this.height) + disY
+                // this.element.width = parseInt(((this.height) + disY)*ratio)
+                break
+              // 左上
+              case 'nw':
+                // this.element.width = parseInt(this.width) - disX
+                this.element.width = parseInt(((this.height) - disY) * ratio)
+                // this.element.left = parseInt(this.left) + disX
+                this.element.left = parseInt(this.left + disY * ratio)
+                this.element.height = parseInt(this.height) - disY
+                this.element.top = parseInt(this.top) + disY
+                break
+              // 左下
+              case 'sw':
+                // this.element.width = parseInt(this.width) - disX
+                this.element.width = parseInt(((this.height) + disY) * ratio)
+                // this.element.left = parseInt(this.left) + disX
+                this.element.left = parseInt(this.left - disY * ratio)
+                this.element.height = parseInt(this.height) + disY
+                break
+              // 右上
+              case 'ne':
+                this.element.height = parseInt(this.height) - disY
+                this.element.top = parseInt(this.top) + disY
+                // this.element.width = parseInt(this.width) + disX
+                this.element.width = parseInt(((this.height) - disY) * ratio)
+                break
+              // 右下
+              case 'se':
+                this.element.height = parseInt(this.height) + disY
+                // this.element.width = parseInt(this.width) + disX
+                this.element.width = parseInt(((this.height) + disY) * ratio)
+                break
+            }
           }
-          document.querySelector('.editor').onmousemove = (event) => {
-            var e = event || window.event
-            if (this.scaleFlag) {
-              let nowX = e.clientX
-              let nowY = e.clientY
-              let disX = nowX - this.currentX
-              let disY = nowY - this.currentY
-              let  ratio = this.width / this.height
-              switch (this.direction) {
-                // 左边
-                case 'w':
-                  this.element.width = parseInt(this.width) - disX
-                  // this.element.height = parseInt(((this.width) - disX)/ratio)
-                  this.element.left = parseInt(this.left) + disX
-                  break
-                // 右边
-                case 'e':
-                  this.element.width = parseInt(this.width) + disX
-                  // this.element.height = parseInt(((this.width) + disX)/ratio)
-                  break
-                // 上边
-                case 'n':
-                  this.element.height = parseInt(this.height) - disY
-                  // this.element.width = parseInt(((this.height) - disY)*ratio)
-                  this.element.top = parseInt(this.top) + disY
-                  break
-                // 下边
-                case 's':
-                  this.element.height = parseInt(this.height) + disY
-                  // this.element.width = parseInt(((this.height) + disY)*ratio)
-                  break
-                // 左上
-                case 'nw':
-                  // this.element.width = parseInt(this.width) - disX
-                  this.element.width = parseInt(((this.height) - disY)*ratio)
-                  // this.element.left = parseInt(this.left) + disX
-                  this.element.left = parseInt(this.left + disY*ratio)
-                  this.element.height = parseInt(this.height) - disY
-                  this.element.top = parseInt(this.top) + disY
-                  break
-                // 左下
-                case 'sw':
-                  // this.element.width = parseInt(this.width) - disX
-                  this.element.width = parseInt(( (this.height) + disY)*ratio)
-                  // this.element.left = parseInt(this.left) + disX
-                  this.element.left = parseInt(this.left - disY*ratio)
-                  this.element.height = parseInt(this.height) + disY
-                  break
-                // 右上
-                case 'ne':
-                  this.element.height = parseInt(this.height) - disY
-                  this.element.top = parseInt(this.top) + disY
-                  // this.element.width = parseInt(this.width) + disX
-                  this.element.width = parseInt(((this.height) - disY)*ratio)
-                  break
-                // 右下
-                case 'se':
-                  this.element.height = parseInt(this.height) + disY
-                  // this.element.width = parseInt(this.width) + disX
-                  this.element.width = parseInt(((this.height) + disY)*ratio)
-                  break
+        }
+      },
+      mousedown(e) {
+        this.$store.state.user.operationFlag = false;
+        if (this.element.locked) {
+          return false;
+        }
+        if (this.stopEvent) {
+          return false
+        }
+        this.flag = true
+        this.currentX = e.clientX
+        this.currentY = e.clientY
+        if (this.$store.state.editor.complexEditorElement.indexOf(this.element) > -1 && this.$store.state.editor.complexEditorElement.length > 1) {
+          this.startTopArr = this.$store.state.editor.complexEditorElement.map(v => v.top)
+          this.startLeftArr = this.$store.state.editor.complexEditorElement.map(v => v.left)
+        }
+        this.top = this.element.top
+        this.left = this.element.left
+        this.move()
+      },
+      mouseup(e) {
+        this.$store.state.user.operationFlag = true;
+        this.flag = false
+        this.scaleFlag = false
+      },
+      mouseover(e) {
+        if (this.$store.state.editor.editorPage.elements.indexOf(this.element) == -1) {
+          return
+        }
+        this.show = true
+      },
+      mouseleave(e) {
+        this.show = false
+      },
+      scaleMousedown(e) {
+        this.$store.state.user.operationFlag = false;
+        this.scaleFlag = true
+        this.flag = true
+        this.currentX = e.clientX
+        this.currentY = e.clientY
+        this.top = this.element.top
+        this.left = this.element.left
+        this.width = this.element.width
+        this.height = this.element.height
+        this.direction = e.target.getAttribute('data-direction')
+        this.scaleMousemove()
+      },
+      scaleMouseup(e) {
+        this.$store.state.user.operationFlag = true;
+        this.scaleFlag = false
+        this.flag = false
+      },
+      dragstart(event) {
+        event.preventDefault()
+      }
+    },
+    components: {
+      Operate,
+      myfont,
+      elabBackgroundCanvas
+    },
+    computed: {
+      editingElement () {
+        return this.$store.getters['editingElement']
+      },
+      styleAnime () {
+        var playing = this.element['playing']
+        //粒子滚动效果
+        if (this.element['animatedType'] == 1) {
+          ////粒子滚动效果，如果设置了延迟播放大小，则进行判断，默认是不延迟,默认的虚线宽度是70
+          if (this.element['delay'] ==0) {
+            if (playing) {
+              return {
+                animationName: this.element['animatedName'],
+                animationDuration: this.element['duration']+'s',
+                animationTimingFunction: 'linear',
+                animationIterationCount: (this.element['loop'] ? 'infinite' : 'initial'),
               }
             }
+            //stroke动画不动的情况，stroke填充线条
+            return {
+              // animationName: this.element['animatedName'],
+              strokeDasharray: '300 400',
+              animationDuration: this.element['duration']+'s',
+              animationTimingFunction: 'linear',
+              animationIterationCount: (this.element['loop'] ? 'infinite' : 'initial'),
+            }
           }
-        },
-        mousedown (e) {
-          this.$store.state.user.operationFlag=false;
-          if(this.element.locked){
-            return false;
-          }
-          if(this.stopEvent){
-            return false
-          }
-          this.flag = true
-          this.currentX = e.clientX
-          this.currentY = e.clientY
-          if(this.$store.state.editor.complexEditorElement.indexOf(this.element)>-1&&this.$store.state.editor.complexEditorElement.length>1){
-            this.startTopArr=this.$store.state.editor.complexEditorElement.map(v=>v.top)
-            this.startLeftArr=this.$store.state.editor.complexEditorElement.map(v=>v.left)
+          return {
+            animationName: this.element['animatedName'],
+            animationDuration: this.element['duration']+'s',
+            animationTimingFunction: 'linear',
+            animationDelay: this.element['delay'] + 's',
+            animationIterationCount: (this.element['loop'] ? 'infinite' : 'initial'),
           }
-          this.top = this.element.top
-          this.left = this.element.left
-          this.move()
-        },
-        mouseup (e) {
-          this.$store.state.user.operationFlag=true;
-          this.flag = false
-          this.scaleFlag = false
-        },
-        mouseover (e) {
-          if(this.$store.state.editor.editorPage.elements.indexOf(this.element)==-1){
-            return
+        } else if (this.element['animatedType'] == 2) { //类似抖音抖动动画
+          var sharksScroll = {
+            animationDirection: 'reverse',
+            animationFillMode: 'none',
+            animationPlayState: 'running',
+            animationTimingFunction: 'cubic-bezier(0.68, -0.55, 0.27, 1.55)',
+            animationDelay: this.element['delay'] + 's',
+            animationIterationCount: (this.element['loop'] ? 'infinite' : 'initial'),
+            animationDuration: this.element['duration']+'s',
+            animationDelay: this.element['delay'] + 's',
+          };
+          if (playing) {
+            sharksScroll = {
+              animationDirection: 'reverse',
+              animationFillMode: 'none',
+              animationPlayState: 'running',
+              animationName: this.element['animatedName'],
+              animationTimingFunction: 'cubic-bezier(0.68, -0.55, 0.27, 1.55)',
+              animationDelay: this.element['delay'] + 's',
+              animationIterationCount: (this.element['loop'] ? 'infinite' : 'initial'),
+              animationDuration: this.element['duration']+'s',
+              animationDelay: this.element['delay'] + 's',
+            }
           }
-          this.show = true
-        },
-        mouseleave(e){
-          this.show = false
-        },
-        scaleMousedown (e) {
-          this.$store.state.user.operationFlag=false;
-          this.scaleFlag = true
-          this.flag = true
-          this.currentX = e.clientX
-          this.currentY = e.clientY
-          this.top = this.element.top
-          this.left = this.element.left
-          this.width = this.element.width
-          this.height = this.element.height
-          this.direction = e.target.getAttribute('data-direction')
-          this.scaleMousemove()
-        },
-        scaleMouseup (e) {
-          this.$store.state.user.operationFlag=true;
-          this.scaleFlag = false
-          this.flag = false
-        },
-        dragstart (event) {
-          event.preventDefault()
+          return sharksScroll;
+        }
+        return {
+          animationIterationCount: this.element['loop'] ? 'infinite' : 'initial',
+          animationDuration: this.element['duration'] + 's',
+          animationDelay: this.element['delay'] + 's'
         }
       },
-      components: {
-        Operate,
-        elabBackgroundCanvas
+     
+      styleBasic () {
+        return {
+          width: this.element['width'] + 'px',
+          lineHeight: this.element['lineHeight'],
+          color: this.element['color'],
+          backgroundColor: this.element['allTransparent'] || this.element['backgroundColor'],
+          textAlign: this.element['textAlign'],
+          fontSize: this.element['fontSize'] + 'px',
+          fontWeight: this.element['fontWeight'],
+          'font-family': this.element['fontFamily'],
+          opacity: this.element['opacity'] / 100,
+          transform: 'rotate(' + this.element['transform'] + 'deg' + ')',
+          'vertical-align': this.element['verticalAlign'],
+          display: this.element['display'],
+          'text-indent': this.element['textIndent'] + 'em',
+          'letter-spacing': this.element['letterSpacing'] + 'em',
+          'writing-mode' : this.element['verticalFont'],
+          'white-space' : this.element['verticalFont'] ? 'pre' : 'pre-wrap'
+        }
       }
-    }
+    },
+  }
 </script>
 
 <style lang='less' scoped>
+  .content {
+    /*white-space: pre-wrap;*/
+    word-wrap: break-word;
+    position: relative;
+    z-index: 3;
+  }
+
   .wrap {
     position: absolute;
     cursor: move;
@@ -224,4 +347,4 @@
     user-select: none;
     /*-webkit-user-drag: none;*/
   }
-</style>
+</style>

src/components/Element/FontElement.vue

@@ -14,25 +14,6 @@
       <div :class="'animated ' + this.element['animatedName']" :style="styleAnime" v-else-if="this.element['animatedType']==0">
         <div :highLightDelimitId="isOverView?'':element.nodeId" :elabEditable="element['elabEditable']||true" :style="styleBasic" :class="this.element['animatedFont'] ">{{ element.text }}</div>
       </div>
-      <!--&lt;!&ndash; 扩展粒子滚动动画 &ndash;&gt;-->
-      <!--<div :class="element['playing'] && 'animated ' + this.element['animatedName']" :style="styleAnime" v-else-if="this.element['animatedType']==1">-->
-        <!--<div :elabEditable="element['elabEditable']||true" :style="styleBasic">-->
-          <!--<svg xmlns="http://www.w3.org/2000/svg" class="hxParticleScrollSVG">-->
-            <!--<symbol :id="`s-text`+element.nodeId">-->
-              <!--<text text-anchor="middle" x="50%" y="50%" dy=".35em">{{ element.text }}</text>-->
-            <!--</symbol>-->
-            <!--<use class="particleScroll" :style="styleAnime" :xlink:href="`#s-text`+element.nodeId"></use>-->
-            <!--<use class="particleScroll" :style="styleAnime" :xlink:href="`#s-text`+element.nodeId"></use>-->
-            <!--<use class="particleScroll" :style="styleAnime" :xlink:href="`#s-text`+element.nodeId"></use>-->
-            <!--<use class="particleScroll" :style="styleAnime" :xlink:href="`#s-text`+element.nodeId"></use>-->
-            <!--<use class="particleScroll" :style="styleAnime" :xlink:href="`#s-text`+element.nodeId"></use>-->
-          <!--</svg>-->
-        <!--</div>-->
-      <!--</div>-->
-      <!--&lt;!&ndash; 扩展抖动动画 &ndash;&gt;-->
-      <!--<div :class="element['playing'] && 'animated ' + this.element['animatedName']" :style="styleAnime" v-else-if="this.element['animatedType']==2">-->
-        <!--<div :highLightDelimitId="isOverView?'':element.nodeId" :elabEditable="element['elabEditable']||true" :style="styleBasic">{{ element.text }}</div>-->
-      <!--</div>-->
       <div  :class="'animated ' + this.element['animatedName']" :style="styleAnime" v-else>
         <div :highLightDelimitId="isOverView?'':element.nodeId" :elabEditable="element['elabEditable']||true" :style="styleBasic" :class="this.element['animatedFont'] ">{{ element.text }}</div>
       </div>
@@ -124,6 +105,7 @@
           animationDelay: this.element['delay'] + 's'
         }
       },
+     
       styleBasic () {
         return {
           width: this.element['width'] + 'px',
@@ -218,56 +200,7 @@
       dragstart (event) {
         event.preventDefault()
       },
-      /**高光移动动画方法**/
-      // tomove(){
-      //   var that = this
-      //   // clearInterval(this.otime);
-      //   this.otime=setInterval(()=>{
-      //     this.loopNum+=10;
-      //     if(this.loopNum==1100) {
-      //       this.loopNum=-300;
-      //       clearInterval(this.otime);
-      //     }
-      //     document.querySelector("[highlightdelimitid='"+that.element.nodeId+"']").style.backgroundPosition=that.loopNum+"px 0px";
-      //   },20)
-      // },
-      /**选择特效方法**/
-      // fontSpecialEffect(){
-      //   if (this.element.animatedFont) {
-      //     this.textValue = this.element.text
-      //     var that = this
-      //     var obj = $("[highlightdelimitid='"+that.element.nodeId+"']")
-      //     if (this.element.animatedFont == 'highLightDelimit') {
-      //       this.tomove()
-      //     } else if (this.element.animatedFont == 'wordByWord') {
-      //       obj.animatext({
-      //         speed: 150,
-      //         mode: "words",
-      //         effect: 'swing',
-      //         infinite: false,
-      //         onBegin:function() {
-      //           obj.html(that.textValue)
-      //         },
-      //         onSuccess:function() {
-      //           obj.html(that.textValue)
-      //         }
-      //       });
-      //     } else if (this.element.animatedFont == 'reverse') {
-      //       obj.animatext({
-      //         speed: 150,
-      //         effect: 'bounceIn',
-      //         reverse: true,
-      //         infinite: false,
-      //         onBegin:function() {
-      //           obj.html(that.textValue)
-      //         },
-      //         onSuccess:function() {
-      //           obj.html(that.textValue)
-      //         }
-      //       });
-      //     }
-      //   }
-      // }
+
     },
     created(){
     },