26 เมษายน 2555

Internship, DAY 6

วันนี้ขอบอกก่อนเลยว่า เป็นวันที่โก๊ะและเพลียที่สุดในชีวิตฝึกงาน

เพราะอะไรน่ะเหรอ~

เพราะว่าไม่ยอมไปกินข้าวเที่ยงไงล่า Orz อาหารสำคัญมากนะคะเด็กๆ ยามทำงานห้ามอดอยากปากแห้งเด็ดขาด

วันนี้ตื่นเช้ากว่าทุกวัน แต่ดันไปสายกว่าทุกวัน เวรกรรม ==" ที่ตื่นเช้าสืบเนื่องจากเมื่อเช้าแดดแผดเผาเข้าห้อง สะลืมสะลือขึ้นมาเห็นมายอยู่หน้ากระจก เอ๊ะ ทำไมมายยังไม่ออกจากหอหว่า ปกติฟ้ายังไม่ทันสว่างก็เผ่นแล้วนี่นา ก็เลยหยิบมือถือขึ้นมาดูเวลา

"มาย นี่มันเจ็ดโมงครึ่งแล้วนะ ไม่สายหรอ?"

...จากนั้นมายก็ช็อกไปเลยคับ หูตูบวิ่งออกจากห้องไป ลืมปิดไฟอีกตะหาก 5555

ไปถึงออฟฟิศก็เจอทุกคนแล้ว(ยกเว้นพี่เติ้ง เพราะปกติพี่เค้าจะมาอีกเวลานึง) ขาดแต่พี่ต้น คือจริงๆแล้วเนี่ยพี่ต้นเป็นคนดูแลเราตามชื่อที่ขึ้นในเว็บฝึกงาน แต่ดูเหมือนพี่เค้าไม่ค่อยว่าง คนที่ assign งานให้ดูนู่นนี่ก็เลยกลายเป็นพี่ต้องแทน พอไปถึงปุ๊บเราก็โอ้เอ้แป๊บนึง เล่น FB ไปฟาดหมูปิ้งไป 4 ไม้ (สาเหตุที่ไม่ไปกินข้าวเที่ยงนั่นแหละ คือมันอิ่มข้าวเหนียวง่ะ กะว่าจะไปกินเลทๆ แต่สุดท้ายกลัวแดดร้อนเลยไม่ไป 555)

แล้วก็เริ่มวาง layout ตามแบบที่ได้ทำไว้เมื่อวาน ติดบั๊กบ้างอะไรบ้างแต่ก็ทำไปได้เรื่อยๆ และทำให้ได้ความรู้ใหม่ (แต่จริงๆทุกคนก็คงรู้กันหมด ยกเว้นเรา ><) ว่า CSS มันไล่โทนสีได้ ทำอะไรได้ตั้งหลายอย่าง แต่ครั้นจะให้เรานั่งจินตนาเกินเอาเองบน Notepad++ ไอคนไม่มีหัวศิลป์อย่างเรามันก็ลำบากอยู่ สุดท้ายเลยไปค้นเจอผู้ช่วยที่แสนดี Gen โค้ดไล่สีให้แม่งเลย 555 สะดวกสบายลัลล้ามาก

หลังจากวาง layout ซึ่งได้ 960 grid จากใน pencil project (พูดถึงในวันก่อนๆ) ช่วยออกแบบเทียบขนาด pixel ในเว็บ ทำให้สะดวกมากยิ่งขึ้น และไล่สี Header กับ Footer จนเรียบร้อยแล้ว เราก็นั่งเรียบเรียงลำดับความสำคัญในหัว ถ้าจะให้ทำ Auto-complete วันนี้เลยไม่เสร็จแน่ เพราะความรู้ jQuery Ajax ยังอ่อนด๋อยอยู่ ก็เลยไปทำส่วนที่ทำได้แน่ๆก่อนก็คือ link list (ไม่ใช่ Algorithm นะเห้ย หมายถึง list ที่มี link) ทางด้านขวามือ 77 จังหวัดเมื่อคลิกเข้าไปแล้วจะต้องให้ไฟล์ .php query ข้อมูลรหัสไปรษณีย์ของจังหวัดนั้นๆออกมา เรื่อง query ไม่ใช่ปัญหา เอาโค้ดเก่าจากงาน Database มาแก้นิดเดียวก็เสร็จ แต่ปัญหาคือ ต้องทำลิ้งทั้ง 77 จังหวัด แสรดดดดดด

