oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

upgraded yui to 2.2.2 and yui-ext to 1.0.1a

Browse source
This commit is contained in:
JT Smith 2007-07-05 04:23:55 +00:00
parent 4d9af2c691
commit 547ced6500
1992 changed files with 645731 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

72
www/extras/yui/examples/logger/basic.html Normal file
View file

@ -0,0 +1,72 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example: Logger - Reading and Writing Basic Logs (YUI Library)</title>
<link type="text/css" rel="stylesheet" href="../../build/reset/reset.css">
<link type="text/css" rel="stylesheet" href="../../build/fonts/fonts.css">
<link type="text/css" rel="stylesheet" href="../../build/logger/assets/logger.css">
<link type="text/css" rel="stylesheet" href="./css/examples.css">
<link type="text/css" rel="stylesheet" href="../assets/dpSyntaxHighlighter.css" />
<style type="text/css">
#bd p {width:50%;}
</style>
</head>
<body>
<div id="hd">
<h1><img src="./img/logo.gif" class="logo" alt="Y!"/><a href="./">Logger Widget</a> :: Reading and Writing Basic Logs</h1>
</div>
<div id="bd">
<!-- Content begins -->
<div id="intro">
<h3>Default LogReader Example</h3>
<p>With just a few lines of code, you can put a LogReader on any web
page to display log messages written out via <code>YAHOO.log()</code>.
By default, the LogReader will also look for the YUI Library's Drag and Drop
utility to make the LogReader automatically draggable.</p>
<p><a href="#" id="loglink">Click here</a> to log a simple message.</p>
</div>
<!-- Sample code begins -->
<div id="code">
<h3>Sample Code</h3>
<textarea name="code" class="JScript" cols="60" rows="1">
// A single line of JavaScript can get you reading logs...
var myLogReader = new YAHOO.widget.LogReader();
// ...and writing logs
YAHOO.log("This is a simple log message.");
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Libary begins -->
<script type="text/javascript" src="../../build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="../../build/event/event.js"></script>
<script type="text/javascript" src="../../build/dom/dom.js"></script>
<script type="text/javascript" src="../../build/dragdrop/dragdrop.js"></script>
<script type="text/javascript" src="../../build/logger/logger.js"></script>
<!-- Library ends -->
<script type="text/javascript">
// Click the link to log a message
var clickHandler = function(e) {
YAHOO.util.Event.stopEvent(e);
YAHOO.log("This is a simple log message.");
};
YAHOO.util.Event.addListener(YAHOO.util.Dom.get("loglink"),"click",clickHandler);
// Put a LogReader on your page
var myLogReader = new YAHOO.widget.LogReader();
</script>
<script type="text/javascript" src="../assets/dpSyntaxHighlighter.js"></script>
<script type="text/javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>
</body>
</html>

20
www/extras/yui/examples/logger/css/examples.css Normal file
View file

