期末報告題目。
設計前，請參考一些使用者建議。
星期二, 5月 26, 2009
一位校友對「為什麼在大學練習寫程式」留下新意見
畢業校友寫給我的回應，轉貼給各位參考。
Franson 已針對您的文章「為什麼在大學練習寫程式」留下新意見：
老師說得沒錯，程式真的很重要，我在網通相關領域業界工作了半年多，碰到很多資工領域背景的同仁，他們寫code能力真的很強。RD幾乎人人都要碰程式，就如英語一樣是目前業界工作基本要求。
但電子電機相關科系的同學也不用擔憂未來或是羨慕資工領域的學生，因為我們有嚴謹的理論訓練。在業界理論才是研發和解決問題的根基，就如同一本好書，想當然作者一定有很好的語言能力，但在他背後的一切才是構成這本好書的原動力。
所以，理論課程非常重要。
關於專題，老師在前面有很多很棒文章^^看了很有感觸阿！對我來說專題是全人教育的一部分，而非單純實作課程。在大學幾乎沒有白學的課程，選了就好好修，一定有會有收穫的。
Franson 已針對您的文章「為什麼在大學練習寫程式」留下新意見：
老師說得沒錯，程式真的很重要，
但電子電機相關科系的同學也不用擔憂未來或是羨慕資工領域的學生
所以，理論課程非常重要。
關於專題，老師在前面有很多很棒文章^^看了很有感觸阿！
為什麼在大學練習寫程式
寫程式是種邏輯訓練，頭腦體操，就算以後你不走這行，你還是因此變聰明了。並不會有所謂白學的問題。
事實上，很多電子系校友也不從事電子這行，例如有個管理顧問公司總經理就是我們系友，他雖然早就不碰電子，但是他還是覺得電子系給他的紮實工程背景訓練，是非常寶貴的一段學習經驗，並不會因為以後不走電子，現在學的東西全部白學。
電 子系同學大多不重視寫程式，想不透是誰給他們寫程式不重要的錯誤概念，事實上寫程式對電子系同學的重要性絕對不亞於資工系，無論是通訊，數位，用到程式 的機會極高。現在的系統講究智慧，智慧從哪裡來? 當然是軟體。以手機為例，手機硬體大同小異，功能差異性主要來自軟體。所謂科技來自人性，軟體居功厥偉。
電子系不等於焊電路接麵包板而已，所以千萬不要輕視寫程式。寫程式的好處如下:
事實上，很多電子系校友也不從事電子這行，例如有個管理顧問公司總經理就是我們系友，他雖然早就不碰電子，但是他還是覺得電子系給他的紮實工程背景訓練，是非常寶貴的一段學習經驗，並不會因為以後不走電子，現在學的東西全部白學。
電 子系同學大多不重視寫程式，想不透是誰給他們寫程式不重要的錯誤概念，事實上寫程式對電子系同學的重要性絕對不亞於資工系，無論是通訊，數位，用到程式 的機會極高。現在的系統講究智慧，智慧從哪裡來? 當然是軟體。以手機為例，手機硬體大同小異，功能差異性主要來自軟體。所謂科技來自人性，軟體居功厥偉。
電子系不等於焊電路接麵包板而已，所以千萬不要輕視寫程式。寫程式的好處如下:
- 以後工作用得上。現在的世界是買硬體送軟體，以後是買軟體送硬體。
- 訓練清晰頭腦，培養邏輯思考能力。
- 快速試做一個概念，因為你在耗時耗費實做之前，即可先用軟體程式模擬。如果結果不錯，再去實做不遲。
星期四, 5月 21, 2009
星期五, 5月 15, 2009
Lab DOM
[Lab]
1. Open NVu
2. Based on the code as in http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
1. Open NVu
2. Based on the code as in http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
Lab Create Image using DOM
1. Open Nvu
2. Hand code a javascript that loads an image from Internet based on
the DOM model.
3. Take a look at the sample code that shows how window.onload to load the image.
4. Use a button to load the image. Try how onclick works.
2. Hand code a javascript that loads an image from Internet based on
the DOM model.
3. Take a look at the sample code that shows how window.onload to load the image.
4. Use a button to load the image. Try how onclick works.
DOM, Document Object Model
操作以下這個網頁
web personalization 網頁個人化
你會不會覺得有點神奇, 它是如何做到的?
關鍵就在 DOM.
- Grab all the tags of the document, or grab the text without grabbing the tag text.
- Insert new text, and change or remove text from any element.
- Move whole parts of the document around, or remove parts as fragments and work with them.
- And the best part: all of these new methods should work in any DOM compliant browser. No more browser sniffing. No need to build different versions of the same page for different browsers.
Reference:
Scripting For The 6.0 Browsers, By Scott Andrew LePera
web personalization 網頁個人化
你會不會覺得有點神奇, 它是如何做到的?
關鍵就在 DOM.
With the DOM scripting methods you can:
- Create new elements on the fly.- Grab all the tags of the document, or grab the text without grabbing the tag text.
- Insert new text, and change or remove text from any element.
- Move whole parts of the document around, or remove parts as fragments and work with them.
- And the best part: all of these new methods should work in any DOM compliant browser. No more browser sniffing. No need to build different versions of the same page for different browsers.
Reference:
Scripting For The 6.0 Browsers, By Scott Andrew LePera
createElement() allows you to create a new tag.
myImg = document.createElement("IMG")
Give definition.In the above example, our newly born tag has no ID, no SRC and no home in the document yet. So let's give it some definition:
myImg.setAttribute("id","imageOne")
myImg.setAttribute("src","jabberwocky.gif")
Append it within the document "tree".
Now all we need to do is append it to the document body. And to do that, we use the DOM node method appendChild():
docBody = document.getElementsByTagName("body").item(0)
docBody.appendChild(myImg)
星期四, 5月 14, 2009
Quiz 5-15-2009
1. 請撰寫一段無障礙圖片的HTML。
2. 列舉至少三個HTML 網頁無法符合無障礙的原因。
3. 列舉 XML 特性至少三個
4. 簡述Web發展史(1989~2009)。
5. 在CGI語法裡，解釋 GET, POST 差異在哪裡?
6. 寫出一個產生網址http://maps.google.com/maps?q=24,121 的HTML片段。
7. GreaseMonkey 跟 Firefox 的關連是什麼?
8. 列舉 GreaseMonkey 應用至少三個
9. 解釋 PageRank
10. 說明 Firefox Accessibility Extension
11. 舉出使用 mash-up的網站至少三個，並說明其 mash-up 特性。
12. Housingmaps 使用了哪些網頁互動技術，請至少列舉三個。
13. 列舉至少三種瀏覽器
14. 列舉至少六種Google服務名稱
15. 如何增加網頁的互動性?
16. 動態網頁的資料來源有哪些? 請列舉。
17. 請解釋 Access Bar (上課實驗)
18. 請解釋 Access Key (上課實驗)
2. 列舉至少三個HTML 網頁無法符合無障礙的原因。
3. 列舉 XML 特性至少三個
4. 簡述Web發展史(1989~2009)。
5. 在CGI語法裡，解釋 GET, POST 差異在哪裡?
6. 寫出一個產生網址http://maps.google.com/maps?q=24,121 的HTML片段。
7. GreaseMonkey 跟 Firefox 的關連是什麼?
8. 列舉 GreaseMonkey 應用至少三個
9. 解釋 PageRank
10. 說明 Firefox Accessibility Extension
11. 舉出使用 mash-up的網站至少三個，並說明其 mash-up 特性。
12. Housingmaps 使用了哪些網頁互動技術，請至少列舉三個。
13. 列舉至少三種瀏覽器
14. 列舉至少六種Google服務名稱
15. 如何增加網頁的互動性?
16. 動態網頁的資料來源有哪些? 請列舉。
17. 請解釋 Access Bar (上課實驗)
18. 請解釋 Access Key (上課實驗)
星期三, 5月 13, 2009
賀: 電子系精障研究 "全程護送 有障無礙" 獲得三創(創意創新創業)比賽全校第一名(科技創新獎)
此獎開始於2007年，由教育部教學卓越計畫主辦，每年挑選全校各系最精華專題成果，選出精華中的精華。獲得獎金五萬元。 恭喜 馬瑱賢 彭書敏 陳虹綺 。
另外，彭書敏 陳彥儒 陳虹綺 熊嬡菁 楊秉霖 黃俊達 精障研究 "展招開道 室內導航" 獲得三創比賽全校第四名。近日內將接受主要媒體採訪。
再次，謝謝各位就服員，老師給這些同學們三年來不斷的支持，鞭策與鼓勵。更要感謝的是所有參與實驗的精障者，你們用樂觀面對生命給我們極大的啟示。
另外，彭書敏 陳彥儒 陳虹綺 熊嬡菁 楊秉霖 黃俊達 精障研究 "展招開道 室內導航" 獲得三創比賽全校第四名。近日內將接受主要媒體採訪。
再次，謝謝各位就服員，老師給這些同學們三年來不斷的支持，
星期二, 5月 12, 2009
2009 輔具科技夏令營
目的: 為了增進對國內外輔具科技認知視野，提升對輔具研發實做能力，特舉行此次輔具科技夏令營。
時間: 2009年6月30日
地點: 中原大學電學大樓 517 實驗室
對象: 研究生，專題生，大學部同學，專業工作者，對身心障礙科技有興趣者
議程
費用: 全免
報名方式: 於此
延續本實驗室傳統，將於6/30舉行。期末考結束了，暑假剛開始。大家團聚一起，分享彼此經驗。除了研究生薪火傳承以及為了促進不同小組技術交流與相互觀摩。歡迎社會人士與專業從業人員與教師。
時間: 2009年6月30日
地點: 中原大學電學大樓 517 實驗室
對象: 研究生，專題生，大學部同學，專業工作者，對身心障礙科技有興趣者
議程
| 9:00-9:10 | 引言: 張耀仁
|
| 9:10-10:00 | 工作職場中情境感知無障礙工作提示應用(張萬志) |
| 10:10-11:00 | |
| 11:10-12:00 |
|
| 12:10-14:00 | 午休 |
| 14:10-15:00 | 資料探勘於精障行動安全與走失預防系統(馬瑱賢小組) |
| 15:10-16:00 | 精障室內導航影像指引(陳彥儒小組) |
| 16:10-17:00 | 綜合座談 |
費用: 全免
報名方式: 於此
延續本實驗室傳統，將於6/30舉行。期末考結束了，暑假剛開始。大家團聚一起，分享彼此經驗。除了研究生薪火傳承以及為了促進不同小組技術交流與相互觀摩。歡迎社會人士與專業從業人員與教師。
星期五, 5月 08, 2009
Lab XML (2)
1. Register and Download Xray, an XML, XSLT editor and processor.
2. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 2. A basic style sheet for the soccer results
use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.
(archive)
3. View the formatted HTML file.
4. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 3. A style sheet that computes team standings
compute the team standings in a table.
5. View the formatted HTML file.
2. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 2. A basic style sheet for the soccer results
use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.
(archive)
3. View the formatted HTML file.
4. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 3. A style sheet that computes team standings
compute the team standings in a table.
5. View the formatted HTML file.
5-15-2009 小考
範圍: 上課內容
方式: closed book, no computer
小考目的主要在測驗學生基本能力，能夠面對問題，獨立去構思答案，不假他人既有成果。因此，不必求完美，只要掌握關鍵概念，就會給予高分。
歷年考題(僅供參考，題型可能變更)
方式: closed book, no computer
小考目的主要在測驗學生基本能力，能夠面對問題，獨立去構思答案，不假他人既有成果。因此，不必求完美，只要掌握關鍵概念，就會給予高分。
歷年考題(僅供參考，題型可能變更)
星期四, 5月 07, 2009
XML
Take a look at islandwide temperatures of Taiwan.
What happens if you just want Taoyuan's temperature?
If you want to include Taoyuan's temperature in your Theme
Park homepage, is there any solution?
XML examples:
- News Syndication
- http://140.135.8.178/bgbg
/lihung.html
Input 2008 4 7 8 55
the need of XML
- HTML for machine-human interaction
- XML can be formatted to HTML according to formartting rules called XSLT. To see it, do Lab XSLT.
- XML for machine-machine interaction
- Without human involvement, automation of business systems can be accelerated.
- An XSLT style sheet is an XML document.
- The basic processing paradigm is pattern matching.
Operation of an XSLT Processor
參考資料
XSLT(專業ASP.NET XML程式設計 - 使用C#)
Lab Hand code a form
Hand code a HTML or use Nvu to edit an HTML so that the webpage can send a request to Google like
http://maps.google.com/maps?q=24.9586,+121.24114
Use Form CGI that includes action, input, and submit.
Try a few different coordinates.
http://maps.google.com/maps?q=24.9586,+121.24114
Use Form CGI that includes action, input, and submit.
Try a few different coordinates.
Lab Form and Action
"logic will get you from A to B - imagination will take you anywhere"
How to use Form to invoke a remote service through CGI.
1. Copy the search box of this search page,
inlcuding radio buttons, text input, and submit button.
2. Open your Nvu HTML editor.
3. Open a new empty HTML file.
4. Paste the search box into this new file.
5. Use Nvu to add a Form to this search box. Do not hand code the HTML. Just fill the blank in the Form dialog.
6. In the form dialog, set Action="http://google.com/search" and name of Form as "f" and method as "get"
(See Hint if it does not work.)
7. Save your file on your computer. Run your HTML by Firefox. What do you get?
8. Set method as "post"
9. Run your HTML by Firefox. What do you get?
How to use Form to invoke a remote service through CGI.
1. Copy the search box of this search page,
inlcuding radio buttons, text input, and submit button.
2. Open your Nvu HTML editor.
3. Open a new empty HTML file.
4. Paste the search box into this new file.
5. Use Nvu to add a Form to this search box. Do not hand code the HTML. Just fill the blank in the Form dialog.
6. In the form dialog, set Action="http://google.com/search" and name of Form as "f" and method as "get"
(See Hint if it does not work.)
7. Save your file on your computer. Run your HTML by Firefox. What do you get?
8. Set method as "post"
9. Run your HTML by Firefox. What do you get?
Static, Dynamic Webpages and Common Gateway
- Dynamic pages, content generated by server-side programs.
- CGI, Common Gateway Interface, for sending requests to server-side programs.
(pages 41~46, 188~193 of Textbook)
static page
Ex:
http://www.google.com/
dynamic page
Ex:
http://www.cna.com.tw/
URL that sends a request by CGI
Ex:
http://maps.google.com/maps?q=24.9586,+121.2411
static page
Ex:
http://www.google.com/
dynamic page
Ex:
http://www.cna.com.tw/
URL that sends a request by CGI
Ex:
http://maps.google.com/maps?q=24.9586,+121.2411
星期五, 5月 01, 2009
Homework 5-1-2009
1. 嘗試闖關以下這個遊戲
Place That State Game
2. 建立你的行事曆，並與學校行事曆合併
Place That State Game
2. 建立你的行事曆，並與學校行事曆合併
Google日曆-中原大學行事曆-html版本<http://www.google.com/calendar/embed?src=sth4g0ns7lj48crs0gsm3ekuns%4...>
Lab Mash-up 4
Lab Mash-up 2
For housing services, compare the three websites
http://www.housingmaps.com
http://www.urmap.com.tw/asp/kijiji/
http://www.7house.com.tw
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
example: TMM
http://www.housingmaps.com
http://www.urmap.com.tw/asp/kijiji/
http://www.7house.com.tw
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
example: TMM
Lab Mash-up 1
1. Upload a sample ppt to Google Docs.
2. Publish the uploaded ppt.
3. Embed the online ppt to your blog.
The reason to do so is that the readers don't have to have ppt to view your presentation. For example, some users work with Linux or Unix, and others work with MacOS. They will appreciate you for doing so.
Hint: a sample work
2. Publish the uploaded ppt.
3. Embed the online ppt to your blog.
The reason to do so is that the readers don't have to have ppt to view your presentation. For example, some users work with Linux or Unix, and others work with MacOS. They will appreciate you for doing so.
Hint: a sample work
訂閱：
文章 (Atom)