พัฒนาเว็บไซต์และโปรแกรม « แลกเปลี่ยนเรียนรู้:km tool

archive page

บันทึกใน ‘พัฒนาเว็บไซต์และโปรแกรม’

วันวุ่นที่ใจไม่ค่อยวุ่น กับหลายหน่วยงาน

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Tuesday, January 4th, 2011
ประกันคุณภาพ

ประกันคุณภาพ

4 ม.ค.54 วันนี้ทำโปรแกรมระบบฐานข้อมูลการประเมินตนเอง /sar เพิ่มอีกนิดหน่อย โดยจัดการส่วนแสดงการรวมเอกสารทั้งหมดจากบุคลากร (มีน้องสาว 3 หน่วยงานกับหัวหน้าหนุ่มมากวนใจ) เพื่อแสดงแบบรายการแยกตามเกณฑ์มาตรฐาน ที่ส่งเอกสารผ่านระบบ e-document มีประโยชน์กับฝ่ายประกันคุณภาพทั้งคณะวิชาและมหาวิทยาลัยได้แล้ว ในอนาคตอันใกล้คณะวิชา หรือมหาวิทยาลัยจะคัดกรองออกไปใช้ ก็จะเลือกคลิ๊กตามชื่อของเจ้าของแฟ้ม หรือชื่อคณะวิชา .. ซึ่งพัฒนาตามความต้องการของทีมวิจัยประกันคุณภาพการศึกษา แต่ยังขาดบูรณาการ เพราะอยู่ระหว่างพัฒนา Prototype

เทคนิคนี้เป็นการรวมก่อนแยก เพราะนี่เป็นรุ่น 2 ซึ่งรุ่นแรกทำแบบแยก และไม่เห็นรวม แต่มหาวิทยาลัยต้องการมองแบบรวม จึงทำแบบรวมเป็น default ไว้ก่อน น่าจะมีประโยชน์ในภาพรวม

ระบบนี้ยังสับสนเรื่อง account ของระบบ intranet กับ sar  เพราะปีที่ผ่านมาทำให้ใช้ได้ทั้งบัญชีของ intranet กับ sar ซึ่งยุ่งในการสร้างพื้นที่รองรับในส่วนของ sar เฉพาะแต่ละบุคคล แต่ปีนี้ตั้งใจจะยุบการรองรับ account ที่มาจาก sar ให้เหลือเฉพาะ intranet แต่สำหรับคณะวิชา และมหาวิทยาลัย ยังจำเป็นต้องมี account ของ sar เพื่อกำหนดพื้นที่เฉพาะสำหรับข้อมูลอื่น เช่น เป้าหมายและผลการประเมินตนเอง ซึ่งระดับบุคคลไม่มีส่วนนี้

วันนี้ทำงานกับคนที่อยากทำงาน รู้สึกใจสงบครับ


ปีจำกัดที่ 2010 ใน moodle

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Tuesday, January 4th, 2011
moodle 2010

moodle 2010

4 ม.ค.54 หัวหน้าที่ใช้งานระบบ e-learning แจ้งว่า พบปัญหาใน moodle 1.5.3 ที่มีปีให้เลือกถึงค.ศ.2010  การขยายปีออกไปทำได้โดยแก้ไขแฟ้ม lib/weblib.php หาคำสั่ง for ($i=2000; $i<=2010; $i++) แล้วก็เปลี่ยนจาก 2010 เป็นปีที่ต้องการ เท่านี้ก็ขยายปีออกไปได้แล้ว
http://kampol.htc.ac.th/km52/index.php?topic=64.0

ถ้าเป็นคำแนะนำอื่น จะบอกว่าให้ upgrade version ของ moodle.org


การวาง url ใน status ของ facebook.com

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Tuesday, December 28th, 2010
url on facebook : cards case study

url on facebook : cards case study

28 ธ.ค.53 นั่งทำระบบ e-cards อยู่ 2 วัน พัฒนาเป็นระบบส่ง parameter ผ่าน url หรือที่เรียกว่าการกำหนด  action method แบบ get เหมือนที่ google.com ใช้ แต่พบปัญหา 2 ประการ คือ ภาพไม่ปรากฎใน ie8 และภาพไม่ปรากฎอัตโนมัติในเฟสบุ๊คเพื่อแสดง thumb nail

