DigiTechLog Dot Com » Ajax/JavaScript http://digitechlog.com Adobe AIR、Flex、Flash、Java Tue, 08 Nov 2011 12:46:29 +0000 http://wordpress.org/?v=2.8 ja hourly 1 OpenLaszlo: Ajax/Flashで動作するリッチインターネットアプリケーションの開発及び配布を行うためのオープンソースプラットフォーム http://digitechlog.com/2009/10/08/openlaszlo-open-source-platform-for-rich-web-applications.html http://digitechlog.com/2009/10/08/openlaszlo-open-source-platform-for-rich-web-applications.html#comments Thu, 08 Oct 2009 13:02:35 +0000 admin http://digitechlog.com/2009/10/08/openlaszlo-open-source-platform-for-rich-web-applications.html OpenLaszloとは、Laszlo Systems社が開発され、Web ブラウザ上でAjax/Flashで動作するリッチインターネットアプリケーションの開発及び配布を行うため、オープンソースプラットフォームです。オープンソースですから、誰でも無料で使うことができます。

以下のような特徴があります。

  • オープンソース
  • ライセンスは CPL ( Common Public License )
  • バージョン 4.0 からは従来の Flash コンテンツだけでなく、 Ajax と DHTML による動的コンテンツを同一のソースコードから生成することができる
  • XML ベースのオブジェクト指向型言語でソースコードを記述する
  • 日本では Laszlo Japan などのコミュニティが活動を行っている

openlaszlo

●OpenLaszloのHello World

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <canvas>
  3.   <text>Hello World</text>
  4. </canvas>

簡単でしょう？！残念ですが、現実問題として、OpenLaszloという名前を聞いたことのあるＩＴ関係者はほとんどいないようです。最近は少し増やしているらしい。

●OpenLaszlo サーバのインストール

OpenLaszloとサーバーサイド連携は、XMLデータでやり取りを行います。

・前準備として、バージョン 1.4 以上の Java SDKが必要です。

・次のURLから（http://www.openlaszlo.org/download）、インストーラをダウンロードします。Windows 、 MacOS 、 Linuxなどプラットフォームが対応されています。

・インストーラを実行すると、自動的にインストールが始まります。

ここまでサーバのインストールは終りました。

「スタート」メニューから、「 OpenLaszlo Server 」-「 OpenLaszlo Explorer 」を選んで、コマンドプロンプトから Tomcat が立ち上がり、ブラウザに OpenLaszlo Explorer が表示されます。それを利用して、チュートリアルやデモアプリケーションを実行することができます。

●開発環境

http://www.atmarkit.co.jp/fwcr/rensai/laszlo_adv01/laszlo_adv01_1.htmlを参考して、EclipseにOpenLaszlo用のプラグインをインストールして、間発環境を作れますので、ここではこの説明を省略いたします。

【関連リンク】

http://www.openlaszlo.org/ 公式サイト

Related Posts

]]> http://digitechlog.com/2009/10/08/openlaszlo-open-source-platform-for-rich-web-applications.html/feed 0 ５行ソースコードでHTML, CSS, AJAXの解析能力があるブラウザを作ろう http://digitechlog.com/2009/01/04/5-link-source-code-to-build-your-browse-support-html-css-ajax-in-adobe-air.html http://digitechlog.com/2009/01/04/5-link-source-code-to-build-your-browse-support-html-css-ajax-in-adobe-air.html#comments Sun, 04 Jan 2009 09:07:25 +0000 admin http://digitechlog.com/2009/01/04/5-link-source-code-to-build-your-browse-support-html-css-ajax-in-adobe-air.html 昔の昔の昔…、VBの時代、Windows　OS環境だったら、VBでIEのようなブラウザを作成するのは、すっごく簡単ですよね。同じのような、Adobe　AIRがブラウザエンジンにWebKitを採用したことを気が付いたので、Googleで検索してサンプルやドキュメントを見ながら作ってみました。

注意しなければいけないものは、ブラウザスクリプトの設定は何もしていないので、文字化けを発生している可能性があります。

