Merge branch 'bzr/golem' of /Users/distler/Sites/code/instiki

This commit is contained in:
Jacques Distler 2010-03-04 00:27:51 -06:00
commit 498f043174
8 changed files with 187 additions and 11 deletions

View file

@ -144,7 +144,7 @@ $(function() {
}, { }, {
type: "input", type: "input",
panel: "foreignObject_panel", panel: "foreignObject_panel",
title: "Change the font-size of enclosed content", title: "Change foreignObject's font size",
id: "foreign_font_size", id: "foreign_font_size",
label: "font-size", label: "font-size",
size: 2, size: 2,
@ -234,10 +234,10 @@ $(function() {
} }
}, },
mouseUp: function(opts) { mouseUp: function(opts) {
var e = opts.event; var e = opts.event;
if(svgCanvas.getMode() == "foreign" && started) { if(svgCanvas.getMode() == "foreign" && started) {
var attrs = $(newFO).attr(["width", "height"]); var attrs = $(newFO).attr(["width", "height"]);
keep = (attrs.width != 0 || attrs.height != 0); keep = (attrs.width != 0 || attrs.height != 0);
svgCanvas.addToSelection([newFO], true); svgCanvas.addToSelection([newFO], true);
return { return {

View file

@ -0,0 +1,80 @@
/*
* ext-helloworld.js
*
* Licensed under the Apache License, Version 2
*
* Copyright(c) 2010 Alexis Deveria
*
*/
/*
This is a very basic SVG-Edit extension. It adds a "Hello World" button in
the left panel. Clicking on the button, and then the canvas will show the
user the point on the canvas that was clicked on.
*/
$(function() {
svgCanvas.addExtension("Hello World", function() {
return {
name: "Hello World",
// For more notes on how to make an icon file, see the source of
// the hellorworld-icon.xml
svgicons: "extensions/helloworld-icon.xml",
// Multiple buttons can be added in this array
buttons: [{
// Must match the icon ID in helloworld-icon.xml
id: "hello_world",
// This indicates that the button will be added to the "mode"
// button panel on the left side
type: "mode",
// Tooltip text
title: "Say 'Hello World'",
// Events
events: {
'click': function() {
// The action taken when the button is clicked on.
// For "mode" buttons, any other button will
// automatically be de-pressed.
svgCanvas.setMode("hello_world");
}
}
}],
// This is triggered when the main mouse button is pressed down
// on the editor canvas (not the tool panels)
mouseDown: function() {
// Check the mode on mousedown
if(svgCanvas.getMode() == "hello_world") {
// The returned object must include "started" with
// a value of true in order for mouseUp to be triggered
return {started: true};
}
},
// This is triggered from anywhere, but "started" must have been set
// to true (see above). Note that "opts" is an object with event info
mouseUp: function(opts) {
// Check the mode on mouseup
if(svgCanvas.getMode() == "hello_world") {
var zoom = svgCanvas.getZoom();
// Get the actual coordinate by dividing by the zoom value
var x = opts.mouse_x / zoom;
var y = opts.mouse_y / zoom;
var text = "Hello World!\n\nYou clicked here: "
+ x + ", " + y;
// Show the text using the custom alert function
$.alert(text);
}
}
};
});
});

View file

@ -283,7 +283,8 @@ $(function() {
while(i--) { while(i--) {
var elem = selElems[i]; var elem = selElems[i];
if(elem && elem.tagName == "foreignObject") { if(elem && elem.tagName == "foreignObject") {
if(opts.selectedElement && !opts.multiselected) { if(opts.selectedElement && !opts.multiselected &&
elem.firstElementChild.namespaceURI == mathns ) {
$('#itex_font_size').val(elem.getAttribute("font-size")); $('#itex_font_size').val(elem.getAttribute("font-size"));
$('#itex_width').val(elem.getAttribute("width")); $('#itex_width').val(elem.getAttribute("width"));
$('#itex_height').val(elem.getAttribute("height")); $('#itex_height').val(elem.getAttribute("height"));

View file

@ -0,0 +1,23 @@
<svg xmlns="http://www.w3.org/2000/svg">
<!--
Sample icons file. This file looks like an SVG file with groups as its
children. Each group element has an ID that must match the ID of the button given
in the extension. The SVG inside the group makes up the actual icon, and
needs use a viewBox instead of width/height for it to scale properly.
Multiple icons can be included, each within their own group. A final element
with ID "svg_eof" must be included too.
-->
<g id="hello_world">
<svg viewBox="0 0 102 102" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
<g>
<title>Layer 1</title>
<rect ry="30" rx="30" x="2.5" y="2.5" width="97" height="97" id="svg_3" fill="#008000" stroke="#000000" stroke-width="5"/>
<text x="52.668" y="42.5" id="svg_1" fill="#ffffff" stroke="#000000" stroke-width="0" font-size="24" font-family="Monospace" text-anchor="middle" xml:space="preserve">Hello</text>
<text x="52.668" y="71.5" fill="#ffffff" stroke="#000000" stroke-width="0" font-size="24" font-family="Monospace" text-anchor="middle" xml:space="preserve" id="svg_2">World!</text>
</g>
</svg>
</g>
<g id="svg_eof"/>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View file

@ -198,6 +198,26 @@
</svg> </svg>
</g> </g>
<g id="add_subpath">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 124 124" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="svg_4" x1="0.33594" y1="0.28125" x2="1" y2="1">
<stop offset="0" stop-color="#ffffff" stop-opacity="1"/>
<stop offset="1" stop-color="#33a533" stop-opacity="1"/>
</linearGradient>
</defs>
<g>
<path d="m6,103l55,-87c85,33.64 -26,37.12 55,87l-110,0z" id="svg_1" fill="url(#svg_4)" stroke="#000000" stroke-width="4" stroke-dasharray="null"/>
<g id="svg_7">
<circle stroke-dasharray="null" stroke-width="5" stroke="#000000" fill="#ffffff" id="svg_6" r="22.63281" cy="88.5" cx="45.5"/>
<line stroke-dasharray="null" stroke-width="7" stroke="#000000" id="svg_2" y2="104.03768" x2="45.5" y1="72.96232" x1="45.5"/>
<line stroke-dasharray="null" stroke-width="7" stroke="#000000" id="svg_3" y2="88.5" x2="61.03768" y1="88.5" x1="29.96232"/>
</g>
</g>
</svg>
</g>
<g id="image"> <g id="image">
<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<defs> <defs>

View file

@ -21,7 +21,8 @@
<script type="text/javascript" src="extensions/ext-closepath.js"></script> <script type="text/javascript" src="extensions/ext-closepath.js"></script>
<script type="text/javascript" src="extensions/ext-arrows.js"></script> <script type="text/javascript" src="extensions/ext-arrows.js"></script>
<script type="text/javascript" src="extensions/ext-connector.js"></script> <script type="text/javascript" src="extensions/ext-connector.js"></script>
<!--<script type="text/javascript" src="extensions/ext-foreignobject.js"></script>--> <!-- <script type="text/javascript" src="extensions/ext-helloworld.js"></script> -->
<!-- <script type="text/javascript" src="extensions/ext-foreignobject.js"></script> -->
<script type="text/javascript" src="extensions/ext-itex.js"></script> <script type="text/javascript" src="extensions/ext-itex.js"></script>
<!-- Release version of script tags: > <!-- Release version of script tags: >
@ -367,6 +368,7 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
</select> </select>
<div class="tool_button" id="tool_node_clone" title="Clone Node"></div> <div class="tool_button" id="tool_node_clone" title="Clone Node"></div>
<div class="tool_button" id="tool_node_delete" title="Delete Node"></div> <div class="tool_button" id="tool_node_delete" title="Delete Node"></div>
<div class="tool_button" id="tool_add_subpath" title="Add sub-path"></div>
</div> </div>
</div> <!-- tools_top --> </div> <!-- tools_top -->

View file

@ -794,6 +794,7 @@ function svg_edit_setup() {
$('#tool_reorient').toggleClass('disabled', angle == 0); $('#tool_reorient').toggleClass('disabled', angle == 0);
} else { } else {
var point = path.getNodePoint(); var point = path.getNodePoint();
$('#tool_add_subpath').removeClass('push_button_pressed').addClass('tool_button');
$('#tool_node_delete').toggleClass('disabled', !path.canDeleteNodes); $('#tool_node_delete').toggleClass('disabled', !path.canDeleteNodes);
if(point) { if(point) {
var seg_type = $('#seg_type'); var seg_type = $('#seg_type');
@ -1415,6 +1416,20 @@ function svg_edit_setup() {
} }
}; };
var addSubPath = function() {
var button = $('#tool_add_subpath');
var sp = !button.hasClass('push_button_pressed');
if (sp) {
button.addClass('push_button_pressed').removeClass('tool_button');
} else {
button.removeClass('push_button_pressed').addClass('tool_button');
}
path.addSubPath(sp);
};
var selectNext = function() { var selectNext = function() {
svgCanvas.cycleElement(1); svgCanvas.cycleElement(1);
}; };
@ -2486,6 +2501,7 @@ function svg_edit_setup() {
{sel:'#tool_node_link', fn: linkControlPoints, evt: 'click'}, {sel:'#tool_node_link', fn: linkControlPoints, evt: 'click'},
{sel:'#tool_node_clone', fn: clonePathNode, evt: 'click'}, {sel:'#tool_node_clone', fn: clonePathNode, evt: 'click'},
{sel:'#tool_node_delete', fn: deletePathNode, evt: 'click'}, {sel:'#tool_node_delete', fn: deletePathNode, evt: 'click'},
{sel:'#tool_add_subpath', fn: addSubPath, evt: 'click'},
{sel:'#tool_move_top', fn: moveToTopSelected, evt: 'click', key: 'shift+up'}, {sel:'#tool_move_top', fn: moveToTopSelected, evt: 'click', key: 'shift+up'},
{sel:'#tool_move_bottom', fn: moveToBottomSelected, evt: 'click', key: 'shift+down'}, {sel:'#tool_move_bottom', fn: moveToBottomSelected, evt: 'click', key: 'shift+down'},
{sel:'#tool_topath', fn: convertToPath, evt: 'click'}, {sel:'#tool_topath', fn: convertToPath, evt: 'click'},
@ -2790,7 +2806,7 @@ function svg_edit_setup() {
updateCanvas(true); updateCanvas(true);
}); });
// var revnums = "svg-editor.js ($Rev: 1433 $) "; // var revnums = "svg-editor.js ($Rev: 1443 $) ";
// revnums += svgCanvas.getVersion(); // revnums += svgCanvas.getVersion();
// $('#copyright')[0].setAttribute("title", revnums); // $('#copyright')[0].setAttribute("title", revnums);
return svgCanvas; return svgCanvas;
@ -2885,6 +2901,7 @@ function svg_edit_setup() {
'#tool_clone,#tool_clone_multi,#tool_node_clone':'clone', '#tool_clone,#tool_clone_multi,#tool_node_clone':'clone',
'#layer_delete,#tool_delete,#tool_delete_multi,#tool_node_delete':'delete', '#layer_delete,#tool_delete,#tool_delete_multi,#tool_node_delete':'delete',
'#tool_add_subpath':'add_subpath',
'#tool_move_top':'move_top', '#tool_move_top':'move_top',
'#tool_move_bottom':'move_bottom', '#tool_move_bottom':'move_bottom',
'#tool_topath':'to_path', '#tool_topath':'to_path',

View file

@ -1190,7 +1190,7 @@ function BatchCommand(text) {
stroke: "#000000", stroke: "#000000",
stroke_paint: null, stroke_paint: null,
stroke_opacity: 1, stroke_opacity: 1,
stroke_width: 2, stroke_width: 5,
stroke_style: 'none', stroke_style: 'none',
opacity: 1 opacity: 1
} }
@ -3740,6 +3740,7 @@ function BatchCommand(text) {
var pathActions = function() { var pathActions = function() {
var subpath = false;
var pathData = {}; var pathData = {};
var current_path; var current_path;
var path; var path;
@ -4346,6 +4347,13 @@ function BatchCommand(text) {
this.selectPt = function(pt, ctrl_num) { this.selectPt = function(pt, ctrl_num) {
p.clearSelection(); p.clearSelection();
if(pt == null) {
p.eachSeg(function(i) {
if(this.prev) {
pt = i;
}
});
}
p.addPtsToSelection(pt); p.addPtsToSelection(pt);
if(ctrl_num) { if(ctrl_num) {
p.dragctrl = ctrl_num; p.dragctrl = ctrl_num;
@ -4805,7 +4813,8 @@ function BatchCommand(text) {
'x2': mouse_x, 'x2': mouse_x,
'y2': mouse_y 'y2': mouse_y
}); });
addPointGrip(0,mouse_x,mouse_y); var index = subpath ? path.segs.length : 0;
addPointGrip(index, mouse_x, mouse_y);
} }
else { else {
// determine if we clicked on an existing point // determine if we clicked on an existing point
@ -4848,13 +4857,23 @@ function BatchCommand(text) {
keep = false; keep = false;
return keep; return keep;
} }
// removeAllPointGripsFromPath();
$(stretchy).remove(); $(stretchy).remove();
// this will signal to commit the path // this will signal to commit the path
element = newpath; element = newpath;
current_path_pts = []; current_path_pts = [];
started = false; started = false;
if(subpath) {
var new_d = newpath.getAttribute("d");
var orig_d = $(path.elem).attr("d");
$(path.elem).attr("d", orig_d + new_d);
$(newpath).remove();
path.init();
pathActions.toEditMode(path.elem);
path.selectPt();
return false;
}
} }
// else, create a new point, append to pts array, update path element // else, create a new point, append to pts array, update path element
else { else {
@ -4879,7 +4898,9 @@ function BatchCommand(text) {
'x2': mouse_x, 'x2': mouse_x,
'y2': mouse_y 'y2': mouse_y
}); });
addPointGrip((current_path_pts.length/2 - 1),mouse_x,mouse_y); var index = (current_path_pts.length/2 - 1);
if(subpath) index += path.segs.length;
addPointGrip(index, mouse_x, mouse_y);
} }
keep = true; keep = true;
} }
@ -4930,6 +4951,7 @@ function BatchCommand(text) {
canvas.clearSelection(); canvas.clearSelection();
path.show(true).update(); path.show(true).update();
path.oldbbox = canvas.getBBox(path.elem); path.oldbbox = canvas.getBBox(path.elem);
subpath = false;
}, },
toSelectMode: function(elem) { toSelectMode: function(elem) {
var selPath = (elem == path.elem); var selPath = (elem == path.elem);
@ -4948,6 +4970,17 @@ function BatchCommand(text) {
canvas.addToSelection([elem], true); canvas.addToSelection([elem], true);
} }
}, },
addSubPath: function(on) {
if(on) {
// Internally we go into "path" mode, but in the UI it will
// still appear as if in "pathedit" mode.
current_mode = "path";
subpath = true;
} else {
pathActions.clear(true);
pathActions.toEditMode(path.elem);
}
},
select: function(target) { select: function(target) {
if (current_path == target) { if (current_path == target) {
pathActions.toEditMode(target); pathActions.toEditMode(target);
@ -7955,7 +7988,7 @@ function BatchCommand(text) {
// Function: getVersion // Function: getVersion
// Returns a string which describes the revision number of SvgCanvas. // Returns a string which describes the revision number of SvgCanvas.
this.getVersion = function() { this.getVersion = function() {
return "svgcanvas.js ($Rev: 1433 $)"; return "svgcanvas.js ($Rev: 1443 $)";
}; };
this.setUiStrings = function(strs) { this.setUiStrings = function(strs) {