master
Mark MacKay 2021-06-16 17:14:27 -05:00
parent 3f329b4f98
commit baca65b70b
3 changed files with 17 additions and 2 deletions

View File

@ -55,8 +55,8 @@
} }
.color_block svg { .color_block svg {
width: 24px; width: 22px;
height: 24px; height: 22px;
} }
#tool_stroke .color_block > div { #tool_stroke .color_block > div {

View File

@ -31,6 +31,7 @@ MD.Keyboard = function(){
"cmd_o": { name: "Open SVG File", cb: ()=> editor.import.open()}, "cmd_o": { name: "Open SVG File", cb: ()=> editor.import.open()},
"cmd_k": { name: "Place image", cb: ()=> editor.import.place()}, "cmd_k": { name: "Place image", cb: ()=> editor.import.place()},
"backspace": { name: "Delete", cb: ()=> editor.deleteSelected()}, "backspace": { name: "Delete", cb: ()=> editor.deleteSelected()},
"delete": { name: "Delete", cb: ()=> editor.deleteSelected()},
"ctrl_arrowleft": { name: "Rotate -1deg", cb: ()=> editor.rotateSelected(0,1)}, "ctrl_arrowleft": { name: "Rotate -1deg", cb: ()=> editor.rotateSelected(0,1)},
"ctrl_arrowright": { name: "Rotate +1deg", cb: ()=> editor.rotateSelected(1,1)}, "ctrl_arrowright": { name: "Rotate +1deg", cb: ()=> editor.rotateSelected(1,1)},
"ctrl_shift_arrowleft": { name: "Rotate -5deg", cb: ()=> editor.rotateSelected(0,5)}, "ctrl_shift_arrowleft": { name: "Rotate -5deg", cb: ()=> editor.rotateSelected(0,5)},

View File

@ -81,6 +81,20 @@ MD.PaintBox = function(container, type){
this.grad = this.defs.appendChild(paint[ptype]); this.grad = this.defs.appendChild(paint[ptype]);
var id = this.grad.id = 'gradbox_' + this.type; var id = this.grad.id = 'gradbox_' + this.type;
fillAttr = "url(#" + id + ')'; fillAttr = "url(#" + id + ')';
if (this.grad.getAttribute('gradientUnits') === "userSpaceOnUse") {
const box = $("#tool_" + this.type);
const width = box.width();
const height = box.height();
const selectedElement = svgCanvas.getSelectedElems().filter(Boolean)[0];
if (!selectedElement) return;
const bbox = selectedElement.getBBox();
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.setAttribute("r", width/2*rRatio);
this.grad.setAttribute("cx", cxRatio * width/2);
this.grad.setAttribute("cy", cyRatio * height/2);
}
} }
this.rect.setAttribute('fill', fillAttr); this.rect.setAttribute('fill', fillAttr);
this.rect.setAttribute('opacity', opac); this.rect.setAttribute('opacity', opac);