| Current Path : /home/poneycluc/www/plugins/system/t4/admin/assets/js/ |
| Current File : /home/poneycluc/www/plugins/system/t4/admin/assets/js/googlefonts.js |
// google fonts
jQuery(document).ready(function($){
//check add event tabs on Joomla 4
if(T4Admin.jversion != 3){
$('#managerFontsTab').find('li').on('click',function(){
if($(this).hasClass('active')) return;
$('#managerFontsTab').find('.active').removeClass('active');
$(this).addClass('active');
$('#managerTabContent').find('.tab-pane').removeClass('active');
console.log('href:', $(this).find('a').attr('href'));
$($(this).find('a').attr('href')).addClass('active');
});
}
// Open Row settings Modal
$(document).on('click touchstart', '.btn-fonts', function(e){
e.preventDefault();
var btndata = $(this).data();
var fontCheck = $('#typelist_site_dont_use_google_font').prop('checked');
if(fontCheck) T4Admin.disGgFont('dis');
//init google font modal
var $bodyfontmodal = $('.t4-google-font-modal');
if(!$bodyfontmodal.parents().is('.themeConfigModal')) $bodyfontmodal.appendTo('.themeConfigModal');
$('body').addClass('t4-modal-open');
var nameFont = $('#'+btndata.name).val();
$bodyfontmodal.find('li[data-name="'+nameFont+'"]').addClass('font-active');
$bodyfontmodal.show();
$bodyfontmodal.data('input',btndata.name);
$('.custom-font-form').find('.input-select').each(function(){
$(this).val("").trigger('liszt:updated');
});
$('#t4-font-filter').val('');
$('.t4-font-filter').hide();
});
$('body').on('change','#custom-css', function(e) {
$(this).closest('.control-group.custom-css').find('.message.alert').remove();
});
$('body').on('change','#custom-font-url', function(e) {
$(this).parents('.control-group.custom-font-url').find('.message.alert').remove();
});
$(document).on('click','li .t4-font-weight-popup', function(e) {
e.stopPropagation();
})
$(document).on('click','li .jub-font-container', function(e) {
e.stopPropagation();
e.preventDefault();
$('.t4-font-weight-popup').appendTo($(this));
$('.jub-font-container.top').removeClass('top');
$('.jub-font-container.left').removeClass('left');
$('.jub-font-container.right').removeClass('right');
var styles = $(this).closest('.jub-font').data('styles'),
fontActive = false,
nameFont = $(this).closest('.jub-font').data('name'),
dataWeight = "",
clsInputFont = "#"+$(this).closest('.t4-google-font-modal').data('input');
if($(this).closest('.jub-font').hasClass('font-active')){
fontActive = true;
dataWeight = $(clsInputFont).data('loadweights');
}
if(typeof dataWeight == 'undefined') dataWeight = "";
var options = {
styles: styles,
name: nameFont,
fontActive: fontActive,
clsInputFont: clsInputFont,
dataWeight: dataWeight.split(',')
}
fontWeightRenderPopup($('.t4-font-weight-popup'),options);
var offSet = $(this).find('.jub-font-styles').offset();
var offSetfixed = $(this).closest('.t4-google-content').offset();
if(offSet.top - offSetfixed.top > 360) {
$(this).addClass('top');
}
if(offSet.left - offSetfixed.left < 500){
$(this).addClass('right');
}
$(".t4-font-weight-popup").show();
$('li.jub-font.font-focus').removeClass('font-focus');
$(this).closest('li.jub-font').addClass('font-focus');
});
$('body').on('click','li.custom-font', function(e){
var nameFont = $(this).data('name'),$fontType = 'custom',
elemClass = this.className.split(" "),
$classInputFont = $(this).closest('.t4-google-font-modal').data('input');
$('#'+$classInputFont).val(nameFont);
$('#'+$classInputFont).data('fontType',$fontType);
$('#'+$classInputFont).data('loadweights','');
$('#'+$classInputFont).trigger('change');
$('.t4-font-weight-preview').html('');
$('body').removeClass('t4-modal-open');
$('.font-active').removeClass('font-active');
$('.themeConfigModal').children().not('.t4-message-container').hide();
});
$('#t4-font-filter').on('keyup',function() {
var value = $(this).val().toLowerCase();
var fontCount = 0;
var $filterKey,$filterView;
if(!$('#jub-google-content').is(":visible")){
$filterKey = 'li.custom-google-font';
$filterView = $('#custom-google-content');
}else{
$filterKey = 'li.jub-google-font';
$filterView = $('#jub-google-content');
}
$($filterKey).not('#custom-local').filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1);
if($(this).text().toLowerCase().indexOf(value) > -1){
fontCount++;
}
});
$('.t4-font-filter').show();
if(!value) $('.t4-font-filter').hide();
if(!fontCount){
$filterView.find('.t4-font-filter').get(0).innerHTML = '<span class="alert alert-success">no result</span>';
}else{
$filterView.find('.t4-font-filter').get(0).innerHTML = '<span class="alert alert-success">you have '+fontCount+' result</span>';
}
$('#custom-local').hide();
});
// export
$('.btn-action[data-action="font.addfont"]').on('click', function() {
$('.add-more-custom-font .btn-action.active').removeClass('active');
$(this).addClass('active');
// show addon form
$('.custom-font-form').show();
$('#custom-font-input').val("");
$('.custom-font-url').show();
$('.add-font-name').show();
$('.custom-css').hide();
});
// export
$('.btn-action[data-action="font.addcss"]').on('click', function() {
$('.add-more-custom-font .btn-action.active').removeClass('active');
$(this).addClass('active');
// show addon form
$('.custom-font-form').show();
$('#custom-font-input').val("");
$('.custom-font-url').hide();
$('.add-font-name').hide();
$('.custom-css').show();
});
$('.btn-action[data-action="fonts.save"]').on('click', function() {
var type = $(this).data('type');
doSave(type);
})
$('body').on('click', '.btn-action[data-action="fonts.remove"]', function(e) {
e.preventDefault();e.stopPropagation();
doRemove(this);
})
var doSave = function (typefont) {
var url = location.pathname + '?option=com_ajax&plugin=t4&format=json&t4do=customFont&task=add&id=' + tempId;
var typeActive = $('.add-more-custom-font').find('.btn-action.active').data('type');
var fonts = {
type: typeActive
};
if (!fonts.type) {
var mesg = $('<div class="message alert" />').append(T4Admin.langs.addonEmptyFieldTypeWaring);
if(!$('.control-group.custom-font-type').find('.message.alert').length){
$('.control-group.custom-font-type').append(mesg);
}
return;
}
if(fonts.type == 'css'){
var $css = $('.'+typefont+' #custom-css').val().trim();
if ($css) {
fonts.css = $css.split('\n');
}
if (!fonts.css) {
var mesg = $('<div class="message alert" />').append(T4Admin.langs.fontsEmptyFieldCssWaring);
if(!$('.control-group.custom-css').find('.message.alert').length){
$('.control-group.custom-css').append(mesg);
}
return;
}
}else{
var font = $('.'+typefont+' #custom-font-url').val().trim();
if (font) {
fonts.font = font.split('\n');
}
if (!fonts.font) {
var mesg = $('<div class="message alert" />').append(T4Admin.langs.fontEmptyFieldFontFileWaring);
if(!$('.control-group.custom-font-url').find('.message.alert').length){
$('.control-group.custom-font-url').append(mesg);
}
return;
}
}
$.post(url, {fonts:fonts}).then(function(response) {
if (response.ok && response.fonts) {
// hide form
if(typeof response.fonts.length != 'undefined' && response.fonts.length != 0){
var $font = response.fonts;
for (var i = 0; i < $font.length; i++) {
var $li = $('.'+typefont+'#custom-local').clone();
$li.data('name',$font[i]['name']);
$li.removeAttr('id').removeClass('hide');
$li.find('.custom-font-container').attr('title',$font[i]['name']);
$li.find('.custom-font-container').data('type',$font[i]['type']);
$li.find('.custom-font-name').html($font[i]['name']);
$li.insertBefore($('.'+typefont+'#custom-local')).show();
}
}else{
// add new addon into list
var $li = $('.'+typefont+'#custom-local').clone();
$li.removeAttr('id').removeClass('hide');
$li.find('.custom-font-container').attr('title') = response.fonts.name;
$li.find('.custom-font-container').data('type',response.fonts.type);
$li.find('.custom-font-name').html(response.fonts.name);
$li.insertBefore($('.'+typefont+' #custom-local')).show();
}
$('.custom-font-input').val('');
T4Admin.Messages(T4Admin.langs.T4fontCustomAdded,'message');
} else {
alert(response.error);
}
})
}
var doRemove = function (btn) {
var $btn = $(btn),
$fontName = $btn.closest('li').find('.custom-font-name').text();
if (!$fontName) return;
T4Admin.Confirm(T4Admin.langs.T4fontCustomRemoveConfirm, function(ans){
if (ans) {
var url = location.pathname + '?option=com_ajax&plugin=t4&format=json&t4do=customFont&task=remove&id=' + tempId;
$.post(url, {name: $fontName}).then(function(response) {
if (response.ok) {
// remove addon
$btn.closest('li').remove();
T4Admin.Messages(T4Admin.langs.T4fontCustomRemoved,'message');
} else {
alert(response.error);
}
})
}else {
return false;
}
},'');
}
$.fn.fontWeight_NumbertoText = function ($number) {
var text = '';
switch ($number) {
case '100':
text = 'Thin';
break;
case '100italic':
case '100i':
text = 'Thin italic';
break;
case '200':
text = 'Extra-Light';
break;
case '200italic':
case '200i':
text = 'Extra-Light italic';
break;
case '300':
text = 'Light';
break;
case '300italic':
case '300i':
text = 'Light italic';
break;
case '400':
case 'regular':
text = 'Regular';
break;
case 'italic':
case '400italic':
case '400i':
text = 'Regular italic';
break;
case '500':
text = 'Medium';
break;
case '500italic':
case '500i':
text = 'Medium italic';
break;
case '600':
text = 'Semi-Bold';
break;
case '600italic':
case '600i':
text = 'Semi-Bold italic';
break;
case '700':
text = 'Bold';
break;
case '700italic':
case '700i':
text = 'Bold italic';
break;
case '800':
text = 'Extra-Bold';
break;
case '800italic':
case '800i':
text = 'Extra-Bold italic';
break;
case '900':
text = 'Ultra-Bold';
break;
case '900italic':
case '900i':
text = 'Ultra-Bold italic';
break;
default:
text = $number;
break;
}
return text;
}
$.fn.fontWeight_TexttoNumber = function ($text) {
var number = '';
switch ($text) {
case 'Thin':
number = 100;
break;
case '100italic':
case '100 italic':
case 'Thin italic':
number = '100i';
break;
case 'Extra-Light':
number = 200;
break;
case '200italic':
case '200 italic':
case 'Extra-Light italic':
number = '200i';
break;
case 'Light':
number = 300;
break;
case '300italic':
case '300 italic':
case 'Light italic':
number = '300i';
break;
case 'Regular':
case 'regular':
number = 400;
break;
case '400 italic':
case 'italic':
case 'Regular italic':
number = '400i';
break;
case 'Medium':
number = 500;
break;
case '500italic':
case 'Medium italic':
number = '500i';
break;
case 'Semi-Bold':
number = 600;
break;
case '600italic':
case 'Semi-Bold italic':
number = '600i';
break;
case 'Bold':
number = 700;
break;
case '700italic':
case 'Bold italic':
number = '700i';
break;
case 'Extra-Bold':
number = 800;
break;
case '800italic':
case 'Extra-Bold italic':
number = '800i';
break;
case 'Ultra-Bold':
number = 900;
break;
case '900italic':
case 'Ultra-Bold italic':
number = '900i';
break;
default:
number = $text;
break;
}
return number;
}
var update_fontWeight = function($options) {
if(!$options.fontweightopt) return;
var fontName = $options.fontname, $fontWeight_options = $('#attrib-themeConfig select.'+$options.fontweightopt ),current_fontWeight = [];
$fontWeight_options.find('option').each(function(){
if($(this).val()) current_fontWeight.push($(this).val());
});
var all_fonts = site_all_fonts;
var fonts = all_fonts.filter(function(font){
if(font.name == fontName){
return font;
}
})[0];
var optWeight = $options.styles;
if(typeof fonts == 'undefined') fonts = {};
if(!fonts.hasOwnProperty('styles')) fonts.styles = '';
if(!optWeight){
optWeight = fonts.styles;
}else{
optWeight = optWeight.split(',');
}
var fontWeight = optWeight;
var remove_w = [];
// merge with current fonts
var removed_fontsWeight = $(current_fontWeight).not(fontWeight).get(),
added_fontnames = $(fontWeight).not(current_fontWeight).get();
removed_fontsWeight.forEach(function(w){
return remove_w.push($.fn.fontWeight_TexttoNumber(w));
});
// remove fonts weigth
if (removed_fontsWeight.length)
$fontWeight_options.find('option').filter(function(){
return $.inArray(this.value, remove_w) > -1 ? true : false}).remove();
if (added_fontnames.length) {
for (var i = 0; i < added_fontnames.length; i++) {
$('<option>', {value: $.fn.fontWeight_TexttoNumber(added_fontnames[i].toString()), text: $.fn.fontWeight_NumbertoText(added_fontnames[i].toString())}).appendTo ($fontWeight_options);
}
}
// update selected for first time
if (!current_fontWeight.length) {
$fontWeight_options.each (function() {
var $elem = $(this);
$elem.val ($elem.data('value'));
})
}
if(remove_w.length){
if(remove_w.findIndex(function(w) {if(w == $fontWeight_options.data('value')) return w;}) > -1){
$fontWeight_options.val ('400');
$fontWeight_options.trigger('change');
}else{
$fontWeight_options.val ($fontWeight_options.data('value'));
}
}
current_fontWeight = fontWeight;
// update for chosen select
$fontWeight_options.trigger('liszt:updated');
$fontWeight_options.trigger('chosen:updated');
}
$(document).on('change','.google-font-input', function(e) {
var $styles = $(this).data('loadweights');
if(typeof $styles == 'undefined') $styles = "";
var options = {
styles:$styles,
fontname: $(this).val(),
fontweightopt: $(this).data('classfontweight'),
}
update_fontWeight(options);
});
var fontWeightRenderPopup = function($selector,$data){
var $div = "";
//convert data to array
var weightArr = $data.styles.split(","),dataW = $data.dataWeight;
if(weightArr.length){
if(dataW && typeof dataW == 'string') dataW = JSON.parse(dataW);
$div += "<ul>";
weightArr.forEach(function(w){
w = $.fn.fontWeight_NumbertoText(w);
w_number = $.fn.fontWeight_TexttoNumber(w);
var $checked = "";
if($data.fontActive && dataW.includes(w_number.toString())){
$checked = 'checked=""';
}
$div += "<li class='t4-form-checkbox'>";
$div += "<label class='checkbox-label'>";
$div += '<input type="checkbox" class="form-check-input" value="" data-value="'+w_number+'" '+$checked+'>'+w;
$div += "</label></li>";
});
$div += "</ul>";
}
if($div){
$div += '<div class="btn-actions"><button type="button" data-action="btn.cancel" class="t4-btn btn-action">Cancel</button>';
$div += '<button type="button" data-action="btn.selected" data-name_font="'+$data.name+'" data-input_font="'+$data.clsInputFont+'" class="t4-btn btn-action btn-primary">Select font</button></div>';
}
$selector.html($div);
}
$(document).on('click','.t4-btn[data-action="btn.selected"]', function(e) {
var dataWeight = [],nameFont = $(this).data('name_font'),class_input_font = $(this).data('input_font');
$('.t4-form-checkbox').find('.form-check-input').each(function(){
if($(this).prop('checked')){
dataWeight.push($(this).data('value').toString());
}
});
$(class_input_font).val(nameFont);
$(class_input_font).data('fonttype','google');
$(class_input_font).data('loadweights',dataWeight.join(","));
var parentELfont = $(class_input_font).closest('.control-group');
if(dataWeight.length){
if(parentELfont.find('.t4-font-weight-preview').length){
parentELfont.find('.t4-font-weight-preview').html("<span class='font-weight'>Font weight: <small>"+dataWeight.join("</small><small>")+"</small></span>");
}else{
parentELfont.append($("<div class='t4-font-weight-preview control-helper' data-fontname='"+nameFont+"' data-loadweights='"+dataWeight.join(",")+"' />").append("<span class='font-weight'>Font weight: <small>"+dataWeight.join("</small><small>")+"</small></span>"));
}
} else {
parentELfont.find('.t4-font-weight-preview').html("");
}
parentELfont.find('.t4-font-weight-preview').data('fontname',nameFont);
parentELfont.find('.t4-font-weight-preview').data('loadweights',JSON.stringify(dataWeight));
$(class_input_font).trigger('change');
$('body').removeClass('t4-modal-open');
$('.font-active').removeClass('font-active');
$(".t4-font-weight-popup").hide();
$('.themeConfigModal').children().not('.t4-message-container').hide();
});
$(document).on('click','.t4-btn[data-action="btn.cancel"]', function(e) {
$(".t4-font-weight-popup").hide();
});
$(document).on('click', '.t4-fonts-manager', function(e) {
$(".t4-font-weight-popup").hide();
$('li.jub-font.font-focus').removeClass('font-focus');
});
});