Edit File by line

function SGPBFloatingButton() {

[0] Fix | Delete

[1] Fix | Delete

}

[2] Fix | Delete

function htmlEncode(str){

[3] Fix | Delete

return String(str).replace(/[^\w. ]/gi, function(c){

[4] Fix | Delete

return '&#'+c.charCodeAt(0)+';';

[5] Fix | Delete

});

[6] Fix | Delete

}

[7] Fix | Delete

SGPBFloatingButton.prototype.adminInit = function()

[8] Fix | Delete

{

[9] Fix | Delete

var that = this;

[10] Fix | Delete

document.getElementById('sgpb-floating-btn-wrapper').addEventListener('change', function(){

[11] Fix | Delete

that.livePreview();

[12] Fix | Delete

});

[13] Fix | Delete

jQuery('#sgpb-floating-button-text').on('keyup keypress', function() {

[14] Fix | Delete

setTimeout(function() {

[15] Fix | Delete

[16] Fix | Delete

that.livePreview();

[17] Fix | Delete

}, 100);

[18] Fix | Delete

});

[19] Fix | Delete

[20] Fix | Delete

jQuery('#sgpb-enable-floating-button').on('click', function() {

[21] Fix | Delete

if (!jQuery(this).is(':checked')) {

[22] Fix | Delete

that.removeButton();

[23] Fix | Delete

}

[24] Fix | Delete

var buttonStyle = jQuery('#sgpb-floating-button-style').val();

[25] Fix | Delete

that.reorderPositions(buttonStyle);

[26] Fix | Delete

that.reorderOtherOptions(buttonStyle);

[27] Fix | Delete

});

[28] Fix | Delete

jQuery('.js-floating-button-position').click(function() {

[29] Fix | Delete

setTimeout(function() {

[30] Fix | Delete

that.livePreview();

[31] Fix | Delete

}, 100);

[32] Fix | Delete

});

[33] Fix | Delete

[34] Fix | Delete

jQuery('.js-floating-button-style').click(function(e) {

[35] Fix | Delete

var buttonStyle = jQuery(this).attr('data-sgvalue');

[36] Fix | Delete

setTimeout(function(){

[37] Fix | Delete

that.livePreview();

[38] Fix | Delete

that.reorderOtherOptions(buttonStyle);

[39] Fix | Delete

}, 100);

[40] Fix | Delete

});

[41] Fix | Delete

[42] Fix | Delete

jQuery('#sgpb-floating-btn-wrapper .sgpb-color-picker').each(function() {

[43] Fix | Delete

var currentColorPicker = jQuery(this);

[44] Fix | Delete

currentColorPicker.wpColorPicker({

[45] Fix | Delete

change: function() {

[46] Fix | Delete

setTimeout(function(){

[47] Fix | Delete

[48] Fix | Delete

that.livePreview();

[49] Fix | Delete

}, 100);

[50] Fix | Delete

}

[51] Fix | Delete

});

[52] Fix | Delete

});

[53] Fix | Delete

};

[54] Fix | Delete

[55] Fix | Delete

SGPBFloatingButton.prototype.livePreview = function()

[56] Fix | Delete

{

[57] Fix | Delete

var buttonIsEnabled = document.getElementById('sgpb-enable-floating-button').checked;

[58] Fix | Delete

if (buttonIsEnabled) {

[59] Fix | Delete

this.createButton();

[60] Fix | Delete

}

[61] Fix | Delete

[62] Fix | Delete

return true;

[63] Fix | Delete

};

[64] Fix | Delete

[65] Fix | Delete

SGPBFloatingButton.prototype.createButton = function()

[66] Fix | Delete

