zhouxy108/wisemapping-open-source
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'feature/remove_mootols' into develop

Browse Source
This commit is contained in:
Paulo Gustavo Veiga
2015-01-31 21:35:52 -03:00
parent 1993040520 6950f7f715
commit d3dd58fdc5
208 changed files with 22533 additions and 10022 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
web2d/src/main/javascript/Element.js
View File

@@ -67,12 +67,6 @@ web2d.Element = new Class({
this._peer.setPosition(cx, cy);
},
positionRelativeTo : function(elem, options) {
this._peer.positionRelativeTo(elem, options);
},
/**
* Allows the registration of event listeners on the event target.
* type
@@ -87,8 +81,8 @@ web2d.Element = new Class({
this._peer.addEvent(type, listener);
},
fireEvent : function(type, event) {
this._peer.fireEvent(type, event);
trigger : function(type, event) {
this._peer.trigger(type, event);
},
cloneEvents : function(from) {
@@ -137,6 +131,10 @@ web2d.Element = new Class({
return this._peer.getPosition();
},
getNativePosition: function() {
return this._peer.getNativePosition();
},
/*
* Defines the element stroke properties.
* width: stroke width

34
web2d/src/main/javascript/Group.js
View File

@@ -21,9 +21,9 @@
*/
web2d.Group = new Class({
Extends: web2d.Element,
initialize : function(attributes) {
initialize: function (attributes) {
var peer = web2d.peer.Toolkit.createGroup();
var defaultAttributes = {width:50, height:50, x:50, y:50,coordOrigin:'0 0',coordSize:'50 50'};
var defaultAttributes = {width: 50, height: 50, x: 50, y: 50, coordOrigin: '0 0', coordSize: '50 50'};
for (var key in attributes) {
defaultAttributes[key] = attributes[key];
}
@@ -33,7 +33,7 @@ web2d.Group = new Class({
/**
* Remove an element as a child to the object.
*/
removeChild : function(element) {
removeChild: function (element) {
if (!$defined(element)) {
throw "Child element can not be null";
}
@@ -53,7 +53,7 @@ web2d.Group = new Class({
/**
* Appends an element as a child to the object.
*/
appendChild : function(element) {
append: function (element) {
if (!$defined(element)) {
throw "Child element can not be null";
}
@@ -71,11 +71,11 @@ web2d.Group = new Class({
throw "A group can not have a workspace as a child";
}
this._peer.appendChild(element._peer);
this._peer.append(element._peer);
},
getType : function() {
getType: function () {
return "Group";
},
@@ -86,34 +86,34 @@ web2d.Group = new Class({
* Consequently CSS2 position attributes (left, top, width, height and so on) have no unit specifier -
* they are simple numbers, not CSS length quantities.
*/
setCoordSize : function(width, height) {
setCoordSize: function (width, height) {
this._peer.setCoordSize(width, height);
},
setCoordOrigin : function(x, y) {
setCoordOrigin: function (x, y) {
this._peer.setCoordOrigin(x, y);
},
getCoordOrigin : function() {
getCoordOrigin: function () {
return this._peer.getCoordOrigin();
},
getSize : function() {
getSize: function () {
return this._peer.getSize();
},
setFill : function(color, opacity) {
setFill: function (color, opacity) {
throw "Unsupported operation. Fill can not be set to a group";
},
setStroke : function(width, style, color, opacity) {
setStroke: function (width, style, color, opacity) {
throw "Unsupported operation. Stroke can not be set to a group";
},
getCoordSize : function() {
getCoordSize: function () {
return this._peer.getCoordSize();
},
appendDomChild : function(DomElement) {
appendDomChild: function (DomElement) {
if (!$defined(DomElement)) {
throw "Child element can not be null";
}
@@ -122,11 +122,11 @@ web2d.Group = new Class({
throw "It's not possible to add the group as a child of itself";
}
this._peer._native.appendChild(DomElement);
this._peer._native.append(DomElement);
},
setOpacity:function(value){
this._peer.setOpacity(value);
setOpacity: function (value) {
this._peer.setOpacity(value);
}
});

66
web2d/src/main/javascript/Workspace.js
View File

@@ -17,27 +17,27 @@
*/
web2d.Workspace = new Class({
Extends:web2d.Element,
initialize:function(attributes) {
Extends: web2d.Element,
initialize: function (attributes) {
this._htmlContainer = this._createDivContainer();
var peer = web2d.peer.Toolkit.createWorkspace(this._htmlContainer);
var defaultAttributes = {width:'200px',height:'200px',stroke:'1px solid #edf1be',
fillColor:"white",coordOrigin:'0 0',coordSize:'200 200' };
var defaultAttributes = {width: '200px', height: '200px', stroke: '1px solid #edf1be',
fillColor: "white", coordOrigin: '0 0', coordSize: '200 200' };
for (var key in attributes) {
defaultAttributes[key] = attributes[key];
}
this.parent(peer, defaultAttributes);
this._htmlContainer.appendChild(this._peer._native);
this._htmlContainer.append(this._peer._native);
},
getType : function() {
getType: function () {
return "Workspace";
},
/**
* Appends an element as a child to the object.
*/
appendChild : function(element) {
append: function (element) {
if (!$defined(element)) {
throw "Child element can not be null";
}
@@ -50,20 +50,20 @@ web2d.Workspace = new Class({
throw "A workspace can not have a workspace as a child";
}
this._peer.appendChild(element._peer);
this._peer.append(element._peer);
},
addItAsChildTo : function(element) {
addItAsChildTo: function (element) {
if (!$defined(element)) {
throw "Workspace div container can not be null";
}
element.appendChild(this._htmlContainer);
element.append(this._htmlContainer);
},
/**
* Create a new div element that will be responsible for containing the workspace elements.
*/
_createDivContainer : function(domElement) {
_createDivContainer: function () {
var container = window.document.createElement("div");
container.id = "workspaceContainer";
// container.style.overflow = "hidden";
@@ -73,7 +73,7 @@ web2d.Workspace = new Class({
container.style.height = "688px";
container.style.border = '1px solid red';
return container;
return $(container);
},
/**
@@ -84,15 +84,15 @@ web2d.Workspace = new Class({
* pt (points; 1pt=1/72in)
* pc (picas; 1pc=12pt)
*/
setSize : function(width, height) {
setSize: function (width, height) {
// HTML container must have the size of the group element.
if ($defined(width)) {
this._htmlContainer.style.width = width;
this._htmlContainer.css('width', width);
}
if ($defined(height)) {
this._htmlContainer.style.height = height;
this._htmlContainer.css('height', height);
}
this._peer.setSize(width, height);
},
@@ -104,21 +104,21 @@ web2d.Workspace = new Class({
* Consequently CSS2 position attributes (left, top, width, height and so on) have no unit specifier -
* they are simple numbers, not CSS length quantities.
*/
setCoordSize : function(width, height) {
setCoordSize: function (width, height) {
this._peer.setCoordSize(width, height);
},
/**
* @Todo: Complete Doc
*/
setCoordOrigin : function(x, y) {
setCoordOrigin: function (x, y) {
this._peer.setCoordOrigin(x, y);
},
/**
* @Todo: Complete Doc
*/
getCoordOrigin : function() {
getCoordOrigin: function () {
return this._peer.getCoordOrigin();
},
@@ -127,34 +127,34 @@ web2d.Workspace = new Class({
/**
* All the SVG elements will be children of this HTML element.
*/
_getHtmlContainer : function() {
_getHtmlContainer: function () {
return this._htmlContainer;
},
setFill : function(color, opacity) {
this._htmlContainer.style.backgroundColor = color;
setFill: function (color, opacity) {
this._htmlContainer.css('background-color', color);
if (opacity || opacity === 0) {
throw "Unsupported operation. Opacity not supported.";
}
},
getFill : function() {
var color = this._htmlContainer.style.backgroundColor;
return {color:color};
getFill: function () {
var color = this._htmlContainer.css('background-color');
return {color: color};
},
getSize : function() {
var width = this._htmlContainer.style.width;
var height = this._htmlContainer.style.height;
return {width:width,height:height};
getSize: function () {
var width = this._htmlContainer.css('width');
var height = this._htmlContainer.css('height');
return {width: width, height: height};
},
setStroke : function(width, style, color, opacity) {
setStroke: function (width, style, color, opacity) {
if (style != 'solid') {
throw 'Not supported style stroke style:' + style;
}
this._htmlContainer.style.border = width + ' ' + style + ' ' + color;
this._htmlContainer.css('border',width + ' ' + style + ' ' + color);
if (opacity || opacity === 0) {
throw "Unsupported operation. Opacity not supported.";
@@ -162,14 +162,14 @@ web2d.Workspace = new Class({
},
getCoordSize : function() {
getCoordSize: function () {
return this._peer.getCoordSize();
},
/**
* Remove an element as a child to the object.
*/
removeChild : function(element) {
removeChild: function (element) {
if (!$defined(element)) {
throw "Child element can not be null";
}
@@ -186,7 +186,7 @@ web2d.Workspace = new Class({
this._peer.removeChild(element._peer);
},
dumpNativeChart : function() {
dumpNativeChart: function () {
var elem = this._htmlContainer
return elem.innerHTML;
}

17
web2d/src/main/javascript/peer/svg/ElementPeer.js
View File

@@ -52,7 +52,7 @@ web2d.peer.svg.ElementPeer = new Class({
this._parent = parent;
},
appendChild:function (elementPeer) {
append:function (elementPeer) {
// Store parent and child relationship.
elementPeer.setParent(this);
var children = this.getChildren();
@@ -86,11 +86,11 @@ web2d.peer.svg.ElementPeer = new Class({
* http://developer.mozilla.org/en/docs/addEvent
*/
addEvent:function (type, listener) {
this._native.addEvent(type, listener);
$(this._native).bind(type, listener);
},
fireEvent:function (type, event) {
this._native.fireEvent(type, event);
trigger:function (type, event) {
$(this._native).trigger(type, event);
},
cloneEvents:function (from) {
@@ -98,7 +98,7 @@ web2d.peer.svg.ElementPeer = new Class({
},
removeEvent:function (type, listener) {
this._native.removeEvent(type, listener);
$(this._native).unbind(type, listener);
},
setSize:function (width, height) {
@@ -214,13 +214,6 @@ web2d.peer.svg.ElementPeer = new Class({
return listeners;
},
positionRelativeTo:function (elem, options) {
options = !$defined(options) ? {} : options;
options['relativeTo'] = $(this._native);
elem.position(options);
},
/**
* Move element to the front
*/

40
web2d/src/main/javascript/peer/svg/GroupPeer.js
View File

@@ -18,17 +18,17 @@
web2d.peer.svg.GroupPeer = new Class({
Extends: web2d.peer.svg.ElementPeer,
initialize : function() {
initialize: function () {
var svgElement = window.document.createElementNS(this.svgNamespace, 'g');
this.parent(svgElement);
this._native.setAttribute("preserveAspectRatio", "none");
this._coordSize = {width:1,height:1};
this._coordSize = {width: 1, height: 1};
this._native.setAttribute("focusable", "true");
this._position = {x:0,y:0};
this._coordOrigin = {x:0,y:0};
this._position = {x: 0, y: 0};
this._coordOrigin = {x: 0, y: 0};
},
setCoordSize : function(width, height) {
setCoordSize: function (width, height) {
var change = this._coordSize.width != width || this._coordSize.height != height;
this._coordSize.width = width;
this._coordSize.height = height;
@@ -38,8 +38,8 @@ web2d.peer.svg.GroupPeer = new Class({
web2d.peer.utils.EventUtils.broadcastChangeEvent(this, "strokeStyle");
},
getCoordSize : function() {
return {width:this._coordSize.width,height:this._coordSize.height};
getCoordSize: function () {
return {width: this._coordSize.width, height: this._coordSize.height};
},
/**
@@ -63,21 +63,27 @@ web2d.peer.svg.GroupPeer = new Class({
* * skewY(<skew-angle>), which specifies a skew transformation along the y-axis.
**/
updateTransform : function() {
updateTransform: function () {
var sx = this._size.width / this._coordSize.width;
var sy = this._size.height / this._coordSize.height;
var cx = this._position.x - this._coordOrigin.x * sx;
var cy = this._position.y - this._coordOrigin.y * sy;
//FIXME: are we sure of this values?
cx = isNaN(cx) ? 0 : cx;
cy = isNaN(cy) ? 0 : cy;
sx = isNaN(sx) ? 0 : sx;
sy = isNaN(sy) ? 0 : sy;
this._native.setAttribute("transform", "translate(" + cx + "," + cy + ") scale(" + sx + "," + sy + ")");
},
setOpacity : function(value) {
setOpacity: function (value) {
this._native.setAttribute("opacity", value);
},
setCoordOrigin : function(x, y) {
setCoordOrigin: function (x, y) {
var change = x != this._coordOrigin.x || y != this._coordOrigin.y;
if ($defined(x)) {
this._coordOrigin.x = x;
@@ -90,14 +96,14 @@ web2d.peer.svg.GroupPeer = new Class({
this.updateTransform();
},
setSize : function(width, height) {
setSize: function (width, height) {
var change = width != this._size.width || height != this._size.height;
this.parent(width, height);
if (change)
this.updateTransform();
},
setPosition : function(x, y) {
setPosition: function (x, y) {
var change = x != this._position.x || y != this._position.y;
if ($defined(x)) {
this._position.x = parseInt(x);
@@ -110,16 +116,16 @@ web2d.peer.svg.GroupPeer = new Class({
this.updateTransform();
},
getPosition : function() {
return {x:this._position.x,y:this._position.y};
getPosition: function () {
return {x: this._position.x, y: this._position.y};
},
appendChild : function(child) {
append: function (child) {
this.parent(child);
web2d.peer.utils.EventUtils.broadcastChangeEvent(child, "onChangeCoordSize");
},
getCoordOrigin : function () {
return {x:this._coordOrigin.x, y:this._coordOrigin.y};
getCoordOrigin: function () {
return {x: this._coordOrigin.x, y: this._coordOrigin.y};
}
});

83
web2d/src/main/javascript/peer/svg/TextPeer.js
View File

@@ -19,27 +19,27 @@
web2d.peer.svg.TextPeer = new Class({
Extends: web2d.peer.svg.ElementPeer,
initialize : function() {
initialize: function () {
var svgElement = window.document.createElementNS(this.svgNamespace, 'text');
this.parent(svgElement);
this._position = {x:0,y:0};
this._position = {x: 0, y: 0};
this._font = new web2d.Font("Arial", this);
},
appendChild : function(element) {
append: function (element) {
this._native.appendChild(element._native);
},
setTextAlignment : function(align) {
setTextAlignment: function (align) {
this._textAlign = align;
},
getTextAlignment : function() {
getTextAlignment: function () {
return $defined(this._textAlign) ? this._textAlign : 'left';
},
setText : function(text) {
setText: function (text) {
// Remove all previous nodes ...
while (this._native.firstChild) {
this._native.removeChild(this._native.firstChild);
@@ -48,38 +48,41 @@ web2d.peer.svg.TextPeer = new Class({
this._text = text;
if (text) {
var lines = text.split('\n');
lines.forEach(function(line) {
var tspan = window.document.createElementNS(this.svgNamespace, 'tspan');
var me = this;
//FIXME: we could use underscorejs here
lines.forEach(function (line) {
var tspan = window.document.createElementNS(me.svgNamespace, 'tspan');
tspan.setAttribute('dy', '1em');
tspan.setAttribute('x', this.getPosition().x);
tspan.setAttribute('x', me.getPosition().x);
tspan.textContent = line.length == 0 ? " " : line;
this._native.appendChild(tspan);
}.bind(this));
me._native.appendChild(tspan);
});
}
},
getText : function() {
getText: function () {
return this._text;
},
setPosition : function(x, y) {
this._position = {x:x, y:y};
setPosition: function (x, y) {
this._position = {x: x, y: y};
this._native.setAttribute('y', y);
this._native.setAttribute('x', x);
// tspan must be positioned manually.
this._native.getElements('tspan').forEach(function(span) {
span.setAttribute('x', x);
});
$(this._native).children('tspan').attr('x', x);
},
getPosition : function() {
getPosition: function () {
return this._position;
},
setFont : function(font, size, style, weight) {
getNativePosition: function() {
return $(this._native).position();
},
setFont: function (font, size, style, weight) {
if ($defined(font)) {
this._font = new web2d.Font(font, this);
}
@@ -95,41 +98,41 @@ web2d.peer.svg.TextPeer = new Class({
this._updateFontStyle();
},
_updateFontStyle : function() {
_updateFontStyle: function () {
this._native.setAttribute('font-family', this._font.getFontFamily());
this._native.setAttribute('font-size', this._font.getGraphSize());
this._native.setAttribute('font-style', this._font.getStyle());
this._native.setAttribute('font-weight', this._font.getWeight());
},
setColor : function(color) {
setColor: function (color) {
this._native.setAttribute('fill', color);
},
getColor : function() {
getColor: function () {
return this._native.getAttribute('fill');
},
setTextSize : function (size) {
setTextSize: function (size) {
this._font.setSize(size);
this._updateFontStyle();
},
setContentSize : function(width, height) {
setContentSize: function (width, height) {
this._native.xTextSize = width.toFixed(1) + "," + height.toFixed(1);
},
setStyle : function (style) {
setStyle: function (style) {
this._font.setStyle(style);
this._updateFontStyle();
},
setWeight : function (weight) {
setWeight: function (weight) {
this._font.setWeight(weight);
this._updateFontStyle();
},
setFontFamily : function (family) {
setFontFamily: function (family) {
var oldFont = this._font;
this._font = new web2d.Font(family, this);
this._font.setSize(oldFont.getSize());
@@ -138,21 +141,21 @@ web2d.peer.svg.TextPeer = new Class({
this._updateFontStyle();
},
getFont : function () {
getFont: function () {
return {
font:this._font.getFont(),
size:parseInt(this._font.getSize()),
style:this._font.getStyle(),
weight:this._font.getWeight()
font: this._font.getFont(),
size: parseInt(this._font.getSize()),
style: this._font.getStyle(),
weight: this._font.getWeight()
};
},
setSize : function (size) {
setSize: function (size) {
this._font.setSize(size);
this._updateFontStyle();
},
getWidth : function () {
getWidth: function () {
var computedWidth;
// Firefox hack for this issue:http://stackoverflow.com/questions/6390065/doing-ajax-updates-in-svg-breaks-getbbox-is-there-a-workaround
try {
@@ -160,12 +163,12 @@ web2d.peer.svg.TextPeer = new Class({
computedWidth = this._native.getBBox().width;
// Chrome bug is producing this error, oly during page loading. Remove the hack if it works. The issue seems to be
// caused when the element is hidden. I don't know why, but it works ...
if(computedWidth==0){
if (computedWidth == 0) {
var bbox = this._native.getBBox();
computedWidth = bbox.width;
}
} catch(e) {
} catch (e) {
computedWidth = 10;
}
@@ -175,17 +178,17 @@ web2d.peer.svg.TextPeer = new Class({
return width;
},
getHeight : function () {
getHeight: function () {
// Firefox hack for this issue:http://stackoverflow.com/questions/6390065/doing-ajax-updates-in-svg-breaks-getbbox-is-there-a-workaround
try {
var computedHeight = this._native.getBBox().height;
} catch(e) {
} catch (e) {
computedHeight = 10;
}
return parseInt(computedHeight);
},
getHtmlFontSize : function () {
getHtmlFontSize: function () {
return this._font.getHtmlSize();
}
});

30
web2d/src/main/javascript/peer/svg/WorkspacePeer.js
View File

@@ -18,13 +18,13 @@
web2d.peer.svg.WorkspacePeer = new Class({
Extends: web2d.peer.svg.ElementPeer,
initialize : function(element) {
initialize: function (element) {
this._element = element;
var svgElement = window.document.createElementNS(this.svgNamespace, 'svg');
this.parent(svgElement);
this._native.setAttribute("focusable", "true");
this._native.setAttribute("id", "workspace");
this._native.setAttribute("preserveAspectRatio", "true");
this._native.setAttribute("preserveAspectRatio", "none");
},
@@ -38,9 +38,9 @@ web2d.peer.svg.WorkspacePeer = new Class({
*
*/
setCoordSize : function (width, height) {
setCoordSize: function (width, height) {
var viewBox = this._native.getAttribute('viewBox');
var coords = [0,0,0,0];
var coords = [0, 0, 0, 0];
if (viewBox != null) {
coords = viewBox.split(/ /);
}
@@ -57,20 +57,20 @@ web2d.peer.svg.WorkspacePeer = new Class({
web2d.peer.utils.EventUtils.broadcastChangeEvent(this, "strokeStyle");
},
getCoordSize : function () {
getCoordSize: function () {
var viewBox = this._native.getAttribute('viewBox');
var coords = [1,1,1,1];
var coords = [1, 1, 1, 1];
if (viewBox != null) {
coords = viewBox.split(/ /);
}
return {width:coords[2],height:coords[3]};
return {width: coords[2], height: coords[3]};
},
setCoordOrigin : function (x, y) {
setCoordOrigin: function (x, y) {
var viewBox = this._native.getAttribute('viewBox');
// ViewBox min-x ,min-y by default initializated with 0 and 0.
var coords = [0,0,0,0];
var coords = [0, 0, 0, 0];
if (viewBox != null) {
coords = viewBox.split(/ /);
}
@@ -86,23 +86,23 @@ web2d.peer.svg.WorkspacePeer = new Class({
this._native.setAttribute('viewBox', coords.join(" "));
},
appendChild : function (child) {
append: function (child) {
this.parent(child);
web2d.peer.utils.EventUtils.broadcastChangeEvent(child, "onChangeCoordSize");
},
getCoordOrigin : function (child) {
getCoordOrigin: function (child) {
var viewBox = this._native.getAttribute('viewBox');
var coords = [1,1,1,1];
var coords = [1, 1, 1, 1];
if (viewBox != null) {
coords = viewBox.split(/ /);
}
var x = parseFloat(coords[0]);
var y = parseFloat(coords[1]);
return {x:x,y:y};
return {x: x, y: y};
},
getPosition : function () {
return {x:0,y:0};
getPosition: function () {
return {x: 0, y: 0};
}
});

4
web2d/src/test/javascript/jquery-2.1.0.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

32
web2d/src/test/javascript/jsUnit/ElementsTestSuite.html
View File

@@ -31,7 +31,7 @@ function setUp()
{
debug("Setting up workspace");
workspace = new web2d.Workspace();
workspace.addItAsChildTo($("divWorkspace"));
workspace.addItAsChildTo($('#divWorkspace').first());
group = new web2d.Group();
line = new web2d.Line();
@@ -43,11 +43,11 @@ function setUp()
function testAppendAndRemoveElements()
{
workspace.appendChild(group);
workspace.appendChild(line);
workspace.appendChild(elipse);
workspace.appendChild(rect);
workspace.appendChild(rectArc);
workspace.append(group);
workspace.append(line);
workspace.append(elipse);
workspace.append(rect);
workspace.append(rectArc);
workspace.removeChild(group);
workspace.removeChild(line);
@@ -55,11 +55,11 @@ function testAppendAndRemoveElements()
workspace.removeChild(rect);
workspace.removeChild(rectArc);
workspace.appendChild(group);
group.appendChild(line);
group.appendChild(elipse);
group.appendChild(rect);
group.appendChild(rectArc);
workspace.append(group);
group.append(line);
group.append(elipse);
group.append(rect);
group.append(rectArc);
group.removeChild(line);
group.removeChild(elipse);
@@ -75,7 +75,7 @@ function testElementFill()
{
if (parent)
{
parent.appendChild(elem);
parent.append(elem);
}
if (isSupported)
@@ -129,7 +129,7 @@ function testElementPosition()
if (isSupported)
{
// Method setting ...
parent.appendChild(elem);
parent.append(elem);
elem.setPosition(x, y);
assertEquals(x, elem.getPosition().x);
@@ -183,7 +183,7 @@ function testElementSize()
{
if (parent)
{
parent.appendChild(elem);
parent.append(elem);
}
if (isSupported)
{
@@ -234,7 +234,7 @@ function testElementEventHandling()
{
if (parent)
{
parent.appendChild(elem);
parent.append(elem);
}
var listener = function() { /* Dummy event listener */
@@ -258,7 +258,7 @@ function testStroke()
{
if (parent)
{
parent.appendChild(elem);
parent.append(elem);
}
var strokeStyles = ['solid','dot','dash','dashdot','longdash'];
for (var i = 0; i < strokeStyles.length; i++)

6
web2d/src/test/javascript/jsUnit/WorkspaceTestSuite.html
View File

@@ -32,7 +32,7 @@ function setUp()
{
debug("Setting up workspace");
workspace = new web2d.Workspace();
workspace.addItAsChildTo($("divWorkspace"));
workspace.addItAsChildTo($('#divWorkspace').first());
}
function testGettersTest()
@@ -119,8 +119,8 @@ function testAppendAndRemoveTest()
// Append elements ..
var elipse = new web2d.Elipse();
var group = new web2d.Group();
group.appendChild(elipse);
workspace.appendChild(group);
group.append(elipse);
workspace.append(group);
// Remove elements ..
workspace.removeChild(group);

76
web2d/src/test/javascript/mootools-core-1.4.5.js vendored Normal file
View File

@@ -0,0 +1,76 @@
/*
---
MooTools: the javascript framework
web build:
- http://mootools.net/core/b28139f033891d55fabb70ffafd6813b
packager build:
- packager build Core/Core Core/Array Core/Class Core/Class.Extras
copyrights:
- [MooTools](http://mootools.net)
licenses:
- [MIT License](http://mootools.net/license.txt)
...
*/
(function(){this.MooTools={version:"1.4.5",build:"ab8ea8824dc3b24b6666867a2c4ed58ebb762cf0"};var o=this.typeOf=function(i){if(i==null){return"null";}if(i.$family!=null){return i.$family();
}if(i.nodeName){if(i.nodeType==1){return"element";}if(i.nodeType==3){return(/\S/).test(i.nodeValue)?"textnode":"whitespace";}}else{if(typeof i.length=="number"){if(i.callee){return"arguments";
}if("item" in i){return"collection";}}}return typeof i;};var j=this.instanceOf=function(t,i){if(t==null){return false;}var s=t.$constructor||t.constructor;
while(s){if(s===i){return true;}s=s.parent;}if(!t.hasOwnProperty){return false;}return t instanceof i;};var f=this.Function;var p=true;for(var k in {toString:1}){p=null;
}if(p){p=["hasOwnProperty","valueOf","isPrototypeOf","propertyIsEnumerable","toLocaleString","toString","constructor"];}f.prototype.overloadSetter=function(s){var i=this;
return function(u,t){if(u==null){return this;}if(s||typeof u!="string"){for(var v in u){i.call(this,v,u[v]);}if(p){for(var w=p.length;w--;){v=p[w];if(u.hasOwnProperty(v)){i.call(this,v,u[v]);
}}}}else{i.call(this,u,t);}return this;};};f.prototype.overloadGetter=function(s){var i=this;return function(u){var v,t;if(typeof u!="string"){v=u;}else{if(arguments.length>1){v=arguments;
}else{if(s){v=[u];}}}if(v){t={};for(var w=0;w<v.length;w++){t[v[w]]=i.call(this,v[w]);}}else{t=i.call(this,u);}return t;};};f.prototype.extend=function(i,s){this[i]=s;
}.overloadSetter();f.prototype.implement=function(i,s){this.prototype[i]=s;}.overloadSetter();var n=Array.prototype.slice;f.from=function(i){return(o(i)=="function")?i:function(){return i;
};};Array.from=function(i){if(i==null){return[];}return(a.isEnumerable(i)&&typeof i!="string")?(o(i)=="array")?i:n.call(i):[i];};Number.from=function(s){var i=parseFloat(s);
return isFinite(i)?i:null;};String.from=function(i){return i+"";};f.implement({hide:function(){this.$hidden=true;return this;},protect:function(){this.$protected=true;
return this;}});var a=this.Type=function(u,t){if(u){var s=u.toLowerCase();var i=function(v){return(o(v)==s);};a["is"+u]=i;if(t!=null){t.prototype.$family=(function(){return s;
}).hide();}}if(t==null){return null;}t.extend(this);t.$constructor=a;t.prototype.$constructor=t;return t;};var e=Object.prototype.toString;a.isEnumerable=function(i){return(i!=null&&typeof i.length=="number"&&e.call(i)!="[object Function]");
};var q={};var r=function(i){var s=o(i.prototype);return q[s]||(q[s]=[]);};var b=function(t,x){if(x&&x.$hidden){return;}var s=r(this);for(var u=0;u<s.length;
u++){var w=s[u];if(o(w)=="type"){b.call(w,t,x);}else{w.call(this,t,x);}}var v=this.prototype[t];if(v==null||!v.$protected){this.prototype[t]=x;}if(this[t]==null&&o(x)=="function"){m.call(this,t,function(i){return x.apply(i,n.call(arguments,1));
});}};var m=function(i,t){if(t&&t.$hidden){return;}var s=this[i];if(s==null||!s.$protected){this[i]=t;}};a.implement({implement:b.overloadSetter(),extend:m.overloadSetter(),alias:function(i,s){b.call(this,i,this.prototype[s]);
}.overloadSetter(),mirror:function(i){r(this).push(i);return this;}});new a("Type",a);var d=function(s,x,v){var u=(x!=Object),B=x.prototype;if(u){x=new a(s,x);
}for(var y=0,w=v.length;y<w;y++){var C=v[y],A=x[C],z=B[C];if(A){A.protect();}if(u&&z){x.implement(C,z.protect());}}if(u){var t=B.propertyIsEnumerable(v[0]);
x.forEachMethod=function(G){if(!t){for(var F=0,D=v.length;F<D;F++){G.call(B,B[v[F]],v[F]);}}for(var E in B){G.call(B,B[E],E);}};}return d;};d("String",String,["charAt","charCodeAt","concat","indexOf","lastIndexOf","match","quote","replace","search","slice","split","substr","substring","trim","toLowerCase","toUpperCase"])("Array",Array,["pop","push","reverse","shift","sort","splice","unshift","concat","join","slice","indexOf","lastIndexOf","filter","forEach","every","map","some","reduce","reduceRight"])("Number",Number,["toExponential","toFixed","toLocaleString","toPrecision"])("Function",f,["apply","call","bind"])("RegExp",RegExp,["exec","test"])("Object",Object,["create","defineProperty","defineProperties","keys","getPrototypeOf","getOwnPropertyDescriptor","getOwnPropertyNames","preventExtensions","isExtensible","seal","isSealed","freeze","isFrozen"])("Date",Date,["now"]);
Object.extend=m.overloadSetter();Date.extend("now",function(){return +(new Date);});new a("Boolean",Boolean);Number.prototype.$family=function(){return isFinite(this)?"number":"null";
}.hide();Number.extend("random",function(s,i){return Math.floor(Math.random()*(i-s+1)+s);});var g=Object.prototype.hasOwnProperty;Object.extend("forEach",function(i,t,u){for(var s in i){if(g.call(i,s)){t.call(u,i[s],s,i);
}}});Object.each=Object.forEach;Array.implement({forEach:function(u,v){for(var t=0,s=this.length;t<s;t++){if(t in this){u.call(v,this[t],t,this);}}},each:function(i,s){Array.forEach(this,i,s);
return this;}});var l=function(i){switch(o(i)){case"array":return i.clone();case"object":return Object.clone(i);default:return i;}};Array.implement("clone",function(){var s=this.length,t=new Array(s);
while(s--){t[s]=l(this[s]);}return t;});var h=function(s,i,t){switch(o(t)){case"object":if(o(s[i])=="object"){Object.merge(s[i],t);}else{s[i]=Object.clone(t);
}break;case"array":s[i]=t.clone();break;default:s[i]=t;}return s;};Object.extend({merge:function(z,u,t){if(o(u)=="string"){return h(z,u,t);}for(var y=1,s=arguments.length;
y<s;y++){var w=arguments[y];for(var x in w){h(z,x,w[x]);}}return z;},clone:function(i){var t={};for(var s in i){t[s]=l(i[s]);}return t;},append:function(w){for(var v=1,t=arguments.length;
v<t;v++){var s=arguments[v]||{};for(var u in s){w[u]=s[u];}}return w;}});["Object","WhiteSpace","TextNode","Collection","Arguments"].each(function(i){new a(i);
});var c=Date.now();String.extend("uniqueID",function(){return(c++).toString(36);});})();Array.implement({every:function(c,d){for(var b=0,a=this.length>>>0;
b<a;b++){if((b in this)&&!c.call(d,this[b],b,this)){return false;}}return true;},filter:function(d,f){var c=[];for(var e,b=0,a=this.length>>>0;b<a;b++){if(b in this){e=this[b];
if(d.call(f,e,b,this)){c.push(e);}}}return c;},indexOf:function(c,d){var b=this.length>>>0;for(var a=(d<0)?Math.max(0,b+d):d||0;a<b;a++){if(this[a]===c){return a;
}}return -1;},map:function(c,e){var d=this.length>>>0,b=Array(d);for(var a=0;a<d;a++){if(a in this){b[a]=c.call(e,this[a],a,this);}}return b;},some:function(c,d){for(var b=0,a=this.length>>>0;
b<a;b++){if((b in this)&&c.call(d,this[b],b,this)){return true;}}return false;},clean:function(){return this.filter(function(a){return a!=null;});},invoke:function(a){var b=Array.slice(arguments,1);
return this.map(function(c){return c[a].apply(c,b);});},associate:function(c){var d={},b=Math.min(this.length,c.length);for(var a=0;a<b;a++){d[c[a]]=this[a];
}return d;},link:function(c){var a={};for(var e=0,b=this.length;e<b;e++){for(var d in c){if(c[d](this[e])){a[d]=this[e];delete c[d];break;}}}return a;},contains:function(a,b){return this.indexOf(a,b)!=-1;
},append:function(a){this.push.apply(this,a);return this;},getLast:function(){return(this.length)?this[this.length-1]:null;},getRandom:function(){return(this.length)?this[Number.random(0,this.length-1)]:null;
},include:function(a){if(!this.contains(a)){this.push(a);}return this;},combine:function(c){for(var b=0,a=c.length;b<a;b++){this.include(c[b]);}return this;
},erase:function(b){for(var a=this.length;a--;){if(this[a]===b){this.splice(a,1);}}return this;},empty:function(){this.length=0;return this;},flatten:function(){var d=[];
for(var b=0,a=this.length;b<a;b++){var c=typeOf(this[b]);if(c=="null"){continue;}d=d.concat((c=="array"||c=="collection"||c=="arguments"||instanceOf(this[b],Array))?Array.flatten(this[b]):this[b]);
}return d;},pick:function(){for(var b=0,a=this.length;b<a;b++){if(this[b]!=null){return this[b];}}return null;},rgbToHex:function(d){if(this.length<3){return null;}if(this.length==4&&this[3]==0&&!d){return"transparent";
}var b=[];for(var a=0;a<3;a++){var c=(this[a]-0).toString(16);b.push((c.length==1)?"0"+c:c);}return(d)?b:"#"+b.join("");}});String.implement({test:function(a,b){return((typeOf(a)=="regexp")?a:new RegExp(""+a,b)).test(this);
},contains:function(a,b){return(b)?(b+this+b).indexOf(b+a+b)>-1:String(this).indexOf(a)>-1;},trim:function(){return String(this).replace(/^\s+|\s+$/g,"");
},clean:function(){return String(this).replace(/\s+/g," ").trim();},camelCase:function(){return String(this).replace(/-\D/g,function(a){return a.charAt(1).toUpperCase();
});},hyphenate:function(){return String(this).replace(/[A-Z]/g,function(a){return("-"+a.charAt(0).toLowerCase());});},capitalize:function(){return String(this).replace(/\b[a-z]/g,function(a){return a.toUpperCase();
});},escapeRegExp:function(){return String(this).replace(/([-.*+?^${}()|[\]\/\\])/g,"\\$1");},rgbToHex:function(b){var a=String(this).match(/\d{1,3}/g);
return(a)?a.rgbToHex(b):null;},substitute:function(a,b){return String(this).replace(b||(/\\?\{([^{}]+)\}/g),function(d,c){if(d.charAt(0)=="\\"){return d.slice(1);
}return(a[c]!=null)?a[c]:"";});}});
Function.implement({bind:function(e){var a=this,b=arguments.length>1?Array.slice(arguments,1):null,d=function(){};var c=function(){var g=e,h=arguments.length;if(this instanceof c){d.prototype=a.prototype;g=new d;}var f=(!b&&!h)?a.call(g):a.apply(g,b&&h?b.concat(Array.slice(arguments)):b||arguments);return g==e?f:g;};return c;},pass:function(b,c){var a=this;if(b!=null){b=Array.from(b);}return function(){return a.apply(c,b||arguments);};},delay:function(b,c,a){return setTimeout(this.pass((a==null?[]:a),c),b);},});
Number.alias("each","times");(function(b){var a={};b.each(function(c){if(!Number[c]){a[c]=function(){return Math[c].apply(null,[this].concat(Array.from(arguments)));
};}});Number.implement(a);})(["abs","acos","asin","atan","atan2","ceil","cos","exp","floor","log","max","min","pow","sin","sqrt","tan"]);(function(){var a=this.Class=new Type("Class",function(h){if(instanceOf(h,Function)){h={initialize:h};
}var g=function(){e(this);if(g.$prototyping){return this;}this.$caller=null;var i=(this.initialize)?this.initialize.apply(this,arguments):this;this.$caller=this.caller=null;
return i;}.extend(this).implement(h);g.$constructor=a;g.prototype.$constructor=g;g.prototype.parent=c;return g;});var c=function(){if(!this.$caller){throw new Error('The method "parent" cannot be called.');
}var g=this.$caller.$name,h=this.$caller.$owner.parent,i=(h)?h.prototype[g]:null;if(!i){throw new Error('The method "'+g+'" has no parent.');}return i.apply(this,arguments);
};var e=function(g){for(var h in g){var j=g[h];switch(typeOf(j)){case"object":var i=function(){};i.prototype=j;g[h]=e(new i);break;case"array":g[h]=j.clone();
break;}}return g;};var b=function(g,h,j){if(j.$origin){j=j.$origin;}var i=function(){if(j.$protected&&this.$caller==null){throw new Error('The method "'+h+'" cannot be called.');
}var l=this.caller,m=this.$caller;this.caller=m;this.$caller=i;var k=j.apply(this,arguments);this.$caller=m;this.caller=l;return k;}.extend({$owner:g,$origin:j,$name:h});
return i;};var f=function(h,i,g){if(a.Mutators.hasOwnProperty(h)){i=a.Mutators[h].call(this,i);if(i==null){return this;}}if(typeOf(i)=="function"){if(i.$hidden){return this;
}this.prototype[h]=(g)?i:b(this,h,i);}else{Object.merge(this.prototype,h,i);}return this;};var d=function(g){g.$prototyping=true;var h=new g;delete g.$prototyping;
return h;};a.implement("implement",f.overloadSetter());a.Mutators={Extends:function(g){this.parent=g;this.prototype=d(g);},Implements:function(g){Array.from(g).each(function(j){var h=new j;for(var i in h){f.call(this,i,h[i],true);}},this);}};})();

10
web2d/src/test/javascript/render/arrow.html
View File

@@ -19,7 +19,7 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -50,6 +50,8 @@
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/TimesFont.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ArialFont.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/VerdanaFont.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Point.js"></script>
<script type="text/javascript" src="utils.js"></script>
<script type="text/javascript">
function initialize(){
@@ -61,15 +63,15 @@
arrow.setFrom(50,50);
arrow.setControlPoint(new core.Point(-50,0));
overflowWorkspace.appendChild(arrow);
overflowWorkspace.append(arrow);
var arrow2 = new web2d.Arrow();
arrow2.setFrom(100,50);
arrow2.setControlPoint(new core.Point(50,50));
overflowWorkspace.appendChild(arrow2);
overflowWorkspace.append(arrow2);
overflowWorkspace.addItAsChildTo($("overflowExample"));
overflowWorkspace.addItAsChildTo($('#overflowExample').first());
}
</script>

11
web2d/src/test/javascript/render/curvedLine.html
View File

@@ -19,8 +19,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript"
src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Workspace.js"></script>
@@ -62,7 +63,7 @@
line1.setTo(100, 100);
line1.setSrcControlPoint(new core.Point(-100, 0));
line1.setDestControlPoint(new core.Point(100, 0));
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line2 = new web2d.CurvedLine();
line2.setStyle(web2d.CurvedLine.NICE_LINE);
@@ -70,9 +71,9 @@
line2.setTo(150, 90);
line2.setSrcControlPoint(new core.Point(100, 0));
line2.setDestControlPoint(new core.Point(-100, 0));
overflowWorkspace.appendChild(line2);
overflowWorkspace.append(line2);
overflowWorkspace.addItAsChildTo($("overflowExample"));
overflowWorkspace.addItAsChildTo($('#overflowExample').first());
}
</script>

320
web2d/src/test/javascript/render/events.html
View File

@@ -15,7 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -53,13 +55,11 @@
<script type="text/javascript">
function EventLogger(type, element)
{
function EventLogger(type, element) {
this._enable = false;
this._element = element;
this._type = type;
this._listener = function logger(event)
{
this._listener = function logger(event) {
var oldColor = this.getAttribute('fillColor');
this.setFill("yellow");
alert("Event on:" + this.getType() + ", Type:" + type);
@@ -67,52 +67,44 @@
};
}
EventLogger.prototype.changeState = function()
{
EventLogger.prototype.changeState = function () {
this._enable = !this._enable;
if (this._enable)
{
if (this._enable) {
this._element.addEvent(this._type, this._listener);
} else
{
} else {
this._element.removeEvent(this._type, this._listener);
}
return this._enable;
};
function MultipleEventHandler(type, element)
{
this._listeners = [];
this._type = type;
this._element = element;
function MultipleEventHandler(type, element) {
this._listeners = [];
this._type = type;
this._element = element;
}
MultipleEventHandler.prototype.registerOneListener = function () {
var count = this._listeners.length;
var listener = function (event) {
alert("Listener #:" + count);
};
this._listeners.push(listener);
this._element.addEvent(this._type, listener);
}
MultipleEventHandler.prototype.listenerCount = function () {
return this._listeners.length;
}
MultipleEventHandler.prototype.unRegisterOneListener = function () {
if (this._listeners.length > 0) {
var listener = this._listeners.pop();
this._element.removeEvent(this._type, listener);
}
}
MultipleEventHandler.prototype.registerOneListener = function()
{
var count = this._listeners.length;
var listener = function(event) {
alert("Listener #:" + count);
};
this._listeners.push(listener);
this._element.addEvent(this._type, listener);
}
MultipleEventHandler.prototype.listenerCount = function()
{
return this._listeners.length;
}
MultipleEventHandler.prototype.unRegisterOneListener = function()
{
if (this._listeners.length > 0)
{
var listener = this._listeners.pop();
this._element.removeEvent(this._type, listener);
}
}
function initialize(){
function initialize() {
web2d.peer.Toolkit.init();
// Workspace with CoordOrigin(100,100);
@@ -123,13 +115,13 @@
var bigElipse = new web2d.Elipse();
bigElipse.setSize(100, 100);
bigElipse.setPosition(75, 75);
workspace.appendChild(bigElipse);
workspace.append(bigElipse);
var smallElipse = new web2d.Elipse();
smallElipse.setSize(50, 50);
smallElipse.setPosition(75, 75);
smallElipse.setFill('red')
workspace.appendChild(smallElipse);
workspace.append(smallElipse);
wClickEventLogger = new EventLogger('click', workspace);
wMouseoverEventLogger = new EventLogger('mouseover', workspace);
@@ -149,7 +141,7 @@
ebousemoveEventLogger = new EventLogger('mousemove', bigElipse);
ebblCickEventLogger = new EventLogger('dblclick', bigElipse);
workspace.addItAsChildTo($("workspaceContainer"));
workspace.addItAsChildTo($('#workspaceContainer').first());
var mEventWorkspace = new web2d.Workspace();
mEventWorkspace.setSize("150px", "150px");
@@ -159,9 +151,9 @@
elipse.setSize(100, 100);
elipse.setPosition(75, 75);
elipse.setFill('blue')
mEventWorkspace.appendChild(elipse);
mEventWorkspace.append(elipse);
mEventWorkspace.addItAsChildTo($("workspaceMultipleEvents"));
mEventWorkspace.addItAsChildTo($('#workspaceMultipleEvents').first());
multipleHandler = new MultipleEventHandler('click', elipse);
}
@@ -177,131 +169,133 @@
<h1>Elements Event Handling</h1>
<table border="1">
<colgroup style="width:80%;">
<col style="width:30%"/>
<col style="width:60%"/>
</colgroup>
<tbody>
<tr>
<td>
This examples shows the ability to attach listeners to handle several events.
In this example, you can attach different events to three elements: workspace, small elipse and the big elipse.
Events will follow the event bubbling behaviour.
</td>
<td>
<div id="workspaceContainer" style="float:left;"></div>
<colgroup style="width:80%;">
<col style="width:30%"/>
<col style="width:60%"/>
</colgroup>
<tbody>
<tr>
<td>
This examples shows the ability to attach listeners to handle several events.
In this example, you can attach different events to three elements: workspace, small elipse and the big
elipse.
Events will follow the event bubbling behaviour.
</td>
<td>
<div id="workspaceContainer" style="float:left;"></div>
<div class="eventForm">
<form action="">
<fieldset>
<legend>Workspace Events</legend>
<label>Click Event:
<input type="button" value="Register"
onclick="(!wClickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Double Click Event:
<input type="button" value="Register"
onclick="(!wDblCickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Over Event:
<input type="button" value="Register"
onclick="(!wMouseoverEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Out Event:
<input type="button" value="Register"
onclick="(!wMouseoutEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Move Event:
<input type="button" value="Register"
onclick="(!wMousemoveEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label>
</fieldset>
</form>
<div class="eventForm">
<form action="">
<fieldset>
<legend>Workspace Events</legend>
<label>Click Event:
<input type="button" value="Register"
onclick="(!wClickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Double Click Event:
<input type="button" value="Register"
onclick="(!wDblCickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Over Event:
<input type="button" value="Register"
onclick="(!wMouseoverEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Out Event:
<input type="button" value="Register"
onclick="(!wMouseoutEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Move Event:
<input type="button" value="Register"
onclick="(!wMousemoveEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label>
</fieldset>
</form>
<form action="">
<fieldset>
<legend>Small Elipse Events</legend>
<label>Click Event:
<input type="button" value="Register"
onclick="(!esClickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Double Click Event:
<input type="button" value="Register"
onclick="(!esDblCickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Over Event:
<input type="button" value="Register"
onclick="(!esMouseoverEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Out Event:
<input type="button" value="Register"
onclick="(!esMouseoutEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Move Event:
<input type="button" value="Register"
onclick="(!esMousemoveEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label>
</fieldset>
</form>
<form action="">
<fieldset>
<legend>Small Elipse Events</legend>
<label>Click Event:
<input type="button" value="Register"
onclick="(!esClickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Double Click Event:
<input type="button" value="Register"
onclick="(!esDblCickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Over Event:
<input type="button" value="Register"
onclick="(!esMouseoverEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Out Event:
<input type="button" value="Register"
onclick="(!esMouseoutEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Move Event:
<input type="button" value="Register"
onclick="(!esMousemoveEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label>
</fieldset>
</form>
<form action="">
<fieldset>
<legend>Big Elipse Events</legend>
<label>Click Event:
<input type="button" value="Register"
onclick="(!ebClickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Double Click Event:
<input type="button" value="Register"
onclick="(!ebDblCickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Over Event:
<input type="button" value="Register"
onclick="(!ebMouseoverEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Out Event:
<input type="button" value="Register"
onclick="(!ebMouseoutEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Move Event:
<input type="button" value="Register"
onclick="(!ebMousemoveEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label>
</fieldset>
</form>
<form action="">
<fieldset>
<legend>Big Elipse Events</legend>
<label>Click Event:
<input type="button" value="Register"
onclick="(!ebClickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Double Click Event:
<input type="button" value="Register"
onclick="(!ebDblCickEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Over Event:
<input type="button" value="Register"
onclick="(!ebMouseoverEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Out Event:
<input type="button" value="Register"
onclick="(!ebMouseoutEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label><br/>
<label>Mouse Move Event:
<input type="button" value="Register"
onclick="(!ebMousemoveEventLogger.changeState())?this.value='Register':this.value='Unregister'"/>
</label>
</fieldset>
</form>
</div>
</td>
</div>
</td>
</tr>
<tr>
<td>Multiple listeners can be attached to an element to handle an event type.
In this example, multiple listeners can be registered to the elipse element to handle the click event type.
</td>
<td>
<div id="workspaceMultipleEvents" style="float:left;"></div>
</tr>
<tr>
<td>Multiple listeners can be attached to an element to handle an event type.
In this example, multiple listeners can be registered to the elipse element to handle the click event type.
</td>
<td>
<div id="workspaceMultipleEvents" style="float:left;"></div>
<div class="eventForm">
<form action="">
<fieldset>
<legend>Elipse Click Events Listeners</legend>
<label>Registered Listeners #:
<input type="text" disabled="disabled" value="0" id="listenerCounter" maxlength="2" size="2"/>
</label>
<br/>
<input type="button" value="Register Listener"
onclick="multipleHandler.registerOneListener();$('listenerCounter').value=multipleHandler.listenerCount();"/>
<input type="button" value="UnRegister Listener"
onclick="multipleHandler.unRegisterOneListener();$('listenerCounter').value=multipleHandler.listenerCount();"/>
</fieldset>
<div class="eventForm">
<form action="">
<fieldset>
<legend>Elipse Click Events Listeners</legend>
<label>Registered Listeners #:
<input type="text" disabled="disabled" value="0" id="listenerCounter" maxlength="2"
size="2"/>
</label>
<br/>
<input type="button" value="Register Listener"
onclick="multipleHandler.registerOneListener();$('#listenerCounter').first().value=multipleHandler.listenerCount();"/>
<input type="button" value="UnRegister Listener"
onclick="multipleHandler.unRegisterOneListener();$('#listenerCounter').first().value=multipleHandler.listenerCount();"/>
</fieldset>
</form>
</form>
</div>
</td>
</tr>
</tbody>
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>

13
web2d/src/test/javascript/render/font.html
View File

@@ -15,7 +15,10 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -52,7 +55,7 @@
[6,8,10,15].forEach(function(size, i) {
var wText = new web2d.Text();
overflowWorkspace.appendChild(wText);
overflowWorkspace.append(wText);
wText.setText(text);
wText.setFont(family, size, 'bold');
@@ -60,7 +63,7 @@
wText.setColor('red');
});
overflowWorkspace.addItAsChildTo($(elemId));
overflowWorkspace.addItAsChildTo($("#"+elemId));
}
function alignments(text, family, elemId) {
@@ -71,7 +74,7 @@
['center','left','right'].forEach(function(align, i) {
var wText = new web2d.Text();
overflowWorkspace.appendChild(wText);
overflowWorkspace.append(wText);
wText.setText(text);
wText.setFont(family, 8, 'bold');
@@ -80,7 +83,7 @@
wText.setTextAlignment(align);
});
overflowWorkspace.addItAsChildTo($(elemId));
overflowWorkspace.addItAsChildTo($("#"+elemId));
}
function initialize() {

80
web2d/src/test/javascript/render/group.html
View File

@@ -15,7 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -58,26 +60,26 @@
group.setPosition(25, 50);
group.setCoordSize(200, 200);
group.setCoordOrigin(0, 0);
workspace.appendChild(group);
workspace.append(group);
var elipse = new web2d.Elipse();
elipse.setSize(200, 200);
elipse.setPosition(100, 100);
group.appendChild(elipse);
group.append(elipse);
var line = new web2d.Line();
line.setFrom(0, 0);
line.setTo(200, 200);
line.setStroke("blue");
group.appendChild(line);
group.append(line);
line = new web2d.Line();
line.setFrom(200, 0);
line.setTo(0, 200);
line.setStroke("blue");
group.appendChild(line);
group.append(line);
workspace.addItAsChildTo($("groupBasicContainer"));
workspace.addItAsChildTo($('#groupBasicContainer'));
var xDir = 1;
@@ -119,17 +121,17 @@
var groupAttributes = {width:50,height:50,x:25,y:50,coordSize:'200 200',coordOrigin:'0 0'};
var group = new web2d.Group(groupAttributes);
workspace.appendChild(group);
workspace.append(group);
var elipseLeft = new web2d.Elipse();
elipseLeft.setSize(200, 200)
elipseLeft.setPosition(200, 0)
group.appendChild(elipseLeft);
group.append(elipseLeft);
var elipseRight = new web2d.Elipse();
elipseRight.setSize(200, 200)
elipseRight.setPosition(0, 0)
group.appendChild(elipseRight);
group.append(elipseRight);
var listener = function(e) {
alert("Click event on:" + this.getType())
@@ -138,7 +140,7 @@
elipseLeft.addEvent("click", listener);
elipseRight.addEvent("click", listener);
workspace.addItAsChildTo($("groupEventsContainer"));
workspace.addItAsChildTo($('#groupEventsContainer'));
}
eventTest();
@@ -154,51 +156,51 @@
groupOuter.setPosition(25, 25);
groupOuter.setCoordSize(100, 100);
groupOuter.setCoordOrigin(0, 0)
workspace.appendChild(groupOuter);
workspace.append(groupOuter);
var elipseOuter = new web2d.Elipse();
elipseOuter.setSize(200, 200);
elipseOuter.setPosition(100, 100);
elipseOuter.setFill("red");
groupOuter.appendChild(elipseOuter);
groupOuter.append(elipseOuter);
var line = new web2d.Line();
line.setFrom(0, 0);
line.setTo(200, 200);
line.setStroke("red");
groupOuter.appendChild(line);
groupOuter.append(line);
var line = new web2d.Line();
line.setFrom(200, 0);
line.setTo(0, 200);
line.setStroke("red");
groupOuter.appendChild(line);
groupOuter.append(line);
var groupInner = new web2d.Group();
groupInner.setSize(50, 50);
groupInner.setPosition(25, 25);
groupInner.setCoordSize(100, 100);
groupInner.setCoordOrigin(0, 0);
groupOuter.appendChild(groupInner);
groupOuter.append(groupInner);
var elipse = new web2d.Elipse();
elipse.setSize(200, 200);
elipse.setPosition(100, 100);
groupInner.appendChild(elipse);
groupInner.append(elipse);
var line = new web2d.Line();
line.setFrom(0, 0);
line.setTo(200, 200);
line.setStroke("blue");
groupInner.appendChild(line);
groupInner.append(line);
var line = new web2d.Line();
line.setFrom(200, 0);
line.setTo(0, 200);
line.setStroke("blue");
groupInner.appendChild(line);
groupInner.append(line);
workspace.addItAsChildTo($("groupNestedContainer"));
workspace.addItAsChildTo($('#groupNestedContainer'));
};
eventTest();
@@ -216,31 +218,31 @@
elipseOuter = new web2d.Elipse();
elipseOuter.setPosition(50, 50);
elipseOuter.setSize(50, 50);
workspace.appendChild(elipseOuter);
workspace.append(elipseOuter);
var group = new web2d.Group();
group.setSize(50, 50);
group.setCoordSize(width, height);
group.setPosition(25, 25);
workspace.appendChild(group);
workspace.append(group);
elipseInner = new web2d.Elipse();
elipseInner.setPosition(50, 50);
elipseInner.setSize(50, 50);
elipseInner.setFill("red");
group.appendChild(elipseInner);
group.append(elipseInner);
return workspace;
}
var sample100x100 = groupSampleBuilder(100, 100);
sample100x100.addItAsChildTo($("coordsizeExample100x100"));
sample100x100.addItAsChildTo($("#coordsizeExample100x100"));
var sample100x200 = groupSampleBuilder(100, 200);
sample100x200.addItAsChildTo($("coordsizeExample100x200"));
sample100x200.addItAsChildTo($("#coordsizeExample100x200"));
var sample200x100 = groupSampleBuilder(200, 100);
sample200x100.addItAsChildTo($("coordsizeExample200x100"));
sample200x100.addItAsChildTo($("#coordsizeExample200x100"));
};
workspaceCoordSizeSample();
@@ -257,33 +259,33 @@
elipseOuter = new web2d.Elipse();
elipseOuter.setPosition(50, 50);
elipseOuter.setSize(50, 50);
workspace.appendChild(elipseOuter);
workspace.append(elipseOuter);
var group = new web2d.Group();
group.setSize(50, 50);
group.setCoordSize(100, 100);
group.setCoordOrigin(x, y);
group.setPosition(25, 25);
workspace.appendChild(group);
workspace.append(group);
elipseInner = new web2d.Elipse();
elipseInner.setPosition(50, 50);
elipseInner.setSize(50, 50);
elipseInner.setFill("red");
group.appendChild(elipseInner);
group.append(elipseInner);
return workspace;
}
;
var sample0x0 = groupSampleBuilder(0, 0);
sample0x0.addItAsChildTo($("coordOriginExample0x0"));
sample0x0.addItAsChildTo($("#coordOriginExample0x0"));
var sample100x200 = groupSampleBuilder(0, 50);
sample100x200.addItAsChildTo($("coordOriginExample0x50"));
sample100x200.addItAsChildTo($("#coordOriginExample0x50"));
var sample200x100 = groupSampleBuilder(50, 0);
sample200x100.addItAsChildTo($("coordOriginExample50x0"));
sample200x100.addItAsChildTo($("#coordOriginExample50x0"));
}
workspaceCoordOriginSample();
@@ -303,7 +305,7 @@
group.addEvent("mouseover", function() {
alert("Mouse Over Group");
});
workspace.appendChild(group);
workspace.append(group);
elipseOuter = new web2d.Elipse();
elipseOuter.setPosition(50, 50);
@@ -311,13 +313,13 @@
group.addEvent("mouseover", function() {
alert("Mouse Over elipseOuter");
});
group.appendChild(elipseOuter);
group.append(elipseOuter);
elipseInner = new web2d.Elipse();
elipseInner.setPosition(50, 50);
elipseInner.setSize(25, 25);
elipseInner.setFill("red");
group.appendChild(elipseInner);
group.append(elipseInner);
var isVisible = true;
var executer = function()
@@ -326,7 +328,7 @@
group.setVisibility(isVisible);
};
executer.periodical(100);
workspace.addItAsChildTo($("visibilityExample"));
workspace.addItAsChildTo($('#visibilityExample'));
}
groupVisibilitySample();
@@ -342,18 +344,18 @@
group.setSize(100, 100);
group.setPosition(0, 0);
group.setCoordSize(100, 100);
workspace.appendChild(group);
workspace.append(group);
elipseOuter = new web2d.Elipse();
elipseOuter.setPosition(50, 50);
elipseOuter.setSize(50, 50);
group.appendChild(elipseOuter);
group.append(elipseOuter);
elipseInner = new web2d.Elipse();
elipseInner.setPosition(50, 50);
elipseInner.setSize(25, 25);
elipseInner.setFill("red");
group.appendChild(elipseInner);
group.append(elipseInner);
var width = 10;
var height = 10;
@@ -364,7 +366,7 @@
group.setCoordSize(width, height);
};
executer.periodical(100);
workspace.addItAsChildTo($("scaleStrokeExample"));
workspace.addItAsChildTo($('#scaleStrokeExample'));
}
groupVisibilitySample();

24
web2d/src/test/javascript/render/line.html
View File

@@ -15,7 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -53,18 +55,18 @@
rect.setSize(10, 10);
rect.setStroke(0);
rect.setPosition(250, 5);
strokeWidthWorkspace.appendChild(rect);
strokeWidthWorkspace.append(rect);
for (var i = 0; i <= 10; i++) {
var line = new web2d.Line();
line.setFrom(5 + (i * 25), 5);
line.setTo(5 + (i * 25), 45);
line.setAttribute('strokeWidth', i + 1);
strokeWidthWorkspace.appendChild(line);
strokeWidthWorkspace.append(line);
}
strokeWidthWorkspace.appendChild(rect);
strokeWidthWorkspace.append(rect);
strokeWidthWorkspace.addItAsChildTo($("strokeWidthSample"));
strokeWidthWorkspace.addItAsChildTo($('#strokeWidthSample'));
var strokeOpacityWorkspace = new web2d.Workspace(workspaceAttributes);
for (var i = 0; i < 10; i++) {
@@ -74,9 +76,9 @@
line.setAttribute('strokeWidth', 2);
line.setAttribute('strokeOpacity', 1 / (i + 1));
line.setAttribute('strokeColor', 'red');
strokeOpacityWorkspace.appendChild(line);
strokeOpacityWorkspace.append(line);
}
strokeOpacityWorkspace.addItAsChildTo($("strokeOpacitySample"));
strokeOpacityWorkspace.addItAsChildTo($('#strokeOpacitySample'));
var strokeStyleWorkspace = new web2d.Workspace(workspaceAttributes);
var styles = ['solid','dot','dash','dashdot','longdash'];
@@ -87,9 +89,9 @@
line.setAttribute('strokeWidth', 2);
line.setAttribute('strokeColor', 'red');
line.setAttribute('strokeStyle', styles[i]);
strokeStyleWorkspace.appendChild(line);
strokeStyleWorkspace.append(line);
}
strokeStyleWorkspace.addItAsChildTo($("strokeStyleSample"));
strokeStyleWorkspace.addItAsChildTo($('#strokeStyleSample'));
var strokeArrowWorkspace = new web2d.Workspace(workspaceAttributes);
var styles = ['none ','block ','classic','diamond ','oval','open','chevron','doublechevron'];
@@ -100,9 +102,9 @@
line.setAttribute('strokeWidth', 2);
line.setAttribute('strokeColor', 'red');
line.setArrowStyle(styles[i]);
strokeArrowWorkspace.appendChild(line);
strokeArrowWorkspace.append(line);
}
strokeArrowWorkspace.addItAsChildTo($("strokeArrowSample"));
strokeArrowWorkspace.addItAsChildTo($('#strokeArrowSample'));
}
</script>
</head>

36
web2d/src/test/javascript/render/polyLine.html
View File

@@ -15,7 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -55,7 +57,7 @@
line.setFrom(95, 95);
line.setStyle("Straight");
line.setStroke('10');
overflowWorkspace.appendChild(line);
overflowWorkspace.append(line);
// line.setTo(165, 165);
@@ -98,35 +100,35 @@
// var line = new web2d.PolyLine();
// line.setFrom(95, 90);
// line.setTo(160, 20);
// overflowWorkspace.appendChild(line);
// overflowWorkspace.append(line);
//
// var line = new web2d.PolyLine();
// line.setStyle("Straight");
// line.setFrom(90, -90);
// line.setTo(20, 20);
// overflowWorkspace.appendChild(line);
// overflowWorkspace.append(line);
//
// var line = new web2d.PolyLine();
// line.setFrom(95, 95);
// line.setTo(165, 165);
// line.setStroke(1, 'solid', 'red');
// overflowWorkspace.appendChild(line);
// overflowWorkspace.append(line);
//
// // Reference ...
// var refLine = new web2d.Line();
// refLine.setFrom(95, 0);
// refLine.setTo(95, 200);
// refLine.setStroke(1, 'solid', 'red');
// overflowWorkspace.appendChild(refLine);
// overflowWorkspace.append(refLine);
//
// var refLine = new web2d.Line();
// refLine.setFrom(165, 0);
// refLine.setTo(165, 200);
// refLine.setStroke(1, 'solid', 'red');
// overflowWorkspace.appendChild(refLine);
// overflowWorkspace.append(refLine);
//
overflowWorkspace.addItAsChildTo($("overflowExample"));
overflowWorkspace.addItAsChildTo($('#overflowExample'));
var overflowWorkspace = new web2d.Workspace();
@@ -135,47 +137,47 @@
line1.setFrom(95, 95);
line1.setTo(165, 165);
line1.setStyle("Curved");
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(95, 95);
line1.setTo(165, 135);
line1.setStyle("Curved");
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(95, 90);
line1.setTo(160, 20);
line1.setStyle("Straight");
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(95, 90);
line1.setTo(160, 50);
line1.setStyle("Straight");
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(90, 90);
line1.setTo(20, 20);
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(90, 90);
line1.setTo(20, 50);
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(90, 95);
line1.setTo(20, 165);
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
var line1 = new web2d.PolyLine();
line1.setFrom(90, 95);
line1.setTo(20, 135);
overflowWorkspace.appendChild(line1);
overflowWorkspace.append(line1);
overflowWorkspace.addItAsChildTo($("multipleLineExample"));
overflowWorkspace.addItAsChildTo($('#multipleLineExample'));
}
</script>
</head>

18
web2d/src/test/javascript/render/prototype.html
View File

@@ -15,7 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -63,9 +65,9 @@
centralRect.setPosition(300, 300);
centralRect.setFill("#99ccff");
centralRect.setStroke(1, 'solid', "#878b8f");
workspace.appendChild(centralRect);
workspace.append(centralRect);
workspace.addItAsChildTo($("divWorkspace"));
workspace.addItAsChildTo($('#divWorkspace'));
}
function zoomIn() {
@@ -93,17 +95,17 @@
outerRect.setPosition(0, 0);
outerRect.setFill("#3e9eff");
outerRect.setStroke(1, 'solid', "#878b8f");
nodeGroup.appendChild(outerRect);
nodeGroup.append(outerRect);
var inerRect = new web2d.Rect(0.3);
inerRect.setSize(190, 85);
inerRect.setPosition(5, 10);
inerRect.setFill("white");
inerRect.setStroke(1, 'dash', '#878b8f');
nodeGroup.appendChild(inerRect);
nodeGroup.append(inerRect);
nodeGroup._drag = false;
workspace.appendChild(nodeGroup);
workspace.append(nodeGroup);
// Add behaviour ...
inerRect.addEvent("mouseover", function() {
@@ -128,9 +130,9 @@
shadowRect.setPosition(5, 10);
shadowRect.setFill("white", 0.3);
shadowRect.setStroke(1, 'dash', '#878b8f');
shadowGroup.appendChild(shadowRect);
shadowGroup.append(shadowRect);
workspace.appendChild(shadowGroup);
workspace.append(shadowGroup);
this._shadowGroup = shadowGroup;
if (!this._moveFunction) {

11
web2d/src/test/javascript/render/rect.html
View File

@@ -16,7 +16,8 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript" src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
@@ -58,8 +59,8 @@
var rect = new web2d.Rect();
rect.setPosition(20, 20);
workspace.appendChild(rect);
workspace.addItAsChildTo($("rectExample"));
workspace.append(rect);
workspace.addItAsChildTo($('#rectExample'));
}
rectExampleTest();
@@ -69,7 +70,7 @@
var rect = new web2d.Rect(i / 10);
rect.setPosition(x, ((i - 1) * (50 + 5)));
rect.setSize(width, height);
container.appendChild(rect);
container.append(rect);
}
}
@@ -78,7 +79,7 @@
workspace.setSize("500px", "550px");
workspace.setCoordOrigin(0, -4);
workspace.setCoordSize(500, 550);
workspace.addItAsChildTo($("roundRect"));
workspace.addItAsChildTo($('#roundRect'));
builder(workspace, 10, 50, 50);

87
web2d/src/test/javascript/render/shapes.html
View File

@@ -15,8 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript"
src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -59,7 +60,7 @@ function initialize() {
rect.setPosition(xPosition, yPosition);
rect.setFill('yellow');
rect.setStroke(1, 'solid', 'black');
parent.appendChild(rect);
parent.append(rect);
xPosition = xPosition + 90 * scale;
rect = new web2d.Rect();
@@ -67,7 +68,7 @@ function initialize() {
rect.setPosition(xPosition, yPosition);
rect.setFill('yellow');
rect.setStroke(strokeWidth, 'dot', 'black');
parent.appendChild(rect);
parent.append(rect);
xPosition = xPosition + 90 * scale;
rect = new web2d.Rect();
@@ -75,7 +76,7 @@ function initialize() {
rect.setPosition(xPosition, yPosition);
rect.setFill('yellow');
rect.setStroke(strokeWidth, 'dash', 'black');
parent.appendChild(rect);
parent.append(rect);
xPosition = xPosition + 90 * scale;
rect = new web2d.Rect();
@@ -83,7 +84,7 @@ function initialize() {
rect.setPosition(xPosition, yPosition);
rect.setFill('yellow');
rect.setStroke(strokeWidth, 'longdash', 'black');
parent.appendChild(rect);
parent.append(rect);
xPosition = xPosition + 90 * scale;
rect = new web2d.Rect();
@@ -91,7 +92,7 @@ function initialize() {
rect.setPosition(xPosition, yPosition);
rect.setFill('yellow');
rect.setStroke(strokeWidth, 'dashdot', 'black');
parent.appendChild(rect);
parent.append(rect);
}
// Workspace with default scale ...
@@ -100,7 +101,7 @@ function initialize() {
workspace.setCoordSize(500, 100);
workspace.setCoordOrigin(0, 0);
builder(workspace, 1, 1);
workspace.addItAsChildTo($("strokeStyle"));
workspace.addItAsChildTo($('#strokeStyle'));
// Workspace with modified scale ...
workspace = new web2d.Workspace();
@@ -108,7 +109,7 @@ function initialize() {
workspace.setCoordSize(5000, 1000);
workspace.setCoordOrigin(0, 0);
builder(workspace, 10, 1);
workspace.addItAsChildTo($("strokeStyleGroup"));
workspace.addItAsChildTo($('#strokeStyleGroup'));
// Workspace with default scale ...
workspace = new web2d.Workspace();
@@ -116,7 +117,7 @@ function initialize() {
workspace.setCoordSize(500, 100);
workspace.setCoordOrigin(0, 0);
builder(workspace, 1, 5);
workspace.addItAsChildTo($("strokeStyleWidth"));
workspace.addItAsChildTo($('#strokeStyleWidth'));
};
@@ -128,32 +129,32 @@ function initialize() {
workspace.setCoordSize(500, 100);
workspace.setCoordOrigin(0, 0);
var rect = new web2d.Rect(0, {x:5,y:5,width:390,height:90,fillColor:'green',
strokeColor:'black',strokeStyle:'solid',strokeWidth:1});
workspace.appendChild(rect);
var rect = new web2d.Rect(0, {x: 5, y: 5, width: 390, height: 90, fillColor: 'green',
strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 1});
workspace.append(rect);
var rectAttributes = {width:60,height:60,fillColor:'yellow',strokeColor:'black',strokeStyle:'solid',strokeWidth:10};
var rectAttributes = {width: 60, height: 60, fillColor: 'yellow', strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 10};
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(20, 20);
rect.setAttribute("strokeOpacity", 1);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(120, 20);
rect.setAttribute("strokeOpacity", 0.5);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(220, 20);
rect.setAttribute("strokeOpacity", 0.3);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(320, 20);
rect.setAttribute("strokeOpacity", 0);
workspace.appendChild(rect);
workspace.append(rect);
workspace.addItAsChildTo($("strokeOpacity"));
workspace.addItAsChildTo($('#strokeOpacity'));
};
strokeOpacityTest();
@@ -164,32 +165,32 @@ function initialize() {
workspace.setCoordSize(500, 100);
workspace.setCoordOrigin(0, 0);
var rect = new web2d.Rect(0, {x:5,y:5,width:390,height:90,fillColor:'green',
strokeColor:'black',strokeStyle:'solid',strokeWidth:4});
workspace.appendChild(rect);
var rect = new web2d.Rect(0, {x: 5, y: 5, width: 390, height: 90, fillColor: 'green',
strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 4});
workspace.append(rect);
var rectAttributes = {width:60,height:60,fillColor:'yellow',strokeColor:'black',strokeStyle:'solid',strokeWidth:10};
var rectAttributes = {width: 60, height: 60, fillColor: 'yellow', strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 10};
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(20, 20);
rect.setAttribute("fillOpacity", 1);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(120, 20);
rect.setAttribute("fillOpacity", 0.5);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(220, 20);
rect.setAttribute("fillOpacity", 0.3);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(320, 20);
rect.setAttribute("fillOpacity", 0);
workspace.appendChild(rect);
workspace.append(rect);
workspace.addItAsChildTo($("fillOpacity"));
workspace.addItAsChildTo($('#fillOpacity'));
};
fillOpacityTest();
@@ -200,58 +201,58 @@ function initialize() {
workspace.setCoordSize(500, 100);
workspace.setCoordOrigin(0, 0);
var rect = new web2d.Rect(0, {x:5,y:5,width:390,height:90,fillColor:'green',
strokeColor:'black',strokeStyle:'solid',strokeWidth:4});
workspace.appendChild(rect);
var rect = new web2d.Rect(0, {x: 5, y: 5, width: 390, height: 90, fillColor: 'green',
strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 4});
workspace.append(rect);
var rectAttributes = {width:60,height:60,fillColor:'yellow',strokeColor:'black',strokeStyle:'solid',strokeWidth:10};
var rectAttributes = {width: 60, height: 60, fillColor: 'yellow', strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 10};
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(20, 20);
rect.setOpacity(0.8);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(120, 20);
rect.setOpacity(0.5);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(220, 20);
rect.setOpacity(0.3);
workspace.appendChild(rect);
workspace.append(rect);
rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(320, 20);
rect.setOpacity(0);
workspace.appendChild(rect);
workspace.append(rect);
workspace.addItAsChildTo($("opacity"));
workspace.addItAsChildTo($('#opacity'));
};
opacityTest();
var visibilityTest = function () {
var workspace = new web2d.Workspace({fillColor:'yellow',strokeWidth:'2px'});
var workspace = new web2d.Workspace({fillColor: 'yellow', strokeWidth: '2px'});
workspace.setSize("500px", "100px");
workspace.setCoordSize(500, 100);
workspace.setCoordOrigin(0, 0);
var rectAttributes = {width:60,height:60,fillColor:'green',strokeColor:'black',strokeStyle:'solid',strokeWidth:10};
var rectAttributes = {width: 60, height: 60, fillColor: 'green', strokeColor: 'black', strokeStyle: 'solid', strokeWidth: 10};
var rect = new web2d.Rect(0, rectAttributes);
rect.setPosition(120, 20);
workspace.appendChild(rect);
rect.addEvent("mouseover", function() {
workspace.append(rect);
rect.addEvent("mouseover", function () {
alert("Mouse Over");
});
var isVisible = true;
var executer = function() {
var executer = function () {
isVisible = !isVisible;
rect.setVisibility(isVisible);
};
executer.periodical(100);
workspace.addItAsChildTo($("visibility"));
workspace.addItAsChildTo($('#visibility'));
};
visibilityTest();
}

17
web2d/src/test/javascript/render/text.html
View File

@@ -15,8 +15,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript"
src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -61,7 +62,7 @@
overflowWorkspace.setCoordOrigin(0, 0);
var text = new web2d.Text();
overflowWorkspace.appendChild(text);
overflowWorkspace.append(text);
var scale = web2d.peer.utils.TransformUtil.workoutScale(text._peer);
text.setText(textval + " " + scale.height);
text.setFont(font, fontSizeval, style, modifier);
@@ -70,19 +71,19 @@
textot = text;
overflowWorkspace.addItAsChildTo($(owner));
overflowWorkspace.addItAsChildTo(document.id(owner));
var parent = $(owner);
var parent = document.id(owner);
var span = document.createElement("span");
span.setAttribute("id", "textoHTML" + iesimo);
var textsize = text.offsetWidth;
var textHtml = document.createTextNode(textsize);
var fontSize = text.getHtmlFontSize();
span.appendChild(textHtml);
span.append(textHtml);
//var fontSize=20*scale.height*2;
span.setAttribute("style", "font-weight:" + modifier + ";font-style: " + style + "; font-size:" + fontSize + "pt; font-family: " + font + ";width:30;height:30;");
parent.appendChild(span);
parent.append(span);
workspaces[iesimo] = overflowWorkspace;
};
@@ -129,7 +130,7 @@
</table>
<span>Text to Inspect: </span><input type="text" id="iesimo">
<input type="button" value="Inspect"
onclick="alert(document.getElementById('textoHTML'+$('iesimo').value).offsetWidth);">
onclick="alert(document.getElementById('textoHTML'+document.id('iesimo').value).offsetWidth);">
<input type="button" value="Zoom In" onclick="zoomIn()">
</body>
</html>

74
web2d/src/test/javascript/render/utils.js
View File

@@ -1,57 +1,53 @@
/*
* Copyright [2012] [wisemapping]
*
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
* It is basically the Apache License, Version 2.0 (the "License") plus the
* "powered by wisemapping" text requirement on every single page;
* you may not use this file except in compliance with the License.
* You may obtain a copy of the license at
*
* http://www.wisemapping.org/license
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
* Copyright [2012] [wisemapping]
*
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
* It is basically the Apache License, Version 2.0 (the "License") plus the
* "powered by wisemapping" text requirement on every single page;
* you may not use this file except in compliance with the License.
* You may obtain a copy of the license at
*
* http://www.wisemapping.org/license
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
Grid = function(parent, colums, rows)
{
Grid = function (parent, colums, rows) {
var cellSize = "10px";
this._parent = parent;
this._container = this._createContainer();
var tbody = this._container.firstChild.firstChild;
for (var i = 0; i < rows; i++)
{
var trElement = document.createElement("tr");
for (var j = 0; j < colums; j++)
{
var tdElement = document.createElement("td");
tdElement.style.width = cellSize;
tdElement.style.height = cellSize;
tdElement.style.borderWidth = "1px";
tdElement.style.borderStyle = "dashed";
tdElement.style.borderColor = "lightsteelblue";
trElement.appendChild(tdElement);
var tbody = $(this._container.firstChild.firstChild);
for (var i = 0; i < rows; i++) {
var trElement = $('<tr></tr>');
for (var j = 0; j < colums; j++) {
var tdElement = $('<td></td>');
tdElement.css({
width: cellSize,
height: cellSize,
borderWidth: "1px",
borderStyle: "dashed",
borderColor: "lightsteelblue"}
);
trElement.append(tdElement);
}
tbody.appendChild(trElement);
tbody.append(trElement);
}
};
Grid.prototype.setPosition = function(x, y)
{
Grid.prototype.setPosition = function (x, y) {
this._container.style.left = x;
this._container.style.top = y;
};
Grid.prototype.render = function()
{
this._parent.appendChild(this._container);
Grid.prototype.render = function () {
$(this._parent).append(this._container);
};
Grid.prototype._createContainer = function()
{
Grid.prototype._createContainer = function () {
var result = window.document.createElement("div");
result.style.tableLayout = "fixed";
result.style.borderCollapse = "collapse";

79
web2d/src/test/javascript/render/workspace.html
View File

@@ -16,8 +16,9 @@
web2d.peer.utils = {};
</script>
<script type="text/javascript"
src="../../../../../mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js"></script>
<script type="text/javascript" src="../mootools-core-1.4.5.js"></script>
<script type="text/javascript" src="../jquery-2.1.0.js"></script>
<script type="text/javascript" src="../../../../../core-js/target/classes/core.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElementPeer.js"></script>
<script type="text/javascript" src="../../../../src/main/javascript/Element.js"></script>
@@ -54,25 +55,25 @@
var elipse1 = new web2d.Elipse();
elipse1.setSize(200, 200);
elipse1.setPosition(0, 0);
overflowWorkspace.appendChild(elipse1);
overflowWorkspace.addItAsChildTo($("overflowExample"));
overflowWorkspace.append(elipse1);
overflowWorkspace.addItAsChildTo($('#overflowExample'));
var workspacePosition = function() {
var workspacePosition = function () {
var elipseAttr = {width:100,height:100,x:100,y:100};
var elipseAttr = {width: 100, height: 100, x: 100, y: 100};
var divElem = $("positionExample");
var divElem = $('#positionExample');
var workPosition = new web2d.Workspace();
workPosition.setSize("100px", "100px");
elipse = new web2d.Elipse(elipseAttr);
workPosition.appendChild(elipse);
workPosition.append(elipse);
workPosition.addItAsChildTo(divElem);
var x = 100;
var executer = function() {
var executer = function () {
x = (x + 10) % 100;
divElem.style.left = x + "px";
divElem.css('left', x + "px");
};
executer.periodical(100);
@@ -92,8 +93,8 @@
elipse.setSize(100, 100);
elipse.setPosition(100, 100);
workspacePixel.appendChild(elipse);
workspacePixel.addItAsChildTo($("sizeExamplePixels"));
workspacePixel.append(elipse);
workspacePixel.addItAsChildTo($('#sizeExamplePixels'));
var workspaceInchs = new web2d.Workspace();
workspaceInchs.setSize("1in", "1in");
@@ -101,53 +102,53 @@
elipse.setSize(100, 100);
elipse.setPosition(100, 100);
workspaceInchs.appendChild(elipse);
workspaceInchs.addItAsChildTo($("sizeExampleInch"));
workspaceInchs.append(elipse);
workspaceInchs.addItAsChildTo($('#sizeExampleInch'));
var workspaceCoordSizeSample = function() {
var workspaceCoordSizeSample = function () {
// Workspace with CoordSize(100,100);
var coordSizeSampleBuilder = function(width, height) {
var coordSizeSampleBuilder = function (width, height) {
var workspace = new web2d.Workspace();
workspace.setSize("100px", "100px");
workspace.setCoordSize(width, height);
elipse = new web2d.Elipse();
elipse.setPosition(50, 50);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(0, 0);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(0, 100);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(100, 0);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(100, 100);
workspace.appendChild(elipse);
workspace.append(elipse);
return workspace;
};
var workspace100x100 = coordSizeSampleBuilder(100, 100);
workspace100x100.addItAsChildTo($("coordsizeExample100x100"));
workspace100x100.addItAsChildTo($("#coordsizeExample100x100"));
var workspace100x200 = coordSizeSampleBuilder(100, 200);
workspace100x200.addItAsChildTo($("coordsizeExample100x200"));
workspace100x200.addItAsChildTo($("#coordsizeExample100x200"));
var workspace200x100 = coordSizeSampleBuilder(200, 100);
workspace200x100.addItAsChildTo($("coordsizeExample200x100"));
workspace200x100.addItAsChildTo($("#coordsizeExample200x100"));
var dynamicWorkspace = coordSizeSampleBuilder(100, 100);
dynamicWorkspace.addItAsChildTo($("coordsizeExampleDynamic"));
dynamicWorkspace.addItAsChildTo($('#coordsizeExampleDynamic'));
var size = 100;
var executer = function() {
var executer = function () {
size = (size + 1) % 100;
if (size < 30) {
size = 30;
@@ -162,9 +163,9 @@
workspaceCoordSizeSample();
var workspaceCoordOriginSample = function() {
var workspaceCoordOriginSample = function () {
var coordOriginSampleBuilder = function(x, y) {
var coordOriginSampleBuilder = function (x, y) {
// Workspace with CoordOrigin(100,100);
var workspace = new web2d.Workspace();
workspace.setSize("100px", "100px");
@@ -173,47 +174,47 @@
elipse = new web2d.Elipse();
elipse.setPosition(0, 0);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(0, 100);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(100, 0);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(100, 100);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(50, 50);
workspace.appendChild(elipse);
workspace.append(elipse);
elipse = new web2d.Elipse();
elipse.setPosition(100, 100);
workspace.appendChild(elipse);
workspace.append(elipse);
return workspace;
};
var workspace0x0 = coordOriginSampleBuilder(0, 0);
workspace0x0.addItAsChildTo($("coordorigin0x0"));
workspace0x0.addItAsChildTo($("#coordorigin0x0"));
var workspace0x50 = coordOriginSampleBuilder(0, 50);
workspace0x50.addItAsChildTo($("coordorigin0x50"));
workspace0x50.addItAsChildTo($("#coordorigin0x50"));
var workspace50x0 = coordOriginSampleBuilder(50, 0);
workspace50x0.addItAsChildTo($("coordorigin50x0"));
workspace50x0.addItAsChildTo($("#coordorigin50x0"));
// Workspace animation changing the coordsize from (30,30) to (100,100)
var dynamicWorkspace = coordOriginSampleBuilder(100, 100);
dynamicWorkspace.addItAsChildTo($("coordoriginExampleDynamic"));
dynamicWorkspace.addItAsChildTo($('#coordoriginExampleDynamic'));
var x = 50;
var y = 50;
executer = function() {
executer = function () {
x = (x + 1) % 50;
y = (y + 1) % 50;