JavaScript DHTML/Ajax Layer/HyperLink
Blink hyperlink
http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<html>
<head>
<title>DynAPI Examples - Template Manager</title>
<script language="JavaScript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath("./dynapisrc/");
dynapi.library.include("dynapi.api");
dynapi.library.include("TemplateManager");
dynapi.library.include("HTMLCalendar");
dynapi.library.include("HTMLRollover");
dynapi.library.include("HTMLClock");
dynapi.library.include("HTMLMenu");
</script>
<script language="Javascript">
// HTML code/templates
var template1="<table cellSpacing=0 cellPadding=0 width=340 border=0>\n <tr>\n <td width=10><img src="./dynapiexamples/images/edge.tplt.gif" border=0 width="10" height="10" /></td>\n <td width=320 background="./dynapiexamples/images/edge.tp.gif"><img height=10 src="./dynapiexamples/images/pixel.gif" width=1 border=0 /></td>\n <td width=10><img height=10 src="./dynapiexamples/images/edge.tprt.gif" width="10" border="0" /></td>\n </tr>\n <tr>\n <td width=10 background="./dynapiexamples/images/edge.lt.gif"><img height=1 src="./dynapiexamples/images/pixel.gif" width=10 border=0></td>\n <td vAlign=top width=320 bgColor=#f5f5f5>\n <table cellSpacing=0 cellPadding=4 width="100%" border=0>\n <tr>\n <td noWrap align=center bgcolor="#FFFFFF" width="100%">\n <table border="0" style="border-collapse: collapse" bordercolor="#111111" cellpadding="0" cellspacing="0">\n <tr>\n <td width="100%">\n <img border=0 src="./dynapiexamples/images/htmlcomponents.gif" width="285" height="42"></td>\n </tr>\n <tr>\n <td width="100%" bgcolor="003366">\n {@hmenu}\n </td>\n </tr>\n <tr>\n <td width="100%">\n <table border="0" cellpadding="4" style="border-collapse: collapse" bordercolor="#111111" id="AutoNumber1" cellspacing="3">\n <tr>\n <td valign="top">\n <table border="0" cellpadding="2" cellspacing="1" style="border-collapse: collapse" bordercolor="#111111" width="103" id="AutoNumber2">\n <tr>\n <td width="93" align="center">{@hbtn1}</td>\n </tr>\n <tr>\n <td width="93" align="center">{@hbtn2}</td>\n </tr>\n <tr>\n <td width="93" align="center"><br>\n {@hclk}</td>\n </tr>\n </table>\n </td>\n <td valign="top">{@hcal}</td>\n </tr>\n </table>\n </td>\n </tr>\n <tr>\n <td width="100%" align="right">{@lyr1}</td>\n </tr>\n <tr>\n <td width="100%" align="center" style="border-top: 1px solid #000000" bgcolor="#F5F5F5"><b>\n <font face="Arial, Helvetica, sans-serif" size="2" color="#800000">DynAPI</font></b><font color=#333333 \n face="Arial, Helvetica, sans-serif" size=2> | {@hlink}</font></td>\n </tr>\n </table> \n </td>\n </tr>\n </table>\n </td>\n <td width=10 background="./dynapiexamples/images/edge.rt.gif"><img height=1 src="./dynapiexamples/images/pixel.gif" width=10 border=0></td>\n </tr>\n <tr>\n <td width=10><img height=10 src="./dynapiexamples/images/edge.bmlt.gif" width=10 border=0></td>\n <td width=320 background="./dynapiexamples/images/edge.bm.gif"><img height=10 src="./dynapiexamples/images/pixel.gif" width=1 border=0></td>\n <td width=10><img height=10 src="./dynapiexamples/images/edge.bmrt.gif" width=10 border=0></td>\n </tr>\n</table>";
var tp = new Template(template1,150,40,400,360);
var imgPath = "./dynapiexamples/images/";;
var btn_home = imgPath+"btn_home_";
var btn_contact = imgPath+"btn_contact_";
var btnE = {
onclick:function(e){
alert("Hello from "+e.getSource()._tmplFld)
}
};
// HTMLMenu
var mbar;
tp.addChild(new HTMLMenu(),"hmenu");
// Main Menu
mbar= tp.hmenu.createMenuBar("main",40,20);
mbar.addItem(null,"File","file");
mbar.addItem(null,"Edit","edit");
mbar.addItem(null,"View","view");
mbar.addItem(null,"Tools","tools");
mbar.addItem(null,"Help","help");
//File menu
mbar = tp.hmenu.createMenuBar("file",130);
mbar.addItem(null,"New");
mbar.addItem(null,"Open",null,"alert("Open files")",null,null,"navy","red");
mbar.addItem(null,"Save");
mbar.addItem(null,"Save As ...");
mbar.addItem(null,"Recent Files","recent");
mbar.addItem(null,"Exit");
//Recent menu
mbar = tp.hmenu.createMenuBar("recent",120);
mbar.addItem(null,"Dynapi.js");
mbar.addItem(null,"Quickref.html");
mbar.addItem(null,"Changelog.html");
mbar.addItem(null,"Index.html");
//edit menu
mbar = tp.hmenu.createMenuBar("edit",120);
mbar.addItem(null,"Undo");
mbar.addItem(null,"Cut");
mbar.addItem(null,"Copy");
mbar.addItem(null,"Paste");
//view menu
mbar = tp.hmenu.createMenuBar("view",130);
mbar.addItem(null,"Go");
mbar.addItem(null,"Stop");
mbar.addItem(null,"Toolbars","tbar");
mbar.addItem(null,"Status Bar");
// tbar
mbar = tp.hmenu.createMenuBar("tbar",120);
mbar.addItem(null,"Header");
mbar.addItem(null,"Footer");
mbar.addItem(null,"Standard");
mbar.addItem(null,"Drawing");
//tools menu
mbar = tp.hmenu.createMenuBar("tools",120);
mbar.addItem(null,"Options");
mbar.addItem(null,"Macro");
mbar.addItem(null,"Convert...");
mbar.addItem(null,"Run...");
//HTMLRollovers
tp.addChild(new HTMLRollover(null,85,29,btn_home+"off.gif",btn_home+"on.gif"),"hbtn1");
tp.addChild(new HTMLRollover(null,85,29,btn_contact+"off.gif",btn_contact+"on.gif"),"hbtn2");
tp.hbtn1.addEventListener(btnE);
tp.hbtn2.addEventListener(btnE);
//HTMLHyperLink
tp.addChild(new HTMLHyperLink(null,"Click Here","http://dynapi.sf.net"),"hlink");
tp.hlink.startFlash("blue","black")
tp.hlink.addEventListener({
onclick:function(e){
var o=e.getSource();
alert("A link to DynAPI"s website")
// o.allowEvent(); // By default HyperLink events are canceled (return false)
}
});
//HTMLClock
tp.addChild(new HTMLClock(),"hclk");
// HTML Calender
hc = tp.addChild(new HTMLCalendar(),"hcal");
// modify colors
hc.borCol = "#000000";
hc.titleBgCol ="maroon";
hc.titleFgCol ="white";
hc.wkDayBgCol ="beige";
hc.selBorCol = "#CCCCCC";
hc.selBgCol = "#DEDEFF";
hc.selTDayBgCol = "beige";
hc.addEventListener({
onchange:function(e){
var o=e.getSource();
var l=o.parent.lyr1;
if(l) {
var dt = o.getDate();
dt=(!dt)? "":(dt.getMonth()+1)+"/"+dt.getDate()+"/"+dt.getFullYear();
o.parent.lyr1.setHTML("<font face="arial" size="2">Date is "+dt+"</font>");
}
}
});
//DynLayer
tp.addChild(new DynLayer(null,0,0,200,20),"lyr1");
dynapi.document.addChild(tp);
</script></head>
<body>
<script>
dynapi.document.insertAllChildren();
</script>
</body>
</html>
<A href="http://www.wbex.ru/Code/JavaScriptDownload/dynapi.zip">dynapi.zip( 791 k)</a>
HyperLink control in JavaScript
http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<html>
<head>
<title>DynAPI Examples - HTML HyperLink</title>
<script language="JavaScript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath("./dynapisrc/");
dynapi.library.include("dynapi.api");
dynapi.library.include("TemplateManager");
dynapi.library.include("HTMLHyperLink");
dynapi.library.include("FlashSound");
</script>
<script language="Javascript">
fs = new FlashSound();
fs.setSWF("images/sndfx.swf");
HTMLComponent.setFlashSound(fs); // Set FlashSound object for all HCs
var tp = new Template("This is the Template:<center><table border="1"><tr><td>{@fld}</td></tr></table></center>",100,100,250,200,"lime");
hl = new HTMLHyperLink(null,"Click Here",null,"HTML Hyper Link Demo");
hl.sndOnMouseover = "/click@start";
hl.sndOnClick = "/check@start";
hl.startFlash()
hl.addEventListener({
onclick:function(e){
var o=e.getSource();
o.setURL("dynapi.sf.net"); // jump to url;
status = "Visit DynAPI\"s website at http://"+o.getURL();
// o.allowEvent(); // By default HyperLink events are canceled (return false)
}
});
tp.addChild(hl,"fld");
dynapi.document.addChild(tp);
</script>
</head>
<body>
<script>
dynapi.document.insertAllChildren();
</script>
</body>
</html>
<A href="http://www.wbex.ru/Code/JavaScriptDownload/dynapi.zip">dynapi.zip( 791 k)</a>