ตอนนั้นเริ่มบ่ายสอง เริ่มหิวแล้ว แต่ไม่ยอมออกไปกิน (แดดมันแรง วันนี้ร้อนที่สุดด้วย 555) ก็เลยเพลียหน้ามึนอยู่หน้าโน้ตบุ๊กต่ออีกประมาณ 3 ชม. Orz

ก็เลยเริ่ม google หาวิธีง่ายๆ โค้ดสั้นๆ แต่กลับไปได้ผลลัพธ์การโยนค่าให้ php ที่ถูกต้อง ซึ่งทำเป็นอยู่แล้วเฟ่ย เลยไปถามหนุ่มโรงงานจากอยุธยาผู้ว่างงาน... วุ้ย! ยาว ขี้เกียจเรียกล่ะ เรียกปอมละกัน ดูเหมือนภาษาที่เราอธิบายปอมไปจะทำให้ปอมงงเป็นอย่างมาก แต่พออธิบายเข้าใจแล้ว ปอมบอกว่า

"ลองไปถามเจดูดิ"

Orz โชคดีที่เจออน FB อยู่ตอนนั้น ก็เลยไปถาม เจบอกว่าเจนึกออกแต่วิธีใช้ javascript ยากๆ (ซึ่งแน่นอน เราเก่ง javascript มวกกกก) และยังบอกอีกว่า

"ลองไปถามอุ้ยดูสิ อุ้ยน่าจะพอรู้วิธีที่ง่ายกว่านี้นะ"

กลัวว่าถ้าไปถามอุ้ย อุ้ยอาจจะโยนไปหาปอมก็เป็นได้ ก็เลยใช้ excel ให้เกิดประโยชน์สูงสุด ก๊อปโค้ดแมร่งง 77 บรรทัด อย่าได้แคร์ แต่ระหว่างที่นั่งลบพวก space, indent ที่มันเกินๆมา ก็นึกขึ้นมาได้ว่า ทำไมเราไม่ใช่ replace วะ แป๊บเดียวก็เสร็จ ก๊อปลง excel ทำไมเนี่ยยย TwT

แต่กว่าจะนึกได้ ก็ต้องแก้โค้ด 77 บรรทัดรอบที่ 2 แล้ว อยากจะบ้า อาการหนักสุดๆ

