Saturday, July 23, 2005
Show Layer
this code from Log of misc.js of Google Ajaxslt
at first start capture mouse location.
on click open or move
layer .
This code was tested on IE6.0 & Firefox 1.0.6
<html>
<head>
<script Language="JavaScript">
<!--
var mouseX;
var mouseY;
var html="<hr>";
function showLayer(x,y,html,id){
var l=getLayer(x,y,id);
l.innerHTML=html;
}
function getLayer(x,y,id){
if(!id){
id="showLayer";
}
var l = document.getElementById(id);
if (!l) {
l = document.createElement('div');
l.id = id;
l.style.position = 'absolute';
l.style.left = x+'px';
l.style.top = y+'px';
l.style.width = '250px';
l.style.height = '150px';
l.style.overflow = 'auto';
l.style.backgroundColor = '#f0f0f0';
l.style.border = '1px solid gray';
l.style.fontSize = '10px';
l.style.padding = '5px';
document.body.appendChild(l);
}else{
l.style.left = x+'px';
l.style.top = y+'px';
}
return l;
}
function mouseMove(evt){
if(document.all){
mouseX = event.x;
mouseY = event.y;}
else{
mouseX = evt.pageX;
mouseY = evt.pageY;
}
}
if(document.all) {
document.onmousemove = mouseMove;
}
else if(document.getElementById){
window.document.onmousemove = mouseMove;
}
else {
window.onmousemove = mouseMove;
window.captureEvents(Event.MOUSEMOVE);
}
// -->
</script>
</head>
<html>
<body>
<input type="button" value="click" onclick="showLayer(mouseX,mouseY,html)">
<br><br><br><br><br><br><br><br>
<input type="button" value="click" onclick="showLayer(mouseX,mouseY,html)">
</body>
</html>
Sunday, July 17, 2005
rss2html.js version 0.1
rss2html.js version 0.1 released.it is Licensed under Creative
Commons
it simple convert rss2.0 to html.
need xmlhttprequest.js,AJAXSLT
Warrning it can download same domain rss
only.
example page
download
(and convert rss2html.js)
Friday, July 15, 2005
mistake on FireFox
I missed select name ends with "/"
<xsl:template
match="rss/channel/item/">; wrong
<xsl:template
match="rss/channel/item">; collect
エラー: [Exception... "'XPath parse error rss/channel/:
RelativeLocationPath
Expr' when calling method: [nsIOnReadystatechangeHandler::handleEvent]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "<unknown>" data: no]
RSS and XSLT
RSS Read and show.
see sample page
http://www.xucker.jpn.org/tblog/ajax/rss.html
this is only xmlHttprequest & XSLT sample.
change XSLT for your feed.
-------------------------------------
samaple XSLT
<xsl:stylesheet>
<xsl:template match="/">
<xsl:apply-templates select="rss/channel/item"/>
</xsl:template>
<xsl:template match="rss/channel/item">
<xsl:element name="a"><xsl:attribute name="href"><xsl:value-of select="link"/></xsl:attribute>
<xsl:value-of select="title"/>
</xsl:element>
<br/>
</xsl:template>
</xsl:stylesheet>
Thursday, July 14, 2005
xmlhttprequest.js and http-xslt.html
---
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Simple XSLT test</title>
<script src="misc.js" type="text/javascript"></script>
<script src="dom.js" type="text/javascript"></script>
<script src="xpath.js" type="text/javascript"></script>
<script src="xslt.js" type="text/javascript"></script>
<script type="text/javascript" src="xmlhttprequest.js"></script>
<script type="text/javascript">
var xslt;
var xml;
logging__ = true;
xsltdebug__ = true;
function test_xslt() {
var xml = xmlParse(el('xml').value);
var xslt = xmlParse(el('xslt').value);
var html = xsltProcess(xml, xslt);
el('html').value = html;
el('htmldisplay').innerHTML = html;
}
function cleanxml() {
var req = new XMLHttpRequest();
if (req) {
req.onreadystatechange = function() {
//alert( req.readyState+","+req.status);
//if (req.readyState == 4 && req.status == 200)
if (req.readyState == 4 ) //for local
{
el('xml').value=req.responseText;
cleanvalue('xml');
}
};
req.open('GET', 'xml.xml');
req.send(null);
}
var req2 = new XMLHttpRequest();
if (req2) {
req2.onreadystatechange = function() {
//alert( req.readyState+","+req.status);
//if (req.readyState == 4 && req.status == 200)
if (req2.readyState == 4 ) //for local
{
el('xslt').value=req2.responseText;
cleanvalue('xslt');
}
};
req2.open('GET', 'xslt.xml');
req2.send(null);
}
}
function cleanvalue(id) {
var x = el(id);
x.value = x.value.replace(/^\s*/, '').replace(/\n\s*/g, '\n');
}
</script>
<link rel="stylesheet" href="test.css"/>
</head>
<body onload="cleanxml()">
<form onsubmit="test_xslt();return false">
<table>
<tr>
<td>
<textarea id="xml" cols="40" rows="10">
</textarea>
</td>
<td>
<textarea id="xslt" cols="40" rows="10">
</textarea>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="process"/>
</td>
</tr>
<tr>
<td>
<textarea id="html" cols="40" rows="10">
</textarea>
</td>
<td>
<div id="htmldisplay"></div>
</td>
</tr>
</table>
</form>
</body>
</html>
XMLHttpRequest()
var req = new XMLHttpRequest();
if (req) {
req.onreadystatechange = function() {
//alert( req.readyState+","+req.status);
//if (req.readyState == 4 && req.status == 200)
if (req.readyState == 4 ) //for local
{
alert(req.responseXML);
}
};
req.open('GET', 'data.xml');
req.send(null); }
}
Cross-Browser XMLHttpRequest v1.2
=================================
Emulate
Gecko 'XMLHttpRequest()' functionality in IE and Opera. Opera requires
the
Sun Java Runtime Environment <http://www.java.com/>.
by Andrew
Gregory
http://www.scss.com.au/family/andrew/webdesign/xmlhttprequest/
xmlResolveEntities(text)
resolve entities.
for example
var xml="<&">";
var
dom=xmlResolveEntities(xml);
alert(dom);
// return <&">
xmlParse(text)
convert text to dom
for example
var xml="<data><v>text1</v><v>text2></v></data>";
var
dom=xmlParse(xml);
xmlText(node)
convert node to string.
for example
var xml="<data><v>text1</v><v>text2></v></data>";
var
dom=xmlParse(xml);
var text=xmlText(dom);
alert(text);
//
return "<data><v>text1</v><v>text2></v></data>"
xmlValue(node)
return text only value.
for example
var xml="<data><v>text1</v><v>text2></v></data>";
var
dom=xmlParse(xml);
var text=xmlValue(dom);
alert(text);
// return "text1text"