心得文又來囉!
原文在這邊:http://hanamitsuki.com/cms/horizontal-path-to-oss/
-------------------
話說回來,我到底是在忙什麼?又是被什麼打斷呢?看了一堆簡體中文,感覺頭腦都頓頓的(無不敬之意)。還是來回想一下吧!
開頭是javascript
一開始我是在我的RSS閱讀器看到javascript的效果介紹文章,然後我就連到他的網站,翻看javascript相關文章。因為除了php的Open Source CMS之外,javascript framework似乎也正進行著一疊疊的亂戰呢!
而且,我最喜歡的「核心+外掛」這模式看起來也在javascript framework的世界上演,所以我一直很想努力鑽研這部分。所以就先去翻文章了。
註:核心+外掛的例子:Firefox、Wordpress、Nuendo、Drupal、Joomla都是這樣獲取我芳心,甚至Photoshop的Blush也是
所以開頭是javascript。
JQuery
然後我發現framework裡面,好像JQuery很有名,但是Joomla是用一個叫做mootools的,而Joomla又有許多漂亮效果,所以我就一直找呀找,發現JQuery的外掛不能用在mootools底下(廢話),才發現這兩個東西原來不能並存!真有趣(哪裡有趣)!
所以目前我的看法是mootools的漸變動態效果比較漂亮,JQuery可能比較輕量吧!總之JQuery應該是比較有名。
然後Joomla內建的是mootools,Drupal內建的是JQuery,真的各有各的風格。
NiceJForms
然後我發現一個需要JQuery的表單美化工具,我對JQuery還非常不懂,所以不知這算不算是JQuery的外掛。總之,這個表單美化工具叫做NiceJForms,他的效果可以到達這樣的地步。
會不會太美了一點。(會有這種讚嘆,還真宅!)
所以從javascript的探索,我找到了NiceJForms。
Drupal Form API
然後我想起來前兩個星期開始學Drupal的Form API,我怎麼用CSS美化,表單都還是普普通通。雖然簡單方便就好,但我突然一股腦很想把javascript應用的技能學起來,所以不管目前Drupal的白老鼠網站的bug多到爆炸,我還是逕自測試起NiceJForm套到Drupal表單的方式。
所以從NiceJForms,我又跑到了Drupal Form API身上。
應該很簡單,按表操課就對了,NiceJForms的說明很簡單易懂,只要插入這些那些這些就好。所以,我打開特別用Drupal為某表單定製的template之後,打入
drupal_add_js(path_to_subtheme() .'/js/nicejforms.js');
drupal_add_css(path_to_subtheme() .'/css/niceforms-green.css');
這是Drupal內建的API,非常非常方便好用。想在這邊插入css,想在那邊插入javascript,都只需要一行字。
不過接下來,第三步驟是要在Form標籤加上class。聽起來很簡單,但是,Drupal的模板可怕的就是都要用Drupal的寫法,不用他的寫法,就等著死吧!所以直接硬是加個form標籤再加上class,是下下之策,既然都到別人家了,就乖乖用他的方法吧!
然後我寫了這兩種方式
$form['#attributes']['class'] = 'niceform';
$form['#attributes'] = array('class' => 'niceform');
都完全沒屁用,連print_r輸出的內容,都看不到#attributes有多個class,然後我憤怒之下,跑到template.php,找到定義這個表單模板的function
<?php
function phptemplate_buytogether_node_form($form) {
global $user;
$vars = array('user' => $user, 'form' => $form);
return _phptemplate_callback('buytogether_form', $vars);
}
?>
我先試著在return前面加上$form['#attributes']['class'] = 'niceform';,結果行不通,然後我又試著在$vars前面加看看,結果,print_r的#attributes就出現class這個東西了。
問題是,render之後的form仍舊沒有class,這到底是怎麼回事?
所以我就跑來部落格呼喊了。最後我鑽牛角尖的地方變成是Drupal的form到底怎麼插入class,回想到我的初衷,只不過是想用用看NiceJForms嘛!
然後有個心得,就是本文標題,我發現我的學習路徑,都是橫向的,我沒辦法畫出來,但我真的覺得我像毛毛蟲一樣,沒有先把一樣東西學會,就跑去學下一樣東西,一開始我都覺得這樣不太好,但我後來想想,既然只有這種方式能夠讓我有一頭熱的熱情繼續鑽研下去,那就這樣吧!
最後,我想問的是,Open Source為何大家都簡稱OSS?為何有兩個S呢?
Re:
剛剛回了另外一篇
到這邊才看到是這種需求
建議是做一個小模組 (不知道你對模組開發的熟悉度如何...)
裡面寫一個 form_alter 就可以改到所有表單
1.建立一個 nicejforms 的資料夾
2.把 nicejforms.js 和 niceforms-green.css 放到 nicejforms 資料夾內
3.在 nicejforms 資料夾內建立 nicejforms.info 檔案,輸入下面的內容
; $Id$
name = "NiceJForms"
description = "表單美化工具 NiceJForms"
version = "5.x-0.1"
4.在 nicejforms 資料夾內建立 nicejforms.module檔案,輸入下面的程式碼
<?php
function nicejforms_form_alter($form_id, &$form){
drupal_add_js(drupal_get_path('module', 'nicejforms') .'/nicejforms.js');
drupal_add_css(rupal_get_path('module', 'nicejforms') .'/niceforms-green.css');
$form['#attributes']['class'] .= ' niceform';
//這邊是用字串相加的方式 因為 attributes 底下的屬性並不會自動累加 也不會處理陣列資料
//當遇到其他的表單也設定 $form['#attributes']['class'] = 'xxx'; 的時候會出現設定被覆蓋 結果只剩下一個 class的情形
}
?>
然後丟到 sites/all/modules 底下
去模組設定裡啟用該模組就行了
Re: 橫向發展的Open Source學習路徑
NiceJform對ie6的支援,意外的好.. :)
好物,推一下
若對做一個輕量級的jquery模組有興趣,可以看看我實做過的
http://drupal.org/project/popup_msg
或是印象中,有一個 plugin_manager for d6.
--
from open mind to open source~
Re:
OSS
Open Source System
Open Source Software
共存方法:
http://docs.jquery.com/Using_jQuery_with_Other_Libraries
下回攪不懂, 可以向JS方面出發, 我相信打開niceform將 .niceform 改為 #id (#node-form) 就可以, 應該很簡單. (我沒測試)
我猜想它預設.class是因為你可能有很多FORM在同一頁, 而.class可以重複使用, 但#id只能用一次
JQuery 比較易學會
MooTools, 很OO, 最新看了一文章, 聽說文檔也不齊全
對待學習, 就像談情說愛一樣就對了,
遇上問題, 就拿出來談談
有好結果, 就跟大家一起分享