Menu
▾
▴
[Dynapi-CVS] CVS: dynapi2x/examples dynapi.api.dynlayer-anchor.html,NONE,1.1 dynapi.api.dynlayer-create.html,NONE,1.1 dynapi.api.dynlayer-slide.html,NONE,1.1 dynapi.api.ext.dragevent.html,NONE,1.1 dynapi.api.mouseevent.html,NONE,1.1 dynapi.fx.pathanim-glide.html,NONE,1.1 dynapi.fx.pathanim-slide.html,NONE,1.1 dynapi.fx.pathanim.html,NONE,1.1 dynapi.gui.graphics.html,NONE,1.1 dynapi.library-file1.js,NONE,1.1 dynapi.library-file2.js,NONE,1.1 dynapi.library-load.html,NONE,1.1 dynapi.util.ioelement-testfile.html,NONE,1.1 dynapi.util.ioelement.html,NONE,1.1
Update of /cvsroot/dynapi/dynapi2x/examples
In directory usw-pr-cvs1:/tmp/cvs-serv15575/examples
Added Files:
dynapi.api.dynlayer-anchor.html
dynapi.api.dynlayer-create.html dynapi.api.dynlayer-slide.html
dynapi.api.ext.dragevent.html dynapi.api.mouseevent.html
dynapi.fx.pathanim-glide.html dynapi.fx.pathanim-slide.html
dynapi.fx.pathanim.html dynapi.gui.graphics.html
dynapi.library-file1.js dynapi.library-file2.js
dynapi.library-load.html dynapi.util.ioelement-testfile.html
dynapi.util.ioelement.html
Log Message:
Initial Import == 2.9
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - DynLayer Anchor</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.debug');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.api');
</script>
<script language="Javascript">
var bb = new DynLayer();
bb.setBgColor('black');
bb.setAnchor({left:8,right:8,top:8,bottom:8});
main = new DynLayer();
main.setBgColor('#999999');
main.setAnchor({left:1,right:1,top:1,bottom:1});
bb.addChild(main);
var anchorlayer = new DynLayer();
anchorlayer.setBgColor('black');
anchorlayer.setSize(200,100);
anchorlayer.setLocation(100,100);
var nw = anchorlayer.addChild( new DynLayer() );
nw.setBgColor('yellow');
nw.setSize(15,15);
nw.setAnchor({left:0,top:0});
var ne = anchorlayer.addChild( new DynLayer() );
ne.setBgColor('yellow');
ne.setSize(15,15);
ne.setAnchor({right:0,top:0});
var sw = anchorlayer.addChild( new DynLayer() );
sw.setBgColor('yellow');
sw.setSize(15,15);
sw.setAnchor({left:0,bottom:0});
var se = anchorlayer.addChild( new DynLayer() );
se.setBgColor('yellow');
se.setSize(15,15);
se.setAnchor({right:0,bottom:0});
var n = anchorlayer.addChild( new DynLayer() );
n.setHeight(5);
n.setBgColor('green');
n.setAnchor({left:20,top:5,right:20});
var s = anchorlayer.addChild( new DynLayer() );
s.setHeight(5);
s.setBgColor('green');
s.setAnchor({left:20,bottom:5,right:20});
var e = anchorlayer.addChild( new DynLayer() );
e.setWidth(5);
e.setBgColor('green');
e.setAnchor({right:5,top:20,bottom:20});
var w = anchorlayer.addChild( new DynLayer() );
w.setWidth(5);
w.setBgColor('green');
w.setAnchor({left:5,top:20,bottom:20});
var cn = anchorlayer.addChild( new DynLayer() );
cn.setSize(20,10);
cn.setBgColor('red');
cn.setAnchor({top:15,centerH:0});
var cn = anchorlayer.addChild( new DynLayer() );
cn.setSize(20,10);
cn.setBgColor('red');
cn.setAnchor({top:15,centerH:0});
var cs = anchorlayer.addChild( new DynLayer() );
cs.setSize(20,10);
cs.setBgColor('red');
cs.setAnchor({bottom:15,centerH:0});
var ce = anchorlayer.addChild( new DynLayer() );
ce.setSize(10,20);
ce.setBgColor('red');
ce.setAnchor({right:15,centerV:0});
var cw = anchorlayer.addChild( new DynLayer() );
cw.setSize(10,20);
cw.setBgColor('red');
cw.setAnchor({left:15,centerV:0});
var chv = anchorlayer.addChild( new DynLayer() );
chv.setSize(20,20);
chv.setBgColor('blue');
chv.setAnchor({centerH:0,centerV:0});
var box = new DynLayer();
box.setBgColor('white');
box.setSize(100,100);
box.setAnchor({right:10,bottom:10});
bluesquare = new DynLayer();
bluesquare.setBgColor('blue');
bluesquare.setSize(10,10);
bluesquare.setAnchor({left:0,top:0});
box.addChild(bluesquare);
main.addChild(box);
main.addChild(anchorlayer)
dynapi.document.addChild(bb);
dynapi.onLoad(init);
function init() {
str = '// Try these tests:\n\n'+
'anchorlayer.setLocation(50,50);\n'+
'anchorlayer.setSize(300,200);\n'+
'//anchorlayer.setAnchor({left:0,right:0,top:0,bottom:0});\n\n'+
'bluesquare.setSize(10,10); // must reset size if it is no longer 10x10\n\n'+
'// Align:\n'+
'bluesquare.setAnchor({right:0,bottom:0});\n'+
'//bluesquare.setAnchor({right:0,top:0});\n'+
'//bluesquare.setAnchor({left:0,top:0});\n'+
'//bluesquare.setAnchor({left:0,bottom:0});\n'+
'// Strech:\n'+
'//bluesquare.setAnchor({left:0,right:0,bottom:0});\n'+
'//bluesquare.setAnchor({left:0,right:0,top:0});\n'+
'//bluesquare.setAnchor({left:0,top:0,bottom:0});\n'+
'//bluesquare.setAnchor({right:0,top:0,bottom:0});\n'+
'// Center:\n'+
'//bluesquare.setAnchor({centerV:0,centerH:0});\n';
dynapi.debug.setEvaluate(str);
}
</script>
</head>
<body bgcolor="white">
<script>
dynapi.document.insertAllChildren();
</script>
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI - DynLayer Create/Remove/Delete</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api');
</script>
<script language="Javascript">
w = new DynLayer();
w.setBgColor('white');
w.setSize(130,130);
w.setLocation(250,50);
b = new DynLayer();
b.setBgColor('black');
b.setSize(100,100);
b.setLocation(400,50);
r = new DynLayer();
r.setBgColor('red');
r.setSize(50,50);
DynAPI.document.addChild(w);
DynAPI.document.addChild(b);
</script>
</head>
<body bgcolor="#999999">
<p>This is not working, and will be fixed in a next release:
<p>R: add to <a href="javascript://" onClick="w.addChild(r)">W</a>, <a href="javascript://" onClick="b.addChild(r)">B</a><br>
R: remove from <a href="javascript://" onClick="r.removeFromParent()">[parent]</a>, <a href="javascript://" onClick="w.removeChild(r)">W</a>, <a href="javascript://" onClick="b.removeChild(r)">B</a>
<script>
DynAPI.document.insertAllChildren();
</script>
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - DynLayer [Slide]</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api');
</script>
<script language="Javascript">
DynAPI.onLoad(function() {
block = new DynLayer();
block.setSize(20,20);
block.setLocation(100,100);
block.setBgColor("red");
var listener = {};
listener.onpathstart = function(e) {
status = "start";
}
listener.onpathrun = function(e) {
var o = e.getSource();
status = "play "+o.x+" "+o.y;
}
listener.onpathstop = function(e) {
var o = e.getSource();
status = "stop "+o.x+" "+o.y;;
}
block.addEventListener(listener);
DynAPI.document.addChild(block);
});
//-->
</script>
</head>
<body bgcolor="#ffffff">
<p>SlideTo:
<br>(<a href="javascript:block.slideTo(100,100)">100,100</a>)
<br>(<a href="javascript:block.slideTo(200,100)">200,100</a>)
<br>(<a href="javascript:block.slideTo(200,200)">200,200</a>)
<br>(<a href="javascript:block.slideTo(100,200)">100,200</a>)
<br>(<a href="javascript:block.slideTo(400,50)">400,50</a>)
<br>(<a href="javascript:block.slideTo(50,400)">50,400</a>)
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - Drag Event</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.debug');
dynapi.library.include('DragEvent');
</script>
<script language="Javascript">
var p = dynapi.document.addChild(new DynLayer(null,20,20,200,200,'silver'))
var a=p.addChild(new DynLayer(null,10,10,20,20,'red'))
DragEvent.enableDragEvents(a);
DragEvent.setDragBoundary(a, {left:5, right:5, top:5, bottom:5});
dynapi.onLoad(function() {
str = '// Try these tests:\n\n'+
'p.setSize(150,350);\n'+
'//p.setSize(200,200);\n';
dynapi.debug.setEvaluate(str);
});
</script>
</head>
<body bgcolor="#ffffff">
<script>
dynapi.document.insertAllChildren();
</script>
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI - Mouse Events</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api','dynapi.debug');
</script>
<script language="Javascript">
var o = new DynObject();
eo = new EventObject();
eo.onhi = function() {
alert('hi!');
}
var el = {};
el.onhi = function(e) {
alert('HI 1!');
e.setPropagate(false);
}
eo.addEventListener(el);
var el2 = {};
el2.onhi = function(e) {
alert('HI 2!');
}
eo.addEventListener(el2);
var str = '<img src="../src/dynapi/images/arrowdown.gif" width=18 height=10 alt="" border="0">'+
'<a href="javascript:alert(\'IMG\')"><img src="../src/dynapi/images/arrowup.gif" width=18 height=10 alt="" border="0"></a><br>'+
'text text '+
'<a href="javascript:alert(\'TEXT\')">link link</a>'+
'<form><input type=button value="Button" onclick="alert(\'BUTTON\')"></form>';
red = new DynLayer(str,50,50,300,300,'red');
blue = red.addChild(new DynLayer(str,0,100,200,200,'blue'));
yellow = blue.addChild(new DynLayer(str,100,100,100,100,'yellow'));
DynAPI.document.addChild(red);
DynAPI.onLoad(init);
function init() {
var el = {};
el.onmouseout = el.onmouseover = el.onmouseup = el.onmousedown = function(e) {
var o = e.getSource();
DynAPI.debug.print(e.type+' '+o.getBgColor()+' xy='+e.x+','+e.y+' pXY='+e.pageX+','+e.pageY);
}
var move = {};
move.onmousemove = function(e) {
var o = e.getSource();
DynAPI.debug.status(e.type+' '+o.getBgColor()+' xy='+e.x+','+e.y+' pXY='+e.pageX+','+e.pageY);
}
red.addEventListener(el);
blue.addEventListener(el);
yellow.addEventListener(el);
yellow.addEventListener(move);
}
</script>
</head>
<body bgcolor="#999999" link="green">
<script language="Javascript">
DynAPI.document.insertAllChildren();
</script>
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - Glide Animation (Path Animation)</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api');
dynapi.library.include('PathAnimation');
dynapi.library.include('GlideAnimation');
</script>
<script language="Javascript">
DynAPI.onLoad(init);
function init() {
block = new DynLayer();
block.setSize(20,20);
block.setLocation(200,100);
block.setBgColor("red");
block.addMethod('glideTo',PathAnimation.glideTo);
block.addMethod('glideStop',PathAnimation.glideStop);
squarePath = new PathAnimation(block);
squarePath.sleep(20);
var p = PathAnimation.glide(200,100,400,100,7,'slow','slow');
p = p.concat( PathAnimation.glide(400,100,400,200,7,'slow','slow') );
p = p.concat( PathAnimation.glide(400,200,200,200,7,'slow','slow') );
p = p.concat( PathAnimation.glide(200,200,200,100,7,'slow','slow') );
squarePath.add(p,true);
var listener = {}
listener.onpathstart = function(e) {
DynAPI.debug.print("start");
}
listener.onpathrun = function(e) {
var o = e.getSource();
DynAPI.debug.print("play "+o.x+" "+o.y);
}
listener.onpathfinish = function(e) {
var o = e.getSource();
DynAPI.debug.print("stop "+o.x+" "+o.y);
}
block.addEventListener(listener);
DynAPI.document.addChild(block);
}
//-->
</script>
</head>
<body bgcolor="#ffffff">
<p>Square Slide:
<br><a href="javascript://" onclick="squarePath.play(); return false;">start</a>
<br><a href="javascript://" onclick="squarePath.stop(); return false;">pause</a>
<p>SlideTo:
<br>(<a href="javascript://" onclick="block.glideTo(200,100); return false;">200,100</a>) slow,slow
<br>(<a href="javascript://" onclick="block.glideTo(400,100); return false;">400,100</a>) slow,slow
<br>(<a href="javascript://" onclick="block.glideTo(400,200); return false;">400,200</a>) slow,slow
<br>(<a href="javascript://" onclick="block.glideTo(200,200); return false;">200,200</a>) slow,slow
<p>(<a href="javascript://" onclick="block.glideTo(100,100,5,20,'fast','slow'); return false;">100,100</a>) fast,slow
<br>(<a href="javascript://" onclick="block.glideTo(50,400,5,20,'slow','fast'); return false;">50,400</a>) slow,fast
<br>(<a href="javascript://" onclick="block.glideTo(0,0,5,20,'fast','fast'); return false;">0,0</a>) fast fast
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - Path Animation [Slide]</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.debug');
dynapi.library.include('PathAnimation');
dynapi.library.include('SlideAnimation');
</script>
<script language="Javascript">
DynAPI.onLoad(function() {
block = new DynLayer();
block.setSize(20,20);
block.setLocation(100,100);
block.setBgColor("red");
var listener = {};
listener.onpathstart = function(e) {
status = "start";
}
listener.onpathrun = function(e) {
var o = e.getSource();
status = "play "+o.x+" "+o.y;
}
listener.onpathfinish = function(e) {
var o = e.getSource();
status = "stop "+o.x+" "+o.y;;
}
block.addEventListener(listener);
DynAPI.document.addChild(block);
});
//-->
</script>
</head>
<body bgcolor="#ffffff">
<p>SlideTo:
<br>(<a href="javascript:block.slideTo(100,100)">100,100</a>)
<br>(<a href="javascript:block.slideTo(200,100)">200,100</a>)
<br>(<a href="javascript:block.slideTo(200,200)">200,200</a>)
<br>(<a href="javascript:block.slideTo(100,200)">100,200</a>)
<br>(<a href="javascript:block.slideTo(400,50)">400,50</a>)
<br>(<a href="javascript:block.slideTo(50,400)">50,400</a>)
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - Path Animation</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.api');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.debug');
dynapi.library.include('PathAnimation');
dynapi.library.include('SlideAnimation');
dynapi.library.include('GlideAnimation');
dynapi.library.add('dynapi.fx.CircleAnimation','circleanim.js',['Thread','dynapi.functions']);
dynapi.library.include('CircleAnimation');
</script>
<script language="Javascript">
dynapi.onLoad(init);
function init() {
block = new DynLayer();
block.setSize(20,20);
block.setLocation(214,174);
block.setBgColor("red");
// path 0 straight line manually created
path = new PathAnimation(block);
linemanual = [100,100,110,110,120,120,130,130,140,140,150,150,160,160,170,170,180,180,190,190,200,200];
path.add( linemanual );
// path 1 straight line generated
linegenerated = PathAnimation.line(100,100, 33,3, 20); // x1,y1,x2,y2,inc
path.add( linegenerated );
// path 2 squiggly line
var x = [90,92,94,97,100,103,107,111,116,120,125,130,135,140,146,151,156,161,167,172,177,183,189,196,203,210,218,227,235,244,252,260,267,273,279,284,288,291,293,294,295,294,293,291,288,285,282,278,274,270,266,263,260,257,254,252,251,251,251,253,255,257,261,266,271,277,284,292,300,310,320,332,344,357,371,385,398,412,424,435];
var y = [73,73,72,72,73,73,74,75,77,79,82,85,89,94,101,108,116,125,136,147,158,169,180,191,200,208,215,221,226,229,231,231,230,228,225,220,215,209,202,194,187,179,171,163,155,147,139,132,126,119,114,109,104,100,96,92,88,84,81,77,74,71,68,66,64,63,63,64,65,68,73,79,86,96,107,119,131,143,155,165];
linesquiggle = PathAnimation.interlace(x,y)
path.add( linesquiggle );
// path 3 generated circle path starting at 180degrees about point (250,250)
// note: circleanim is not required in order to use pathanim
circle = new CircleAnimation();
circle.setRadius(50);
circle.setAngle(180);
circle.setAngleIncrement(10);
circlepath = circle.generatePath(250,250);
path.add(circlepath);
// default interval
path.sleep(50);
var listener = {};
listener.onpathstart = function(e) {
status = "start";
}
listener.onpathrun = function(e) {
var o = e.getSource();
status = "play "+o.x+" "+o.y;
}
listener.onpathstop = function(e) {
var o = e.getSource();
status = "stop "+o.x+" "+o.y;;
}
block.addEventListener(listener);
DynAPI.document.addChild(block);
}
</script>
</head>
<body bgcolor="#ffffff">
<p><b>Controls</b>:
<br>sleep : <a href="javascript:path.sleep(20)">20</a> | <a href="javascript:path.sleep(50)">50</a> | <a href="javascript:path.sleep(100)">100</a>
<br>show coordinates : <a href="javascript:alert(path.paths[0])">path 0</a> | <a href="javascript:alert(path.paths[1])">path 1</a> | <a href="javascript:alert(path.paths[2])">path 2</a> | <a href="javascript:alert(path.paths[3])">path 3</a>
<br><a href="javascript:path.stop()">stopAnimation</a>
<p><b>Unstored Animations</b>
<br><font size=-1>This type is meant for quick playing, the information is deleted when
<br>the animation is finished playing (this is used in slide animations)</font>
<p><a href="javascript:path.play(linemanual)">quickplay path 0</a>
<br><a href="javascript:path.play(linegenerated)">quickplay path 1</a>
<br><a href="javascript:path.play(linesquiggle)">quickplay path 2</a>
<br><a href="javascript:path.play(circlepath,true)">quickplay path 3</a> (loops)
<p><b>Stored Animations</b>
<br><font size=-1>These play paths that have been saved in the PathAnimation object</font>
<table border=1>
<tr><td><td>
<td>loop</td>
<td>auto-reset</td>
<td>play</tr>
<tr><td>Path 0
<br>straight line<td>
<td><a href="javascript:path.setLoops(0,true)">on</a> | <a href="javascript:path.setLoops(0,false)">off</a></td>
<td><a href="javascript:path.setResets(0,true)">on</a> | <a href="javascript:path.setResets(0,false)">off</a></td>
<td><a href="javascript:path.play(0)">play</a></td></tr>
<tr><td>Path 1
<br>generated line<td>
<td><a href="javascript:path.setLoops(1,true)">on</a> | <a href="javascript:path.setLoops(1,false)">off</a></td>
<td><a href="javascript:path.setResets(1,true)">on</a> | <a href="javascript:path.setResets(1,false)">off</a></td>
<td><a href="javascript:path.play(1)">play</a></td></tr>
<tr><td>Path 2
<br>squiggly line<td>
<td><a href="javascript:path.setLoops(2,true)">on</a> | <a href="javascript:path.setLoops(2,false)">off</a></td>
<td><a href="javascript:path.setResets(2,true)">on</a> | <a href="javascript:path.setResets(2,false)">off</a></td>
<td><a href="javascript:path.play(2)">play</a></td></tr>
<tr><td>Path 2
<br>circle<td>
<td><a href="javascript:path.setLoops(3,true)">on</a> | <a href="javascript:path.setLoops(3,false)">off</a></td>
<td><a href="javascript:path.setResets(3,true)">on</a> | <a href="javascript:path.setResets(3,false)">off</a></td>
<td><a href="javascript:path.play(3)">play</a></td></tr>
</table>
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI Examples - Graphics</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.api');
dynapi.library.include('dynapi.gui.Graphics');
</script>
<script language="JavaScript">
<!--
DynAPI.onLoad(function() {
lyr = new DynLayer()
lyr.setLocation(20,50)
lyr.setSize(400,400)
lyr.setBgColor('#C0C0C0');
DynAPI.document.addChild(lyr)
graphics = new Graphics(lyr);
graphics.useVML = true
graphics.setStrokeColor('red');
graphics.setStrokeWeight(2);
graphics.setFillColor(lyr.bgcolor);
});
function getRandomInt(min,max) {
return Math.floor(min+Math.random()*(max-min+1))
}
function randline() {
graphics.drawLine(getRandomInt(0,400),getRandomInt(0,400),getRandomInt(0,400),getRandomInt(0,400));
}
function randcircle() {
graphics.drawCircle(getRandomInt(0,300),getRandomInt(0,200),getRandomInt(20,100));
}
//-->
</script>
</head>
<body bgcolor="#ffffff">
<form>
<INPUT TYPE="BUTTON" value="draw line" onclick="randline();">
<INPUT TYPE="BUTTON" value="draw circle" onclick="randcircle();">
<INPUT TYPE="BUTTON" value="draw rect" onclick="">
<INPUT TYPE="BUTTON" value="delete last" onclick="">
<INPUT TYPE="BUTTON" value="delete all" onclick="">
</form>
</body>
</html>
--- NEW FILE ---
// make global variable
file1Data = [1,1,1,1,1];
alert('you ran file1');
--- NEW FILE ---
// make global variable
file2Data = [2,2,2,2,2];
alert('you ran file2');
--- NEW FILE ---
<html>
<head>
<title>DynAPI - Library [Load]</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
<!--
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.debug'); // can load on the fly
dynapi.library.include('dynapi.library'); // include library load extension
dynapi.library.addPackage('mypackage','mypackage/');
dynapi.library.add(['mypackage.MyObject0','mypackage.MyObject1'],'myobject1.js','dynapi.api');
dynapi.library.add('mypackage.MyObject2','myobject2.js','MyObject1');
dynapi.library.add('mypackage.MyObject3','myobject3.js',['MyObject2']);
// include the <script> elements for the files:
//dynapi.library.include('dynapi.api');
//dynapi.library.include('DynEvent');
//dynapi.library.include('DynDocument');
//dynapi.library.include('MouseEvent');
//dynapi.library.include('MyObject3');
// any load()'s performed before dynapi is loaded will be queued
// and loaded before dynapi.onLoad handlers are called
//dynapi.library.load('dynapi.api');
function loadPackage() {
var p = document.libloader.packagename.options[document.libloader.packagename.selectedIndex].value;
if (p) dynapi.library.load(p, function() {
alert(eval(p));
});
}
function getPackagePath() {
var p = document.libloader.packagename.options[document.libloader.packagename.selectedIndex].value;
if (p) alert(dynapi.library.getPath(p));
}
function loadObject() {
var n = document.libloader.objectname.options[document.libloader.objectname.selectedIndex].value;
if (n) dynapi.library.load(n, function() {
alert(dynapi.frame[n]);
});
}
function reloadObject() {
var n = document.libloader.objectname.options[document.libloader.objectname.selectedIndex].value;
if (n) dynapi.library.reload(n, function() {
alert(dynapi.frame[n]);
}, true);
}
function reloadAll() {
var n = document.libloader.objectname.options[document.libloader.objectname.selectedIndex].value;
if (n) dynapi.library.reload(n, function() {
alert(dynapi.frame[n]);
}, true);
}
//-->
</script>
<script language="Javascript">
dynapi.onLoad(init);
function init() {
var evalstr = 'dynapi.debug.print(MyObject0)\n'+
'dynapi.debug.print(MyObject1)\n'+
'dynapi.debug.print(MyObject2)\n'+
'dynapi.debug.print(MyObject3)\n\n'+
'var m3 = new MyObject3();\n'+
'alert(m3.value0+" "+m3.value1+" "+m3.value2+" "+m3.value3);\n';
dynapi.debug.setEvaluate(evalstr)
// run test on startup:
//createTest();
}
//dynapi.onLoad(createTest);
count = 1;
function createTest() {
dynapi.library.load('dynapi.api', function(){
dynapi.document.addChild(new DynLayer('success '+count++,260,70,80,80,'yellow'));
});
}
</script>
</head>
<body bgcolor="#999999">
<!-- load debugger on the fly
<a href="javascript:dynapi.library.load('dynapi.debug', function(){dynapi.debug.open()})">open Debugger</a><br>
<a href="javascript:dynapi.debug.close()">close Debugger</a>
-->
<form name="libloader">
<p>After clicking the links try testing for the objects with the given commands in the debugger.<br>
<ul>
<p><li>Load a package:<br>
<font face="Courier" size=-1><select name=packagename size=5>
<script language="Javascript">
var str = '';
var s,pkg;
for (var p in dynapi.library.packages) {
str += '<option value="'+p+'">'+p+'</option>';
}
document.write(str);
</script>
</select></font><br>
<input type=button onclick="loadPackage()" value="Load"><input type=button onclick="getPackagePath()" value="Get Path">
<p><li>Load an object:<br>
<font face="Courier" size=-1><select name=objectname size=10>
<script language="Javascript">
var str = '';
var s,pkg;
for (var n in dynapi.library.objects) {
s = dynapi.library.objects[n];
str += '<option value="'+n+'">'+ s.pkg +'.'+ n +'</option>';
}
document.write(str);
</script>
</select></font>
<br><input type=button onclick="loadObject()" value="Load"><input type=button onclick="reloadObject" value="Reload"><input type=button onclick="reloadAll()" value="Reload all Dependencies">
</form>
<p><li>Tests:<br>
<a href="javascript:createTest()">load dynapi.api, then draw a layer</a><br>
<p><li>Manually load a JS file:<br>
Note: dynapi.library.loadScript() is meant for non-objects (commands that manipulate the page or load data)<br>
<a href="javascript:dynapi.library.loadScript('dynapi.library-file1.js', function(){alert(file1Data); dynapi.debug.print('loaded dynapi.library-file1.js')})">libraryloader_file1.js</a><br>
<a href="javascript:dynapi.library.loadScript('dynapi.library-file2.js', function(){alert(file2Data); dynapi.debug.print('loaded dynapi.library-file2.js')})">libraryloader_file2.js</a>
</ul>
</body>
</html>
--- NEW FILE ---
<html>
<script>
<!--
var dynapi = parent.dynapi;
var ioelement;
if (dynapi) {
ioelement = parent.IOElement.notify(this, init); // run init() when this file loads
}
else alert('Error: no dynapi');
// you can server-generate js variables and retrieve them in the load handler
var boolValue = true;
var randValue = Math.random();
// obtain arguments passed in the url
if (dynapi) {
var args = dynapi.functions.getURLArguments(this);
var myValue = args['myvalue'];
}
function init() {
dynapi.debug.print('loaded ioelement-testfile.html');
}
//-->
</script>
<body>
<script>
<!--
if (ioelement) {
// fix iframe bgcolor to parent IOElement's bgcolor, IE/Moz only
if (!dynapi.ua.ns4) this.document.body.style.backgroundColor = ioelement.getBgColor();
document.write('<b>server-generated values:</b><br>');
document.write('boolValue = '+boolValue+'<br>');
document.write('randValue = '+randValue+'<br>');
document.write('<b>value passed in the URL:</b><br>');
document.write('myvalue = '+args['myvalue']+'<br>');
document.write('<b>values used by IOElement:</b><br>');
document.write('ioLoadID = '+args['ioLoadID']+'<br>');
document.write('ioElmID = '+args['ioElmID']+'<br>');
}
//-->
</script>
<p>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>
</body>
</html>
--- NEW FILE ---
<html>
<head>
<title>DynAPI - I/O Element</title>
<script language="JavaScript" src="../src/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('../src/dynapi/');
dynapi.library.include('dynapi.debug');
dynapi.library.include('dynapi.api');
dynapi.library.include('IOElement');
</script>
<script language="Javascript">
var d = dynapi.document.addChild(new DynLayer('',150,90,400,300,'white'));
// create a hidden IOElement
// you do not have to add the IOElement to dynapi.document manually
// it is done automatically when "true" is passed to the constructor
hidden_io = new IOElement(true);
// create a visible IOElement
// shows a layer/iframe element inside the dynlayer
yellow_io = new IOElement();
yellow_io.setLocation(50,50);
yellow_io.setSize(300,200);
yellow_io.setBgColor('yellow');
dynapi.onLoad(init);
function init() {
// works better in IE if created on the fly
// a later version may only be created this way
d.addChild(yellow_io);
}
function loadtest(ioelement) {
var fn = function(e) {
var o = e.getSource();
alert('IOElement load handler found these values:\nboolValue = ' + o.getScope().boolValue+'\nrandValue = ' + o.getScope().randValue+'\nmyValue = ' + o.getScope().myValue);
}
ioelement.load("dynapi.util.ioelement-testfile.html?myvalue=12345",fn);
}
</script>
</head>
<body bgcolor="#999999">
Load "dynapi.util.ioelement-testfile.html" into:<br>
<a href="javascript:loadtest(hidden_io)">hidden IOElement</a><br>
<a href="javascript:loadtest(yellow_io)">visible IOElement (yellow)</a>
<script>
dynapi.document.insertAllChildren();
</script>
</body>
</html>
|
