radex
/
MethodDraw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

changes

main
Mark MacKay 2021-06-16 18:51:45 -05:00
parent baca65b70b
commit bdd0a164f8
6 changed files with 41 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/css/button.css
View File

@ -16,6 +16,7 @@
padding: 0 var(--x4);
display: inline-block;
font-weight: bold;
background-color: var(--z1);
}
.button:hover {

26
src/index.html
View File

@ -12,6 +12,7 @@
<!-- build:css all.css -->
<link rel="stylesheet" href="css/base.css" type="text/css"/>
<link rel="stylesheet" href="css/method-draw.css" type="text/css"/>
<link rel="stylesheet" href="css/jpicker.css" type="text/css"/>
<link rel="stylesheet" href="css/jgraduate.css" type="text/css"/>
<link rel="stylesheet" href="css/fonts.css" type="text/css"/>
@ -27,7 +28,6 @@
<link rel="stylesheet" href="css/source.css" type="text/css"/>
<link rel="stylesheet" href="css/keyboard.css" type="text/css"/>
<link rel="stylesheet" href="css/dialog.css" type="text/css"/>
<link rel="stylesheet" href="css/method-draw.css" type="text/css"/>
<link rel="stylesheet" href="css/app.css" type="text/css"/>
<link rel="stylesheet" href="css/tools.css" type="text/css"/>
<link rel="stylesheet" href="css/button.css" type="text/css"/>
@ -428,17 +428,18 @@
</div>
<div id="g_panel" class="context_panel clearfix">
<h4>Group</h4>
<div class="draginputs">
<label>
<input id="g_x" class="attr_changer" data-title="Change groups's x coordinate" data-attr="x" pattern="[0-9]*" />
<span>X</span>
</label>
<label>
<input id="g_y" class="attr_changer" data-title="Change groups's y coordinate" data-attr="y" pattern="[0-9]*" />
<span>Y</span>
</label>
<h4>Group</h4>
<div class="draginputs">
<label>
<input id="g_x" class="attr_changer" data-title="Change groups's x coordinate" data-attr="x" pattern="[0-9]*" />
<span>X</span>
</label>
<label>
<input id="g_y" class="attr_changer" data-title="Change groups's y coordinate" data-attr="y" pattern="[0-9]*" />
<span>Y</span>
</label>
</div>
<div class="button full" title="Ungroup Elements" id="button_ungroup">Ungroup</div>
</div>
<div id="path_node_panel" class="context_panel clearfix">
@ -455,7 +456,7 @@
</label>
<div id="segment_type" class="draginput label">
<span>Segment Type</span>
<span>Seg Type</span>
<select id="seg_type" data-title="Change Segment type">
<option id="straight_segments" selected="selected" value="4">Straight</option>
<option id="curve_segments" value="6">Curve</option>
@ -590,6 +591,7 @@
</div>
</div>
<div class="clearfix"></div>
<div class="button full" id="button_group">Group Elements</div>
<div class="button full" id="tool_text_on_path" title="Place text on path">Place text on path</div>
</div>

5
src/js/PaintBox.js
View File

@ -29,8 +29,8 @@ MD.PaintBox = function(container, type){
paint = new $.jGraduate.Paint(p);
editor.paintBox[picker].setPaint(paint, true);
svgCanvas.setPaint(picker, paint);
if (paint.radialGradient) paint.radialGradient = paint.radialGradient.outerHTML
if (paint.linearGradient) paint.linearGradient = paint.linearGradient.outerHTML
//if (paint.radialGradient) paint.radialGradient = paint.radialGradient.outerHTML
//if (paint.linearGradient) paint.linearGradient = paint.linearGradient.outerHTML
if (picker === "fill") state.set("canvasFill", paint);
if (picker === "stroke") state.set("canvasStroke", paint);
if (picker === "canvas") state.set("canvasBackground", paint);
@ -91,6 +91,7 @@ MD.PaintBox = function(container, type){
const rRatio = this.grad.getAttribute("r") / (bbox.width/2);
const cxRatio = this.grad.getAttribute("cx") / (bbox.width);
const cyRatio = this.grad.getAttribute("cy") / (bbox.height);
this.grad.removeAttribute("gradientTransform");
this.grad.setAttribute("r", width/2*rRatio);
this.grad.setAttribute("cx", cxRatio * width/2);
this.grad.setAttribute("cy", cyRatio * height/2);

3
src/js/Panel.js
View File

@ -86,6 +86,9 @@ MD.Panel = function(){
$("#tool_unlink_use").on("click", function(){
svgCanvas.ungroupSelectedElement();
});
$('#button_group').on("click", editor.groupSelected);
$('#button_ungroup').on("click", editor.ungroupSelected);
function show(elem) {

23
src/js/lib/jquery.jgraduate.js
View File

@ -76,7 +76,18 @@ $.jGraduate = {
this.linearGradient = options.copy.linearGradient.cloneNode(true);
break;
case "radialGradient":
this.radialGradient = options.copy.radialGradient.cloneNode(true);
const clone = options.copy.radialGradient.cloneNode(true);
if (clone.getAttribute('gradientUnits') === "userSpaceOnUse") {
// todo hardcoded dimensions
const rRatio = (256/2) / clone.getAttribute("r");
const cxRatio = (256/2) / clone.getAttribute("cx");
const cyRatio = (256/2) /clone.getAttribute("cy");
clone.setAttribute("r", rRatio * 22/2 );
clone.setAttribute("cx", cxRatio * 22/2);
clone.setAttribute("cy", cyRatio * 22/2);
}
this.radialGradient = clone;
break;
}
}
@ -476,11 +487,11 @@ jQuery.fn.jGraduate =
.val(attrval)
.change(function() {
// TODO: Support values < 0 and > 1 (zoomable preview?)
if (isNaN(parseFloat(this.value)) || this.value < 0) {
this.value = 0.0;
} else if(this.value > 1) {
this.value = 1.0;
}
// if (isNaN(parseFloat(this.value)) || this.value < 0) {
// this.value = 0.0;
// } else if(this.value > 1) {
// this.value = 1.0;
// }
if(!(attr[0] === 'f' && !showFocus)) {
if(isRadial && curType === 'radialGradient' || !isRadial && curType === 'linearGradient') {

6
src/js/start.js
View File

@ -118,7 +118,7 @@ const eyedropper = svgCanvas.addExtension.apply(this, ["eyedropper", MD.Eyedropp
state.set("canvasId", t("Untitled"));
state.set("canvasMode", state.get("canvasMode"));
svgCanvas.setSvgString(state.get("canvasContent"));
editor.paintBox.fill.setPaint(state.get("canvasFill"));
editor.paintBox.stroke.setPaint(state.get("canvasStroke"));
editor.paintBox.canvas.setPaint(state.get("canvasBackground"));
//editor.paintBox.fill.setPaint(state.get("canvasFill"));
//editor.paintBox.stroke.setPaint(state.get("canvasStroke"));
//editor.paintBox.canvas.setPaint(state.get("canvasBackground"));
document.body.classList.remove("loading");