อธิบายโค้ดนิดนึงก่อน คือว่าเราเรียกการแสดงผล link list 77 จังหวัด ไปไว้ใน div ฝั่งขวามือ เมื่อกดลิ้งไปซักอันแล้ว ผลการ query ต้องไปแสดงผลใน div อีกส่วนนึงในหน้า page เดิม ตอนแรกคิดว่าจะเป็นงานหินซะแล้ว จนกระทั่งเจอโค้ดของชาวบ้าน มันเวิร์กจริงๆ แต่ก็เป็นสาเหตุที่ทำให้ต้องไปแก้โค้ด 77 บรรทัดรอบที่ 2 ด้วย (อ่านมาถึงตรงนี้แล้ว จะสังเกตเห็นว่า เรามึนมากๆ รู้ทั้งรู้ว่าลิ้งยังไม่เรียบร้อย ยังอุตส่าห์ก๊อปตั้ง 77 บรรทัดไปใช้ = =")

หลังจากแสดงผลถูกเรียบร้อยแล้ว แม้จะยังเน่าๆเพราะไม่ได้ตกแต่งอะไรเลยนอกจาก Header กับ Footer ก็ให้พี่ต้องมาดู ทำให้รู้ว่า ควรจะเรียกพี่เค้ามาตั้งแต่แรกๆ แต่ไม่ค่อยอยากเรียก เพราะพี่เค้าก็มีงานต้องทำเหมือนกัน พี่ต้องดูโค้ดแล้วถามกลับว่า

"ถ้าเกิด รมต. เกิดเฮี้ยนอยากเปลี่ยนชื่อจังหวัด 'กระบี่' เป็น 'กระบี่ไร้เทียมทาน' จะทำยังไง?"

ติด stunt ไปสามชั่วกัปป์ พี่ต้องก็เลยบอกว่าข้อมูล list 77 จังหวัดต้องดึงมากจาก Database สิ ก็มีให้อยู่แล้ว ณ ตอนนั้นแม้จะมึนมากเพราะเลยเวลาอาหารไปนานแล้วแต่ก็ยังถึงบางอ้อ เพราะมัวแต่คิดว่าจะโยนค่าให้ php เอาไป query ต่อยังไง ลืมนึกไปว่า Database ก็มีให้อยู่แล้ว จะไปโยนค่าไปทำซากอ้อยหอยหลอดอะไร แล้วโค้ดวนลูปสั้นๆ ที่จริงก็เคยทำมาในวิชา Database ด้วยซ้ำไป เพียงแต่คนที่เอาไปแก้คือทิพไม่ใช่เรา ทำให้อาจจะหลงๆลืมๆไปมั่ง แต่ที่แน่ๆ ก็แค่ทำฟอร์มประมาณ echo 'HTML code'.$var.'HTML code'; เหมือนที่เคยทำก็เรียบร้อยแล้ว

แล้วก็เอา scroll bar ตรงส่วน link list ออกด้วย พี่ต้องว่า scroll bar มันเยอะเกิน ให้เนื้อหามัน flow ไปตามปกติดีกว่า

ลองก๊อปโค้ดจากไฟล์ php ลงในตัว HTML ปรากฏว่าไม่เวิร์กแฮะ เห็นเหมยเคยทำได้ แต่เราเอาวิธีแบบเราละกัน ก็คือใช้โค้ดที่มาจากเว็บเดียวกับที่ทำให้คลิกลิ้งแล้วไปแสดงผลในส่วนของ div ได้ เพียงแต่หนนี้เราไม่ต้องการคลิกลิ้ง เราต้องการให้แสดงผลเลย เว็บนั้นก็มีให้เหมือนกัน แก้เสร็จแล้วก็ให้พี่ต้องดูอีกรอบ พี่ต้องถามว่า โค้ดนี้วน Loop กี่รอบ?

การเอาโค้ดเก่ามาแก้นั้นต้องระวังมาก แม้ว่าจะแสดงผลถูกต้องแล้วก็ตาม แต่ดันมีลูปพิเรนทร์ๆจากโค้ดเก่าซ้อนมาอีกชั้นนึงแบบไม่จำเป็น เพราะโค้ดก่อน query ออกมา 1 row มีหลาย column หนนี้มี column เดียว จะวนอะไรกันนักกันหนา แล้วก็เรื่องการตั้งชื่อตัวแปล ไม่ควรตั้งเป็นอักษรตัวเดียว เพราะมันจะดูเป็นตัวเลขมากกว่า และก็ไม่ค่อยบ่งบอกความหมาย คนที่เอาไปพัฒนาต่ออาจมึนตึ้บได้


ส่วนนึงโค้ดเก่าที่เอาผลจากการ query รหัสไปรษณีย์ในแต่ละจังหวัดไปแสดงเป็นตารางใน div
-ขออนุญาตพิมพ์ผิดหลักนิดนึง ไม่งั้นมันไม่โชว์โค้ดบางส่วนอะ


while($rs=mysql_fetch_assoc($result))
{
echo ' < tr > ';
foreach ($rs as $i)
echo ' < td >'.$i.' < /td > ';
echo ' < /tr > ';
}




ส่วนนึงโค้ดใหม่ที่ตอนแรกลืมเอา foreach ออก แต่ตอนนี้เอาออกเรียบร้อยละน้า (แต่ยังใช้ตัวแปรเป็นอักษรตัวเดียว แค่เลี่ยงตัว i จะได้ไม่คิดว่ามันเป็นตัวเลข)



while($rs=mysql_fetch_assoc($result))
{
$p = $rs["PROVINCE"];
echo ' < li >< a href="javascript:ajaxpage(\'province.php?p=' .$p'\',\'result\');" > ' .$p' < /a >< /li > ';

}




จบความมึนแต่เพียงเท่านี้...


ปล.พี่ต้องบอกให้ออกแบบโลโก้เว็บแบบเรียบๆ ใช้แค่ตัวอักษรก็พอ เป็นภาษาไทย คิดว่าจะใช้ font อันนี้แหละ แต่พรุ่งนี้คงต้องไปหา tool ออกแบบมาเพิ่ม
ปล.2 มังกรแนะนำ Auto-complete มาอีกตัว ยังไม่ได้ศึกษาเลย

2 ความคิดเห็น: