<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Cyberpunk &#187; AJAX Framework</title>
	<atom:link href="http://punk.tw/category/computer/programming/ajax/ajax-framework/feed" rel="self" type="application/rss+xml" />
	<link>http://punk.tw</link>
	<description>網際叛客：學習心得、Web 2.0與網路觀察、Google應用與技術、Ruby on Rails, Google App Engine</description>
	<lastBuildDate>Tue, 07 Feb 2012 08:42:21 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>jq4r: jQuery on Rails</title>
		<link>http://punk.tw/2007/09/20/jq4r-jquery-on-rails</link>
		<comments>http://punk.tw/2007/09/20/jq4r-jquery-on-rails#comments</comments>
		<pubDate>Thu, 20 Sep 2007 13:04:51 +0000</pubDate>
		<dc:creator>deduce</dc:creator>
				<category><![CDATA[AJAX Framework]]></category>
		<category><![CDATA[Ruby on Rails]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://punk.tw/2007/09/20/259.html</guid>
		<description><![CDATA[ericksk說：「既然找不到別人寫的，那就自己寫吧！」，因此他寫了一套jq4r，全名叫jQuery helpers for Rails。真是頗吸引我的，之前用過一陣子的jQuery，感覺還滿好用的，最近不但推出新版還搞了一套jQuery UI，之前在某個日文網站看到的評論稱之為「jQuery's Scriptaculous」。 anyway，ericsk的文章在此：jq4r - jQuery helpers for Rails 他另外開了一個blog及google code project專門來放jq4r： jq4r project: http://jq4r.googlecode.com/ jq4r blog: http://jq4r.blogspot.com/]]></description>
			<content:encoded><![CDATA[<p><a href="http://blog.ericsk.org/">ericksk</a>說：「既然找不到別人寫的，那就自己寫吧！」，因此他寫了一套jq4r，全名叫jQuery helpers for Rails。真是頗吸引我的，之前用過一陣子的jQuery，感覺還滿好用的，最近不但推出新版還搞了一套jQuery UI，之前在某個日文網站看到的評論稱之為「jQuery's Scriptaculous」。</p>
<p>anyway，ericsk的文章在此：<a href="http://blog.ericsk.org/archives/767">jq4r - jQuery helpers for Rails</a></p>
<p>他另外開了一個blog及google code project專門來放jq4r：</p>
<ul>
<li>jq4r project: <a href="http://jq4r.googlecode.com/">http://jq4r.googlecode.com/</a> </li>
<li>jq4r blog: <a href="http://jq4r.blogspot.com/">http://jq4r.blogspot.com/</a> </li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://punk.tw/2007/09/20/jq4r-jquery-on-rails/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery Plugins</title>
		<link>http://punk.tw/2007/09/17/jquery-plugins</link>
		<comments>http://punk.tw/2007/09/17/jquery-plugins#comments</comments>
		<pubDate>Mon, 17 Sep 2007 06:26:26 +0000</pubDate>
		<dc:creator>deduce</dc:creator>
				<category><![CDATA[AJAX Framework]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://punk.tw/2007/09/17/244.html</guid>
		<description><![CDATA[剛剛看到「jQueryのプラグイン33+1選」列出了一堆jQuery製作出來的網頁效果，我才發現原來jQuery有這麼多好用的外掛，之前只用過我覺得還滿方便的ThickBox（ThickBox簡單來說就是透過jQuery做出來的LightBox效果）。 另外還有這個Tab看起來也是滿簡單好用的，對於我這種懶人而言實在是相當方便:D jQuery：jQuery- The Write Less, Do More JavaScript Library jQuery的Plugins：http://docs.jquery.com/Plugins]]></description>
			<content:encoded><![CDATA[<p>剛剛看到「<a href="http://coliss.com/articles/build-websites/operation/javascript/356.html">jQueryのプラグイン33+1選</a>」列出了一堆jQuery製作出來的網頁效果，我才發現原來jQuery有這麼多好用的外掛，之前只用過我覺得還滿方便的<a href="http://jquery.com/demo/thickbox/">ThickBox</a>（ThickBox簡單來說就是透過jQuery做出來的<a href="http://www.huddletogether.com/projects/lightbox/">LightBox</a>效果）。</p>
<p>另外還有<a href="http://www.stilbuero.de/2007/02/05/tabs-plugin-update-support-for-unobtrusive-ajax/">這個Tab</a>看起來也是滿簡單好用的，對於我這種懶人而言實在是相當方便:D</p>
<p>jQuery：<a title="jQuery- The Write Less, Do More JavaScript Library" href="http://jquery.com/">jQuery- The Write Less, Do More JavaScript Library</a></p>
<p>jQuery的Plugins：<a title="http://docs.jquery.com/Plugins" href="http://docs.jquery.com/Plugins">http://docs.jquery.com/Plugins</a></p>
]]></content:encoded>
			<wfw:commentRss>http://punk.tw/2007/09/17/jquery-plugins/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Dojo Offline Toolkit迎接離線網路應用程式時代來臨</title>
		<link>http://punk.tw/2007/04/25/dojo-offline-toolkit%e8%bf%8e%e6%8e%a5%e9%9b%a2%e7%b7%9a%e7%b6%b2%e8%b7%af%e6%87%89%e7%94%a8%e7%a8%8b%e5%bc%8f%e6%99%82%e4%bb%a3%e4%be%86%e8%87%a8</link>
		<comments>http://punk.tw/2007/04/25/dojo-offline-toolkit%e8%bf%8e%e6%8e%a5%e9%9b%a2%e7%b7%9a%e7%b6%b2%e8%b7%af%e6%87%89%e7%94%a8%e7%a8%8b%e5%bc%8f%e6%99%82%e4%bb%a3%e4%be%86%e8%87%a8#comments</comments>
		<pubDate>Wed, 25 Apr 2007 11:25:05 +0000</pubDate>
		<dc:creator>deduce</dc:creator>
				<category><![CDATA[AJAX Framework]]></category>

		<guid isPermaLink="false">http://punk.tw/2007/04/25/dojo-offline-toolkit%e8%bf%8e%e6%8e%a5%e9%9b%a2%e7%b7%9a%e7%b6%b2%e8%b7%af%e6%87%89%e7%94%a8%e7%a8%8b%e5%bc%8f%e6%99%82%e4%bb%a3%e4%be%86%e8%87%a8/</guid>
		<description><![CDATA[剛剛在Ajaxian上看到這篇「Dojo Offline Toolkit Beta Released」，沒想到不久前才在思考的有趣議題「離線網路應用程式」如今實現了。雖然還沒有把這個Dojo offline toolkit抓下來玩，不過光用想像的，支援離線應用的話，未來網站的開發將會具有更大的發展彈性。雖然現在無線網路普及度很高，加上3G/3.5G(HSDPA)的發展，大家的眼光、願景應該要朝著網路無所不在（ubiquitous）的方向思考才是，但事實上我們現在還是經常有機會處於完全找不到網路節點的環境，因此離線應用還是有其價值所在啦！就像我習慣用離線的blogging工具就是可以隨時打篇文章、紀錄生活，等到有網路的時候再publish即可。 廢話講了一大堆，還是稍微來翻譯一下Dojo Offline Toolkit的網頁，讓懶得看英文的朋友可以更快瞭解這個Dojo Offline Toolkit有什麼搞頭。（翻得太爛還請多指教orz「信雅達」的原則以我的能力來說恐怕相當不足。） Dojo Offline Toolkit網址：http://dojotoolkit.org/offline Dojo Offline Toolkit Dojo Offline是個免費、開放原始碼的開發工具，可以輕鬆地讓網站應用程式（web application）離線運作。Dojo Offline主要由兩個部份組成，1. 一個與網站綁在一起的JavaScript函式庫, 2. 一個僅有300K大小的跨平台、跨瀏覽器的安裝套件，它會在使用者端建立一份網站使用介面的離線快取。 Dojo Offline是... Small輕巧User端需要下載的程式僅300K大小，只花您一分鐘的時間即可下載。 Easy易於使用Dojo Offline處理了繁雜的工作，所以您可以專注於網站的開發。Dojo Offline提供工具讓您建立離線的使用者介面，並有處理資料同步的機制，確保您的資料可以持續地儲存。 Open開放100%開放原始碼，BSD License. Focused專注Dojo Offline不會幫您的地板打蠟（按：意指Dojo Offline不是拿來讓網站變漂亮用的），但Dojo Offline真的把一件事做得很好：讓你現有的網站可以離線使用。 Supported支援這段不太想寫，反正就是遇到問題他們有提供求援管道=.= http://www.sitepen.com/offline Demo http://codinginparadise.org/projects/dojo_offline/working/demos/offline/moxie/editor.html Documentation說明文件 Creating Offline Web Applications That Work in the Browser [video lecture] Hello World [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://punk.tw/wp-content/uploads/images/DojoOfflineToolkit_10B98/image02.png" atomicselection="true"><img src="http://punk.tw/wp-content/uploads/images/DojoOfflineToolkit_10B98/image0_thumb.png"></a> </p>
<p>剛剛在<a href="http://ajaxian.com">Ajaxian</a>上看到這篇「<a href="http://ajaxian.com/archives/dojo-offline-toolkit-beta-released">Dojo Offline Toolkit Beta Released</a>」，沒想到不久前才在思考的有趣議題「離線網路應用程式」如今實現了。雖然還沒有把這個Dojo offline toolkit抓下來玩，不過光用想像的，支援離線應用的話，未來網站的開發將會具有更大的發展彈性。雖然現在無線網路普及度很高，加上3G/3.5G(HSDPA)的發展，大家的眼光、願景應該要朝著網路無所不在（ubiquitous）的方向思考才是，但事實上我們現在還是經常有機會處於完全找不到網路節點的環境，因此離線應用還是有其價值所在啦！就像我習慣用離線的blogging工具就是可以隨時打篇文章、紀錄生活，等到有網路的時候再publish即可。</p>
<p>廢話講了一大堆，還是稍微來翻譯一下Dojo Offline Toolkit的網頁，讓懶得看英文的朋友可以更快瞭解這個Dojo Offline Toolkit有什麼搞頭。（翻得太爛還請多指教orz「信雅達」的原則以我的能力來說恐怕相當不足。）</p>
<p>Dojo Offline Toolkit網址：<a title="http://dojotoolkit.org/offline" href="http://dojotoolkit.org/offline">http://dojotoolkit.org/offline</a></p>
<h1>Dojo Offline Toolkit</h1>
<p>Dojo Offline是個免費、開放原始碼的開發工具，可以輕鬆地讓網站應用程式（web application）離線運作。Dojo Offline主要由兩個部份組成，1. 一個與網站綁在一起的JavaScript函式庫, 2. 一個僅有300K大小的跨平台、跨瀏覽器的安裝套件，它會在使用者端建立一份網站使用介面的離線快取。</p>
<h1>Dojo Offline是...</h1>
<ul>
<li>Small輕巧<br />User端需要下載的程式僅300K大小，只花您一分鐘的時間即可下載。</li>
<li>Easy易於使用<br />Dojo Offline處理了繁雜的工作，所以您可以專注於網站的開發。Dojo Offline提供工具讓您建立離線的使用者介面，並有處理資料同步的機制，確保您的資料可以持續地儲存。</li>
<li>Open開放<br />100%開放原始碼，BSD License.</li>
<li>Focused專注<br />Dojo Offline不會幫您的地板打蠟（按：意指Dojo Offline不是拿來讓網站變漂亮用的），但Dojo Offline真的把一件事做得很好：讓你現有的網站可以離線使用。</li>
<li>Supported支援<br />這段不太想寫，反正就是遇到問題他們有提供求援管道=.= <a title="http://www.sitepen.com/offline" href="http://www.sitepen.com/offline">http://www.sitepen.com/offline</a></li>
</ul>
<h1>Demo</h1>
<p><a title="http://codinginparadise.org/projects/dojo_offline/working/demos/offline/moxie/editor.html" href="http://codinginparadise.org/projects/dojo_offline/working/demos/offline/moxie/editor.html">http://codinginparadise.org/projects/dojo_offline/working/demos/offline/moxie/editor.html</a></p>
<h1>Documentation說明文件</h1>
<ul>
<li><a href="http://video.yahoo.com/video/play?vid=427145">Creating Offline Web Applications That Work in the Browser</a> [video lecture]
<li><a href="http://codinginparadise.org/projects/dojo_offline/working/demos/offline/helloworld/helloworld.html">Hello World Example</a>
<li><a href="http://codinginparadise.org/projects/dojo_offline/working/src/dot/howtoServerConfig.html">How to Configure Your Web Server For Dojo Offline Applications</a>
<li><a href="http://codinginparadise.org/projects/dojo_offline/working/demos/offline/moxie/server/README">How to Build Moxie's Server-Side Portion</a> (Moxie is an example Dojo Offline app bundled with the SDK)
<li><a href="http://dojotoolkit.org/node/115">Dojo Storage Documentation</a>
<li><a href="http://dojotoolkit.org/files/dojoOfflineDebugHints.html">Debug Hints for Dojo Offline Developers</a>
<li><a href="http://dojotoolkit.org/files/manualUninstall.html">How to Manually Uninstall Dojo Offline Runtime</a></li>
</ul>
<h1>教學影片</h1>
<p><a title="http://video.yahoo.com/video/play?vid=427145" href="http://video.yahoo.com/video/play?vid=427145">http://video.yahoo.com/video/play?vid=427145</a></p>
<p>這個教學影片長達59分52秒，實在有點懶得看，有空再來看好了orz</p>
]]></content:encoded>
			<wfw:commentRss>http://punk.tw/2007/04/25/dojo-offline-toolkit%e8%bf%8e%e6%8e%a5%e9%9b%a2%e7%b7%9a%e7%b6%b2%e8%b7%af%e6%87%89%e7%94%a8%e7%a8%8b%e5%bc%8f%e6%99%82%e4%bb%a3%e4%be%86%e8%87%a8/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Prototype Window Class</title>
		<link>http://punk.tw/2006/12/20/prototype-window-class</link>
		<comments>http://punk.tw/2006/12/20/prototype-window-class#comments</comments>
		<pubDate>Wed, 20 Dec 2006 12:54:49 +0000</pubDate>
		<dc:creator>deduce</dc:creator>
				<category><![CDATA[AJAX Framework]]></category>
		<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://punk.tw/2006/12/20/prototype-window-class/</guid>
		<description><![CDATA[&#160; Prototype Window Class：http://prototype-window.xilinus.com/ 昨天亂逛到的一個AJAX Framework，主要訴求是希望讓Web開發者透過Prototype Window Class便可以輕鬆地在網頁上產生各式各樣的視窗（Window or Windows）。 比較吸引我的是Prototype Window Class的文件很完整，使用起來應該不會有太大困難，再加上Sample網頁有幾個範例很吸引我，像是登入視窗的特效，很簡單就可以做出類似HEMiDEMi或是Netvibes的登入效果，對我這種懶人而言，不需要多研究什麼東西就可以完成一件事情是多麼美好的事情！（稍微翻譯一下它的首頁好了orz，沒什麼技術能力可以充實內容，只好靠英文字典了XD） Overview 根據Prototype Window Class首頁的說法，它是以Prototype為基礎開發出來的，同時是「inspired by the powerful script.aclou.us」（這個說法很酷，之前有聽到script.aclou.us是Driven and Inspired by Ruby on Rails，這麼推演的話，RoR真的是非常偉大！），目前已經在Safari, Camino, Firefox以及IE6等瀏覽器上測試過。 Features特色 Prototype Window Class所產生的code都是 Valid HTML/XHTML 可調整大小的視窗 支援最大化、最小化視窗（Maximize/Minimize） Modal dialogs（看不懂，大概就是可以產生「確認、取消」之類的對話視窗） 各種視覺效果 可更換Skin How to Use使用方式 首先在網頁上插入以下程式碼，最後一行是Themes的設定，要更換視窗風格只要修改此行即可： [js] [/js] 接下來是進行宣告視窗的動作： [js] win = new Window('window_id', {className: "mac_os_x", [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://prototype-window.xilinus.com/"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="76" src="http://punk.tw/wp-content/uploads/2006/12/WindowsLiveWriter/PrototypeWindowClass_120CE/image%7B0%7D_thumb%5B4%5D6.png" width="356" border="0"></a>&nbsp;</p>
<p>Prototype Window Class：<a href="http://prototype-window.xilinus.com/">http://prototype-window.xilinus.com/</a></p>
<p>昨天亂逛到的一個AJAX Framework，主要訴求是希望讓Web開發者透過Prototype Window Class便可以輕鬆地在網頁上產生各式各樣的視窗（Window or Windows）。</p>
<p>比較吸引我的是Prototype Window Class的文件很完整，使用起來應該不會有太大困難，再加上<a href="http://prototype-window.xilinus.com/samples.html">Sample網頁</a>有幾個範例很吸引我，像是登入視窗的特效，很簡單就可以做出類似HEMiDEMi或是Netvibes的登入效果，對我這種懶人而言，不需要多研究什麼東西就可以完成一件事情是多麼美好的事情！<br />（稍微翻譯一下它的<a href="http://prototype-window.xilinus.com/index.html">首頁</a>好了orz，沒什麼技術能力可以充實內容，只好靠英文字典了XD）</p>
<h1>Overview</h1>
<p>根據Prototype Window Class首頁的說法，它是以<a href="http://prototype.conio.net/">Prototype</a>為基礎開發出來的，同時是「inspired by the powerful <a href="http://script.aculo.us/">script.aclou.us</a>」（這個說法很酷，之前有聽到script.aclou.us是Driven and Inspired by Ruby on Rails，這麼推演的話，RoR真的是非常偉大！），目前已經在Safari, Camino, Firefox以及IE6等瀏覽器上測試過。</p>
<h1>Features特色</h1>
<ul>
<li>Prototype Window Class所產生的code都是 Valid HTML/XHTML
<li>可調整大小的視窗
<li>支援最大化、最小化視窗（Maximize/Minimize）
<li>Modal dialogs（看不懂，大概就是可以產生「確認、取消」之類的對話視窗）
<li>各種視覺效果
<li>可更換Skin</li>
</ul>
<h1>How to Use使用方式</h1>
<p>首先在網頁上插入以下程式碼，最後一行是Themes的設定，要更換視窗風格只要修改此行即可：</p>
<pre>[js]
<script src="/javascripts/prototype.js" type="text/javascript"> </script>
<script src="/javascripts/window.js" type="text/javascript"> </script>
<link href="/stylesheets/themes/default.css" type="text/css" rel="stylesheet"></link>
<!-- Add this to have a specific theme-->
<link href="themes/mac_os_x.css" type="text/css" rel="stylesheet"></link>[/js] </pre>
<p>接下來是進行宣告視窗的動作：</p>
<pre>[js]
win = new Window('window_id', {className: "mac_os_x", title: "Sample", width:200, height:150});
win.getContent().innerHTML = "
<h1>Hello world !!</h1>

";
win.setDestroyOnClose();
win.showCenter(); [/js]</pre>
<p>如果在官網上，程式碼下面就有Test it可以馬上看到效果，在此放張截圖：</p>
<p><a href="http://punk.tw/wp-content/uploads/2006/12/WindowsLiveWriter/PrototypeWindowClass_120CE/image%7B0%7D%5B9%5D6.png" atomicselection="true"><img style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" height="269" src="http://punk.tw/wp-content/uploads/2006/12/WindowsLiveWriter/PrototypeWindowClass_120CE/image%7B0%7D_thumb%5B5%5D6.png" width="325" border="0"></a></p>
]]></content:encoded>
			<wfw:commentRss>http://punk.tw/2006/12/20/prototype-window-class/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Adobe AJAX Framework: Spry</title>
		<link>http://punk.tw/2006/10/19/adobe-ajax-framework-spry</link>
		<comments>http://punk.tw/2006/10/19/adobe-ajax-framework-spry#comments</comments>
		<pubDate>Thu, 19 Oct 2006 08:39:12 +0000</pubDate>
		<dc:creator>deduce</dc:creator>
				<category><![CDATA[AJAX Framework]]></category>

		<guid isPermaLink="false">http://punk.tw/2006/10/19/adobe-ajax-framework-spry/</guid>
		<description><![CDATA[Spry framework for Ajaxhttp://labs.adobe.com/technologies/spry/ Demo: Photo Gallery—An XML-based photo gallery. Product Table—An interactive data grid displaying XML-based data. RSS Reader—An RSS reader showing how multiple XML files can be used to build a rich interface. Effects Demo—A series of sample effects. 效果不錯，使用方式也很簡單。]]></description>
			<content:encoded><![CDATA[<p>Spry framework for Ajax<br /><a href="http://labs.adobe.com/technologies/spry/">http://labs.adobe.com/technologies/spry/</a></p>
<p>Demo:</p>
<li><a href="http://labs.adobe.com/technologies/spry/demos/gallery/">Photo Gallery</a>—An XML-based photo gallery.
<li><a href="http://labs.adobe.com/technologies/spry/demos/products/">Product Table</a>—An interactive data grid displaying XML-based data.
<li><a href="http://labs.adobe.com/technologies/spry/demos/rssreader/">RSS Reader</a>—An RSS reader showing how multiple XML files can be used to build a rich interface.
<li><a href="http://labs.adobe.com/technologies/spry/demos/effects/">Effects Demo</a>—A series of sample effects.</li>
<p>效果不錯，使用方式也很簡單。</p>
]]></content:encoded>
			<wfw:commentRss>http://punk.tw/2006/10/19/adobe-ajax-framework-spry/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