具体的な環境設定とか、アイコンファイルの配置とか、AIRファイルの作成とかは本文最後の「参考リソース」のURLを参照してください。以下は簡単なswfファイルを作成するソースコードだけをメモします。

下記のような「browser.mxml」というソースファイルを作ります。

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
  3.     <mx:Label text="Please enter your URL and hit &quot;enter&quot;"/>
  4.     <mx:TextInput id="URLtext" width="100%" enter="HTML.location=URLtext.text"/>
  5.     <mx:HTML id="HTML" location="http://www.google.com/ig" width="100%" />  
  6. </mx:WindowedApplication>
フルプロジェクトはここをクリックしてダウンロード出来ます。

参考リソース：

http://blog.codezine.jp/editor/2007/06/adobe_air_1.php

Related Posts

]]> http://digitechlog.com/2009/01/04/5-link-source-code-to-build-your-browse-support-html-css-ajax-in-adobe-air.html/feed 0 JavaServer Faces(JSF) 2.0中にAjaxを利用するサンプルソースコード http://digitechlog.com/2008/11/06/a-simple-example-of-the-ajax-support-in-javaserver-faces-jsf-20.html http://digitechlog.com/2008/11/06/a-simple-example-of-the-ajax-support-in-javaserver-faces-jsf-20.html#comments Thu, 06 Nov 2008 04:22:04 +0000 admin http://digitechlog.com/2008/11/06/a-simple-example-of-the-ajax-support-in-javaserver-faces-jsf-20.html JavaServer Faces (JSF) はJavaベースの Webアプリケーションフレームワーク であり、Java EEアプリケーションのユーザーインターフェイスの開発を簡単にする。表示技術として使用するが、JSFはXULなどの他の表示技術を利用することもできる。

Ajax（エイジャックス、アジャックス）は、ウェブブラウザ内で非同期通信とインターフェイスの構築などを行う技術の総称。XMLHttpRequest（HTTP通信を行うためのJavaScript組み込みクラス）による非同期通信を利用し、通信結果に応じてダイナミックHTMLで動的にページの一部を書き換えるというアプローチを取る。

最近、Web 2.0の発展にしたがって、Ajaxも広くてよく使われている。もともとWeb上で実現できない操作も、Ajaxを利用して素敵な実現できた。下記はJSF中にAjaxを利用するサンプルである。

まずは、下記のようなJSFソース：

  1. import javax.faces.event.ActionEvent;
  2. import javax.faces.model.ManagedBean;
  3. import javax.faces.model.SessionScoped;
  4.  
  5. @ManagedBean(name = "count")
  6. @SessionScoped
  7. public class Count {
  8.     Integer count = 0;
  9.  
  10.     public Integer getCount() {
  11.         return count++;
  12.     }
  13.  
  14.     public void reset(ActionEvent ae) {
  15.         count = 0;
  16.     }
  17. }

下記はフェイス部分のサンプルソース：

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" 
  4.       xmlns:h="http://java.sun.com/jsf/html">
  5. <h:head>
  6.     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
  7.     <title>Ajax</title>
  8. </h:head>
  9. <h:body>
  10.     <h:form id="form1" prependId="false">
  11.         <h:outputScript name="ajax.js" library="javax.faces" target="head"/>
  12.         <h:outputText id="out1" value="#{count.count}"/>
  13.         <br/>
  14.         <!-- Increment the counter on the server, and the client -->
  15.         <h:commandButton id="button1" value="Count"
  16.                          onclick="javax.faces.Ajax.ajaxRequest(this, event, {execute: this.id, render: 'out1'}); return false;"/>
  17.         <br/>
  18.         <!-- Resets the counter -->
  19.         <h:commandButton id="reset" value="reset"
  20.                             onclick="javax.faces.Ajax.ajaxRequest(this, event, {execute:'reset', render: 'out1'}); return false;"
  21.                             actionListener="#{count.reset}"/>
  22.     </h:form>
  23. </h:body>
  24. </html>

Related Posts

]]> http://digitechlog.com/2008/11/06/a-simple-example-of-the-ajax-support-in-javaserver-faces-jsf-20.html/feed 0