j1-template 2021.3.1 → 2022.0.2

data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.js

@@ -89,14 +89,14 @@
 
       buttonsHTML =  '<div class="twemoji-icon-picker">';
       buttonsHTML +=   '<span id="open-group" class="mr-2" style="width: 2rem; height: 2rem;">';
-      buttonsHTML +=     '<button type="button" name="open-group" class="btn btn-raised btn-flex btn-primary mr-2"><i class="toggle-button mdi mdi-lg mr-1 mdi-toggle-switch-off"></i> Picker </button>';
+      buttonsHTML +=     '<button type="button" name="open-group" class="btn btn-flex btn-primary mr-2"><i class="toggle-button mdi mdi-lg mr-1 mdi-toggle-switch-off"></i> Picker </button>';
       buttonsHTML +=   '</span>';
       buttonsHTML +=   '<span id="clear-textarea" style="width: 2rem; height: 2rem;">';
-      buttonsHTML +=     '<button type="button" name="clear-textarea" class="btn btn-raised btn-flex btn-primary"><i class="mdi mdi-close mdi-lg mr-1"></i>' + clearText + '</button>';
+      buttonsHTML +=     '<button type="button" name="clear-textarea" class="btn btn-flex btn-primary"><i class="mdi mdi-close mdi-lg mr-1"></i>' + clearText + '</button>';
       buttonsHTML +=   '</span>';
       buttonsHTML += '</div>';
 
-      h.$id = "#void" + h.$el["0"].id;
+      h.$id = "#" + h.$el["0"].id;
       h.$pickerHeigth = h.options.height.replace("px", "");
       h.$pickerHeigth = Number(h.$pickerHeigth);
       h.$wrapper = h.$el.wrap('<div class="twemoji-wrap"></div>').parent();

data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.min.js

@@ -16,4 +16,4 @@
  # For details, https://github.com/xLs51/Twemoji-Picker
  # -----------------------------------------------------------------------------
 */