{

[67] Fix | Delete

/* we remove already existed button and create new */

[68] Fix | Delete

this.removeButton();

[69] Fix | Delete

var buttonStyle = document.getElementById('sgpb-floating-button-style').value;

[70] Fix | Delete

var buttonPosition = document.getElementById('sgpb-floating-button-position').value;

[71] Fix | Delete

[72] Fix | Delete

this.hideShowUnrelatedOptions(buttonStyle);

[73] Fix | Delete

[74] Fix | Delete

var positionTop = document.getElementById('sgpb-floating-button-position-top').value;

[75] Fix | Delete

var positionRight = document.getElementById('sgpb-floating-button-position-right').value;

[76] Fix | Delete

var textColor = document.getElementById('sgpb-floating-button-text-color').value;

[77] Fix | Delete

var bgColor = document.getElementById('sgpb-floating-button-bg-color').value;

[78] Fix | Delete

var borderColor = document.getElementById('sgpb-floating-button-border-color').value;

[79] Fix | Delete

var borderRadius = document.getElementById('sgpb-floating-button-border-radius').value;

[80] Fix | Delete

var borderSize = document.getElementById('sgpb-floating-button-border-size').value;

[81] Fix | Delete

var fontSize = document.getElementById('sgpb-floating-button-font-size').value;

[82] Fix | Delete

var text = htmlEncode( document.getElementById('sgpb-floating-button-text').value );

[83] Fix | Delete

var button = document.createElement('div');

[84] Fix | Delete

button.innerHTML = '<span class="sgpb-'+buttonStyle+'-floating-button-text">'+text+'</span>';

[85] Fix | Delete

button.id = 'sgpb-floating-button';

[86] Fix | Delete

button.style.fontSize = fontSize+'px';

[87] Fix | Delete

button.style.borderWidth = borderSize+'px';

[88] Fix | Delete

button.style.borderRadius = borderRadius+'px';

[89] Fix | Delete

button.style.borderColor = borderColor;

[90] Fix | Delete

button.style.backgroundColor = bgColor;

[91] Fix | Delete

button.style.color = textColor;

[92] Fix | Delete

button.style.zIndex = '99999999';

[93] Fix | Delete

button.style.position = 'fixed';

[94] Fix | Delete

button.style.textAlign = 'center';

[95] Fix | Delete

button.style.padding = '10px';

[96] Fix | Delete

if (buttonPosition.includes('right')) {

[97] Fix | Delete

button.style.right = '0';

[98] Fix | Delete

if (buttonPosition.includes('center')) {

[99] Fix | Delete

button.style.top = positionTop+'%';

[100] Fix | Delete

button.style.transform = 'rotate(-90deg)';

[101] Fix | Delete

button.style.transformOrigin = 'bottom right';

[102] Fix | Delete

}

[103] Fix | Delete

}

[104] Fix | Delete

if (buttonPosition.includes('bottom')) {

[105] Fix | Delete

button.style.bottom = '0';

[106] Fix | Delete

if (buttonPosition.includes('center')) {

[107] Fix | Delete

button.style.right = positionRight+'%';

[108] Fix | Delete

}

[109] Fix | Delete

}

[110] Fix | Delete

if (buttonPosition.includes('left')) {

[111] Fix | Delete

button.style.left = '0';

[112] Fix | Delete

if (buttonPosition.includes('center')) {

[113] Fix | Delete

button.style.top = positionTop+'%';

[114] Fix | Delete

button.style.transform = 'rotate(90deg)';

[115] Fix | Delete

button.style.transformOrigin = 'left bottom';

[116] Fix | Delete

}

[117] Fix | Delete

}

[118] Fix | Delete

if (buttonPosition.includes('top')) {

[119] Fix | Delete

button.style.top = '0';

[120] Fix | Delete

if (buttonPosition.includes('center')) {

[121] Fix | Delete

button.style.right = positionRight+'%';

[122] Fix | Delete

}

[123] Fix | Delete

}

[124] Fix | Delete

if (buttonStyle === 'corner') {

[125] Fix | Delete

if (buttonPosition === 'top-left') {

[126] Fix | Delete

button.style.left = '-220px';

[127] Fix | Delete

button.style.top = '-40px';

[128] Fix | Delete

button.style.transform = 'rotate(140deg)';

[129] Fix | Delete

button.style.transformOrigin = 'right center';

[130] Fix | Delete

}

[131] Fix | Delete

if (buttonPosition === 'bottom-left') {

[132] Fix | Delete

button.style.left = '-115px';

[133] Fix | Delete

button.style.bottom = '-145px';

[134] Fix | Delete

button.style.transform = 'rotate(45deg)';

[135] Fix | Delete

button.style.transformOrigin = 'right center';

[136] Fix | Delete

}

[137] Fix | Delete

if (buttonPosition === 'top-right') {

[138] Fix | Delete

button.style.right = '62px';

[139] Fix | Delete

button.style.top = '-145px';

[140] Fix | Delete

button.style.transform = 'rotate(-140deg)';

[141] Fix | Delete

button.style.transformOrigin = 'right';

[142] Fix | Delete

}

[143] Fix | Delete

if (buttonPosition === 'bottom-right') {

[144] Fix | Delete

button.style.right = '-65px';

[145] Fix | Delete

button.style.bottom = '-30px';

[146] Fix | Delete

button.style.transform = 'rotate(-45deg)';

[147] Fix | Delete

button.style.transformOrigin = 'right';

[148] Fix | Delete

}

[149] Fix | Delete

button.style.width = '160px';

[150] Fix | Delete

button.style.height = '160px';

[151] Fix | Delete

button.style.display = 'inline-grid';

[152] Fix | Delete

}

[153] Fix | Delete

button.className = 'sgpb-'+buttonStyle+'-'+buttonPosition;

[154] Fix | Delete

document.getElementsByTagName('body')[0].appendChild(button);

[155] Fix | Delete

};

