วันอังคารที่ 30 สิงหาคม พ.ศ. 2559
การดึงข้อมูลของ text plugin ที่สร้างแล้วออกมา
ณ ตอนที่เขียนบทความนี้ ตัวโปรเจ็คเมื่อผู้ใช้งานสร้างข่าวประเภท text แล้วยังไม่สามารถแก้ไขได้ ทำให้ต้องสร้างข่าวใหม่ทุกครั้ง ในบทความนี้จะนำเสนอเกี่ยวกับวิธีดึงข้อมูลของ text plugin ที่ถูกสร้างแล้วออกมา เพื่อนำมาประยุกต์ใช้ให้สามารถแก้ไขได้ต่อไปต่อไปนี้จะเป็นโค้ดการทดลองดึงข้อมูลจาก text plugin ออกมา
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | >>> p <PageList: page803> >>> placeholders = list(p.page.get_placeholders()) >>> placeholders [<Placeholder: content>] >>> place = placeholders[0] >>> plugins = place.get_plugins_list() >>> plugins [<CMSPlugin: 825>] >>> plug = plugins[0] >>> plug <CMSPlugin: 825> >>> instance, plugin = plug.get_plugin_instance() >>> instance <Text: Hello world> >>> instance.body '<p><br>\n<img style="height: 162px; width: 162px;" src="/media/uploads/root/2016/08/29/photodj.png" alt=""> Hello world</p>\n' |
อธิบายโค้ดด้านบน
ในบรรทัดที่ 1 กำหนดให้ p เป็น object ของหน้า page ที่มี text plugin ที่เราต้องการอยู่ ต่อมาในบรรทัดที่ 3 ทำการดึง placeholder ทั้งหมดในหน้าของ p ออกมา จากบรรทัดที่ 5 พบว่ามี placeholder ชื่อ content อยู่ตัวเดียว จึงดึงออกมาเก็บในตัวแปรชื่อ place ในบรรทัดที่ 6 ขั้นต่อมาในบรรทัดที่ 7 เก็บ plugin ทั้งหมดใน place ออกมา ในบรรทัดที่ี 10 มีการเก็บ plugin นั้นในตัวแปรชื่อ plug ในบรรทัดที่ 13 ทำการดึง instance ของ text plugin ออกมา ต้องใช้ 2 ตัวแปรเพราะเป็นรูปแบบที่ถูกกำหนดมาของ text plugin ต่อมาในบรรทัดที่ 14 เราใช้ตัวแปรชื่อ instance คือ object ที่เป็น text plugin ที่เราอ่านค่าได้ โดยใช้คำสั่งตามบรรทัดที่ 16
วันอาทิตย์ที่ 28 สิงหาคม พ.ศ. 2559
Adviser meeting 29/8/2559
สิ่งที่ดำเนินการไปแล้ว1. create show advise time for pdf news
2. edit check_error_announce() about datetime filter
3. edit time advise to show only in create page
4. edit video plugin template to be center
5. set video plugin auto play and loop when showing
6. edit image plugin to show full screen
7. บทที่ 3
สิ่งที่จะดำเนินการต่อ
1. text plugin edit ได้
set video plugin auto play and loop when showing
กำหนดให้เมื่อข่าว video กำลังแสดงในหน้าจอให้เล่นโดยอัตโนมัติและเล่นวนซ้ำ แต่ถ้าอยู่ในหน้าอื่นจะไม่ให้เล่นอัตโนมัติและเล่นซ้ำ
edit time advise to show only in create page
จากการทำ advise time แนะนำเวลาในการสร้างข่าวประเภท pdf ทำให้เกิดแถบแนะนำเวลาทุกหน้าที่มีข่าว pdf แสดงอยู่ เราจึงทำการแก้ไขโดยให้แถบนั้นแสดงเฉพาะในหน้า create.html หน้าเดีบว
edit check_error_announce() about datetime filter
แก้ไขฟังก์ชัน check_error ใน newsapp/views.py ให้แสดง error แจ้งไปในหน้า create.html ได้เมื่อการสร้าง program มีเวลาทับซ้อนกับ program อื่น
create show advise time for pdf news
ในเวลาที่สร้างข่าวประเภท pdf จะมีฟังก์ชันช่วยแนะนำเวลาในการแสดงข่าว pdf ว่าแสดงนานขนาดไหน จึงจะทำให้ผู้อ่านข่าวบนหน้าจอสามารถอ่านข่าวได้จบ โดยทำการแก้ไข pdf_plugin.html ให้นับหน้า page ทั้งหมด
วันจันทร์ที่ 22 สิงหาคม พ.ศ. 2559
Adviser meeting 23/8/2559
สิ่งที่ดำเนินการไปแล้ว1. create search_news()
2. create url for search_news()
3. back end และ front end ของระบบ login (ยังไม่ได้รวม)
สิ่งที่จะไปทำเพิ่ม/แก้ไข
1. ระบบ login อาจมีเพิ่มฟังก์ชั่นการใช้ไฟล์ csv ในการสร้าง user
2. ใส่บทที่ 3 ใน bitbucket
create search_news()
ในไฟล์ newsapp/views.py สร้างฟังก์ชันที่ใช้ในการ search ค้นหาข่าวได้แก่ ฟังก์ชัน search_news() และ pagination_news() ที่ใช้ในการหาข่าวออกมาแสดงครั้งละ 6 ข่าวในแต่ละหน้า เนื่องจากใน template ที่ออกแบบมีการกำหนดให้แสดงข่าวที่ search มาได้ครั้งละ 6 ข่าวถ้ามีข่าวมากกว่านี้จะมีปุ่มหน้า page ให้เลือกดูข่าวในหน้าถัดไป ต่อมาในส่วนการแสดง preview page ของข่าวประเภท pdf ได้มีการเปลี่ยนให้เป็นรูปสัญลักษณ์ pdf แล้ว
วันจันทร์ที่ 15 สิงหาคม พ.ศ. 2559
Adviser meetig 15/08/2559
คำถาม1. ถ้าให้มีการคัดลอกรายการได้เวลา ผู้ใช้ค้นหาข่าว จะมีข่าวซ้ำๆปรากฎขึ้นมา จะแก้ปัญหานี้อย่างไร
2. คิดว่าโปรเจ็คนี้ตอนเสร็จเป็นอย่างไร
ข้อกำหนด
1. เราจะกำหนดให้ 1 ประกาศสร้างไดเ 1 plugin
สิ่งที่จะดำเนินการต่อ
1. หาขนาดไฟล์ที่เหมาะสมในการ upload ในแต่ละ plugin
2. pdf แสดง preview เป็นรูปไฟล์ pdf ไปก่อน
3. pdf plugin ปรับขนาดให้เต็มจอ และใช้มีตัวช่วยคำนวณเวลาที่ pdf แสดงตามจำนวนหน้า
*search publish_date, announce_date
วันอาทิตย์ที่ 14 สิงหาคม พ.ศ. 2559
customize template in newsapp
ปรับปรุง template ต่างๆใน newsapp ได้แก่หน้า programs.html, table.html, view_screen.html และ show.html ซึ่งหน้า show.html มีไว้ใช้สำหรับดึงข้อมูลข่าวมาใช้แสดงในหน้านี้
หน้า programs.html
หน้า view_screen.html
หน้า table.html
create forms file upload
ใน newsapp/form.py ทำการสร้าง form สำหรับ upload ไฟล์ของแต่ละ plugin ได้แก่ Image plugin, pdf plugin และ video plugin
create template for FullImagePlugin
ใน myapp/template สร้าง template สำหรับ FullImagePlugin โดยจะแสดงภาพแบบเต็มจอโดยปรับขนาดภาพให้พอดีกับความสูงของหน้าจอ
create FullImagePlugin
ในไฟล์ myapp/cms_plugins.py ทำการสร้าง plugin ใหม่ชื่อ FullImagePlugin() ใช้เป็น plugin แสดงรูปภาพแบบเต็มจอ
add FullImage model
ใน myapp/models.py เพิ่ม model สำหรับใช้สร้าง Full image plugin มาเป็น plugin สำหรับแสดงรูปภาพแบบเต็มจอ
edit get_preview_page by using Firefox webdriver
ในไฟล์ newsapp/views.py ส่วนฟังก์ชัน get_preview_page() ที่ใช้สร้าง preview page พบว่าการใช้ phantomjs เป็น webdriver ผลของรูปภาพที่ได้เมื่อใช้งานกับ pdf plguin กับ video plugin มีปัญหารูปภาพไม่ขึ้นกับ missing flash plugin จึงได้ทำการแก้ไขโดยใช้ Firefox มาเป็น webdriver
add spiner process modal
ในไฟล์ create.html ในแต่ละ modal ที่ใช้เพิ่ม plugin ในแต่ละ page เมื่อมีการกด save แล้วในขณะที่กำลังรอการประมวลผลจาก server จะมี process spiner ปรากฎ
add limit file size and file type
ในไฟล์ newsapp-jquery.js ในแต่ละ modal ที่ใช้เพิ่ม plguin เข้าไปในแต่ละ page มีการจำกัดขนาดของไฟล์ที่ใช้ upload ใน image plugin, pdf plugin และ video plugin
edit toggleSelect and meetSelect to create true url for adding plugin
ในไฟล์ newsapp-jquery.js ทำการแก้ไขฟังก์ชัน toggleSelect() และ meetSelect() ให้เปลี่ยน url ในแต่ละ model ที่ใช้เพิ่ม plugin ให้ใช้ url ที่ถูกต้อง
edit modal plugin to support with server
ในแต่ละ modal ที่ใช้กดเพื่อเพิ่ม plugin เข้าไปในแต่ละ page ถูกแก้ไข tag form เพื่อให้สามารถใช้งานได้
add urls for add plugin
ในไฟล์ newsapp/urls.py ทำการเพิ่ม url ที่เกี่ยวข้องกับการเพิ่ม plugin ไปใส่ในแต่ละ page ในหน้า create.html
edit add_image_plugin, add_pdf_plugin and add_video_plugin to work
ในไฟล์ newsapp/views.py ทำการแก้ไข add_image_plugin(), add_pdf_plugin() และ add_video_plugin() จนสามารถใช้งานได้
image plugin
pdf plugin
video plugin
edit add new_page button to show preview page
ในที่นี้แก้ไขไฟล์ newsapp-jquery.js โดยในส่วน tags field ให้มีการอ่านค่าในนี้แล้วนำไปเปลี่ยนค่า id ของ page ที่ถูกกดเลือกอยู่ จากนั้นในส่วนของการกดปุ่มเพิ่ม page ใหม่ได้ปรับปรุงข้อมูล json ให้ถูกต้องแล้วส่งไปยัง server เมื่อเสร็จแล้วให้เพิ่ม page ใหม่ขึ้นมาแสดงให้ผู้ใช้เห็น ต่อมาในส่วนของการกดลบ page ให้ลบ page ที่ถูกกดลบไม่แสดงให้ผู้ใช้เห็นอีก จากนั้นทำการสร้างฟังก์ชัน meetSelect() ไว้ใช้ใส่ค่า id ของ page ที่จะถูกนำไปใช้เวลาเพิ่ม plugin ในแต่ละ page
edit add_new_page() to create new page
ในฟังก์ชัน add_new_page() ถูกแก้ไขโดยมีการกำหนด page preview ของ page ที่ถูกสร้างใหม่ให้เป็นรูปหน้าเว็บว่างเปล่า(รูปพื้นสีขาว) ในส่วนการสร้างรูป page preview มีการกำหนดให้ใช้ url สำหรับสร้างหน้า page preview ที่ถูกต้อง เพราะก่อนหน้านี้ใช้ url ที่ไม่ถูกต้องจึงทำให้รูป page preview ที่ได้เป็นรูปสีขาวอย่างเดียว
text plugin avaliable but can not upload image
ทำการแก้ไขปรับปรุง text plugin จนใช้งานได้ แต่ยังไม่สามารถ upload ไฟล์รูปภาพขึ้นไปแสดงได้ คือถ้าพิมพ์ข้อความ ปรับแต่งข้อความเป็นตัวเล็ก ตัวไหญ่ ตัวหนา ตัวเอง สามารถทำได้
ถ่ายภาพหน้าจอด้วย selenium โดยใช้ Firefox webdriver
ก่อนหน้านี้เราทำการรับภาพ preview ของหน้าเว็บโดยการใช้ phantomjs มาทำเป็น webdriver ผลที่ได้ก็ทำให้ได้รูปภาพที่ต้องการ แต่ในบางกรณีรูปภาพที่ได้มีปัญหา คือในกรณีที่หน้าเว็บเป็น plugin pdf ผลที่ได้คือจะมองไม่เห็นตัว pdf viewer ดังรูปด้านล่างนี้ ส่วนที่เป็นพื้นที่โล่งตรงกลางรูปภาพคือส่วน pdf viewer ที่มองไม่เห็น
และในกรณีใช้งาน video plugin ในหน้าเว็บจะพบปัญหา missing flash plugin ทำให้ตัว video player ไม่ปรากฎขึ้นมาให้เราเห็นในรูปภาพ ดังรูปด้านล่างนี้
วิธีแก้ไขคือใช้ Firefox webdriver ดังตัวอย่างด้านล่างนี้
#!/usr/bin/env python from pyvirtualdisplay import Display from selenium import webdriver display = Display(visible=0, size=(800, 600)) display.start() # now Firefox will run in a virtual display. # you will not see the browser. browser = webdriver.Firefox() browser.get('http://www.google.com') print browser.title browser.quit() display.stop()
จากตัวอย่างด้านบน ให้เราติดตั้ง library pyvirtualdisplay ก่อนซึ่ง library ตัวนี้จะใช้ไม่ให้มีการเปิด web browser ขึ้นมาเมื่อ selenium ทำงาน
ติดตั้งด้วยคำสั่ง ดังนี้
$ sudo apt-get install xvfb python-pip$ sudo pip install pyvirtualdisplay วันอาทิตย์ที่ 7 สิงหาคม พ.ศ. 2559
Adviser meeting 8/8/2559
หัวข้อที่เสร็จ1. admin สร้าง แก้ไข ลบเนื้อหาประกาศได้
2. admin ควบคุมเวลาการแสดงประกาศในแต่ละหน้าจอได้และควบคุมให้แต่ละหน้าจอแสดงประกาศที่แตกต่างกันได้
3. admin สร้างประกาศได้ 4 ประเภท ได้แก่ บาทความ, รูปภาพ(JPEG, GIF, BMP, PNG), วิดีโอ(MP4), และไฟล์ pdf
วันพุธที่ 3 สิงหาคม พ.ศ. 2559
User meeting #3
ข้อเสนอแนะ/คำติชม
1. การใช้งานดูแตกต่างจากเดิมอยู่บ้าง น่าสนใจมากขึ้น สามารถสร้างข่าวสารได้จากไฟล์อื่นนอกจากรูปภาพ
2. อยากให้สั่งปิดการแสดงรายการได้ผ่านเว็บ
3. มีข้อสงสัยเกี่ยวกับการกำหนดเวลาบางส่วน แต่เมื่ออธิบายอย่างละเอียดแล้วก็มีความรู้สึกพึงพอใจ
4. มีความพอใจกับการที่สามารถทำงานนอกสถานที่ได้
Adviser meeting #4/8/2559
สิ่งที่ดำเนินการไปแล้ว1. add edit_program() to get data from create page
2. check whitespace in name_field in create page
3. customize show screen and create add, search button
4. customize create_screen page
5. edit to_create_announce for work with create page
6. set index and name for first_page in to_create_announce()
7. move add-new-widget from create page to newsapp-jquery.js
8. create delete_page_select in newsapp/views.py
9. edit delete_announce by delete all page in program that be delete
10. move sortable to newsapp-jquery.js and add form to modal
11. add action when click garbage button
12. add data for send to server in saveAnnounce()
13. add check button in edit_program()
14. add alert when save success or failure
15. check button if publish in create.html
สิ่งที่จะดำเนินการต่อ
1.แก้ไขการ alert ของการ create ให้ alert เมื่อกรณีเกิดข้อผิดพลาด ไม่ต้องแจ้งในกรณีที่สำเร็จ
2. เริ่มคิดและเขียนรายงานบทที่ 3 โดยนำเอาความเกี่ยวข้องของ attrubute และการออกแบบต่างๆมาประยุกต์ในการเขียน
สมัครสมาชิก:
บทความ
(
Atom
)