-(function(c,h,a){var k=150;var i={};var e="/assets/data/twa_v1.json";var j;var l;c.TwemojiPicker=function(d,b){var f=this;c.when(this._loadDatabase()).done(function(m){f.$el=c(d);f._init(b)})};c.TwemojiPicker.defaults={init:null,language:"en",size:25,icon:"grinning",iconSize:25,height:100,width:null,category:["smile","cherry-blossom","video-game","oncoming-automobile","symbols"],categorySize:20,pickerPosition:null,pickerHeight:150,pickerWidth:null,placeholder:"Click on Picker to select Emoji's from a Category",};c.TwemojiPicker.prototype={_init:function(b){this.options=c.extend(true,{},c.TwemojiPicker.defaults,b);this._initPicker();this._initCategory();this._initTwemoji();this._initText();this._initStyle();this._initEvents()},_loadDatabase:function g(){return c.ajax({url:e,success:function(b){if(typeof b=="string"){i=JSON.parse(b)}if(typeof b=="object"){i=b}}})},_initPicker:function(){var f=this;var b;var d;if(f.options.language=="en"){b="Clear";j="Copied to Clipboard";l=f.options.placeholder}else{if(f.options.language=="de"){b="Löschen";j="Kopiert zur Zwischenablage";l="Klicken Sie auf Picker zur Auswahl von Emoji's aus einer Kategorie"}else{b="Clear";j="in Clipboard";l=f.options.placeholder}}d='<div class="twemoji-icon-picker">';d+='<span id="open-group" class="mr-2" style="width: 2rem; height: 2rem;">';d+='<button type="button" name="open-group" class="btn btn-raised btn-flex btn-primary mr-2"><i class="toggle-button mdi mdi-lg mr-1 mdi-toggle-switch-off"></i> Picker </button>';d+="</span>";d+='<span id="clear-textarea" style="width: 2rem; height: 2rem;">';d+='<button type="button" name="clear-textarea" class="btn btn-raised btn-flex btn-primary"><i class="mdi mdi-close mdi-lg mr-1"></i>'+b+"</button>";d+="</span>";d+="</div>";f.$id="#void"+f.$el["0"].id;f.$pickerHeigth=f.options.height.replace("px","");f.$pickerHeigth=Number(f.$pickerHeigth);f.$wrapper=f.$el.wrap('<div class="twemoji-wrap"></div>').parent();f.$wrapper.append('<div class="twemoji-textarea" contentEditable="true" placeholder="'+l+'"></div>');f.$wrapper.append('<div class="twemoji-textarea-duplicate"></div>');f.$wrapper.append(d);f.$wrapper.append('<div class="twemoji-picker"></div>');f.$el.hide();f.$textarea=f.$wrapper.find(".twemoji-textarea");f.$textareaDuplicate=f.$wrapper.find(".twemoji-textarea-duplicate").hide();f.$iconPicker=f.$wrapper.find("#open-group");f.$clearTextarea=f.$wrapper.find("#clear-textarea");f.$picker=f.$wrapper.find(".twemoji-picker").hide()},_initCategory:function(){var d=this;var b=this.options.category;this.categoryName=["people","nature","object","place","symbol"];this.$picker.append('<div class="twemoji-picker-category"></div>');this.$pickerCategory=this.$picker.find(".twemoji-picker-category");c.each(this.categoryName,function(m,f){d.$pickerCategory.append('<span data-category="'+f+'">'+d.imageFromName(b[m])+"</span>")});this.$pickerCategory.find("span:first").addClass("active")},_initTwemoji:function(){var b=this;c.each(this.categoryName,function(f,d){b.$picker.append('<div class="twemoji-list '+d+'"></div>');c.each(i,function(n,m){if(m.category===d){b.$wrapper.find(".twemoji-picker ."+d).append('<span><img class="emoji" draggable="false" src="'+m.base64+'" alt="'+m.value+'" title="'+m.name+'"></span>')}})});this.$twemojiList=this.$picker.find(".twemoji-list");this.$twemojiList.not(":first").hide()},_initText:function(){if(this.options.init){var b=this.options.init;var d=/:([\w-]+):/g;var f;while(f==d.exec(b)){b=b.replace(f[0],this.imageFromName(f[1],true))}this.$textarea.html(b);this.copyTextArea(this.$textarea.html())}},_initStyle:function(){this.$wrapper.css({width:this.options.width?this.options.width:"100%",height:this.options.height?this.options.height:"",});this.$wrapper.find("img").css({width:this.options.size,height:this.options.size,});this.$iconPicker.css({width:this.options.iconSize,height:this.options.iconSize,});this.$pickerCategory.find("img").css({width:this.options.categorySize,height:this.options.categorySize,});this.$twemojiList.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",height:this.options.pickerHeight,});this.$picker.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",top:this.options.pickerPosition==="top"?"-"+this.$picker.outerHeight()+"px":"",})},_initEvents:function(){var b=this;this.$textarea.on("keyup",function(){b.copyTextArea(c(this).html())});this.$iconPicker.on("click",function(){var d=c(".twemoji-picker").height()+k;c("#picker").height(d);c(".toggle-button").toggleClass("mdi-toggle-switch-off mdi-toggle-switch");if(!b.openedPicker){b.openPicker()}else{b.closePicker();c("#picker").height(b.$pickerHeigth)}});this.$clearTextarea.on("click",function(){b.copyTextArea("");c(b.$id).val("");c(".twemoji-textarea > .emoji-span").remove()});this.$pickerCategory.find("span").on("click",function(){var d=c(this).data("category");b.openCategory(c(this),d)});this.$pickerCategory.find(".close").on("click",function(){if(b.openedPicker){b.closePicker()}});this.$twemojiList.find("img").on("click",function(){b.copyTwemoji(c(this))})},copyText:function(f){var d=document.createElement("textarea");d.setAttribute("style","position:fixed;opacity:0;top:100px;left:100px;");d.value=f;document.body.appendChild(d);d.select();document.execCommand("copy");var b=document.createElement("div");b.setAttribute("class","copied");b.appendChild(document.createTextNode(j));document.body.appendChild(b);setTimeout(function(){document.body.removeChild(d);document.body.removeChild(b)},1500)},openPicker:function(){this.$picker.show();this.openedPicker=true},closePicker:function(){this.$picker.hide();this.openedPicker=false},openCategory:function(d,b){this.$pickerCategory.find("span").removeClass("active");d.addClass("active");this.$twemojiList.not(".twemoji-picker ."+b).hide();this.$twemojiList.filter(".twemoji-picker ."+b).show()},copyTwemoji:function(b){var m=b.attr("alt");var d=b.attr("src");var f=b.attr("title");var n="emoji:"+f+"[]";this.copyText(n);this.$textarea.focus();this.pasteAtCursor('<span class="emoji-span"><img class="emoji" src="'+d+'" title="'+f+'" alt="'+m+'" width="'+this.options.size+'" height="'+this.options.size+'"> '+n+"</span> ");this.copyTextArea(this.$textarea.html())},copyTextArea:function(b){var f=this.$textareaDuplicate.html(b);f.find("img").replaceWith(function(){return this.alt});var d=f.html();this.$el.text(d)},imageFromName:function(d,b){var f=c.grep(i,function(m){return m.name==d});if(b){return'<img class="emoji" src="'+f[0].base64+'" alt="'+f[0].value+'" width="'+this.options.size+'" height="'+this.options.size+'">'}return'<img class="emoji" draggable="false" src="'+f[0].base64+'" alt="'+d+'">'},pasteAtCursor:function(b){var d,q;if(h.getSelection){d=h.getSelection();if(d.getRangeAt&&d.rangeCount){q=d.getRangeAt(0);q.deleteContents();var p=document.createElement("div");p.innerHTML=b;var r=document.createDocumentFragment(),f,o;while((f=p.firstChild)){o=r.appendChild(f)}q.insertNode(r);if(o){q=q.cloneRange();q.setStartAfter(o);q.collapse(true);d.removeAllRanges();d.addRange(q)}}}else{if(document.selection&&document.selection.type!="Control"){document.selection.createRange().pasteHTML(b)}}}};c.fn.twemojiPicker=function(b){var d=c.data(this,"twemojiPicker");this.each(function(){d?d._init():d=c.data(this,"twemojiPicker",new c.TwemojiPicker(this,b))});return d}})(jQuery,window);
+(function(c,h,a){var k=150;var i={};var e="/assets/data/twa_v1.json";var j;var l;c.TwemojiPicker=function(d,b){var f=this;c.when(this._loadDatabase()).done(function(m){f.$el=c(d);f._init(b)})};c.TwemojiPicker.defaults={init:null,language:"en",size:25,icon:"grinning",iconSize:25,height:100,width:null,category:["smile","cherry-blossom","video-game","oncoming-automobile","symbols"],categorySize:20,pickerPosition:null,pickerHeight:150,pickerWidth:null,placeholder:"Click on Picker to select Emoji's from a Category",};c.TwemojiPicker.prototype={_init:function(b){this.options=c.extend(true,{},c.TwemojiPicker.defaults,b);this._initPicker();this._initCategory();this._initTwemoji();this._initText();this._initStyle();this._initEvents()},_loadDatabase:function g(){return c.ajax({url:e,success:function(b){if(typeof b=="string"){i=JSON.parse(b)}if(typeof b=="object"){i=b}}})},_initPicker:function(){var f=this;var b;var d;if(f.options.language=="en"){b="Clear";j="Copied to Clipboard";l=f.options.placeholder}else{if(f.options.language=="de"){b="Löschen";j="Kopiert zur Zwischenablage";l="Klicken Sie auf Picker zur Auswahl von Emoji's aus einer Kategorie"}else{b="Clear";j="in Clipboard";l=f.options.placeholder}}d='<div class="twemoji-icon-picker">';d+='<span id="open-group" class="mr-2" style="width: 2rem; height: 2rem;">';d+='<button type="button" name="open-group" class="btn btn-flex btn-primary mr-2"><i class="toggle-button mdi mdi-lg mr-1 mdi-toggle-switch-off"></i> Picker </button>';d+="</span>";d+='<span id="clear-textarea" style="width: 2rem; height: 2rem;">';d+='<button type="button" name="clear-textarea" class="btn btn-flex btn-primary"><i class="mdi mdi-close mdi-lg mr-1"></i>'+b+"</button>";d+="</span>";d+="</div>";f.$id="#"+f.$el["0"].id;f.$pickerHeigth=f.options.height.replace("px","");f.$pickerHeigth=Number(f.$pickerHeigth);f.$wrapper=f.$el.wrap('<div class="twemoji-wrap"></div>').parent();f.$wrapper.append('<div class="twemoji-textarea" contentEditable="true" placeholder="'+l+'"></div>');f.$wrapper.append('<div class="twemoji-textarea-duplicate"></div>');f.$wrapper.append(d);f.$wrapper.append('<div class="twemoji-picker"></div>');f.$el.hide();f.$textarea=f.$wrapper.find(".twemoji-textarea");f.$textareaDuplicate=f.$wrapper.find(".twemoji-textarea-duplicate").hide();f.$iconPicker=f.$wrapper.find("#open-group");f.$clearTextarea=f.$wrapper.find("#clear-textarea");f.$picker=f.$wrapper.find(".twemoji-picker").hide()},_initCategory:function(){var d=this;var b=this.options.category;this.categoryName=["people","nature","object","place","symbol"];this.$picker.append('<div class="twemoji-picker-category"></div>');this.$pickerCategory=this.$picker.find(".twemoji-picker-category");c.each(this.categoryName,function(m,f){d.$pickerCategory.append('<span data-category="'+f+'">'+d.imageFromName(b[m])+"</span>")});this.$pickerCategory.find("span:first").addClass("active")},_initTwemoji:function(){var b=this;c.each(this.categoryName,function(f,d){b.$picker.append('<div class="twemoji-list '+d+'"></div>');c.each(i,function(n,m){if(m.category===d){b.$wrapper.find(".twemoji-picker ."+d).append('<span><img class="emoji" draggable="false" src="'+m.base64+'" alt="'+m.value+'" title="'+m.name+'"></span>')}})});this.$twemojiList=this.$picker.find(".twemoji-list");this.$twemojiList.not(":first").hide()},_initText:function(){if(this.options.init){var b=this.options.init;var d=/:([\w-]+):/g;var f;while(f==d.exec(b)){b=b.replace(f[0],this.imageFromName(f[1],true))}this.$textarea.html(b);this.copyTextArea(this.$textarea.html())}},_initStyle:function(){this.$wrapper.css({width:this.options.width?this.options.width:"100%",height:this.options.height?this.options.height:"",});this.$wrapper.find("img").css({width:this.options.size,height:this.options.size,});this.$iconPicker.css({width:this.options.iconSize,height:this.options.iconSize,});this.$pickerCategory.find("img").css({width:this.options.categorySize,height:this.options.categorySize,});this.$twemojiList.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",height:this.options.pickerHeight,});this.$picker.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",top:this.options.pickerPosition==="top"?"-"+this.$picker.outerHeight()+"px":"",})},_initEvents:function(){var b=this;this.$textarea.on("keyup",function(){b.copyTextArea(c(this).html())});this.$iconPicker.on("click",function(){var d=c(".twemoji-picker").height()+k;c("#picker").height(d);c(".toggle-button").toggleClass("mdi-toggle-switch-off mdi-toggle-switch");if(!b.openedPicker){b.openPicker()}else{b.closePicker();c("#picker").height(b.$pickerHeigth)}});this.$clearTextarea.on("click",function(){b.copyTextArea("");c(b.$id).val("");c(".twemoji-textarea > .emoji-span").remove()});this.$pickerCategory.find("span").on("click",function(){var d=c(this).data("category");b.openCategory(c(this),d)});this.$pickerCategory.find(".close").on("click",function(){if(b.openedPicker){b.closePicker()}});this.$twemojiList.find("img").on("click",function(){b.copyTwemoji(c(this))})},copyText:function(f){var d=document.createElement("textarea");d.setAttribute("style","position:fixed;opacity:0;top:100px;left:100px;");d.value=f;document.body.appendChild(d);d.select();document.execCommand("copy");var b=document.createElement("div");b.setAttribute("class","copied");b.appendChild(document.createTextNode(j));document.body.appendChild(b);setTimeout(function(){document.body.removeChild(d);document.body.removeChild(b)},1500)},openPicker:function(){this.$picker.show();this.openedPicker=true},closePicker:function(){this.$picker.hide();this.openedPicker=false},openCategory:function(d,b){this.$pickerCategory.find("span").removeClass("active");d.addClass("active");this.$twemojiList.not(".twemoji-picker ."+b).hide();this.$twemojiList.filter(".twemoji-picker ."+b).show()},copyTwemoji:function(b){var m=b.attr("alt");var d=b.attr("src");var f=b.attr("title");var n="emoji:"+f+"[]";this.copyText(n);this.$textarea.focus();this.pasteAtCursor('<span class="emoji-span"><img class="emoji" src="'+d+'" title="'+f+'" alt="'+m+'" width="'+this.options.size+'" height="'+this.options.size+'"> '+n+"</span> ");this.copyTextArea(this.$textarea.html())},copyTextArea:function(b){var f=this.$textareaDuplicate.html(b);f.find("img").replaceWith(function(){return this.alt});var d=f.html();this.$el.text(d)},imageFromName:function(d,b){var f=c.grep(i,function(m){return m.name==d});if(b){return'<img class="emoji" src="'+f[0].base64+'" alt="'+f[0].value+'" width="'+this.options.size+'" height="'+this.options.size+'">'}return'<img class="emoji" draggable="false" src="'+f[0].base64+'" alt="'+d+'">'},pasteAtCursor:function(b){var d,q;if(h.getSelection){d=h.getSelection();if(d.getRangeAt&&d.rangeCount){q=d.getRangeAt(0);q.deleteContents();var p=document.createElement("div");p.innerHTML=b;var r=document.createDocumentFragment(),f,o;while((f=p.firstChild)){o=r.appendChild(f)}q.insertNode(r);if(o){q=q.cloneRange();q.setStartAfter(o);q.collapse(true);d.removeAllRanges();d.addRange(q)}}}else{if(document.selection&&document.selection.type!="Control"){document.selection.createRange().pasteHTML(b)}}}};c.fn.twemojiPicker=function(b){var d=c.data(this,"twemojiPicker");this.each(function(){d?d._init():d=c.data(this,"twemojiPicker",new c.TwemojiPicker(this,b))});return d}})(jQuery,window);