{"version":3,"sources":["webpack:///./src/assets/img/fonts-panel/textPosLeft.svg","webpack:///./src/assets/img/select_arrow.svg","webpack:///./src/assets/img/fonts-panel/textPosCenter.svg","webpack:///./src/components/contextMenu/fontFamilyInput.vue?1b5d","webpack:///./src/assets/img/fonts-panel/textPosRigth.svg","webpack:///./src/components/contextMenu/widgets/likeDislikeWidgetPanel.vue","webpack:///src/components/contextMenu/widgets/likeDislikeWidgetPanel.vue","webpack:///./src/components/contextMenu/widgets/likeDislikeWidgetPanel.vue?1f65","webpack:///./src/components/contextMenu/widgets/likeDislikeWidgetPanel.vue?7b4f","webpack:///./src/components/contextMenu/fontFamilyInput.vue","webpack:///src/components/contextMenu/fontFamilyInput.vue","webpack:///./src/components/contextMenu/fontFamilyInput.vue?93d5","webpack:///./src/components/contextMenu/fontFamilyInput.vue?19f2","webpack:///./src/components/contextMenu/widgets/likeDislikeWidgetPanel.vue?323c"],"names":["module","exports","render","_vm","this","_c","_self","staticClass","_l","likeDislikeList","s","idx","key","_v","_s","on","$event","removeLikeDislike","directives","name","rawName","value","newLikeDislikeName","expression","attrs","domProps","target","composing","onAddNewLikeDislike","fontFamily","updateFontFamily","updateFontSize","fontSize","fontStyles","checked","Array","isArray","_i","$$a","$$el","$$c","$$v","$$i","$set","concat","slice","updateFontStyle","device","class","underline","title","n","style","backgroundColor","textColors","border","getColorBorder","hex","slot","onUpdateColor","$store","dispatch","type","data","callback","onChangeIcon","configs","updateIconName","staticRenderFns","components","ChromePicker","fontFamilyInput","addOpen","visibleIconsListLike","visibleIconsListDislike","timeoutId","colorChecker","iconsList","bold","italic","textAlignMock","left","require","center","right","mounted","FeedService","getItemsByCategory","id","limit","then","rich_image","computed","mapGetters","survey","activeWidget","textItems","_objects","filter","o","textBackgroudItems","likeItem","dislikeItem","iconsBackground","_this$textItems$0$fil","_this$textItems","_this$textBackgroudIt","_this$textBackgroudIt2","fill","textColor","textBackgroundColor","created","init","onFontSizeScaling","methods","fontWeight","fontStyle","textAlign","Math","round","get","groupHeight","height","pos","i","length","item","width","limitHeight","limitWidth","textContent","isCut","cycle","text","initDimensions","set","setPositionByOrigin","x","y","renderAll","size","_size$target$valueAsN","_size$target","_size","valueAsNumber","forEach","calucaltePosition","setSurveyStepParam","fire","colorIdx","setColor","random","clearTimeout","setTimeout","paramName","param","fetchCanvasFont","isActiveObj","fontLink","content","push","updateLikeDislikeList","splice","url","widget","toObject","active","addWidget","remove","setCoords","clearAll","watch","component","onHideDropdown","fontInput","ref","activeFontFamily","fontFamilyList","onChangeFontFamily","__typename","preview","showLoader","props","preloader","allFonts","fontsListMod","currentPage","maxPerPage","disableObserve","fonts","myFonts","interactionMode","canvas","_canvas","serializedMyFonts","map","f","replace","scrollTrigger","$emit","rating","incrementRating","v","$refs","blur","observer","IntersectionObserver","entries","entry","intersectionRatio","fetchPathFontsList","observe","infinityScrollTrigger","partFontList","promiseList","Promise","all","toLowerCase","includes"],"mappings":"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","file":"js/likeDislikeWidgetPanel.917cbec4.js","sourcesContent":["module.exports = __webpack_public_path__ + \"img/textPosLeft.985af18d.svg\";","module.exports = __webpack_public_path__ + \"img/select_arrow.c1529dcc.svg\";","module.exports = __webpack_public_path__ + \"img/textPosCenter.68bbb8e9.svg\";","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./fontFamilyInput.vue?vue&type=style&index=0&id=438dff51&prod&scoped=true&lang=css&\"","module.exports = __webpack_public_path__ + \"img/textPosRigth.6d07de6c.svg\";","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"context-panel-container\"},[_c('div',{staticClass:\"context-panel-scroll\"},[_c('div',{staticClass:\"context-panel-group\"},[_c('div',{staticClass:\"like-dislike-container\"},[_c('div',{staticClass:\"like-dislike-items\"},_vm._l((_vm.likeDislikeList),function(s,idx){return _c('div',{key:idx,staticClass:\"like-dislike-item\"},[_c('div',{staticClass:\"like-dislike-item-text\"},[_vm._v(_vm._s(s))]),_c('div',{staticClass:\"close\",on:{\"click\":function($event){return _vm.removeLikeDislike(idx)}}},[_vm._v(\"×\")])])}),0),_c('div',{staticClass:\"like-dislike-item add-new-open\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.newLikeDislikeName),expression:\"newLikeDislikeName\"}],attrs:{\"type\":\"text\",\"placeholder\":\"add new\"},domProps:{\"value\":(_vm.newLikeDislikeName)},on:{\"input\":function($event){if($event.target.composing)return;_vm.newLikeDislikeName=$event.target.value}}}),_c('div',{staticClass:\"add-btn\",attrs:{\"src\":\"@/assets/img/add_btn.svg\"},on:{\"click\":_vm.onAddNewLikeDislike}},[_vm._v(\" + \")])])])]),_c('div',{staticClass:\"mob-separator\"}),_c('div',{staticClass:\"context-panel-group\"},[_c('font-family-input',{staticClass:\"font-family-container\",attrs:{\"activeFontFamily\":_vm.fontFamily},on:{\"on-change-font-family\":_vm.updateFontFamily}}),_c('div',{staticClass:\"font-size text-settings-wraper\"},[_c('div',{staticClass:\"font-size-controllers minus\",on:{\"click\":function($event){return _vm.updateFontSize(--_vm.fontSize)}}},[_vm._v(\" - \")]),_c('input',{staticClass:\"font-size-input\",attrs:{\"type\":\"number\"},domProps:{\"value\":_vm.fontSize},on:{\"input\":function($event){return _vm.updateFontSize($event)}}}),_c('div',{staticClass:\"font-size-controllers plus\",on:{\"click\":function($event){return _vm.updateFontSize(++_vm.fontSize)}}},[_vm._v(\" + \")])]),_c('div',{staticClass:\"font-style text-settings-wraper\"},_vm._l((_vm.fontStyles),function(value,key,idx){return _c('label',{key:idx,staticClass:\"label\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.fontStyles[key].checked),expression:\"fontStyles[key].checked\"}],staticClass:\"checkbox-button\",attrs:{\"type\":\"checkbox\"},domProps:{\"checked\":Array.isArray(_vm.fontStyles[key].checked)?_vm._i(_vm.fontStyles[key].checked,null)>-1:(_vm.fontStyles[key].checked)},on:{\"change\":[function($event){var $$a=_vm.fontStyles[key].checked,$$el=$event.target,$$c=$$el.checked?(true):(false);if(Array.isArray($$a)){var $$v=null,$$i=_vm._i($$a,$$v);if($$el.checked){$$i<0&&(_vm.$set(_vm.fontStyles[key], \"checked\", $$a.concat([$$v])))}else{$$i>-1&&(_vm.$set(_vm.fontStyles[key], \"checked\", $$a.slice(0,$$i).concat($$a.slice($$i+1))))}}else{_vm.$set(_vm.fontStyles[key], \"checked\", $$c)}},function($event){return _vm.updateFontStyle({ key, value })}]}}),_c('el-tooltip',{attrs:{\"placement\":\"bottom\",\"content\":key,\"transition\":\"fade-tooltip\",\"disabled\":_vm.device === 'mobile'}},[_c('span',{staticClass:\"input-wrapper fs\",class:{ underline: idx === 2 }},[_vm._v(_vm._s(value.title))])])],1)}),0)],1),_c('div',{staticClass:\"mob-separator\"}),_c('div',{staticClass:\"context-panel-group icons-group\"},[_c('div',{staticClass:\"colors-container\"},_vm._l((2),function(n){return _c('div',{key:n,staticClass:\"border-color\"},[_c('el-dropdown',{attrs:{\"placement\":\"bottom\",\"trigger\":\"click\"}},[_c('el-tooltip',{attrs:{\"placement\":\"bottom\",\"content\":\"color\",\"transition\":\"fade-tooltip\",\"disabled\":_vm.device === 'mobile'}},[_c('span',{staticClass:\"picker-button\"},[_c('div',{staticClass:\"color-picker-wraper\",style:({\n                    backgroundColor: _vm.textColors[n - 1],\n                    border: _vm.getColorBorder({ hex: _vm.textColors[n - 1] })\n                  })})])]),_c('el-dropdown-menu',{attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_c('chrome-picker',{staticClass:\"picker-element\",attrs:{\"value\":_vm.textColors[n - 1]},on:{\"input\":function($event){return _vm.onUpdateColor(n - 1, $event)}}})],1)],1)],1)}),0),_c('div',{staticClass:\"field-name\"},[_vm._v(\"color\")]),_c('div',{staticClass:\"change-icons-container\"},_vm._l((['likeIcon', 'dislikeIcon']),function(n,idx){return _c('div',{key:idx,staticClass:\"icon-container\"},[_c('div',{staticClass:\"change-icon-wrap\",on:{\"click\":function($event){return _vm.$store.dispatch('workSpace/showPopup', {\n                type: 'changeImage',\n                data: {\n                  idx: n,\n                  callback: _vm.onChangeIcon\n                }\n              })}}},[_c('img',{staticClass:\"icon\",attrs:{\"alt\":\"img\",\"src\":_vm.configs[n]}})]),_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.configs[idx ? 'dislikeName' : 'likeName']),expression:\"configs[idx ? 'dislikeName' : 'likeName']\"}],staticClass:\"icon-name\",attrs:{\"type\":\"text\"},domProps:{\"value\":(_vm.configs[idx ? 'dislikeName' : 'likeName'])},on:{\"change\":_vm.updateIconName,\"input\":function($event){if($event.target.composing)return;_vm.$set(_vm.configs, idx ? 'dislikeName' : 'likeName', $event.target.value)}}})])}),0)])])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"context-panel-container\">\n    <div class=\"context-panel-scroll\">\n      <div class=\"context-panel-group\">\n        <div class=\"like-dislike-container\">\n          <div class=\"like-dislike-items\">\n            <div\n              class=\"like-dislike-item\"\n              v-for=\"(s, idx) in likeDislikeList\"\n              :key=\"idx\"\n            >\n              <div class=\"like-dislike-item-text\">{{ s }}</div>\n\n              <div class=\"close\" @click=\"removeLikeDislike(idx)\">&times;</div>\n            </div>\n          </div>\n\n          <div class=\"like-dislike-item add-new-open\">\n            <input\n              type=\"text\"\n              placeholder=\"add new\"\n              v-model=\"newLikeDislikeName\"\n            />\n            <div\n              src=\"@/assets/img/add_btn.svg\"\n              class=\"add-btn\"\n              @click=\"onAddNewLikeDislike\"\n            >\n              +\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"mob-separator\"></div>\n      <div class=\"context-panel-group\">\n        <!-- font-family-->\n        <font-family-input\n          @on-change-font-family=\"updateFontFamily\"\n          :activeFontFamily=\"fontFamily\"\n          class=\"font-family-container\"\n        />\n        <!-- font size -->\n        <div class=\"font-size text-settings-wraper\">\n          <div\n            class=\"font-size-controllers minus\"\n            @click=\"updateFontSize(--fontSize)\"\n          >\n            -\n          </div>\n          <input\n            type=\"number\"\n            class=\"font-size-input\"\n            :value=\"fontSize\"\n            @input=\"updateFontSize($event)\"\n          />\n          <div\n            class=\"font-size-controllers plus\"\n            @click=\"updateFontSize(++fontSize)\"\n          >\n            +\n          </div>\n        </div>\n        <!-- font styles -->\n        <div class=\"font-style text-settings-wraper\">\n          <label\n            class=\"label\"\n            v-for=\"(value, key, idx) of fontStyles\"\n            :key=\"idx\"\n          >\n            <input\n              class=\"checkbox-button\"\n              v-model=\"fontStyles[key].checked\"\n              type=\"checkbox\"\n              @change=\"updateFontStyle({ key, value })\"\n            />\n            <el-tooltip\n              placement=\"bottom\"\n              :content=\"key\"\n              transition=\"fade-tooltip\"\n              :disabled=\"device === 'mobile'\"\n            >\n              <span\n                class=\"input-wrapper fs\"\n                :class=\"{ underline: idx === 2 }\"\n                >{{ value.title }}</span\n              >\n            </el-tooltip>\n          </label>\n        </div>\n      </div>\n      <div class=\"mob-separator\"></div>\n      <div class=\"context-panel-group icons-group\">\n        <!-- spacify colors -->\n        <div class=\"colors-container\">\n          <div class=\"border-color\" v-for=\"n in 2\" :key=\"n\">\n            <el-dropdown placement=\"bottom\" trigger=\"click\">\n              <el-tooltip\n                placement=\"bottom\"\n                content=\"color\"\n                transition=\"fade-tooltip\"\n                :disabled=\"device === 'mobile'\"\n              >\n                <span class=\"picker-button\">\n                  <div\n                    class=\"color-picker-wraper\"\n                    :style=\"{\n                      backgroundColor: textColors[n - 1],\n                      border: getColorBorder({ hex: textColors[n - 1] })\n                    }\"\n                  ></div>\n                </span>\n              </el-tooltip>\n\n              <el-dropdown-menu slot=\"dropdown\">\n                <chrome-picker\n                  class=\"picker-element\"\n                  @input=\"onUpdateColor(n - 1, $event)\"\n                  :value=\"textColors[n - 1]\"\n                />\n              </el-dropdown-menu>\n            </el-dropdown>\n          </div>\n        </div>\n        <div class=\"field-name\">color</div>\n\n        <div class=\"change-icons-container\">\n          <div\n            class=\"icon-container\"\n            v-for=\"(n, idx) in ['likeIcon', 'dislikeIcon']\"\n            :key=\"idx\"\n          >\n            <div\n              class=\"change-icon-wrap\"\n              @click=\"\n                $store.dispatch('workSpace/showPopup', {\n                  type: 'changeImage',\n                  data: {\n                    idx: n,\n                    callback: onChangeIcon\n                  }\n                })\n              \"\n            >\n              <img alt=\"img\" :src=\"configs[n]\" class=\"icon\" />\n            </div>\n            <input\n              type=\"text\"\n              class=\"icon-name\"\n              v-model=\"configs[idx ? 'dislikeName' : 'likeName']\"\n              @change=\"updateIconName\"\n            />\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { getColorBorder } from \"@/helpers/hex\";\nimport ChromePicker from \"vue-color/src/components/Chrome\";\nimport fontFamilyInput from \"@/components/contextMenu/fontFamilyInput\";\nimport { fetchCanvasFont } from \"@/helpers/fontsHelper\";\nimport { mapGetters } from \"vuex\";\nimport FeedService from \"@/services/FeedService\";\nimport { setSurveyStepParam } from \"@/util/survey/markSurveyObject\";\nimport { addWidget } from \"@/util/survey/widgets\";\nimport \"@/assets/css/contextMenu.css\";\n\nexport default {\n  name: \"PilLikeDislikeWidgetPanel\",\n  components: {\n    ChromePicker,\n    fontFamilyInput\n  },\n  data() {\n    return {\n      getColorBorder,\n      addOpen: false,\n      likeDislikeList: [],\n      newLikeDislikeName: \"\",\n      fontSize: 16,\n      fontFamily: \"Monserrat\",\n      visibleIconsListLike: false,\n      visibleIconsListDislike: false,\n      timeoutId: null,\n      colorChecker: null,\n      iconsList: [],\n      fontStyles: {\n        bold: {\n          title: \"B\",\n          checked: false\n        },\n        italic: {\n          title: \"I\",\n          checked: false\n        },\n        underline: {\n          title: \"U\",\n          checked: false\n        }\n      },\n      textAlignMock: {\n        left: require(\"@/assets/img/fonts-panel/textPosLeft.svg\"),\n        center: require(\"@/assets/img/fonts-panel/textPosCenter.svg\"),\n        right: require(\"@/assets/img/fonts-panel/textPosRigth.svg\")\n      }\n    };\n  },\n  mounted() {\n    FeedService.getItemsByCategory(\n      {\n        id: \"8379135c-e79d-40c8-919e-703b5b04dda2\"\n      },\n      { type: \"richImages\", limit: false }\n    ).then(({ rich_image }) => {\n      this.iconsList = rich_image;\n    });\n  },\n  computed: {\n    ...mapGetters({\n      device: \"workSpace/device\",\n      survey: \"workSpace/survey\",\n      activeWidget: \"workSpace/activeWidget\"\n    }),\n    textItems() {\n      return this.activeWidget._objects.filter(o => o.type === \"text\");\n    },\n    textBackgroudItems() {\n      return this.activeWidget._objects.filter(\n        o => o.name === \"textBackground\"\n      );\n    },\n    configs() {\n      return this.activeWidget && this.activeWidget.configs;\n    },\n    likeItem() {\n      return this.activeWidget._objects.filter(o => o.name === \"like\")[0];\n    },\n    dislikeItem() {\n      return this.activeWidget._objects.filter(o => o.name === \"dislike\")[0];\n    },\n    iconsBackground() {\n      return this.activeWidget._objects.filter(\n        o => o.name === \"iconsBackground\"\n      );\n    },\n    textColors() {\n      this.colorChecker;\n      return [\n        this.textItems?.[0]?.fill ?? this.configs.textColor,\n        this.textBackgroudItems?.[0]?.fill ?? this.configs.textBackgroundColor\n      ];\n    }\n  },\n  created() {\n    this.init();\n    this.activeWidget.on(\"scaling\", () => {\n      this.onFontSizeScaling();\n    });\n  },\n  methods: {\n    init() {\n      this.likeDislikeList = this.configs.likeDislikeList;\n      this.fontFamily = this.configs.fontFamily;\n      this.fontStyles.bold.checked = this.configs.fontWeight === \"bold\";\n      this.fontStyles.italic.checked = this.configs.fontStyle === \"italic\";\n      this.fontStyles.underline.checked = this.configs.underline;\n      this.textAlign = this.configs.textAlign;\n      this.fontFamily = this.configs.fontFamily;\n      this.fontSize = Math.round(\n        this.configs.fontSize * this.activeWidget.get(\"scaleY\")\n      );\n    },\n    async calucaltePosition() {\n      const groupHeight = this.activeWidget.height;\n      let pos = -(groupHeight / 2);\n      for (let i = 0; i < this.textItems.length; i++) {\n        const item = this.textItems[i];\n        const height = item.height;\n        let width = item.width;\n        const limitHeight = 30;\n        const limitWidth = 270;\n        if (height >= limitHeight) {\n          this.updateFontSize(--this.fontSize);\n          break;\n        }\n        let textContent = this.likeDislikeList[i];\n        let isCut = false;\n        let cycle = true;\n        while (cycle) {\n          if (!isCut) item.text = textContent;\n          else item.text = textContent = textContent.slice(0, -1);\n          item.initDimensions();\n          width = item.width;\n          if (width <= limitWidth) break;\n          isCut = true;\n        }\n        if (isCut) {\n          item.text = textContent.slice(0, -3) + \"...\";\n          item.initDimensions();\n        }\n        this.textBackgroudItems[i].set(\"width\", width + 30);\n        item.setPositionByOrigin({ x: 0, y: pos + 15 }, \"center\", \"center\");\n        pos += 40;\n      }\n      this.survey.renderAll();\n    },\n    onFontSizeScaling() {\n      let fontSize =\n        this.textItems[0].get(\"fontSize\") * this.activeWidget.get(\"scaleY\");\n      fontSize = Math.round(fontSize);\n      if (!fontSize) return;\n      this.fontSize = fontSize;\n    },\n    updateFontSize(size) {\n      const _size = size?.target?.valueAsNumber ?? size;\n      const fontSize = Math.round(\n        _size / this.activeWidget.get(\"scaleY\") ? _size : 1\n      );\n      this.fontSize = _size > 0 ? _size : 1;\n      this.textItems.forEach(i => i.set(\"fontSize\", fontSize));\n      this.calucaltePosition();\n      this.survey.renderAll();\n      this.configs.fontSize = fontSize;\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      this.survey.fire(\"canvas:changes\");\n    },\n    onUpdateColor(colorIdx, { hex }) {\n      if (colorIdx === 0) {\n        this.textItems.forEach(i => i.setColor(hex));\n        this.configs.textColor = hex;\n      } else if (colorIdx === 1) {\n        this.textBackgroudItems.forEach(i => i.setColor(hex));\n        this.configs.textBackgroundColor = hex;\n      }\n      this.colorChecker = Math.random();\n      this.survey.renderAll();\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      if (this.timeoutId) clearTimeout(this.timeoutId);\n      this.timeoutId = setTimeout(() => {\n        this.survey.fire(\"canvas:changes\");\n      }, 500);\n    },\n    updateIconName() {\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      this.survey.fire(\"canvas:changes\");\n    },\n    updateFontStyle({ key, value }) {\n      fetchCanvasFont(this.textItems[0].fontFamily, { isActiveObj: false });\n      let paramName, param;\n      if (key === \"bold\")\n        [paramName, param] = [\"fontWeight\", value.checked ? \"bold\" : \"normal\"];\n      if (key === \"italic\")\n        [paramName, param] = [\"fontStyle\", value.checked ? \"italic\" : \"normal\"];\n      if (key === \"underline\")\n        [paramName, param] = [\"underline\", value.checked];\n      this.textItems.forEach(i => i.set(paramName, param));\n      this.configs[paramName] = param;\n      this.calucaltePosition();\n      this.survey.renderAll();\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      this.survey.fire(\"canvas:changes\");\n    },\n    async updateFontFamily(fontFamily) {\n      await fetchCanvasFont(fontFamily, { isActiveObj: false });\n      this.textItems.forEach(i => i.set(\"fontFamily\", fontFamily.name));\n      this.fontFamily = fontFamily.name;\n      this.calucaltePosition();\n      this.survey.renderAll();\n      this.configs.fontFamily = fontFamily.name;\n      this.configs.fontLink = fontFamily.content;\n      setSurveyStepParam(\"configs\", this.activeWidget, this.configs);\n      this.survey.fire(\"canvas:changes\");\n    },\n    onAddNewLikeDislike() {\n      if (!this.newLikeDislikeName) return;\n      else this.likeDislikeList.push(this.newLikeDislikeName);\n      this.newLikeDislikeName = \"\";\n      this.updateLikeDislikeList();\n    },\n    removeLikeDislike(idx) {\n      // if (this.likeDislikeList.length < 2) return;\n      this.likeDislikeList.splice(idx, 1);\n      this.updateLikeDislikeList();\n    },\n    onChangeIcon(type, url) {\n      this.configs[type] = url;\n      this.updateLikeDislikeList();\n    },\n    async updateLikeDislikeList() {\n      const widget = this.activeWidget.toObject();\n      widget.configs.likeDislikeList = this.likeDislikeList;\n      const active = this.activeWidget;\n      await addWidget(\"like-dislike\", this.survey, widget);\n      this.survey.remove(active);\n      this.survey.renderAll();\n      this.activeWidget.setCoords();\n      this.$store.dispatch(\"workSpace/showPopup\", { clearAll: true });\n      this.survey.fire(\"canvas:changes\");\n    }\n  },\n  watch: {\n    activeWidget() {\n      this.init();\n    }\n  }\n};\n</script>\n\n<style scoped>\n.like-dislike-simple-panel-wraper {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 100%;\n  padding-left: 7px;\n  box-sizing: border-box;\n}\n.panel-title {\n  color: #1d2d36;\n  font-size: 12px;\n  font-weight: 600;\n  text-align: center;\n  margin-top: 10px;\n}\n.colors-container {\n  display: flex;\n  align-items: center;\n  width: 113px;\n  background: #f8f8f5;\n  height: 30px;\n  border-radius: 6px;\n  justify-content: space-around;\n}\n\n.border-color {\n  display: flex;\n  cursor: pointer;\n  position: relative;\n}\n\n.picker-label {\n  width: 24px;\n  height: 24px;\n  border: 1px solid black;\n}\n.like-dislike-items,\n.like-dislike-container {\n  padding: 0 10px;\n  box-sizing: border-box;\n  flex-wrap: wrap;\n  display: flex;\n  width: 100%;\n  margin-top: 20px;\n}\n.like-dislike-items {\n  padding: 0;\n  margin-top: 0;\n}\n.like-dislike-item {\n  display: flex;\n  background: #f8f8f5;\n  color: #1d2d36;\n  font-size: 11px;\n  font-weight: 600;\n  height: 20px;\n  padding-left: 5px;\n  text-align: center;\n  box-sizing: border-box;\n  border-radius: 3px;\n  width: fit-content;\n  line-height: 20px;\n  margin-right: 9px;\n  margin-bottom: 10px;\n}\n.like-dislike-item .close {\n  cursor: pointer;\n  padding: 0 5px;\n  font-size: 16px;\n}\n.add-new-like-dislike {\n  cursor: pointer;\n  padding-right: 5px;\n}\n.add-new-open {\n  background: #fff;\n  padding-left: 0;\n}\n.add-new-open input {\n  height: 100%;\n  max-width: 110px;\n  box-sizing: border-box;\n  border: none;\n  background: #f8f8f5;\n  border-radius: 0;\n  text-align: center;\n  font-weight: 600;\n}\n.add-btn {\n  cursor: pointer;\n  margin-left: 4px;\n  min-width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #f8f8f5;\n  border-radius: 4px;\n  font-size: 20px;\n  font-weight: 600;\n}\n.font-family-container {\n  margin-top: 20px;\n}\n.font-family-container >>> .popover-container,\n.font-family-container >>> .fonts-input-label {\n  left: 0;\n}\n\n.like-dislike-item-text {\n  max-width: 265px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.font-style {\n  display: flex;\n  justify-content: space-between;\n  width: 120px;\n  margin-bottom: 20px;\n}\n\n.label {\n  display: flex;\n  text-align: center;\n  justify-content: center;\n  min-width: 26px;\n  height: 26px;\n  background: #f8f8f5;\n  border-radius: 4px;\n}\n\n.input-wrapper::after {\n  width: 15px;\n}\n.icon-container {\n  display: flex;\n  justify-content: space-around;\n  width: 170px;\n  margin-bottom: 20px;\n  box-sizing: border-box;\n  align-items: center;\n}\n.icon-container input {\n  width: 80px;\n  text-align: center;\n  border: none;\n  background: #f8f8f5;\n  height: 25px;\n  line-height: 25px;\n  padding: 0 5px;\n  box-sizing: border-box;\n}\n.icon-item {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 30px;\n  height: 30px;\n  border: 1px solid #f8f8f5;\n}\n.icon-item img {\n  height: 100%;\n  padding: 5px;\n  box-sizing: border-box;\n}\n.change-icon-wrap {\n  cursor: pointer;\n  background: #f8f8f5;\n  height: 50px;\n  width: 50px;\n  padding: 7px;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.change-icon-wrap img {\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n.icons-item {\n  width: 40px;\n  height: 40px;\n  cursor: pointer;\n  margin: 0 10px 10px 0;\n  border: 1px solid #f8f8f5;\n}\n.icons-item img {\n  width: 100%;\n  padding: 5px;\n  box-sizing: border-box;\n  height: 100%;\n  object-fit: contain;\n}\n.icons-group {\n  margin-bottom: -10px;\n}\n.icons-items {\n  display: flex;\n  flex-wrap: wrap;\n  max-width: 280px;\n  max-height: calc(100vh - 500px);\n  overflow: auto;\n}\n.font-size {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-bottom: 20px;\n}\n@media screen and (max-width: 990px) {\n  .font-style {\n    margin-bottom: 0;\n  }\n  .icons-items {\n    max-height: calc(100vh - 100px);\n  }\n  .font-family-container,\n  .like-dislike-container {\n    margin: 0;\n    padding: 0;\n  }\n  .like-dislike-container {\n    width: 270px;\n  }\n  .like-dislike-items {\n    overflow: auto;\n    max-height: 80px;\n  }\n  .add-new-open {\n    margin: 15px;\n  }\n}\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./likeDislikeWidgetPanel.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./likeDislikeWidgetPanel.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./likeDislikeWidgetPanel.vue?vue&type=template&id=276c781a&scoped=true&\"\nimport script from \"./likeDislikeWidgetPanel.vue?vue&type=script&lang=js&\"\nexport * from \"./likeDislikeWidgetPanel.vue?vue&type=script&lang=js&\"\nimport style0 from \"./likeDislikeWidgetPanel.vue?vue&type=style&index=0&id=276c781a&prod&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"276c781a\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('el-dropdown',{attrs:{\"trigger\":\"click\",\"placement\":'bottom'},on:{\"visible-change\":_vm.onHideDropdown}},[_c('div',{staticClass:\"el-dropdown-link\"},[_c('label',{staticClass:\"fonts-input-label\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.fontInput),expression:\"fontInput\"}],ref:\"fontFamilyInput\",staticClass:\"fonts-input\",attrs:{\"placeholder\":_vm.activeFontFamily,\"type\":\"text\"},domProps:{\"value\":(_vm.fontInput)},on:{\"input\":function($event){if($event.target.composing)return;_vm.fontInput=$event.target.value}}}),_c('img',{staticClass:\"fonts-input-arrow\",attrs:{\"alt\":\"img\",\"g\":\"\",\"src\":require(\"@/assets/img/select_arrow.svg\")}})]),_c('div',{staticClass:\"field-name\"},[_vm._v(\"font\")])]),_c('el-dropdown-menu',{staticClass:\"dropdown-menu-wraper\",attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_c('el-dropdown-item',[_vm._l((_vm.fontFamilyList),function(n,idx){return _c('div',{key:idx,staticClass:\"font-family-item\",on:{\"click\":function($event){return _vm.onChangeFontFamily(n)}}},[(n.__typename === 'font')?_c('img',{attrs:{\"alt\":\"img\",\"src\":n.preview}}):_c('div',{staticClass:\"font-family-name\",class:{ 'custom-font': n.__typename === 'upload_my_font' },style:({ 'font-family': n.name })},[_vm._v(\" \"+_vm._s(n.name)+\" \")])])}),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(!_vm.fontFamilyList.length && !_vm.showLoader),expression:\"!fontFamilyList.length && !showLoader\"}],staticClass:\"t-not-found\"},[_vm._v(\" font \"+_vm._s(_vm.fontInput)+\" not found \")]),_c('div',{staticClass:\"loader\"},[_c('div',{ref:\"infinityScrollTrigger\",attrs:{\"id\":\"scroll-trigger\"}}),_c('preloader',{staticClass:\"preloader\",attrs:{\"visible\":_vm.showLoader}})],1)],2)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <el-dropdown\n    trigger=\"click\"\n    :placement=\"'bottom'\"\n    @visible-change=\"onHideDropdown\"\n  >\n    <div class=\"el-dropdown-link\">\n      <label class=\"fonts-input-label\">\n        <input\n          :placeholder=\"activeFontFamily\"\n          class=\"fonts-input\"\n          type=\"text\"\n          v-model=\"fontInput\"\n          ref=\"fontFamilyInput\"\n        />\n        <img\n          alt=\"img\"\n          g\n          class=\"fonts-input-arrow\"\n          src=\"@/assets/img/select_arrow.svg\"\n        />\n      </label>\n      <div class=\"field-name\">font</div>\n    </div>\n    <el-dropdown-menu class=\"dropdown-menu-wraper\" slot=\"dropdown\">\n      <el-dropdown-item>\n        <div\n          class=\"font-family-item\"\n          v-for=\"(n, idx) of fontFamilyList\"\n          :key=\"idx\"\n          @click=\"onChangeFontFamily(n)\"\n        >\n          <img alt=\"img\" v-if=\"n.__typename === 'font'\" :src=\"n.preview\" />\n          <div\n            class=\"font-family-name\"\n            v-else\n            :style=\"{ 'font-family': n.name }\"\n            :class=\"{ 'custom-font': n.__typename === 'upload_my_font' }\"\n          >\n            {{ n.name }}\n          </div>\n        </div>\n        <div class=\"t-not-found\" v-show=\"!fontFamilyList.length && !showLoader\">\n          font {{ fontInput }} not found\n        </div>\n        <div class=\"loader\">\n          <div ref=\"infinityScrollTrigger\" id=\"scroll-trigger\"></div>\n          <preloader class=\"preloader\" :visible=\"showLoader\" />\n        </div>\n      </el-dropdown-item>\n    </el-dropdown-menu>\n  </el-dropdown>\n</template>\n\n<script>\nimport preloader from \"@/components/preloaderMenu\";\nimport { fetchCanvasFont } from \"@/helpers/fontsHelper\";\nimport rating from \"@/services/catalog/RatingsService\";\nimport { mapGetters } from \"vuex\";\nexport default {\n  name: \"PilFontFamilyInput\",\n  props: [\"activeFontFamily\"],\n  components: {\n    preloader\n  },\n  data() {\n    return {\n      fontFamilyList: [],\n      allFonts: [],\n      fontsListMod: [],\n      currentPage: 0,\n      maxPerPage: 50,\n      fontInput: \"\",\n      showLoader: false,\n      disableObserve: false\n    };\n  },\n  computed: {\n    ...mapGetters({\n      fonts: \"feed/fonts\",\n      myFonts: \"customContent/myFonts\",\n      device: \"workSpace/device\",\n      interactionMode: \"workSpace/interactionMode\",\n      survey: \"workSpace/survey\",\n      canvas: \"workSpace/canvas\"\n    }),\n    _canvas() {\n      return this.interactionMode ? this.survey : this.canvas;\n    }\n  },\n  mounted() {\n    const serializedMyFonts = this.myFonts.map(f => ({\n      ...f,\n      name: f.name.replace(/\\.ttf/g, \"\").replace(/\\.otf/g, \"\")\n    }));\n    this.fontsListMod = this.allFonts = [...serializedMyFonts, ...this.fonts];\n    this.scrollTrigger();\n  },\n  methods: {\n    async onChangeFontFamily(fontFamily) {\n      await fetchCanvasFont(fontFamily.name, { isActiveObj: false });\n      this._canvas.fire(\"canvas:changes\");\n      this.$emit(\"on-change-font-family\", fontFamily);\n      if (fontFamily.__typename === \"font\") {\n        rating.incrementRating(fontFamily.id, \"font\");\n      }\n    },\n    onHideDropdown(v) {\n      if (!v) this.$refs.fontFamilyInput.blur();\n    },\n    scrollTrigger() {\n      this.observer = new IntersectionObserver(entries => {\n        entries.forEach(async entry => {\n          if (entry.intersectionRatio > 0) {\n            await this.fetchPathFontsList();\n          }\n        });\n      });\n      this.observer.observe(this.$refs.infinityScrollTrigger);\n    },\n    async fetchPathFontsList() {\n      if (this.disableObserve) {\n        this.disableObserve = false;\n        return;\n      }\n      this.showLoader = true;\n      const partFontList = this.fontsListMod.slice(\n        this.maxPerPage * this.currentPage,\n        this.maxPerPage * this.currentPage + this.maxPerPage\n      );\n      const promiseList = [];\n      for (let f of partFontList) {\n        if (f.__typename === \"upload_my_font\") {\n          promiseList.push(fetchCanvasFont(f.name, { isActiveObj: false }));\n        }\n      }\n      await Promise.all(promiseList);\n      this.currentPage += 1;\n      this.showLoader = false;\n      this.fontFamilyList.push(...partFontList);\n    }\n  },\n  watch: {\n    fontInput(value) {\n      this.disableObserve = false;\n      this.currentPage = 0;\n      this.fontFamilyList = [];\n      if (!value) this.fontsListMod = this.allFonts;\n      else\n        this.fontsListMod = this.allFonts.filter(f =>\n          f.name.toLowerCase().includes(this.fontInput.toLowerCase())\n        );\n      this.fetchPathFontsList();\n      this.disableObserve = true;\n    }\n  }\n};\n</script>\n\n<style scoped>\n.el-dropdown-link {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.fonts-input {\n  padding: 0 20px 0 5px;\n  box-sizing: border-box;\n  width: 200px;\n  height: 25px;\n  background: #f8f8f5;\n  border: none;\n  text-align: center;\n  color: #1d2d36;\n  font-size: 12px;\n  border-radius: 7px;\n}\n.fonts-input-arrow {\n  cursor: pointer;\n  position: absolute;\n  right: 0;\n  top: 1px;\n  padding: 9px 5px;\n}\n.dropdown-menu-wraper {\n  margin: 0;\n  padding: 0;\n}\n.dropdown-menu-wraper >>> .el-dropdown-menu__item:focus,\n.dropdown-menu-wraper >>> .el-dropdown-menu__item:not(.is-disabled):hover {\n  background-color: white !important;\n  color: black !important;\n}\n.lang-cecker-wraper {\n  display: flex;\n  align-items: center;\n  /* width: 100%; */\n}\n.lang-cecker-wraper span {\n  font-size: 12px;\n  margin-right: 4px;\n}\n.checkbbox {\n  box-sizing: border-box;\n  width: 18px;\n  height: 18px;\n  border-radius: 2px;\n  border: 2px solid black;\n  position: relative;\n  margin: 3px 5px;\n}\n.is-checked {\n  display: none;\n  position: absolute;\n  top: -8px;\n  left: -3px;\n  width: 24px;\n  height: 24px;\n}\ninput[type=\"checkbox\"]:checked + .checkbbox > .is-checked {\n  display: block;\n}\n.font-family-item {\n  display: flex;\n  padding: 0 7px;\n  cursor: pointer;\n}\n.font-family-item:hover {\n  background: #f8f8f5;\n}\n.font-family-name {\n  font-size: 14px;\n  line-height: 22px;\n  min-width: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  margin-right: 10px;\n}\n.t-not-found {\n  height: auto;\n  margin: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100px;\n}\n.preloader {\n  position: absolute;\n  height: 100px;\n}\n.loader {\n  height: 5px;\n  position: relative;\n}\n.custom-font {\n  color: #ffe000;\n}\n.dropdown-menu-wraper {\n  min-height: 200px;\n  height: calc(100vh - 350px);\n  max-height: 1000px;\n  width: 280px;\n  border-radius: 10px;\n  overflow: auto;\n}\n.dropdown-menu-wraper >>> .el-dropdown-menu__item {\n  padding: 0;\n}\n.font-family-item img {\n  padding: 3px 0;\n  max-height: 16px;\n}\n@media screen and (max-width: 990px) {\n  .dropdown-menu-wraper {\n    width: 250px;\n    max-height: calc(100vh - 150px);\n  }\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./fontFamilyInput.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./fontFamilyInput.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./fontFamilyInput.vue?vue&type=template&id=438dff51&scoped=true&\"\nimport script from \"./fontFamilyInput.vue?vue&type=script&lang=js&\"\nexport * from \"./fontFamilyInput.vue?vue&type=script&lang=js&\"\nimport style0 from \"./fontFamilyInput.vue?vue&type=style&index=0&id=438dff51&prod&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"438dff51\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./likeDislikeWidgetPanel.vue?vue&type=style&index=0&id=276c781a&prod&scoped=true&lang=css&\""],"sourceRoot":""}