assets/js/frame.js in appscms-tools-theme-2.2.7 vs assets/js/frame.js in appscms-tools-theme-2.2.8

@@ -115,10 +115,20 @@
         if (item.type === 'text') {
           let myFont = new FontFace(item.font, `url(${item.fontPath})`)
           myFont.load().then(function (font) {
             ctx.save()
             document.fonts.add(font)
+            let textValue = document.querySelector(`#${item.id}`).value
+            if (textValue.length > 10 && item.fontSizeOption1) {
+              item.fontSize = item.fontSizeOption1
+            }
+            if (textValue.length > 20 && item.fontSizeOption2) {
+              item.fontSize = item.fontSizeOption2
+            }
+            if (textValue.length > 30 && item.fontSizeOption3) {
+              item.fontSize = item.fontSizeOption3
+            }
             ctx.font = `${item.fontSize}px ${item.font}`
             if (item.shadowColor) {
               ctx.shadowColor = `${item.shadowColor}`
             }
 
@@ -134,14 +144,10 @@
             if (item.rotate) {
               ctx.rotate((item.rotate * Math.PI) / 180)
             }
             ctx.textAlign = 'center'
             ctx.fillStyle = `${item.color}`
-            ctx.fillText(
-              document.querySelector(`#${item.id}`).value,
-              item.x,
-              item.y
-            )
+            ctx.fillText(textValue, item.x, item.y)
             ctx.restore()
           })
         }
         if (item.type === 'rectangle') {
         }