devol
/
LinkStack
mirror of https://github.com/LinkStackOrg/LinkStack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improved button editor 

- Improved compatibility
 - Reduced bulk

https://github.com/LinkStackOrg/LinkStack/issues/411
This commit is contained in:
Julian Prieber 2023-05-15 14:33:33 +02:00
parent 2d643378df
commit aa65331b32
2 changed files with 35 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
assets/button-editor/js/jquery.gradientPicker.js vendored
View File

@ -27,15 +27,6 @@
}
var browserPrefix = "";
if ($.browser.mozilla) {
browserPrefix = "-moz-";
} else if ($.browser.webkit) {
browserPrefix = "-webkit-";
} else if ($.browser.opera) {
browserPrefix = "-o-";
} else if ($.browser.msie) {
browserPrefix = "-ms-";
}
function GradientSelection($el, opts) {
this.$el = $el;

84
resources/views/studio/button-editor.blade.php
View File

@ -20,10 +20,7 @@
<script>
$(document).ready(function() {
$('#code').click(function() {
var css_text = 'padding-top : ' + button_css.padding_top + ';' + '\npadding-bottom :' + button_css.padding_bottom + ';' + '\npadding-left :' + button_css.padding_left + ';';
css_text = css_text + '\npadding-right :' + button_css.padding_right + ';' + '\ncolor :' + button_css.color + ';' + '\nbackground-image :' + button_css.background_image + ';';
css_text = css_text + '\nborder-radius :' + button_css.border_radius + ';' + '\nfont-size :' + button_css.font_size + ';' + '\nfont-family :' + button_css.font_family + ';';
css_text = css_text + '\nborder-color :' + button_css.border_color + ';' + '\nborder-style :' + button_css.border_style + ';' + '\nborder-width :' + button_css.border_width + ';';
var css_text = 'color: ' + button_css.color + ';' + '\nbackground-image: ' + button_css.background_image + ';';
$('#sCode').html(css_text);
Rainbow.color(div, function() {
document.getElementById('output').appendChild(div);
@ -66,86 +63,11 @@
button_css.color = '#' + hex;
}
});
$('#border-color').ColorPicker({
color: '#000000',
onShow: function(colpkr) {
$(colpkr).fadeIn(500);
return false;
},
onHide: function(colpkr) {
$(colpkr).fadeOut(500);
return false;
},
onChange: function(hsb, hex, rgb) {
$('#border-color').css('background-color', '#' + hex);
document.getElementById("sample").style.borderColor = '#' + hex;
button_css.border_color = '#' + hex;
}
});
document.getElementById("pdtb").onchange = $.proxy(function() {
var val = document.getElementById('pdtb').value;
$('#sample').css("padding-top", val + 'px');
$('#sample').css("padding-bottom", val + 'px');
button_css.padding_top = val + 'px';
button_css.padding_bottom = val + 'px';
}, document);
document.getElementById("pdlr").onchange = $.proxy(function() {
var val = document.getElementById('pdlr').value;
$('#sample').css("padding-left", val + 'px');
$('#sample').css("padding-right", val + 'px');
button_css.padding_left = val + 'px';
button_css.padding_right = val + 'px';
}, document);
document.getElementById("ftb").onchange = $.proxy(function() {
var val = document.getElementById('ftb').value;
$('#sample').css("font-size", val + 'px');
button_css.font_size = val + 'px';
}, document);
document.getElementById("br").onchange = $.proxy(function() {
var val = document.getElementById('br').value;
$('#sample').css("border-radius", val + 'px');
button_css.border_radius = val + 'px';
}, document);
document.getElementById("tsub").onclick = $.proxy(function() {
var val = document.getElementById('text').value;
$('#sample').text(val);
}, document);
document.getElementById("ffsub").onclick = $.proxy(function() {
var font1 = document.getElementById("font-face"); // or in jQuery use: select = this;
var FontFace = font1.options[font1.selectedIndex].text;
document.getElementById('sample').style.fontFamily = FontFace;
button_css.font_family = FontFace;
}, document);
document.getElementById("bssub").onclick = $.proxy(function() {
var bor = document.getElementById("border-style"); // or in jQuery use: select = this;
var borstyle = bor.options[bor.selectedIndex].text;
document.getElementById('sample').style.borderStyle = borstyle;
$('#sample').text(val);
button_css.border_style = borstyle;
}, document);
document.getElementById("bw").onchange = $.proxy(function() {
var val = document.getElementById('bw').value;
$('#sample').css("border-width", val + 'px');
button_css.border_width = val + 'px';
}, document);
});
// Many of these values cannot be changed by the UI editor, so they are set to zero here. These values might get used in the future.
// Only include the necessary properties
var button_css = {
padding_top: 'inherit',
padding_bottom: 'inherit',
color: 'inherit',
background_image: 'inherit',
padding_left: 'inherit',
padding_right: 'inherit',
border_radius: '8px',
font_family: 'inherit',
font_size: 'inherit',
border_color: 'inherit',
border_style: 'inherit',
border_width: 'inherit'
background_image: 'inherit'
};
</script>