สรุปปัญหาแรก คือ การกำหนดความกว้างของภาพเป็น % เป็นผลให้ไม่สามารถแสดงผลใน ie8 ภาพหายไปเฉย ๆ แต่ไม่พบปัญหาใน browser ตัวอื่น แม้แต่ ie6 ก็ไม่พบปัญหา แก้ไขโดยกำหนดเป็น pixel ตามปกติ ก็ใช้ได้กับ brower ทุกตัวที่เข้ามาทดสอบ ปัญหาที่สอง คือ เขียน card.php ตัวเดียว แล้วใช้วิธีส่งค่าแทนการสร้างสคริ๊ปขึ้นใหม่สำหรับแต่ละภาพ พบว่า การวาง url ใน  status ของ fb จะไม่มีการเรียก url ผ่าน parameter เพื่อดึงภาพจากเว็บเพจมาทำเป็น thumb เช่น ส่ง card.php?x=1 ผลที่ fb อ่านคือ card.php เท่านั้น  แก้ไขโดยกำหนดค่า default สำหรับการเรียก card.php ขึ้นมา เพื่อให้ fb ได้ภาพที่ต้องการสำหรับแสดง thumb nail มิเช่นนั้นจะว่างเปล่า

สมมติฐานที่ทีแรกสงสัยว่าภาพไม่ปรากฎใน fb จากกการวาง url คือ การเขียน html tag ไม่เป็นมาตรฐาน หรือการเขียน table หลายชั้น แต่ความจริงเป็นเพราะ fb ไม่รับ parameter ในการเลือกภาพมาแสดงเป็น thumb nail ของ status และปัญหาจากรุ่นของ browser เข้ามาผสมโรงในตอนท้ายของการทดสอบ
http://www.yonok.ac.th/cards


พบปัญหาการตัดนามสกุลใน e-document script

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Tuesday, December 21st, 2010
edit managefile

edit managefile

พบปัญหาการตัดอักษรจากชื่อแฟ้มผิดพลาดในระบบ e-document รุ่นที่ใช้กับมหาวิทยาลัย จากที่เคยทดสอบจะไม่ใช้ . ในชื่อแฟ้ม เพราะ . นิยมใช้กั้นระหว่างชื่อแฟ้มกับนามสกุลแฟ้ม แต่มีผู้ใช้บางท่านใช้ . เป็นบางส่วนของชื่อแฟ้ม ทำให้การแสดงรายชื่อแฟ้มไม่ครบตามที่ผู้ใช้คาดหวัง จึงเพิ่มบรรทัดที่ 142 สำหรับรวบรวมชื่อแฟ้มใหม่ให้ถูกต้อง และเปลี่ยนการแสดงชื่อแฟ้มจากอาร์เรย์ตัวที่ 0 มาเป็น $newcut ในบรรทัด 145 ตามตัวอย่าง (script ตัวนี้ไม่เผยแพร่ เพราะ upgrade สำหรับงานเฉพาะของมหาวิทยาลัย ที่ทำงานร่วมกับระบบภาระงาน และเอกสารประกันคุณภาพแล้ว) แต่รุ่นที่เผยแพร่คือ http://www.thaiall.com/perlphpasp/source.pl?9102


การนำวีดีโอจากเทปใน SONY DCR ลงเว็บ

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Friday, December 3rd, 2010

การนำวีดีโอจากเทปใน SONY DCR-TRV33E MiniDV ลงเว็บแบบ Streaming

1. เปิดตัวเลือก USB Streaming เป็น on ในเมนูของกล้อง
2. ติดตั้ง Driver สำหรับเชื่อม USB จากกล้องเข้าเครื่อง
3. เชื่อมสายจากกล้องเข้าเครื่องคอมพิวเตอร์ แล้วสั่ง play จากกล้อง
4. เปิดโปรแกรม Windows Movie Maker แล้ว Capture from video device
5. เมื่อสั่ง Start, Capture จะถ่ายวีดีโอไปยังแฟ้ม .wmv ทีละเฟรม เทียบเท่าเวลาที่บันทึกในวีดีโอ
6. ใช้โปรแกรม Total video converter หรือ Formatfactory แปลง .wmv เป็น .flv
7. ใช้ FlowPlayer แสดงแฟ้ม .flv แบบ Streaming
+ http://www.thaiall.com/media

<html><head>
<script type="text/javascript" src="flowplayer-3.2.4.min.js"></script>
</head><body>
<a href="http://www.xxx.com/x.flv"
style="display:block;width:425px;height:300px;" id="player"></a>
<script>flowplayer("player", "flowplayer.swf");</script>
</body></html>

set outlook e-mail

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Thursday, November 18th, 2010

