mirror of
https://bitbucket.org/wisemapping/wisemapping-open-source.git
synced 2024-11-27 00:04:55 +01:00
160 lines
6.4 KiB
HTML
160 lines
6.4 KiB
HTML
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||
|
|
||
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
<head>
|
||
|
<script type="text/javascript">
|
||
|
web2d = {
|
||
|
peer: {}
|
||
|
};
|
||
|
|
||
|
web2d.peer =
|
||
|
{
|
||
|
svg: {}
|
||
|
};
|
||
|
|
||
|
web2d.peer.utils = {};
|
||
|
</script>
|
||
|
|
||
|
<script type="text/javascript"
|
||
|
src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.2/mootools-yui-compressed.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>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Workspace.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/WorkspacePeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Toolkit.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Elipse.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/ElipsePeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Line.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/LinePeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/PolyLine.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/PolyLinePeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Group.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/GroupPeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Rect.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/RectPeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Text.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/TextPeer.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/utils/TransformUtils.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/utils/EventUtils.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/Font.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/Font.js"></script>
|
||
|
<script type="text/javascript" src="../../../../src/main/javascript/peer/svg/TahomaFont.js"></script>
|
||
|
<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="utils.js"></script>
|
||
|
<script type="text/javascript">
|
||
|
function multiline(text, family, elemId) {
|
||
|
var overflowWorkspace = new web2d.Workspace();
|
||
|
overflowWorkspace.setSize('200px', '240px');
|
||
|
overflowWorkspace.setCoordSize('200', '240');
|
||
|
overflowWorkspace.setCoordOrigin(0, 0);
|
||
|
|
||
|
[6,8,10,15].forEach(function(size, i) {
|
||
|
var wText = new web2d.Text();
|
||
|
overflowWorkspace.appendChild(wText);
|
||
|
|
||
|
wText.setText(text);
|
||
|
wText.setFont(family, size, 'bold');
|
||
|
wText.setPosition(30, 50 * i);
|
||
|
wText.setColor('red');
|
||
|
});
|
||
|
|
||
|
overflowWorkspace.addItAsChildTo($(elemId));
|
||
|
}
|
||
|
|
||
|
function alignments(text, family, elemId) {
|
||
|
var overflowWorkspace = new web2d.Workspace();
|
||
|
overflowWorkspace.setSize('260px', '240px');
|
||
|
overflowWorkspace.setCoordSize('260', '240');
|
||
|
overflowWorkspace.setCoordOrigin(0, 0);
|
||
|
|
||
|
['center','left','right'].forEach(function(align, i) {
|
||
|
var wText = new web2d.Text();
|
||
|
overflowWorkspace.appendChild(wText);
|
||
|
|
||
|
wText.setText(text);
|
||
|
wText.setFont(family, 8, 'bold');
|
||
|
wText.setPosition(30, 80 * i);
|
||
|
wText.setColor('red');
|
||
|
wText.setTextAlignment(align);
|
||
|
});
|
||
|
|
||
|
overflowWorkspace.addItAsChildTo($(elemId));
|
||
|
}
|
||
|
|
||
|
function initialize() {
|
||
|
web2d.peer.Toolkit.init();
|
||
|
// Multine tests ...
|
||
|
['Arial','Tahoma','Verdana','Times'].forEach(function(family, i) {
|
||
|
multiline('This multine text.\nLine 1 :)\nLine2', family, 'multi' + i);
|
||
|
});
|
||
|
|
||
|
// Multine tests and alingments .. ...
|
||
|
['Arial','Tahoma','Verdana','Times'].forEach(function(family, i) {
|
||
|
alignments('This multine text.\nThis is the long line just because :)\nShort line', family, 'amulti' + i);
|
||
|
})
|
||
|
}
|
||
|
</script>
|
||
|
</head>
|
||
|
|
||
|
<body onload="initialize();">
|
||
|
|
||
|
<h1>Web2d Fonts Tests</h1>
|
||
|
|
||
|
<table border="1">
|
||
|
<colgroup>
|
||
|
<col style="width:30%"/>
|
||
|
<col style="width:60%"/>
|
||
|
</colgroup>
|
||
|
<thead>
|
||
|
<tr>
|
||
|
<td></td>
|
||
|
<td>Arial</td>
|
||
|
<td>Tahoma</td>
|
||
|
<td>Verdana</td>
|
||
|
<td>Times</td>
|
||
|
</tr>
|
||
|
</thead>
|
||
|
<tr>
|
||
|
<td>
|
||
|
Multiline Text
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="multi0"></div>
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="multi1"></div>
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="multi2"></div>
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="multi3"></div>
|
||
|
</td>
|
||
|
</tr>
|
||
|
<tr>
|
||
|
<td>
|
||
|
Multiline Aligment
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="amulti0"></div>
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="amulti1"></div>
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="amulti2"></div>
|
||
|
</td>
|
||
|
<td>
|
||
|
<div id="amulti3"></div>
|
||
|
</td>
|
||
|
</tr>
|
||
|
<!--**************************************************************************-->
|
||
|
|
||
|
</table>
|
||
|
<input type="button" value="Zoom In" onclick="zoomIn()">
|
||
|
</body>
|
||
|
</html>
|