@ -0,0 +1,20 @@
h1 {font-size:144%;}
h2 {font-size:129%;}
h3 {font-size:114%;}
h4 {font-size:100%;}
h1,h2,h3,h4 {font-weight:bold;margin-bottom:1em;}
body {margin:1em;font-family:verdana,arial,sans-serif;}
ul {width:80%;margin-bottom:1em;}
dl {padding:1em;}
#hd {position:relative;}
#hd .logo {width:65px;height:38px;vertical-align:middle;padding-right:10px;}
#bd {margin:1em;}
p {margin-bottom:1em;}
#intro {margin-bottom:2em;}
.example, .content, .container {position:relative;}
.example {margin:1em;padding:1em;border:1px solid black;background-color:#EEE;}
.container {float:right;}
.code {clear:both;}

BIN
www/extras/yui/examples/logger/img/logo.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 705 B

29
www/extras/yui/examples/logger/index.html Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Examples: Logger (YUI Library)</title>
<link rel="stylesheet" href="../../build/reset/reset.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts.css" />
<link rel="stylesheet" type="text/css" href="./css/examples.css" />
<style type="text/css">
ul {margin:1em;}
li {margin:1em;list-style-type:none;}
</style>
</head>
<body>
<div id="hd">
<h1><img src="./img/logo.gif" class="logo" alt="Y!"/>Logger Widget Implementation Examples</h1>
</div>
<div id="bd">
<ul>
<li><a href="./basic.html">Reading and Writing Basic Logs</a></li>
<li><a href="./logreader.html">Customizing LogReader UI</a></li>
<li><a href="./logwriter.html">Writing Logs with Categories and Sources</a></li>
<li><a href="./integration.html">Integrating with YUI Components</a></li>
</ul>
</div>
</body>
</html>

175
www/extras/yui/examples/logger/integration.html Normal file
View file

@ -0,0 +1,175 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example: Logger - Integrating with YUI Components (YUI Library)</title>
<link type="text/css" rel="stylesheet" href="../../build/reset/reset.css">
<link type="text/css" rel="stylesheet" href="../../build/fonts/fonts.css">
<link type="text/css" rel="stylesheet" href="../../build/logger/assets/logger.css">
<link type="text/css" rel="stylesheet" href="./css/examples.css">
<link type="text/css" rel="stylesheet" href="../assets/dpSyntaxHighlighter.css">
<style type="text/css">
#bd p {width:50%;}
#statesmod {position:relative;margin-bottom:5em;}
#statesautocomplete{position:relative;width:15em;margin-bottom:0em;}/* set width of widget here*/
#statesinput {position:absolute;width:100%;height:1.4em;}
#statescontainer {position:absolute;top:1.7em;width:100%}
#statescontainer .yui-ac-content {position:absolute;width:100%;border:1px solid #404040;background:#fff;overflow:hidden;z-index:9050;}
#statescontainer .yui-ac-shadow {position:absolute;margin:.3em;width:100%;background:#a0a0a0;z-index:9049;}
#statescontainer ul {padding:5px 0;width:100%;}
#statescontainer li {padding:0 5px;cursor:default;white-space:nowrap;}
#statescontainer li.yui-ac-highlight {background:#ff0;}
#statescontainer li.yui-ac-prehighlight {background:#FFFFCC;}
</style>
</head>
<body>
<div id="hd">
<h1><img src="./img/logo.gif" class="logo" alt="Y!"/><a href="./">Logger Widget</a> :: Integrating with YUI Components</h1>
</div>
<div id="bd">
<!-- Intro -->
<div id="intro">
<h3>Point to Debug Builds</h3>
<p>The debug builds of YUI components call YAHOO.log() to output log messages
that can help you integrate and debug code. In this example, the debug
builds of the Event Utility and the AutoComplete Widget will output
log messages as you interact with the widget.</p>
</div>
<!-- AutoComplete begins -->
<div id="statesmod">
<form onsubmit="return YAHOO.example.AutoCompleteLogger.validateForm();">
<h3>Type a state (will output log messages):</h3>
<div id="statesautocomplete">
<input id="statesinput">
<div id="statescontainer"></div>
</div>
</form>
</div>
<!-- AutoComplete ends -->
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;script type="text/javascript" src="../../build/yahoo/yahoo.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="../../build/event/event-debug.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="../../build/dom/dom.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="../../build/animation/animation.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="../../build/autocomplete/autocomplete-debug.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="../../build/logger/logger.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
var myLogReader = new YAHOO.widget.LogReader();
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Libary begins -->
<script type="text/javascript" src="../../build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="../../build/event/event-debug.js"></script>
<script type="text/javascript" src="../../build/dom/dom.js"></script>
<script type="text/javascript" src="../../build/animation/animation.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-debug.js"></script>
<script type="text/javascript" src="../../build/logger/logger.js"></script>
<!-- Library ends -->
<!-- In-memory JS array begins-->
<script type="text/javascript">
var statesArray = [
"Alabama",
"Alaska",
"Arizona",
"Arkansas",
"California",
"Colorado",
"Connecticut",
"Delaware",
"Florida",
"Georgia",
"Hawaii",
"Idaho",
"Illinois",
"Indiana",
"Iowa",
"Kansas",
"Kentucky",
"Louisiana",
"Maine",
"Maryland",
"Massachusetts",
"Michigan",
"Minnesota",
"Mississippi",
"Missouri",
"Montana",
"Nebraska",
"Nevada",
"New Hampshire",
"New Jersey",
"New Mexico",
"New York",
"North Dakota",
"North Carolina",
"Ohio",
"Oklahoma",
"Oregon",
"Pennsylvania",
"Rhode Island",
"South Carolina",
"South Dakota",
"Tennessee",
"Texas",
"Utah",
"Vermont",
"Virginia",
"Washington",
"West Virginia",
"Wisconsin",
"Wyoming"
];
</script>
<!-- In-memory JS array ends-->
<script type="text/javascript">
YAHOO.example.AutoCompleteLogger = function() {
return {
validateForm: function() {
// Validate form inputs here
return false;
},
init: function() {
// Instantiate LogReader
var oLogReader = new YAHOO.widget.LogReader();
// Instantiate DataSource
var oACDS = new YAHOO.widget.DS_JSArray(statesArray);
// Instantiate AutoComplete
var oAutoComp = new YAHOO.widget.AutoComplete('statesinput','statescontainer', oACDS);
oAutoComp.queryDelay = 0;
oAutoComp.prehighlightClassName = "yui-ac-prehighlight";
}
};
}();
YAHOO.util.Event.addListener(this,'load',YAHOO.example.AutoCompleteLogger.init);
</script>
<script type="text/javascript" src="../assets/dpSyntaxHighlighter.js"></script>
<script type="text/javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>
</body>
</html>

419
www/extras/yui/examples/logger/logreader.html Normal file
View file

@ -0,0 +1,419 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example: Logger - Customizing LogReader UI (YUI Library)</title>
<link type="text/css" rel="stylesheet" href="../../build/reset/reset.css">
<link type="text/css" rel="stylesheet" href="../../build/fonts/fonts.css">
<link type="text/css" rel="stylesheet" href="../../build/logger/assets/logger.css">
<link type="text/css" rel="stylesheet" href="./css/examples.css">
<link type="text/css" rel="stylesheet" href="../assets/dpSyntaxHighlighter.css" />
<style type="text/css">
#styled .yui-log {font-family:verdana;}
#styled .info {background-color:blue;}
#styled .warn {background-color:green;}
#styled .error {background-color:red;}
#styled .time {background-color:orange;}
#styled .window {background-color:yellow;}
</style>
</head>
<body>
<div id="hd">
<h1><img src="./img/logo.gif" class="logo" alt="Y!"/><a href="./">Logger Widget</a> :: Customizing LogReader UI</h1>
</div>
<div id="bd">
<!-- Intro -->
<div id="intro">
<h3>Customizing LogReader</h3>
<p>The UI of LogReader can be customized via certain properties and
methods, as well as CSS classes. Please refer to the
Sample Code section for details on how to achieve the following effects.</p>
</div>
<!-- Example: Compact Output -->
<div class="example">
<div id="compact" class="container"></div>
<div class="content">
<h4>Example: Compact Ouput</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>By default, log messages are printed to the console with a good
deal of whitespace for better readability. In this example, verbose
output has been disabled so each message gets output on
a single line without wrapping.</p>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="compact"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myCompact = new YAHOO.widget.LogReader("compact", {verboseOutput:false});
myCompact.setTitle("Compact Output");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
</div>
<!-- Example: Oldest On Top -->
<div class="example">
<div id="oldestOnTop" class="container"></div>
<div class="content">
<h4>Example: Oldest On Top</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>By default, new messages get prepended at the top of the console.
In this example, new messages get appended at the bottom of the
console.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="oldestOnTop"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myOldestOnTop = new YAHOO.widget.LogReader("oldestOnTop", {newestOnTop:false});
myOldestOnTop.setTitle("Oldest On Top");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Undraggable -->
<div class="example">
<div id="undraggable" class="container"></div>
<div class="content">
<h4>Example: Undraggable</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>Although the Drag and Drop Utility is available on the page,
draggability of this LogReader has been disabled.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="undraggable"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myUndraggable = new YAHOO.widget.LogReader("undraggable", {draggable:false});
myUndraggable.setTitle("Undraggable");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Filtered -->
<div class="example">
<div id="filtered" class="container"></div>
<div class="content">
<h4>Example: Filtered Output</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>The first LogReader will show only global info messages. The
second LogReader will only show info messages coming from the
"LogReader" class.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="filtered"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myFiltered1 = new YAHOO.widget.LogReader("filtered");
var myFiltered2 = new YAHOO.widget.LogReader("filtered");
myFiltered1.hideCategory("warn");
myFiltered1.hideCategory("error");
myFiltered1.hideCategory("time");
myFiltered1.hideCategory("window");
myFiltered2.hideCategory("warn");
myFiltered2.hideCategory("error");
myFiltered2.hideCategory("time");
myFiltered2.hideCategory("window");
myFiltered1.hideSource("LogReader");
myFiltered2.hideSource("global");
myFiltered1.setTitle("Filtered LogReader: Global Messages Only");
myFiltered2.setTitle("Filtered LogReader: LogReader Messages Only");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Buffered -->
<div class="example">
<div id="buffered" class="container"></div>
<div class="content">
<h4>Example: Buffered</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>Output buffer has been increased to 3 seconds. Therefore,
messages are printed to the screen every 3 seconds.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="paused"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myBuffered = new YAHOO.widget.LogReader("buffered", {outputBuffer:3000});
myPaused.setTitle("3 Second Output Buffer");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Paused -->
<div class="example">
<div id="paused" class="container"></div>
<div class="content">
<h4>Example: Paused</h4>
<p><a href="#" id="resume">Resume this LogReader</a> | <a href="#" id="pause">Pause this LogReader</a> | <a href="#" class="logit">Log a simple message</a></p>
<p>Output has been paused.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="paused"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myPaused = new YAHOO.widget.LogReader("paused");
myPaused.pause();
myPaused.setTitle("Paused LogReader");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Collapsed -->
<div class="example">
<div id="collapsed" class="container"></div>
<div class="content">
<h4>Example: Collapsed</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>The LogReader console has been collapsed.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="collapsed"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myCollapsed = new YAHOO.widget.LogReader("collapsed");
myCollapsed.collapse();
myCollapsed.setTitle("Collapsed LogReader");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Hidden -->
<div class="example">
<div id="hidden" class="container"></div>
<div class="content">
<h4>Example: Hidden</h4>
<p><a href="#" id="show">Show this LogReader</a> | <a href="#" id="hide">Hide this LogReader</a> | <a href="#" class="logit">Log a simple message</a></p>
<p>The entire LogReader console has been hidden.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;body&gt;
&lt;div id="hidden"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myHidden = new YAHOO.widget.LogReader("hidden");
myHidden.hide();
myHidden.setTitle("Hidden LogReader");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
<!-- Example: Styled via CSS -->
<div class="example">
<div id="styled" class="container"></div>
<div class="content">
<h4>Example: Styled via CSS</h4>
<p><a href="#" class="logit">Log a simple message</a></p>
<p>The UI has been customized via CSS.</p>
</div>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
&lt;head&gt;
&lt;style type="text/css"&gt;
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div id="styled"&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
var myStyled = new YAHOO.widget.LogReader("styled");
myStyled.setTitle("Styled via CSS");
&lt;/script&gt;
&lt;/body&gt;
</textarea>
</div>
<!-- Code sample ends -->
</div>
</div>
<!-- Libary begins -->
<script type="text/javascript" src="../../build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="../../build/event/event.js"></script>
<script type="text/javascript" src="../../build/dom/dom.js"></script>
<script type="text/javascript" src="../../build/dragdrop/dragdrop.js"></script>
<script type="text/javascript" src="../../build/logger/logger.js"></script>
<!-- Library ends -->
<script type="text/javascript">
var myCompact = new YAHOO.widget.LogReader("compact", {verboseOutput:false});
myCompact.setTitle("Compact Output");
var myOldestOnTop = new YAHOO.widget.LogReader("oldestOnTop", {newestOnTop:false});
myOldestOnTop.setTitle("Oldest On Top");
var myUndraggable = new YAHOO.widget.LogReader("undraggable", {draggable:false});
myUndraggable.setTitle("Undraggable");
var myFiltered1 = new YAHOO.widget.LogReader("filtered");
var myFiltered2 = new YAHOO.widget.LogReader("filtered");
myFiltered1.hideCategory("warn");
myFiltered1.hideCategory("error");
myFiltered1.hideCategory("time");
myFiltered1.hideCategory("window");
myFiltered2.hideCategory("warn");
myFiltered2.hideCategory("error");
myFiltered2.hideCategory("time");
myFiltered2.hideCategory("window");
myFiltered1.hideSource("LogReader");
myFiltered2.hideSource("global");
myFiltered1.setTitle("Filtered LogReader: Global Messages Only");
myFiltered2.setTitle("Filtered LogReader: LogReader Messages Only");
var myBuffered = new YAHOO.widget.LogReader("buffered", {outputBuffer:3000});
myBuffered.setTitle("3 Second Ouput Buffer");
var myPaused = new YAHOO.widget.LogReader("paused");
myPaused.pause();
myPaused.setTitle("Paused LogReader");
var myCollapsed = new YAHOO.widget.LogReader("collapsed");
myCollapsed.collapse();
myCollapsed.setTitle("Collapsed LogReader");
var myHidden = new YAHOO.widget.LogReader("hidden");
myHidden.hide();
myHidden.setTitle("Hidden LogReader");
var myStyled = new YAHOO.widget.LogReader("styled");
myStyled.setTitle("Styled via CSS");
// Click to log
var clickToLog = function(e) {
YAHOO.util.Event.stopEvent(e);
YAHOO.log("This is a simple log message.");
};
var logitEls = YAHOO.util.Dom.getElementsByClassName("logit","a",YAHOO.util.Dom.get("bd"));
for(var i=0; i<logitEls.length; i++) {
YAHOO.util.Event.addListener(logitEls[i],"click",clickToLog);
}
// Click to pause
var clickToPause = function(e,LogReader) {
YAHOO.util.Event.stopEvent(e);
LogReader.pause();
};
YAHOO.util.Event.addListener(YAHOO.util.Dom.get("pause"),"click",clickToPause,myPaused);
// Click to resume
var clickToResume = function(e,LogReader) {
YAHOO.util.Event.stopEvent(e);
LogReader.resume();
};
YAHOO.util.Event.addListener(YAHOO.util.Dom.get("resume"),"click",clickToResume,myPaused);
// Click to show
var clickToShow = function(e,LogReader) {
YAHOO.util.Event.stopEvent(e);
LogReader.show();
};
YAHOO.util.Event.addListener(YAHOO.util.Dom.get("show"),"click",clickToShow,myHidden);
// Click to hide
var clickToHide = function(e,LogReader) {
YAHOO.util.Event.stopEvent(e);
LogReader.hide();
};
YAHOO.util.Event.addListener(YAHOO.util.Dom.get("hide"),"click",clickToHide,myHidden);
</script>
<script type="text/javascript" src="../assets/dpSyntaxHighlighter.js"></script>
<script type="text/javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>
</body>
</html>

177
www/extras/yui/examples/logger/logwriter.html Normal file
View file

@ -0,0 +1,177 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example: Logger - Writing Logs (YUI Library)</title>
<link type="text/css" rel="stylesheet" href="../../build/reset/reset.css">
<link type="text/css" rel="stylesheet" href="../../build/fonts/fonts.css">
<link type="text/css" rel="stylesheet" href="../../build/logger/assets/logger.css">
<link type="text/css" rel="stylesheet" href="./css/examples.css">
<link type="text/css" rel="stylesheet" href="../assets/dpSyntaxHighlighter.css" />
<style type="text/css">
.yui-log-container {position:absolute;top:1em;right:1em;}
.yui-log .mytype {background-color:#FF99CC;}
</style>
</head>
<body>
<div id="hd">
<h1><img src="./img/logo.gif" class="logo" alt="Y!"/><a href="./">Logger Widget</a> :: Writing Logs</h1>
</div>
<div id="bd">
<!-- Intro -->
<div id="intro">
<h3>Writing Logs</h3>
<p>The following examples demonstrate how to assign
different categories and sources to your log messages.</p>
</div>
<!-- Example: Global -->
<div class="example">
<div class="content">
<h4>Example: Log messages into different categories</h4>
<p>By default, unsourced log messages get assigned to a "global" bucket.</p>
<ul id="globals">
<li><a href="#" class="global info">Log an "info" message.</a></li>
<li><a href="#" class="global warn">Log a "warn" message.</a></li>
<li><a href="#" class="global error">Log an "error" message.</a></li>
<li><a href="#" class="global time">Log a "time" message.</a></li>
</ul>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
YAHOO.log("This is an \"info\" message.", "info"); // or just YAHOO.log("This is an \"info\" message.");
YAHOO.log("This is a \"warn\" message.", "warn");
YAHOO.log("This is an \"error\" message.", "error");
YAHOO.log("This is a \"time\" message.", "time");
</textarea>
</div>
<!-- Code sample ends -->
</div>
</div>
<!-- Example: Sourced -->
<div class="example">
<div class="content">
<h4>Example: Log messages into different categories and assign them
to a source called <code>myBucket</code></h4>
<p>You can assign a source to a log message by passing it in as
the third argument to <code>YAHOO.log()</code>.</p>
<ul>
<li><a href="#" class="myBucket info">Log an "info" message.</a></li>
<li><a href="#" class="myBucket warn">Log a "warn" message.</a></li>
<li><a href="#" class="myBucket error">Log an "error" message.</a></li>
<li><a href="#" class="myBucket time">Log a "time" message.</a></li>
</ul>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
YAHOO.log("This is an \"info\" message.", "info", "myBucket");
YAHOO.log("This is a \"warn\" message.", "warn", "myBucket");
YAHOO.log("This is an \"error\" message.", "error", "myBucket");
YAHOO.log("This is a \"time\" message.", "time", "myBucket");
</textarea>
</div>
<!-- Code sample ends -->
</div>
</div>
<!-- Example: Classed -->
<div class="example">
<div class="content">
<h4>Example: Create a LogWriter write log messages from a class
named <code>MyClass</code></h4>
<p>If you plan to assign many log messages to the same source (such
as from a class), it may be easier to write log messages from a
LogWriter instance.</p>
<ul>
<li><a href="#" class="MyClass info">Log an "info" message.</a></li>
<li><a href="#" class="MyClass warn">Log a "warn" message.</a></li>
<li><a href="#" class="MyClass error">Log an "error" message.</a></li>
<li><a href="#" class="MyClass time">Log a "time" message.</a></li>
</ul>
<!-- Sample code begins -->
<div class="code">
<h4>Sample Code</h4>
<textarea name="code" class="JScript" cols="60" rows="1">
var myLogWriter = new YAHOO.widget.LogWriter("MyClass");
myLogWriter.log("This is an \"info\" message.", "info"); // or just myLogWriter.log("This is an \"info\" message.");
myLogWriter.log("This is a \"warn\" message.");
myLogWriter.log("This is an \"error\" message.");
myLogWriter.log("This is a \"time\" message.");
</textarea>
</div>
<!-- Code sample ends -->
</div>
</div>
</div>
<!-- Libary begins -->
<script type="text/javascript" src="../../build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="../../build/event/event.js"></script>
<script type="text/javascript" src="../../build/dom/dom.js"></script>
<script type="text/javascript" src="../../build/dragdrop/dragdrop.js"></script>
<script type="text/javascript" src="../../build/logger/logger.js"></script>
<!-- Library ends -->
<script type="text/javascript">
var myLogReader = new YAHOO.widget.LogReader();
var myLogWriter = new YAHOO.widget.LogWriter("MyClass");
// Click to log
var clickToLog = function(e) {
YAHOO.util.Event.stopEvent(e);
var target = YAHOO.util.Event.getTarget(e);
var source = (YAHOO.util.Dom.hasClass(target, "MyClass")) ? "MyClass" : null;
if(!source) {
source = (YAHOO.util.Dom.hasClass(target, "myBucket")) ? "myBucket" : null;
if(YAHOO.util.Dom.hasClass(target, "info")) {
YAHOO.log("This is an \"info\" message.", "info", source);
}
else if(YAHOO.util.Dom.hasClass(target, "warn")) {
YAHOO.log("This is a \"warn\" message.", "warn", source);
}
else if(YAHOO.util.Dom.hasClass(target, "error")) {
YAHOO.log("This is an \"error\" message.", "error", source);
}
else if(YAHOO.util.Dom.hasClass(target, "time")) {
YAHOO.log("This is a \"time\" message.", "time", source);
}
}
else {
if(YAHOO.util.Dom.hasClass(target, "info")) {
myLogWriter.log("This is an \"info\" message.", "info");
}
else if(YAHOO.util.Dom.hasClass(target, "warn")) {
myLogWriter.log("This is a \"warn\" message.", "warn");
}
else if(YAHOO.util.Dom.hasClass(target, "error")) {
myLogWriter.log("This is an \"error\" message.", "error");
}
else if(YAHOO.util.Dom.hasClass(target, "time")) {
myLogWriter.log("This is a \"time\" message.", "time");
}
}
};
YAHOO.util.Event.addListener(YAHOO.util.Dom.get("bd"),"click",clickToLog);
</script>
<script type="text/javascript" src="../assets/dpSyntaxHighlighter.js"></script>
<script type="text/javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>
</body>
</html>