studio_emoji.js

Created Diff never expires
3 removals
59 lines
10 additions
66 lines
jQuery(function($) {
(function($) {
let studio = {
let studio = {
result: $('#emoji_search_result'),
result: $('#emoji_search_result'),
panels: $('#emoji a[data-subpanel]'),
panels: $('#emoji a[data-subpanel]'),
init: function() {
init: function() {
studio.getData();
studio.getData();
studio.bindSearch();
studio.bindSearch();


studio.panels.on('click', studio.lazyLoad);
studio.panels.on('click', studio.lazyLoad);
$('#emoji_toggle').on('click', studio.lazyLoad);
$('#emoji_toggle').on('click', studio.lazyLoad);


studio.result.empty = studio.result.find('> .error');
studio.result.empty = studio.result.find('> .error');
},
},
lazyLoad: function() {
lazyLoad: function() {
let panel = $(this).data('subpanel') || studio.panels.first().data('subpanel');
let panel = $(this).data('subpanel') || studio.panels.first().data('subpanel');


$(`#${panel} img[data-src]`).each(function() {
$(`#${panel} img[data-src]`).each(function() {
$(this).attr('src', $(this).data('src')).removeAttr('data-src');
$(this).attr('src', $(this).data('src')).removeAttr('data-src');
});
});

if (panel === 'emoji-search-panel') {
window.setTimeout(function () {
$('#emoji_search').focus();
}, 0);
}
},
},
getData: function() {
getData: function() {
let $data = $('#studio_emoji').find('> :first-child');
let $data = $('#studio_emoji').find('> :first-child');


this.emoji = $.parseJSON($data.text());
this.emoji = $.parseJSON($data.text());
this.ext = $data.data('ext');
this.ext = $data.data('ext');
this.cdn = $data.data('cdn');
this.cdn = $data.data('cdn');


$data.remove();
$data.remove();
},
},
bindSearch: function() {
bindSearch: function() {
$('#emoji_search').on('keyup', function() {
$('#emoji_search').on('keyup', function() {
let search = $(this).val().replace(' ', '_');
let search = $(this).val().replace(' ', '_').toLowerCase();;


studio.clearResult();
studio.clearResult();


if (search.length > 2) {
if (search.length > 2) {
$.each(studio.emoji, function(name, src) {
$.each(studio.emoji, function(name, src) {
if (name.indexOf(search) > -1) {
if (name.indexOf(search) > -1) {
studio.result.append(studio.createImg(name, src))
studio.result.append(studio.createImg(name, src))
}
}
});
});
}
}


studio.checkEmpty();
studio.checkEmpty();
});
});
},
},
createImg: function(name, src) {
createImg: function(name, src) {
return `<a href="#" onclick="insert_text('${name}', true); return false;"><img class="emoji smilies" src="${studio.cdn + src + studio.ext}" alt="${name}" title="${name}" /></a>`;
return `<a href="#" onclick="insert_text('${name}', true); return false;"><img class="emoji smilies" src="${studio.cdn + src + studio.ext}" alt="${name}" title="${name}" /></a>`;
},
},
clearResult: function() {
clearResult: function() {
studio.result.children().not(studio.result.empty).remove();
studio.result.children().not(studio.result.empty).remove();
},
},
checkEmpty: function() {
checkEmpty: function() {
studio.result.empty.toggle(studio.result.empty.is(':only-child'));
studio.result.empty.toggle(studio.result.empty.is(':only-child'));
},
},
};
};


$(window).on('load', studio.init);
$(window).on('load', studio.init);
});
})(jQuery);