Hi David,
Thanks for sending me those missing files. I've had a chance to work with
the Image Button Menu Demo.
I found the API, well, akward, at least for my purposes. The parameters for
setting up sub menus are quite mind boggling. (I gave up.) Also, it seems
unreasonable to to provide information like menu depth and number of
submenus when it has all the info necessary to to figure that stuff out. I
also missed not being able to specify a caption on the button itself.
Let me tell you about what I'm up to. What I think I want is a "navigation"
widget. More simply put, I want a widget that can essentially can provide a
full set of pull down menus, like a Windows application. Ideally, it should
be completely "skinable" so that the same "navigation" widget could be shown
as a left hand expanding menu or outlook style menu. (That would likely be
a different widget, but the interface for adding menus and sub menus can be
the same.) Naturally, they should also be configurable with CSS.
I'm in the process of learning XSLT. I will store my menus like this:
<-----------------------------------START-----------------------------------
------>
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl"
href="C:\Inetpub\wwwroot\Common\MenuCode.xsl"?>
<Menu>
<Menu Caption="File" TargetPage="FileHelp.htm">
<Command Caption="Open" Description="A tool tip test"
TargetPage="FileOpen.htm"/>
<Command Caption="Save" Description="" TargetPage="FileSave.htm"/>
<Command Caption="Close" Description="" TargetPage="FileClose.htm"/>
</Menu>
<Menu Caption="Test Menu with Subs">
<Menu Caption="Sub Menu 1" TargetPage="">
<Command Caption="Choice 1 on Sub Menu 1" Description=""
TargetPage="Whatever.htm">
</Command>
<Command Caption="Choice 1 on Sub Menu 2" Description=""
TargetPage="Whatever2.htm">
</Command>
</Menu>
</Menu>
</Menu>
<-----------------------------------
END ----------------------------------------->
(the xml-stylesheet line is just there so I could conveniently envoke it
from my editor - xmlspy)
Then, I can apply an XSLT style sheet. Like this:
<-----------------------------------START-----------------------------------
------>
<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:output method="text" encoding="us-ascii"/>
<xsl:template match="/">
<xsl:text disable-output-escaping="yes">
<script language="Javascript"
src="bin/dynapi/dynapi.js"></script>
<script language="Javascript">
DynAPI.setLibraryPath('bin/dynapi/lib/')
DynAPI.include('dynapi.api.browser');
DynAPI.include('dynapi.api.dynlayer');
DynAPI.include('dynapi.api.dyndocument');
DynAPI.include('dynapi.api.events');
DynAPI.include('dynapi.gui.dynimage');
DynAPI.include('dynapi.util.thread.js');
DynAPI.include('dynapi.dcutil.style1.js'); // use style.js for standard grey
DynAPI.include('dynapi.dcutil.popup.js');
DynAPI.include('dynapi.dcutil.pathanim');
DynAPI.include('dynapi.dcutil.wipe.js');
DynAPI.include('dynapi.dcutil.buttonmenu');
DynAPI.onLoad=function() {
// preload the images
alert("X");
p1uimg = DynImage.getImage('fbutlu.gif',77,22); // make sure the image
files are available
p1oimg = DynImage.getImage('fbutlo.gif');
p1dimg = DynImage.getImage('fbutld.gif');
p1rimg = DynImage.getImage('fbutlr.gif');
</xsl:text>
<xsl:apply-templates select="Menu"/>
<xsl:apply-templates select="Menu" mode="InitGraphics"/>
}
</script>
</xsl:template>
<xsl:template name="menuNumber" match="*" >
<!--x="I'm here P=<xsl:value-of select="position()"/> L=<xsl:value-of
select="count(ancestor::*)"/> PR=<xsl:value-of
select="count(preceding-sibling::*)"/>"-->
<xsl:choose>
<!--walk up tree until at document element-->
<xsl:when test="count(ancestor::*)>1">
<xsl:for-each select="ancestor::*[1]">
<xsl:call-template name="menuNumber"/>
</xsl:for-each>
</xsl:when>
<xsl:otherwise>
<!--must be at top menu element-->
<xsl:text/><xsl:value-of
select="count(preceding-sibling::*)+1"/><xsl:text/>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<xsl:template match="Menu">
<xsl:for-each select="*">
<!--ancestor::*[count(ancestor::*)]-->
<xsl:if test='name()="Command"'>
buti<xsl:call-template name="menuNumber"/>.addMenuItem('<xsl:value-of
select="@Caption"/>', '<xsl:value-of select="@TargetPage"/>');
</xsl:if>
<xsl:if test='name()="Menu"'>
<xsl:if test="count(ancestor::*)=1">
<!-- First Level Handling -->
// I want caption <xsl:value-of select="@Caption"/>, but i can't set it
buti<xsl:value-of select="position()"/> = new BtImMenu("Button
<xsl:value-of select="position()"/> Menu",200,10,3,2,1,-20,5); // YIKES -
these params are hard to calculate
buti<xsl:value-of select="position()"/>.setSize(77,22); // image size for
button x,y
buti<xsl:value-of select="position()"/>.moveTo(<xsl:value-of
select="(position() - 1)*76+40"/>,100);
buti<xsl:value-of select="position()"/>.setZIndex(20); //important to set
this to at least 10 as other layers stack below it Minimum 4
DynAPI.document.addChild(buti<xsl:value-of select="position()"/>);
</xsl:if>
<xsl:if test="count(ancestor::*)>1">
buti<xsl:call-template name="menuNumber"/>.addMenuItem('<xsl:value-of
select="@Caption"/>', null, <xsl:value-of select="position()"/> ); //
Another YIKES - can't calculate needed params
</xsl:if>
<xsl:apply-templates select="."/> <!-- recurse -->
</xsl:if>
</xsl:for-each>
</xsl:template>
<xsl:template match="Menu" mode="InitGraphics">
DynImage.onLoaderDone=function() {
// asign the button images, initialize the menus
<xsl:for-each select="*">
<xsl:if test='name()="Menu"'>
buti<xsl:value-of
select="position()"/>.setImages(p1uimg,p1oimg,p1dimg,p1rimg);
</xsl:if>
</xsl:for-each>
}
</xsl:template>
</xsl:stylesheet>
<-----------------------------------
END ----------------------------------------->
Some of the embedded JavaScript should look familiar. I hacked it out of
your example code. It essenitially generates JavaSccript code to "boot up"
a series of button menus. I'm sure it's possible to calculate all of the
parameters with XSLT, but I gave up. (See the // YIKE's) I think the
widget interface should be changed.
Basically, it walks the menu structure generating JavaScript calls to
initialize the widgets.
Here's the resulting (broken) JavaScript:
<-----------------------------------START-----------------------------------
------>
<script language="Javascript" src="bin/dynapi/dynapi.js"></script>
<script language="Javascript">
DynAPI.setLibraryPath('bin/dynapi/lib/')
DynAPI.include('dynapi.api.browser');
DynAPI.include('dynapi.api.dynlayer');
DynAPI.include('dynapi.api.dyndocument');
DynAPI.include('dynapi.api.events');
DynAPI.include('dynapi.gui.dynimage');
DynAPI.include('dynapi.util.thread.js');
DynAPI.include('dynapi.dcutil.style1.js'); // use style.js for standard grey
DynAPI.include('dynapi.dcutil.popup.js');
DynAPI.include('dynapi.dcutil.pathanim');
DynAPI.include('dynapi.dcutil.wipe.js');
DynAPI.include('dynapi.dcutil.buttonmenu');
DynAPI.onLoad=function() {
// preload the images
alert("X");
p1uimg = DynImage.getImage('fbutlu.gif',77,22); // make sure the image
files are available
p1oimg = DynImage.getImage('fbutlo.gif');
p1dimg = DynImage.getImage('fbutld.gif');
p1rimg = DynImage.getImage('fbutlr.gif');
// I want caption File, but i can't set it
buti1 = new BtImMenu("Button 1 Menu",200,10,3,2,1,-20,5); // YIKES -
these params are hard to calculate
buti1.setSize(77,22); // image size for button x,y
buti1.moveTo(40,100);
buti1.setZIndex(20); //important to set this to at least 10 as other
layers stack below it Minimum 4
DynAPI.document.addChild(buti1);
buti1.addMenuItem('Open', 'FileOpen.htm');
buti1.addMenuItem('Save', 'FileSave.htm');
buti1.addMenuItem('Close', 'FileClose.htm');
// I want caption Test Menu with Subs, but i can't set it
buti2 = new BtImMenu("Button 2 Menu",200,10,3,2,1,-20,5); // YIKES -
these params are hard to calculate
buti2.setSize(77,22); // image size for button x,y
buti2.moveTo(116,100);
buti2.setZIndex(20); //important to set this to at least 10 as other
layers stack below it Minimum 4
DynAPI.document.addChild(buti2);
buti2.addMenuItem('Sub Menu 1', null, 1 ); // Another YIKES - can't
calculate needed params
buti2.addMenuItem('Choice 1 on Sub Menu 1', 'Whatever.htm');
buti2.addMenuItem('Choice 1 on Sub Menu 2', 'Whatever2.htm');
DynImage.onLoaderDone=function() {
// asign the button images, initialize the menus
buti1.setImages(p1uimg,p1oimg,p1dimg,p1rimg);
buti2.setImages(p1uimg,p1oimg,p1dimg,p1rimg);
}
}
</script>
<-----------------------------------
END ----------------------------------------->
Anyway, I wanted to share what I've done with the group. I seem to recall a
couple of messages about server side stuff for DynAPI. This approach is a
natural for that.
I also wanted to ask you, Dave, if the idea of a Navigation widget fits your
goals. if so perhaps we can collaborate.
Ken
> -----Original Message-----
> From: [EMAIL PROTECTED]
> [mailto:[EMAIL PROTECTED]]On Behalf Of David
> Cushman
> Sent: Friday, February 16, 2001 3:05 PM
> To: [EMAIL PROTECTED]
> Subject: Re: RE: [Dynapi-Help] Widget test Image button menu
>
>
> Hey Ken,
> You can get the /ri/ files at Richard's site:
> http://www.resass.f2s.com/dynapi/php/index2.php
>
> or I just added those two (wipe and pathanim) to the
> zip file on my site. I also updated the modified
> popup in that zip to make some minor changes suggested
> by Henrik. Still working on the placement relative to
> window edge code and the delay.
>
> Cheers
> Dave C. "You Changed What?!?"
>
>
>
>
> "I thought I'd try to download this and get it going.
> Where do I get the
> 'dynapi.ri' dependencies from? Any particular version
> requirements for the
> other files that you're aware of?
>
> Ken"
>
>
> __________________________________________________
> Do You Yahoo!?
> Get personalized email addresses from Yahoo! Mail - only $35
> a year! http://personal.mail.yahoo.com/
>
> _______________________________________________
> Dynapi-Help mailing list
> [EMAIL PROTECTED]
> http://lists.sourceforge.net/lists/listinfo/dynapi-help
>
_______________________________________________
Dynapi-Help mailing list
[EMAIL PROTECTED]
http://lists.sourceforge.net/lists/listinfo/dynapi-help
