Namespaces

Variants
Actions

Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries over the next few weeks. Thanks for all your past and future contributions.

Web Runtime Widgetでログを出力する例

From Wiki
Jump to: navigation, search
Article Metadata
Code ExampleArticle
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の起動時に端末上でローカルに取り込むようにすることもできます。

  <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>
...
</head>

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に変更します。

This page was last modified on 9 December 2011, at 02:50.
220 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×