18 พ.ย.53 มีน้องชายถามว่า outlook จะ set mail อย่างไร ก็ต้องตีความตามความเข้าใจของผมว่า เขาคงสนใจใช้ outlook 2003 และต้องการเชื่อมต่อกับ mail server ที่บริการ pop3 กับ smtp ในองค์กร ซึ่งองค์กรอาจมีบริการเชื่อมต่อแบบอื่นอยู่แล้ว แต่บริการนี้เป็นการเสริมสำหรับ advance user ที่ต้องการใช้ เพื่อให้การ download mail หรือจัดการ mail นั้นทำได้ง่าย ซึ่ง outlook ย่อมทำงานได้สมบูรณ์กว่า Outlook express ขั้นตอนหลังเปิด outlook ก็เลือก tools, E-mail Accounts, เลือกประเภทของบริการ, กำหนดไอพีของ pop3 และ smtp .. ก่อนเชื่อมต่อหาตัวเลือกว่าจะลบออกจาก server หรือแค่ download เพราะถ้าลบจาก server ก็มีความหมายตรงตัวเลยครับ คือ mail ทั้งหมดจะมาอยู่ในเครื่องของเราเพียงเครื่องเดียว ไม่สำเนาไว้ที่ server

outlook

outlook


ระบบ Comment ของ fb สำหรับเว็บเพจภายนอก

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Monday, November 15th, 2010
fb comments

fb comments

15 พ.ย.53 มีโอกาสทดสอบระบบ Comment ของ fb ซึ่งสามารถนำมาแปะกับเว็บเพจหน้าใดก็ได้ในเว็บไซต์ของเรา .. จากการทดสอบกับหลายเว็บไซต์ และหลาย Browser ผมยังไม่มั่นใจที่จะนำมาใช้กับมหาวิทยาลัยโยนก เพราะระบบ Comment ที่มีอยู่เสถียรกว่าระบบของ FB มาก ผมทดสอบกับ IE6 จำนวน 3 เครื่อง และ IE7 พบว่า Comment ออกบ้างไม่ออกบ้าง
แม้พยายาม Refresh แล้วก็ไม่ออก .. ตอนผมใช้กับเครื่องบริการนอกมหาวิทยาลัยต้องสร้างเป็น iframe จึงจะทำงานได้ เพราะเรียกใช้ในเว็บเพจที่มี Javascript ของผมจะพบว่าขัดแย้งกัน เมื่อเปลี่ยนไปใช้ iframe ไม่มีปัญหาเรื่องความขัดแย้ง

ถ้าสนใจสามารถ view code แล้วคัดลอกได้เลยครับ
http://www.thaiall.com/facebook/fb_comments.htm


การสั่งเปิด image เป็น layer ใหม่ในเว็บพจเดิม

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, November 7th, 2010
alumni

alumni

7 ต.ค.53 lightbox เป็นชุดสคริ๊ปสำหรับเปิดภาพเป็น layer ใหม่ในเว็บเพจเดิม พัฒนาโดย huddletogether.com จากการทดสอบใน gallery ของ joom พบว่าแต่ละภาพมีขนาดไม่สม่ำเสมอ ถ้าไม่ปรับ code ก็จะควบคุมการแสดงผลไม่ได้ แต่ทดสอบกับ gallery ของ ynalumni พบว่าใช้งานได้ดี เพราะภาพทั้งหมดได้มาจาก facebook ซึ่งมีการปรับความกว้างของทุกภาพให้เท่ากัน และไม่กว้างเกินขนาดของ windows จึงสะดวกในการใช้ previous หรือ next พบว่ามีการใช้งานในหลายเว็บไซต์ เช่น toptenthailand.com หรือ sopitthaspa.com

การกำหนดความสูง ของ lightbox : ทำได้โดยกำหนดใน lightbox.css โดยเติม top:0!important; เข้าไปใน #lightbox{ }

การติดตั้ง lightbox ในแฟ้ม .htm : ทำได้โดยส่ง 6 แฟ้ม คือ lightbox.css builder.js effects.js lightbox.js prototype.js scriptaculous.js เข้าไปในห้องที่เก็บแฟ้ม .htm แล้วเพิ่ม 4 บรรทัดนี้เข้าไปในส่วนหัวของ .htm แล้ว link ของภาพ ก็เติม rel=”lightbox[roadtrip]“ หรือ rel=”lightbox” เข้าไป เช่น <a href=”burin.jpg” rel=”lightbox[roadtrip]“><img src=”burin.jpg”></a>

code 4 บรรทัดสำหรับ .htm
<link rel=”stylesheet” href=”lightbox.css” type=”text/css” media=”screen” />
<script src=”prototype.js” type=”text/javascript”></script>
<script src=”scriptaculous.js?load=effects,builder” type=”text/javascript”></script>
<script src=”lightbox.js” type=”text/javascript”></script>