[156] Fix | Delete

[157] Fix | Delete

SGPBFloatingButton.prototype.removeButton = function()

[158] Fix | Delete

{

[159] Fix | Delete

var button = document.getElementById('sgpb-floating-button');

[160] Fix | Delete

if (button !== null) {

[161] Fix | Delete

button.parentNode.removeChild(button);

[162] Fix | Delete

}

[163] Fix | Delete

};

[164] Fix | Delete

[165] Fix | Delete

SGPBFloatingButton.prototype.hideShowUnrelatedOptions = function(buttonStyle)

[166] Fix | Delete

{

[167] Fix | Delete

var that = this;

[168] Fix | Delete

jQuery('#sgpb-floating-button-style').on('select2:select', function (e) {

[169] Fix | Delete

var data = e.params.data;

[170] Fix | Delete

/* data.id = 'corner/basic' */

[171] Fix | Delete

that.reorderPositions(data.id);

[172] Fix | Delete

that.reorderOtherOptions(data.id);

[173] Fix | Delete

});

[174] Fix | Delete

};

[175] Fix | Delete

[176] Fix | Delete

SGPBFloatingButton.prototype.reorderPositions = function(buttonStyle)

[177] Fix | Delete

{

[178] Fix | Delete

var positionDropdown = jQuery('#sgpb-floating-button-position');

[179] Fix | Delete

if (!positionDropdown.length) {

[180] Fix | Delete

return false;

[181] Fix | Delete

}

[182] Fix | Delete

/* these positions will be removed or appended */

[183] Fix | Delete

var dynamicPositions = [

[184] Fix | Delete

{'id': 'top-center', 'text': 'Top center'},

[185] Fix | Delete

{'id': 'bottom-center', 'text': 'Bottom center'},

[186] Fix | Delete

{'id': 'right-center', 'text': 'Right center'},

[187] Fix | Delete

{'id': 'left-center', 'text': 'Left center'}

[188] Fix | Delete

];

[189] Fix | Delete

/* we need the loop and checking button style in it, to know if we should add or remove the related options */

[190] Fix | Delete

for (var i in dynamicPositions) {

[191] Fix | Delete

if (buttonStyle === 'corner') {

[192] Fix | Delete

positionDropdown.find("option[value='" + dynamicPositions[i].id + "']").remove();

[193] Fix | Delete

}

[194] Fix | Delete

if (buttonStyle === 'basic') {

[195] Fix | Delete

/* check if we've already had this option (select2 documentation method) */

[196] Fix | Delete

if (positionDropdown.find("option[value='" + dynamicPositions[i].id + "']").length) {

[197] Fix | Delete

positionDropdown.val(dynamicPositions[i].id).trigger('change');

[198] Fix | Delete

}

[199] Fix | Delete

else {

[200] Fix | Delete

var newOption = new Option(dynamicPositions[i].text, dynamicPositions[i].id, false, false);

[201] Fix | Delete

positionDropdown.append(newOption).trigger('change');

[202] Fix | Delete

}

[203] Fix | Delete

}

[204] Fix | Delete

}

[205] Fix | Delete

[206] Fix | Delete

return false;

[207] Fix | Delete

};

[208] Fix | Delete

[209] Fix | Delete

SGPBFloatingButton.prototype.reorderOtherOptions = function(buttonStyle)

[210] Fix | Delete

{

[211] Fix | Delete

jQuery('.sgpb-basic-button-style-options-wrapper-js').removeClass('sgpb-hide');

[212] Fix | Delete

if (buttonStyle === 'corner') {

[213] Fix | Delete

jQuery('.sgpb-basic-button-style-options-wrapper-js').addClass('sgpb-hide');

[214] Fix | Delete

}

[215] Fix | Delete

};

[216] Fix | Delete

[217] Fix | Delete

jQuery(document).ready(function() {

[218] Fix | Delete

if (document.getElementById('sgpb-enable-floating-button') === null) {

[219] Fix | Delete

return false;

[220] Fix | Delete

}

[221] Fix | Delete

var sgpbFloatingBtn = new SGPBFloatingButton();

[222] Fix | Delete

sgpbFloatingBtn.livePreview();

[223] Fix | Delete

sgpbFloatingBtn.adminInit();

[224] Fix | Delete

});

[225] Fix | Delete

[226] Fix | Delete