Web Runtime Widgetでログを出力する例
Article Metadata
Code Example
Source file: Media:Loggertest.zip
Article
Translated:
By fnjwikimng
Last edited: hamishwillee
(09 Dec 2011)
本ページは、Web Runtime Widgetで YUI Logger Control を使用する方法について示します。
必要なYUIのCSS、JavaScriptファイルをインクルードする
YUIファイルの依存関係については、こちらで確認することができます: [1]
WidgetのHTMLファイル中で以下のように定義して、必要なYUIサーバー側のLogger Controlファイルを取り込むようにします。
<head>
<!-- css -->
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.1/build/logger/assets/skins/sam/logger.css">
<!-- js -->
<script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/logger/logger-min.js"></script>
...
</head>
代わりに、必要なファイルをWidgetバンドルにコピーし、Widgetの起動時に端末上でローカルに取り込むようにすることもできます。
YUIのライセンスについては、各自確認しておいてください。
JavaScript、HTML中でログ出力機構(Logger)を使用する
操作手順の詳細については、YUI Logger Control ドキュメント をご覧ください。
下記サンプルコードは、HTMLページ上でLogger Controlのコンテナを生成し、画面上にハードコードでのログ出力を行います。
window.onload = init;
var myLogReader;
var myConfigs = {
width: "230px",
height: "30em",
newestOnTop: true,
footerEnabled: false
};
// Initializes the widget
function init() {
var myContainer = document.body.appendChild(document.createElement("div"));
myLogReader = new YAHOO.widget.LogReader(myContainer);
}
function logMsg() {
YAHOO.log("hello there");
}
上記JavaScriptを使用した全HTMLソースは、以下の通りです。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- css -->
<link rel="stylesheet" type="text/css" href="./YUI/logger.css">
<!-- js -->
<script type="text/javascript" src="./YUI/yahoo-dom-event.js"></script>
<script type="text/javascript" src="./YUI/logger-min.js"></script>
<script type="text/javascript" src="script.js" /></script>
<title>YUI Logger Example</title>
</head>
<body>
<br><a href="#" onclick="logMsg();">log</a><br>
</body>
</html>
パッケージのインストール・動作可能な端末について
本ページのデモWidgetは、 Web Runtimeに対応した端末で動作します。
また、端末にインストールする前に、ファイルの拡張子を.wgzに変更します。
(no comments yet)