xsl-list
[Top] [All Lists]

RE: Javascript and XSLT

2004-09-25 19:41:40
process_login_member.xsl: 

"<?xml version="1.0"?>
<!DOCTYPE xsl:stylesheet [
        <!ENTITY % HTMLlat1 SYSTEM "Dtd/HTMLlat1x.ent">
        %HTMLlat1;
        <!ENTITY % HTMLsymbol SYSTEM "Dtd/HTMLsymbolx.ent">
        %HTMLsymbol;
        <!ENTITY % HTMLspecial SYSTEM "Dtd/HTMLspecialx.ent">
        %HTMLspecial;
]>
<xsl:stylesheet version="1.0" 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform";>
    <xsl:import href="cascademenu_member.xsl"/>
        <xsl:import href="footer.xsl"/>
        <xsl:import href="menubarv.xsl"/>
        <xsl:import href="menubarh_member.xsl"/>
        <xsl:import href="header.xsl"/>
        
        <xsl:output method="html" encoding="iso-8859-1"/>
        <xsl:template match="/">
                <html>
                        <xsl:for-each select="//ROOT">
                                <!-- If the username or password entered is not
the same as pulled 
out from db. Ask for login again -->
                                <!--xsl:if test="VAR_USERNAME !=OBJECT/USERNAME 
or
VAR_PASSWORD != 
OBJECT/PASSWORD"-->
                                <xsl:if test="WRONG_USERNAME != ' ' or
WRONG_PASSWORD != ' ' ">
                                        <head>
                                                <title>Member Login Page</title>
                                                <meta http-equiv="Content-Type"
content="text/html; 
charset=iso-8859-1"/>
                                                <link rel="stylesheet" 
href="../style/style.css"

type="text/css"/>
                                        </head>
                                        <body bgcolor="#8080C0" link="#6666FF"
vlink="#6666FF" 
alink="#CCCCCC">
                                                <!--xsl:import 
href="header.xsl"/-->
                                                <xsl:call-template 
name="header" />
                                                <!--Start of repeating part-->
                                                <table width="100%" border="0" 
align="center"
cellpadding="10">
                                                        <!--xsl:import 
href="menubarh_member.xsl"/-->
                                                                
<xsl:call-template name="menubarh_member" />
                                                                <tr 
bgcolor="#6699FF">
                                                                <!--xsl:import 
href="menubarv.xsl"/-->
                                                                
<xsl:call-template name="menubarv" />
                                                                <td 
bgcolor="#FFFFFF" valign="top"
height="400">
                                                                        <div 
align="center">
                                                                        You've 
entered a invalid username or
password. Please try 
again.  
                                                                                
<p>
                                                                                
        <font face="Verdana, Arial, Helvetica,
sans-serif" size="3">
                                                                                
                <b>Member Login </b>
                                                                                
        </font>
                                                                                
</p>
                                                                                
<form name="member_login_form2"
method="post" 
action="?CN=process_login_member">
                                                                                
        <table width="49%" border="0" height="88">
                                                                                
                <tr>
                                                                                
                        <td width="38%" height="40">
                                                                                
                                <div align="right">
                                                                                
                                        <font face="Verdana" size="2">User
name</font>
                                                                                
                                </div>
                                                                                
                        </td>
                                                                                
                        <td width="62%" height="40">
                                                                                
                                <input type="text" name="username"/>
                                                                                
                        </td>
                                                                                
                </tr>
                                                                                
                <tr>
                                                                                
                        <td width="38%" height="48">
                                                                                
                                <div align="right">
                                                                                
                                        <font face="Verdana"
size="2">Password</font>
                                                                                
                                </div>
                                                                                
                        </td>
                                                                                
                        <td width="62%" height="48">
                                                                                
                                <input type="password" name="password"/>
                                                                                
                        </td>
                                                                                
                </tr>
                                                                                
        </table>
                                                                                
        <p>
                                                                                
                <input type="submit" name="Submit"
value="Sign in"/>
                                                                                
        </p>
                                                                                
</form>
                                                                        </div>
                                                                </td>
                                                        </tr>
                                                </table>
                                                <!--xsl:import 
href="footer.xsl"/-->
                                                <xsl:call-template 
name="footer" />
                                        </body>
                                </xsl:if>
                                <xsl:if test="VAR_USERNAME = OBJECT/USERNAME and