แนะนำเว็บไซต์
http://www.huddletogether.com/projects/lightbox2/releases/lightbox2.04.zip
http://www.thaiall.com/java/lightbox/lightbox204a.zip
http://www.thaiall.com/java/lightbox/lightbox.htm
http://www.thaiall.com/actress/joom.htm
http://www.thaiabc.com/ynalumni/photo.asp


ตัวอย่างโครงสร้างตาราง ระบบภาระงานคณาจารย์รุ่น 2

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, October 24th, 2010

ข้อตกลงภาระงานคณาจารย์ ภาคเรียนที่ 1 ปีการศึกษา 2553
parakit (parakit_id v13,perid v10,pot v50,poa v50,poo v50,fac v50,maj v50,years_id v10)
1. ภาระการสอน
parakit_teacher(parakit_id v13, parakitt_id i13)
parakit_teacher_detail (parakitt_id v13,ids i13,parakitt_name v50,parakitt_student c3,parakitt_time v30,parakitt_total v4,parakitt_amount v4,parakitt_mark v200)
2. ภาระงานวิจัย
parakit_research (parakit_id v13,parakitr_id i13)
parakit_research_detail (parakitr_id v13,ids i13,parakitr_name v200,parakitr_type v100,parakitr_date v50,parakitr_amount v4,parakitr_mark v200)
3. ภาระงานอื่น
3.1 ภาระงานบริหาร
parakit_administrator(parakit_id v13,parakita_id i13)
parakit_administrator_detail(parakita_id v13,ids i13,parakita_name v50,parakita_amount v4,parakita_mark v200)
3.2 การผลิตผลงานทางวิชาการ
parakit_academic(parakit_id v13, parakitac_id i13)
parakit_academic_detail (parakitac_id i13,ids i13,parakitac_name v150parakitac_type v150parakitac_date v50parakitac_amount v4parakitac_mark v200)
3.3 การพัฒนานักศึกษา
parakit_development (parakit_id v13,parakitd_id i13)
parakit_development_detail (parakitd_id v13,ids i13,parakitd_name v150,parakitd_student c2,parakitd_time v4,parakitd_total v4,parakitd_amount v4,parakitd_mark v200)
3.4 การบริการวิชาการ
parakit_service (parakit_id v13,parakits_id i13)
parakit_service_detail (parakits_id v13,ids i13,parakits_name v150,parakits_date v50,parakits_total v4,parakits_amount v4,parakits_mark v200)
3.5 การทำนุบำรุงศิลปวัฒนธรรม
parakit_art (parakit_id v13,parakitart_id i13)
parakit_art_detail (parakitart_id v13,ids i13parakitart_name v150parakitart_date v50parakitart_total v4parakitart_amount v4parakitart_mark v200)
3.6 การปฏิบัติงานมอบหมายอื่น
parakit_other (parakit_id v13,parakito_id i13)
parakit_other_detail (parakito_id v13,ids i13,parakito_name v150,parakito_date v50,parakito_amount v4,parakito_mark v200)


contentslider javascript

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Saturday, October 16th, 2010
content slider

content slider

16 ต.ค.53 คุณธรณินทร์ สุรินทร์ปันยศ ช่วยให้ผมได้ศึกษาเรื่องของ การใช้ javascript ทำ slide show เมื่อเปรียบเทียบแล้วพบว่า ใช้งานได้ดีกว่า dm-album  ในกรณีนี้ ซึ่งปกติผมจะปิดกั้นตนเองไม่ศึกษาเรื่องแบบนี้ แต่ อ.ทันฉลอง รักษาการอธิการ มีนโยบายให้มีการปรับปรุงเว็บไซต์ทั้งระบบ ประกอบกับ code ชุดนี้ เคยถูกนำมาใช้งานโดย  startupthailand.com เมื่อแกะโค้ด ก็พบว่ามีการ import แฟ้ม contentslider.js เพียงแฟ้มเดียว ซึ่งนำไปใช้ได้ง่าย แล้วเผยแพร่ใน thaiall.com/java หัวข้อ 2.18 เพื่อให้นักพัฒนาคัดลอก .zip ที่มีตัวอย่างและปรับ code เบื้องต้นแล้ว .. (ปัญหา สร้าง โอกาส)

ต.ย.  http://www.thaiall.com/java/contentslider/contentslider.htm

และ http://www.thaiall.com/java/contentslider/contentslider.zip

http://www.thaiall.com/blog/burin/3205/