VAR_PASSWORD = 
OBJECT/PASSWORD">
                                        <head>
                                                <title>User's Page</title>
                                                <meta http-equiv="Content-Type"
content="text/html; 
charset=iso-8859-1"/>
                                                <link rel="stylesheet" 
href="../style/style.css"

type="text/css"/>
                                                <link rel="stylesheet"
href="../style/cascademenu.css" 
type="text/css"/>
                                                <!--xsl:import 
href="cascademenu_member.xsl"/-->
                                                <xsl:call-template 
name="cascademenu_member" />
                                        </head>
                                        <body bgcolor="#8080C0" marginwidth="0"
marginheight="0" 
style="margin: 0" onLoad="writeMenus()" onResize="if
(isNS4) nsResizeHandler()" 
link="#6666FF" vlink="#6666FF" alink="#CCCCCC">
                                                <!--xsl:import 
href="header.xsl"/-->
                                                <xsl:call-template 
name="header" />
                                                <!--Start of repeating part-->
                                                <table width="100%" border="0" 
align="center"
cellpadding="10">
                                                        <!--xsl:import 
href="menubarh_member.xsl"/-->
                                                        <xsl:call-template 
name="menubarh_member" />
                                                        <tr bgcolor="#6699FF">
                                                                <td width="18%" 
valign="top"
bgcolor="#CCCCCC">
                                                                </td>
                                                                <td 
bgcolor="#FFFFFF" valign="top"
height="400">
                                                                        <div 
align="center">
                                                                                
<p>&nbsp;</p>
                                                                                
<font color="#000000" face="Verdana, Arial,
Helvetica, 
sans-serif" size="2">
                                                                                
        <b><font color="#000000" face="Verdana,
Arial, Helvetica, 
sans-serif" size="2">Welcome </font>
                                                                                
        <font color="red" face="Verdana, Arial,
Helvetica, 
sans-serif" size="2"><xsl:value-of
select="OBJECT/USERNAME"/></font>
                                                                                
        <font color="#000000" face="Verdana, Arial,
Helvetica, 
sans-serif" size="2">to the member's web
site.</font></b>
                                                                                
        <font color="#000000" face="Verdana, Arial,
Helvetica, 
sans-serif" size="2"><p>You have successfully logged
in.</p></font>
                                                                                
        <font color="#000000" face="Verdana, Arial,
Helvetica, 
sans-serif" size="2"><p>You can click on the links on
the left menu bar to 
view information or take the questionnaire.</p></font>
                                                                                
</font>
                                                                        </div>
                                                                </td>
                                                        </tr>
                                                </table>
                                                <!--xsl:import 
href="footer.xsl"/-->
                                                <xsl:call-template 
name="footer" />
                                        </body>
                                </xsl:if>
                        </xsl:for-each>
                </html>
        </xsl:template>
</xsl:stylesheet>


This is the file containing javascript:

<?xml version="1.0"?>
<!DOCTYPE xsl:stylesheet [
        
<!ENTITY % HTMLlat1 SYSTEM "Dtd/HTMLlat1x.ent">
        %HTMLlat1;
        <!ENTITY % 
HTMLsymbol SYSTEM "Dtd/HTMLsymbolx.ent">
        %HTMLsymbol;
        <!ENTITY % 
HTMLspecial SYSTEM "Dtd/HTMLspecialx.ent">
        %HTMLspecial;
]>
<xsl:stylesheet 
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform";>
<script 
language="javascript" 
type="text/javascript">
<xsl:comment>
<![CDATA[
var isDOM = (document.getElementById ? true : false); 
var isIE4 = 
((document.all && !isDOM) ? true : false);
var isNS4 = (document.layers ? 
true : false);
function getRef(id) {
if (isDOM) return 
document.getElementById(id);
if (isIE4) return document.all[id];
if (isNS4) return 
document.layers[id];
}
function getSty(id) {
return (isNS4 ? getRef(id) : 
getRef(id).style);
} 
// Hide timeout.
var popTimer = 0;
// Array showing 
highlighted menu items.
var litNow = new Array();
function 
popOver(menuNum, itemNum) {
clearTimeout(popTimer);
hideAllBut(menuNum);
litNow = 
getTree(menuNum, itemNum);
changeCol(litNow, true);
targetNum = 
menu[menuNum][itemNum].target;
if (targetNum > 0) {
thisX = 
parseInt(menu[menuNum][0].ref.left) +
parseInt(menu[menuNum][itemNum].ref.left);
thisY = 
parseInt(menu[menuNum][0].ref.top) + 
parseInt(menu[menuNum][itemNum].ref.top);
with (menu[targetNum][0].ref) {
left = parseInt(thisX + 
menu[targetNum][0].x);
top = parseInt(thisY + menu[targetNum][0].y);
visibility 
= 'visible';
      }
   }
}
function popOut(menuNum, itemNum) {
if 
((menuNum == 0) && 
!menu[menuNum][itemNum].target)
hideAllBut(0)
else
popTimer = setTimeout('hideAllBut(0)', 500);
}
function getTree(menuNum, 
itemNum) {

// Array index is the menu number. The contents are
null (if 
that menu is not a parent)
// or the item number in that menu that is an 
ancestor (to light it up).
itemArray = new 
Array(menu.length);

while(1) {
itemArray[menuNum] = itemNum;
// If we've reached the top of the 
hierarchy, return.
if (menuNum == 0) return itemArray;
itemNum = 
menu[menuNum][0].parentItem;
menuNum = menu[menuNum][0].parentMenu;
   }
}

// 
Pass an array and a boolean to specify colour change,
true = over 
colour.
function changeCol(changeArray, isOver) {
for (menuCount = 0; 
menuCount < changeArray.length; menuCount++) {
if (changeArray[menuCount]) 
{
newCol = isOver ? menu[menuCount][0].overCol : 
menu[menuCount][0].backCol;
// Change the colours of the div/layer background.
with 
(menu[menuCount][changeArray[menuCount]].ref) {
if (isNS4) bgColor = newCol;
else 
backgroundColor = newCol;
         }
      }
   }
}
function 
hideAllBut(menuNum) {
var keepMenus = getTree(menuNum, 1);
for (count = 0; count 
< menu.length; count++)
if 
(!keepMenus[count])
menu[count][0].ref.visibility = 'hidden';
changeCol(litNow, false);
}

// *** MENU CONSTRUCTION 
FUNCTIONS ***

function Menu(isVert, popInd, x, y, width, overCol, 
backCol, borderClass, textClass) {
// True or false - a vertical 
menu?
this.isVert = isVert;
// The popout indicator used (if any) for this 
menu.
this.popInd = popInd
// Position and size settings.
this.x = x;
this.y 
= y;
this.width = width;
// Colours of menu and items.
this.overCol = 
overCol;
this.backCol = backCol;
// The stylesheet class used for item 
borders and the text within items.
this.borderClass = 
borderClass;
this.textClass = textClass;
// Parent menu and item numbers, indexed 
later.
this.parentMenu = null;
this.parentItem = null;
// Reference to the 
object's style properties (set later).
this.ref = null;
}

function 
Item(text, href, frame, length, spacing, target) {
this.text = 
text;
this.href = href;
this.frame = frame;
this.length = length;
this.spacing = 
spacing;
this.target = target;
// Reference to the object's style 
properties (set later).
this.ref = null;
}

function writeMenus() {
if (!isDOM 
&& !isIE4 && !isNS4) return;

for (currMenu = 0; currMenu < menu.length; 
currMenu++) with (menu[currMenu][0]) {
// Variable for holding HTML for 
items and positions of next item.
var str = '', itemX = 0, itemY = 
0;

// Remember, items start from 1 in the array (0 is
menu object itself, 
above).
// Also use properties of each item nested in the
other with() 
for construction.
for (currItem = 1; currItem < menu[currMenu].length; 
currItem++) with (menu[currMenu][currItem]) {
var itemID = 'menu' + 
currMenu + 'item' + currItem;

// The width and height of the menu item - 
dependent on orientation!
var w = (isVert ? width : length);
var h = 
(isVert ? length : width);

// Create a div or layer text string with 
appropriate styles/properties.
// the width must be a miniumum of 3 for it 
to work in that browser.
if (isDOM || isIE4) {
str += '<div id="' + 
itemID + '" style="position: absolute; left: ' + itemX
+ '; top: ' + itemY 
+ '; width: ' + w + '; height: ' + h + '; visibility:
inherit; ';
if 
(backCol) str += 'background: ' + backCol + '; ';
str += '" ';
}
if 
(isNS4) {
str += '<layer id="' + itemID + '" left="' + itemX +
'" top="' + 
itemY + '" width="' +  w + '" height="' + h + '"
visibility="inherit" 
';
if (backCol) str += 'bgcolor="' + backCol + '" ';
}
if (borderClass) 
str += 'class="' + borderClass + '" ';

// Add mouseover handlers and 
finish div/layer.
str += 'onMouseOver="popOver(' + currMenu + ',' + 
currItem + ')" onMouseOut="popOut(' + currMenu + ',' +
currItem + ')">';

// 
Add contents of item (default: table with link
inside).
// In IE/NS6+, 
add padding if there's a border to emulate NS4's layer
padding.
// If a 
target frame is specified, also add that to the <a>
tag.

str += 
'<table width="' + (w - 8) + '" border="0"
cellspacing="0" cellpadding="' + 
(!isNS4 && borderClass ? 3 : 0) + '"><tr><td
align="left" height="' + (h 
- 7) + '">' + '<a class="' + textClass + '" href="' +
href + '"' + 
(frame ? ' target="' + frame + '">' : '>') + text +
'</a></td>';
if (target 
0) {

// Set target's parents to this menu 
item.
menu[target][0].parentMenu = currMenu;
menu[target][0].parentItem = currItem;

// Add a 
popout indicator.
if (popInd) str += '<td class="' + textClass + '" 
align="right">' + popInd + '</td>';
}
str += '</tr></table>' + (isNS4 ? 
'</layer>' : '</div>');
if (isVert) itemY += length + spacing;
else itemX += 
length + spacing;
}
if (isDOM) {
var newDiv = 
document.createElement('div');
document.getElementsByTagName('body').item(0).appendChild(newDiv);
newDiv.innerHTML 
= str;
ref = newDiv.style;
ref.position = 'absolute';
ref.visibility = 
'hidden';
}

// Insert a div tag to the end of the BODY with menu
HTML 
in place for IE4.
if (isIE4) 
{
document.body.insertAdjacentHTML('beforeEnd', '<div
id="menu' + currMenu + 'div" ' + 'style="position: 
absolute; visibility: hidden">' + str + '</div>');
ref = getSty('menu' + 
currMenu + 'div');
}

// In NS4, create a reference to a new layer and write

the items to it.
if (isNS4) {
ref = new 
Layer(0);
ref.document.write(str);
ref.document.close();
}

for (currItem = 1; currItem < 
menu[currMenu].length; currItem++) {
itemName = 'menu' + currMenu + 'item' + 
currItem;
if (isDOM || isIE4) menu[currMenu][currItem].ref = 
getSty(itemName);
if (isNS4) menu[currMenu][currItem].ref =
ref.document[itemName];
   
}
}
with(menu[0][0]) {
ref.left = x;
ref.top = y;
ref.visibility = 
'visible';
   }
}

var menu = new Array();

// Default colours passed to 
most menu constructors (just passed to functions, not
// a global 
variable - makes things easier to change later in
bulk).
var defOver = 
'#8080C0', defBack = '#CCCCFF';

// Default 'length' of menu items - item 
height if menu is vertical, width if horizontal.
var defLength = 22;

// 
Menu 0 is the special, 'root' menu from which
everything else 
arises.()
menu[0] = new Array();
menu[0][0] = new Menu(true, '', 30, 150, 150, 
'#8080C0', '#CCCCCC', '', 'itemText');
menu[0][1] = new Item('  View 
Events', '?CN=viewEvents', '', 30, 0, 0);
menu[0][2] = new Item('  Veiw 
Staff Members', '?CN=viewStaff', '', 30, 0, 0);
menu[0][3] = new Item('  
View Charts', '', '', 30, 0, 3);
menu[0][4] = new Item('  Questionnaire', 
'?CN=questions', '', 30, 0, 0);
menu[0][5] = new Item('  User Logout', 
'?CN=member_logout', '', 30, 0, 0);

// Membership menu.
menu[1] = new 
Array();
menu[1][0] = new Menu(true, '>', 100, 22, 80, defOver,

defBack, 'itemBorder', 'itemText');
menu[1][1] = new Item('Add', 
'?CN=addMember', '', defLength, 0, 0);
menu[1][2] = new Item('Delete', 
'?CN=delMemberInfo', '', defLength, 0, 0);
menu[1][3] = new Item('Modify', 
'?CN=modMemberInfo', '', defLength, 0, 0);

// Questionnaire menu.
menu[2] = new 
Array();
menu[2][0] = new Menu(true, '>', 100, 22, 80, defOver,

defBack, 'itemBorder', 'itemText');
menu[2][1] = new Item('Add', 
'?CN=addQuestion', '', defLength, 0, 0);
menu[2][2] = new Item('Delete', 
'?CN=delQuestion', '', defLength, 0, 0);
menu[2][3] = new Item('Modify', '#', '', 
defLength, 0, 0);

// View Charts menu
menu[3] = new 
Array();
menu[3][0] = new Menu(true, '>', 100, 22, 140,
defOver, defBack, 'itemBorder', 
'itemText');
menu[3][1] = new Item('Age Distribution', '?CN=age',
'', 
defLength, 0, 0);
menu[3][2] = new Item('Medicine Usage',
'?CN=medicine', 
'', defLength, 0, 0);
menu[3][3] = new Item('Tinnitus Occurrence', 
'?CN=occurrence', '', defLength, 0, 0);
menu[3][4] = new Item('Tinnitus 
Loudness', '?CN=loudness', '', defLength, 0, 0);
menu[3][5] = new 
Item('Sound of Tinnitus', '?CN=sound', '', defLength,
0, 0);
menu[3][6] = new 
Item('Use of Hearing Aid', '?CN=hearingaid', '',
defLength, 0, 0);


// 
Reopen menu
menu[4] = new Array();
menu[4][0] = new Menu(true, '>', 
100, 0, 120, '#333366', '#666699', 'crazyBorder',
'crazyText');
menu[4][1] 
= new Item('Recent Doc 1:<br>Schedule', '#', '', 36,
4, 0);
menu[4][2] 
= new Item('Recent Doc 2:<br>Plan', '#', '', 36, 7,
0);
menu[4][3] = 
new Item('Etc. etc...', '#', '', defLength, 0, 0);

// Events 
menu
menu[5] = new Array();
menu[5][0] = new Menu(true, '>', 100, 22, 80, defOver,

defBack, 'itemBorder', 'itemText');
menu[5][1] = new Item('Add', 
'?CN=addEvent', '', defLength, 0, 0);
menu[5][2] = new Item('Delete', 
'?CN=delEvent', '', defLength, 0, 0);
menu[5][3] = new Item('Edit', '#', '', 
defLength, 0, 0);


var popOldWidth = window.innerWidth;
nsResizeHandler 
= new Function('if (popOldWidth != window.innerWidth) 
location.reload()');

if (isNS4) document.captureEvents(Event.CLICK);
document.onclick = 
clickHandle;

function clickHandle(evt)
{
 if (isNS4) 
document.routeEvent(evt);
 hideAllBut(0);
}

// This is just the moving command for the 
example.

function moveRoot()
{
 with(menu[0][0].ref) left = 
((parseInt(left) < 100) ? 100 : 
5);
}
]]>
</xsl:comment>
</script>
<style>
<xsl:comment>
.itemBorder { border: 1px solid gray }
.itemText { 
text-decoration: none; color: #000000; font: 12px
Verdana, Arial, Helvetica, 
sans-serif }

.crazyBorder { border: 2px outset #663399 }
.crazyText { 
text-decoration: none; color: #FFCC99; font: Bold 12px
Verdana, Arial, 
Helvetica, sans-serif}
</xsl:comment>
</style>
        
</xsl:stylesheet>

"
--- Michael Kay <mike(_at_)saxonica(_dot_)com> wrote:

 

It is that the stylesheet is not producing the
HTML I
want it to produce.

Then show us the HTML you want to produce, compared
with the HTML actually
produced, and we can tell you what is wrong with
your stylesheet.

Michael Kay
http://www.saxonica.com/



--+------------------------------------------------------------------
XSL-List info and archive: 
http://www.mulberrytech.com/xsl/xsl-list
To unsubscribe, go to:
http://lists.mulberrytech.com/xsl-list/
or e-mail:
<mailto:xsl-list-unsubscribe(_at_)lists(_dot_)mulberrytech(_dot_)com>
--+--





                
__________________________________
Do you Yahoo!?
Yahoo! Mail - 50x more storage than other providers!
http://promotions.yahoo.com/new_mail


<Prev in Thread] Current Thread [Next in Thread>