Mục LụcPhần 1: Tổng quan về portlet 31. Nhắc lại về Liferay portal 31.1 Khái niệm về portlet 41.2 Phân loại 51.2.1 JavaServer Page portlet (JSP portlet) 61.2.2 Strusts portlet 61.2.3 JavaServer Faces portlet (JSF portlet) 61.2.4 Vaadin portlet 61.2.5 Spring MVC portlet 71.3 Hoạt động của portlet trong Liferay portal 71.4 Truyền dữ liệu giữa các phase 8Phần 2: Tìm hiểu về JSP portlet và Vaadin portlet 102.1 JSP portlet 102.1.1 Cấu trúc 102.1.2 Mô hình MVC trong JSP portlet 142.1.3 Một vài đặc điểm của JSP portlet 142.2 Vaadin portlet 142.2.1 Cấu trúc Vaadin portlet 162.2.2 Hoạt động của Vaadin portlet 172.2.3 Một vài đặc điểm của Vaadin portlet 17Phần 3: Thực hành – Hướng dẫn phát triển portlet 183. Cài đặt môi trường phát triển portlet 183.1 JSP portlet 193.1.1 Firstportlet 193.1.2 MyGreetingportlet (simple) 203.1.3 MyGreetingportlet1 (Advance) 233.1.4 GreetingSessionPortlet 253.1.5 Ajax portlet 273.1.6 Report portlet 323.2 Vaadin portlet 342 | Page3.2.1 FirstVaadin portlet3.2.2 NotifyVaadin portlet3.2.3 Login portlet3.2.4 Vaadinportlet mode3.3 Project examplePhần 4: Một số vấn đề tham khảo4. Các tags phổ biến trong portlet4.1 Tùy chỉnh portlet trên giao diện4.2 Các quy ước chuẩn về codePhần 5: Phân công công việcPhần 6: Kết luậnPhần 7: Tài liệu tham khảoPhần 1: Tổng quan về portlet1. Nhắc lại về Liferay portal3 |
TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI VIỆN CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THỒNG o0o BÀI TẬP LỚN CÔNG NGHỆ WEB VÀ DỊCH VỤ TRỰC TRUYẾN Đề tài: Phát triển portlet cho người dùng Giảng viên hướng dẫn: Thầy Tạ Tuấn Anh Nhóm thực hiện: Sinh viên thực hiện: Nhóm 04 - HTTT K52 Dương Mạnh Linh 20071697 Mai Ngọc Dương 20070009 Nguyễn Văn Minh 20071970 Vũ Văn Thiện 20072737 Lê Quang Vịnh 20073503 Đỗ Như Linh 20071700 Lớp HTTT – K52 Hà Nội – Tháng 11/2011 | Page Mục Lục Phần 1: Tổng quan portlet Nhắc lại Liferay portal 1.1 Khái niệm portlet 1.2 Phân loại 1.2.1 JavaServer Page portlet (JSP portlet) 1.2.2 Strusts portlet 1.2.3 JavaServer Faces portlet (JSF portlet) 1.2.4 Vaadin portlet 1.2.5 Spring MVC portlet 1.3 Hoạt động portlet Liferay portal 1.4 Truyền liệu phase Phần 2: Tìm hiểu JSP portlet Vaadin portlet 2.1 JSP portlet 10 10 2.1.1 Cấu trúc 10 2.1.2 Mơ hình MVC JSP portlet 14 2.1.3 Một vài đặc điểm JSP portlet 14 2.2 Vaadin portlet 14 2.2.1 Cấu trúc Vaadin portlet 16 2.2.2 Hoạt động Vaadin portlet 17 2.2.3 Một vài đặc điểm Vaadin portlet 17 Phần 3: Thực hành – Hướng dẫn phát triển portlet 18 Cài đặt môi trường phát triển portlet 18 3.1 JSP portlet 19 3.1.1 First-portlet 19 3.1.2 MyGreeting-portlet (simple) 20 3.1.3 MyGreeting-portlet1 (Advance) 23 3.1.4 Greeting-Session-Portlet 25 3.1.5 Ajax portlet 27 3.1.6 Report portlet 32 3.2 Vaadin portlet 34 | Page 3.2.1 FirstVaadin portlet 3.2.2 NotifyVaadin portlet 3.2.3 Login portlet 3.2.4 Vaadin-portlet mode 3.3 Project example Phần 4: Một số vấn đề tham khảo Các tags phổ biến portlet 4.1 Tùy chỉnh portlet giao diện 4.2 Các quy ước chuẩn code Phần 5: Phân công công việc Phần 6: Kết luận Phần 7: Tài liệu tham khảo Phần 1: Tổng quan portlet Nhắc lại Liferay portal | Page Portal là: Cổng thơng tin điện tử tích hợp điểm truy cập tập trung nhất, tích hợp kênh thơng tin, dịch vụ ứng dụng, phân phối tới người sử dụng thông qua phương thức thống đơn giản tảng Web Có nhiều loại cổng thơng tin khác cung cấp nhiều loại dịch vụ ứng dụng khác nhau, nhiên chúng phải có số tính như: - Khả cá nhân hóa (Personalization) Tích hợp nhiều loại thơng tin (Content aggregation) Xuất thông tin (Content syndication) Hỗ trợ nhiều môi trường hiển thị thông tin (Multidevice support) Khả đăng nhập lần (Single Sidn on – SSO) Quản trị portal (Portal administrator) Quản trị người dùng (Portal user management) Chính tính điểm phân biệt website bình thường, ứng dụng quản trị nội dung (CMS) hay ứng dụng chạy tảng web (Web application) với cổng thông tin Khái niệm bị nhầm lẫn nhiều người Portal có tính giúp người quản trị thu thập, quản lý nhiều nguồn thông tin khác nhau, từ phân phối chúng dạng dịch vụ cho người dùng khác tuỳ thuộc vào nhóm quyền, vào nhu cầu mục đích người dùng Portal thực việc linh động, từ cơng việc tìm xem đặt mua sách kho hàng trực tuyến, xem thay đổi thông tin sinh viên giáo viên ứng dụng quản lý giảng dạy, đến việc đăng chia sẻ thông tin, tài nguyên, viết diễn dàn hay cung cấp việc truy cập thống thuận lợi đến thông tin nội website công ty Portal cổng vào vạn cho người dùng tìm kiếm thông tin tác nghiệp cách thuận lợi dễ dàng Khái niệm Portal xuất từ lâu, trải qua trình dài phát triển hoàn thiện Liferay portal giải pháp cổng thơng tin với mã nguồn mở tồn diện phổ biến 1.1 Khái niệm portlet Portlet web application nhỏ chạy portal Nó phần quan trọng cổng thơng tin nào, chứa chức thực tế portal, cụ thể hóa chức thành giao diện tương tác với người dùng Mọi hoạt động portal thực thông qua | Page portlet Nói cách khác, portlet trái tim portal H1 Hình ảnh portlet tren portal (các vùng khoanh) Mỗi portlet phần nhỏ trang web, trang bao gồm nhiều portlet Nó biên dịch thành đoạn mã HTML trang web, thế, portlet không bao gồm tag , hay Portal kết hợp đoạn mã HTML từ nhiều portlet gộp thành trang web hoàn chỉnh Nội dung sản sinh portlet đuợc gọi fragment Một fragment phần ngôn ngữ đánh dấu (như HTML, XHTML, WML) tuân thủ nghiêm ngạt luật kết hợp với fragments khác tạo nên tài liệu hồn chỉnh Nội dung portlet thơng thường tích hợp với nội dung portlet khác để hình thành nên trang cổng điện tử Chu kỳ sống portlet quản lý portlet container Portlet container thành phần quản lý portlet portal, chịu trách nhiệm quản lý, thiết lập, cung cấp tài nguyên, quản lý chu trình sống portlet Portlet container nhận yêu cầu từ cổng điện tử thực thi yêu cầu portlet mà quản lý Portlet container khơng chịu trách nhiệm kết hợp nội dung sản sinh portlet, trách nhiệm thuộc portal Một cách khác, coi portlet container trạm trung giam điều phối hoạt động portlet portal 1.2 Phân loại Portlet có nhiều loại khác Liferay portal hỗ trợ Một số loại portlet phổ biến kể đến như: | Page o o o o o JavaServer Page (JSP) portlets Struts portlets JavaServer Faces (JSF) portlets Vaadin portlets Spring Model–View–Controller (MVC) portlets 1.2.1 JavaServer Page portlet (JSP portlet) Đây loại portlet đơn giản Liferay Phần core xử lý viết java Các nhà phát triển dễ dàng hiểu phát triển JSP portlet cấu trúc, cách thức xử lý logic JSP portlet đơn giản dễ hiểu Trong Liferay plugin SQK có chế độ tự động sinh portlet theo dạng JSP portlet, coi mà loại portlet mặc định 1.2.2 Strusts portlet Strusts portlet thiết kế theo mơ hình MVC dựa tảng Struts Portlet Framework Strust portlet công nghệ hoàn chỉnh portlet nhiên việc phát triển khó khăn Chúng ta tải Struts portlet Struts 2.0 portlet trang download Liferay 1.2.3 JavaServer Faces portlet (JSF portlet) Portlet xây dựng tảng Java Server Faces APIs SUN Đây công nghệ tiêu chuẩn để xây dựng giao diện người dùng phía máy chủ, thiết kế để giúp cho nhà thiết kế giao diện web dễ dàng Trên giao diện download Liferay, ta lấy WAR file cho JSF 1.1 JSF 1.2 Portlet 1.2.4 Vaadin portlet Vaadin portlet portlet hỗ trợ Liferay portal chạy phiên cũ cách cài đặt thủ công thông qua file thư viện mở Vaadin Vaadin portlet có đặc điểm thú vị viết Vaadin portlet hồn tồn phía server, khơng cần lo ngại HTML, CSS, Javascript hay tương thích với trình duyệt hồn tồn xử lý từ bên Vaadin portlet phát triển dựa Vaadin Framework | Page 1.2.5 Spring MVC portlet Liferay portal hỗ trợ Spring MVC portlet Spring MVC portlet tiếng với khía cạnh lập trình định hướng Được phát triển dựa Spring Web Flow (SWF), Spring Framework – giải pháp tốt cho việc quản lý dòng chảy ứng dụng web Cụ thể cho phép chụp dịng kiện module khép kín tái sử dụng cho tình khác Và vậy, lý tưởng cho việc xây dựng module ứng dụng web cho phép nhà quản lý dễ dàng quản lý giao dịch mà không cần quan tâm đến vấn đề xử lý mức độ thấp 1.3 Hoạt động portlet Liferay portal Một điểm đặc thù portlet cần tới bước để hiển thị Nó khác biệt với nhiều người phát triển servlet hay người quen sử dụng ngôn ngữ thông dụng nhu PHP, Python hay Ruby… Lý cho việc phải sử dụng đến phases portlet trang HTML hồn chỉnh, phần nhỏ trang Trang tin tạo cách gọi portlet điền mã HTML bổ sung cho chúng để có trang HTML hoàn chỉnh Tuy nhiên,việc đem lại vài rắc rối Ta hình dung q trình hoạt động portet portal sau: Khi người dùng tương tác với trang web, chẳng hạn bấm vào link portlet cụ thể Tất nhiên cổng thơng tin phải có trách nhiệm xử lý kiện trả lại kết cho portlet Sau phải làm nhiệm vụ hiển thị trang web bao gồm portlet vừa tác động( nội dung portlet thay đổi ), đồng thời phải thị nội dung portlet khác Việc cần thiết portlet người dùng không tương tác đến nội dung bị thay đổi hành động vừa người dùng Vậy làm để cổng thông tin hiển thị nội dung portlet khác khơng có tác động đến chúng? Chúng ta hình dung kịch bản: Chúng ta có trang bán hàng với portlet, navigation-portlet (portlet cho hình thức vận chuyển hàng) shopping-portlet Người dùng thao tác với trang sau: - Người dùng vào trang bán hàng Click vào button shopping-portlet để mua hàng Lúc này, tài khoản giỏ hàng người dùng tự động cập nhật bắt đầu trình để vận chuyển sản phẩm cần mua Sau | Page - hoạt động này, cổng thông tin gọi đến navigation-portlet với giao diện mặc định Người dùng bấm vào link navigation-portlet để chọn kiểu vận chuyển Nội dung portlet thay đổi Sau cổng thơng tin phải hiển thị lại nội dung shopping-portlet, lặp lại hành động cuối người dùng click vào nút mua hàng trình mua hàng lặp lại dẫn đến trình vận chuyển … Và để portlet có nội dung nó, cần phải yêu cầu lại tới portal Việc cịn lặp lại nhiều lần (ít tài khoản người dùng đến giới hạn) Ta thấy, rõ ràng kịch khơng Để ngăn chặn tình này, đặc điểm kỹ thuật portlet định nghĩa giai đoạn cho yêu cầu portlet phép cổng thơng tin phân biệt hành động thực (tất nhiên không nên lặp lại) nội dung sinh ra: - - Action phase: Giai đoạn thực portlet thời điểm thường kết việc tương tác người dùng với trang web Trong giai đoạn này, portlet thay đổi trạng thái Nó đề nghị thực tác động thay đổi CSDL hay hoạt động mà không cần lặp lặp lại Render phase: Giai đoạn luôn áp dụng cho tất portlet trang bao gồm portlet vừa tác động portlet khác Nó thực thi có tác động làm thay đổi đến nội dung trang Có điểm quan trọng trang, thứ tự render portlet không xác định Nếu cần thiết cho viện này, Liferay có mở rộng render-weight liferay-portlet.xml muốn sử dụng người dùng phải tự thêm vào Các portlet có render-weight cao render trước 1.4 Truyền liệu phase Như trình bày, portlet hoạt động phase Vậy làm cách mà liệu hay thông tin truyền từ phase sang phase kia? Có cách mà ta làm để truyền liệu từ action phase vào render phase | Page - Thứ nhất, ta truyền qua biến Trong lúc thực processAction ta truyền thêm tham số cho bước render: actionResponse.setRenderParameter("parameter-name", "value"); Trong render phase (file jsp) giá trị đọc sử dụng biến bình thường: renderRequest.getParameter("parameter-name"); (*) Chú ý - Khi gọi actionURL, tham số truyền đọc giai đoạn action phase (trong phương thức proceessAction) Để truyền tham số cho bước render phase ta phải lấy chúng từ actionRequest sau sử dụng phương thức setRenderParamater cho tham số cần Một ý quan trọng biến RenderParamater portal ghi nhớ portlet gọi với tham số khác Do trường hợp người dùng sử dụng portlet tạo tham số, sau người dùng tiếp tục tác động đến portlet khác, lần trang nạp lại, portal render lại portlet sử dụng tham số thiết lập Điều có nghĩa thơng báo (giả sử thơng báo “Save successfuly” ví dụ trên) khơng phải bấm Save Phương pháp thứ ta sử dụng sử dụng session Trên thực tế phương pháp tốt so với phương pháp Nó khơng truyền tham số cho portlet mà tất portlet lấy Có thể người quen với cách lập trình với ngơn ngữ khác Để thực việc này, ta sử dụng thêm lớp SesionMessage liferay cung cấp Cụ thể ta trình bày phần (9) Greeting-Sesion-portlet | Page Phần 2: Tìm hiểu JSP portlet Vaadin portlet 2.1 JSP portlet 2.1.1 Cấu trúc Trong Eclipse Liferay IDE, portlet mặc định tạo project JSP portlet, xây dựng dựa mơ hình chuẩn theo MVCPortlet Framework Nó ẩn nhiều phần xử lý phức tạp phía portlet giúp cho người phát triển dễ dàng nắm bắt cấu trúc, cách xây dựng xử lý portlet mà không cần quan tâm nhiều đến cách xử lý bên Nhìn qua portlet gồm phần chính: Java source Configuration file Client-side file (.jsp, css, js, images, …) Khi sử dụng Liferay Plugin SDK để tạo portlet, cấu trúc thư mục chứa có dạng sau : Folder Structure: H2 Portlet Structure - Phần Java source chứa thư mục docroot/WEB-INF/src 10 | Page Liferay security tag phần khơng thể tách rời tính chứng thực phân quyền Liferay Liferay-security:doAsURl Tag Liferay security tag liferay-security:doAsURL Một ví dụ trình bày đây: Tag diễn tả lớp com.liferay.taglib.security.DoAsURLTag Nó sinh URL để mạo danh người dùng khác đưa giá trị URL vào pageContext URL cuối sử dụng Impersonate User (Open New Window) link hình đây: Liferay-security:permissionsURL Tag liferay-security:permissionsURL diễn tả quền hạn người dùng Nó cho phép người dùng thiết lập phân quyền tài nguyên Tài nguyên portlet, model page Permission URL tag trả URL mà đưa người dùng tới trang nơi họ tùy chỉnh cấu hình phân quyền 47 | Page Giá trị thuộc tính modelResource tên lớp Java tiêu chuẩn Tên chuyển đổi thông qua file Language.properties để trở nên thân thiện Giá trị modelResourceDescription thứ Trong ví dụ lấy tên trang cục Thuộc tính resourcePrimKey lấy giá trị page layout ID Tag diễn tả lớp com.liferay.taglib.security.PermissionsURLTag Nếu giá trị thuộc tính var khơng null, tạo permissions URL thiết lập thuộc tính pageContext với giá trị var tên Nếu giá trị thuộc tính var null, đơn giản đưa permissions URL đoạn mã HTML Tag lấy từ file $AS_ROOT_HOME/html/portlet/communities/ edit_pages_page.jsp PermissionsURL tạo cho nút Permissions trang đó, ví dụ đây: Trong hình đây, thấy cho trang default cộng đồng Guest Tên trang Welcome Khi ta click vào nút Permissions, ta thấy trang mà ta cấu hình phân quyền cho trang /web/guest/home 48 | Page Liferay theme tags Liferay theme tag phần quan trọng việc coding portlet UI Liferay-theme:defineObjects Đây tag quan trọng mà ta thường xuyên sử dụng Nó diễn tả lớp com.liferay.taglib.theme.DefineObjectsTag Vậy tag có tác dụng nảo? Nó đưa themeDisplay, company, user, scopeGroupId, đối tượng thường xuyên sử dụng khác vào pageContext, sử dụng trực tiếp chúng file JSP – việc biết cách sử dụng tag quan trọng - Liferay-theme:include Tag liferay-theme:include bao gồm file JSP trang portal Một ví dụ tag trình bày đây: Tag liferay-theme:include diễn tả lớp com.liferay.taglib.theme.IncludeTag - Liferay-theme:layout-icon Tag liferay-theme:layout-icon sử dụng lần Liferay Portal Chúng ta xem ví dụ sau: Tag diễn tả lớp com.liferay.taglib.theme.LayoutIconTag Nó thiết lập thuộc tính bố trí giá trị đối tượng HTTP servlet request - Liferay-theme:meta-tags Tag liferay-theme:meta-tag, trình bày đây, sử dụng lần Liferay Portal: Tag diễn tả lớp com.liferay.taglib.theme.MetaTagsTag Nó bao gồm meta tag markup trang portal Ví dụ cho thấy điều này: 49 | Page liferay-theme:wrap-portlet Một theme tác khác tag liferay-theme:wrap-portlet, ví dụ đây: Tag liferay-util:buffer diễn tả lớp com.liferay.taglib.util.BufferTag class Nó thiết lập cặp thuộc tính – giá trị 50 | Page pageContext Trong ví dụ trên, thuộc tính có tên removeGroupIcon; giá trị thuộc tính trả tag liferay-ui:icon - liferay-util:html-top Tag Liferay utility liferay-util:html-top Tag diễn tả lớp com.liferay.taglib.util.HtmlTopTag class Nó thêm nội dung tag liferay-util:html-top phần body trang portal - liferay-util:include Đây tag liferay-util:include: Nó thường dùng để thêm file JSP Dịng vừa lấy từ $AS_ROOT_HOME/html/common/themes/portlet_content_wrapper.jspf, sử dụng để thể nội dung portlet có liên quan thông điệp phụ thuộc vào, cho dù người xem có quyền truy nhập vào portlet hay khơng - liferay-util:param Tag cuối Liferay utility tag liferay-util:param Tag diễn tả lớp com.liferay.taglib.util.ParamTag Nó thêm cặp tham số - giá trị vào đối tượng yêu cầu cho việc sử dụng file JSP tag bao quanh Trong ví dụ trên, file JSP file $AS_ROOT_HOME/html/portlet/ communities/toolbar.jsp 51 | Page 4.1 Tùy chỉnh portlet giao diện Portlet and layout Trong Liferay portal, layout (cách bố trí) chia trang portal thành nhiều vùng khác Một nhiều portlet xếp vùng Chúng ta kéo thả portlet đến vùng layout, thay đổi giao diện người dung cách linh động Đây tiện ích Liferay portal: áp dụng layout vào trang Khơng thế, ta đưa portlet vào vùng 1layout Bằng phương pháp kéo thả, thay đổi giao diện website vòng vài phút, điều gây bất ngờ thú vị người thường xuyên truy nhập vào website Liferay cung cấp cho 10 layout mặc định, layout đáp ứng hầu hết thiết kế liferay portal Tất nhiên tự tạo layout riêng Các layout mặc định là: - Freeform - cột - cột (50/50) - cột (30/70) - cột (70/30) - cột - 1-2 cột (30/70) - 1-2 cột (70/30) - 1-2-1 cột - 2-2 cột Quay trở lại với portlet để kiểm tra xem layout dược sử dụng trang Faceone Để kiểm tra ta vào menu Manage vào tiếp Page layout, cửa sổ sau: 52 | Page Nhìn hình ta thấy ô columns (30/70) đánh dấu Điều có nghĩa layout sử dụng cho trang FaceOne Điều giải thích giao diện trang FaceOne portlet Sign In nằm phía bên trái lại có độ dài ngắn portlet uisix phía bên phải Chúng ta cần lưu ý layout column hình sử dụng thường xuyên Nếu muốn sử dụng layout cho trang portal ta làm theo bước sau: Click vào nut x màu nỏ để tắt layout popup Tạo trang tên FaceTwo Vào giao diện FaceTwo, chọn Manage chọn tiếp Page Layout Chọn layout column click vào Save Thao tác giúp ta có layout column trang FaceTwo Thêm vào uisix portlet vào trang FaceTwo Usix Portlet chiếm toàn chiều dài trang FaceTwo Khi thêm trang mới, trình duyệt khơng refresh Tuy nhiên lần truy nhập ta thấy trang FaceTwo tồn Vậy làm mà lưu vào sở liệu? Nó lưu nhờ phương thức AJAX gọi đến 53 | Page Portlet content portlet template Một portlet Liferay có phần: - Portlet content: Là phần bên mà hiển thị văn text, hình ảnh cho người dung - Portlet template: Là phần bên chứa icon cho việc chỉnh sửa portlet Phần chỉnh sửa giao diện Khi portlet khởi tạo, Liferay vẽ đường viền xung quanh Hành động cấu hình file $PLUGIN_SDK_HOME/portlets/unisex-portlet/docroot/WEB-INF/ liferay-portlet.xml Việc hiển thị đường viền hoàn toàn chỉnh sửa lại cách sử dụng file template $AS_ROOT_HOME/ html/common/themes/portlet.jsp File chịu trách nhiệm vẽ đường viền xung quanh portlet hình thấy File $AS_ROOT_HOME/html/common/themes/portlet.jsp vẽ button để điều khiển portlet bao gồm: - Look-and-field configuration (Chỉnh sửa font chữ, cách thể …) - Minimize (Thu nhỏ cửa sổ portlet) - Maximize (Phóng to cửa sổ portlet) - Close (Đóng portlet) - Move up (Di chuyển portlet lên trên) - Move down (Di chuyển portlet xuống dưới) - Preferences (Tùy biến portlet – sử dụng chế độ chỉnh sửa hỗ trợ) 54 | Page - Help (Các dẫn – hiển thị chế độ dẫn hỗ trợ) Portal khởi tạo tham số ngữ cảnh để định template hiển thị button Ngoài portlet template, portlet content điều chỉnh Điều thực thông qua file CSS file JavaScript đóng gói file WAR portlet File CSS file JavaScript được đặc tả thông qua file $PLUGIN_SDK_HOME/portlets/unisexportlet/docroot/WEB-INF/liferay-portlet.xml /css/portlet.css /js/javascript.js Customizing portlet chrome Một trang portal bao gồm nhiều portlet Một portlet thành phần động trang portal Trong phần này, nói việc làm để tùy biến portlet Portlet chrome Trong hình đây, thành phần sau gọi chung Portlet Chrome - icon nhỏ phía bên trái portlet - Portlet title - Icon chức Look and Fiew Configuraion - Icon thu nhỏ - - Icon phóng to + - Icon xóa x 55 | Page Chúng ta điều khiển việc xuất portlet chrome với theme style sheet Portlet icon mơ tả file cấu hình $PLUGIN_SDK_HOME/ portlets/unisex-portlet/docroot/WEB-INF/liferay-portlet.xml : uisix /icon.png //ignore details Portlet title tùy chỉnh file: $PLUGIN_SDK_HOME/ portlets/unisex-portlet/docroot/WEB-INF/ portlet.xml uisix uisix uisix Tùy chỉnh portlet icon Dựa vào hình đây, ta thay file icon.png thư mục uisix-portlet/docroot Nếu muốn ẩn biểu tượng icon ta phải làm nào? Chúng ta cần tạo theme tùy chỉnh, gọi uisix-theme cho uisix-portlet Sau trong file $PLUGIN_SDK_HOME/portlets/unisex-portlet/ 56 | Page docroot/_diffs/templates/portlet.vm, sau tìm đến dịng sau, ta xóa $theme.iconPortlet() icon khơng xuất thêm $theme.iconPortlet() text">$portlet_title file="/html/portlet/journal/ 57 | Page Sử dụng dấu ngoặ đơn cho xâu JavaScript, sau: confirm('') Sử dụng fieldset để nhóm trường đầu vào có liên quan đến nhau, ví dụ sau: Orchard Fruits Apple Orange Sử dụng dấu phân cách có sẵn Liferay để phân biệt phần loại khác nhau, sau: Nếu tuân theo quy ước coding, UI mà tạo quán UI có sẵn Liferay portal 58 | Page Phần 5: Phân công công việc Các thành viên nhóm: Dương Mạnh Linh Vũ Văn Thiện Mai Ngọc Dương Nguyễn Văn Minh Đỗ Như Linh Lê Quang Vịnh 20071697 20072737 20070009 20071970 20071700 20073503 Nhóm trưởng Phân cơng cơng việc: Tìm hiểu, cài đặt mơi trường để phát triền portlet - LinhDM Customize portlet + conventions – DuongMN + VinhLQ Ajax for portlet interface – LinhDN + VinhLQ Pdf + exel report – MinhNV + ThienVV Vaddin portlet – ThienVV + LinhDM Common portlet tag – DươngMN Code project example – LinhDM 59 | Page Phần 6: Kết luận Trong báo cáo, nhóm em trình bày tìm hiểu portlet Đồng thời trình bày cách chi tiết ví dụ mà nhóm thực từ giúp người đọc hiểu hình dung rõ nét bước để phát triển portlet Liferay portal Bên cạnh số tham khảo tag phổ biến hay sử dụng, quy tắc viết code để rõ ràng dễ đọc, giúp đỡ người đỡ cơng tìm kiếm nhanh chóng bắt tay vào việc phát triển portlet Em xin cảm ơn thầy Tạ Tuấn Anh kiến thức bổ ích Liferay portal! 60 | Page Phần 7: Tài liệu tham khảo Packtpub.Liferay.User.Interface.Development.Nov.2010.pdf - Dr Jonas X Yuan, Xinsheng Chen, Frank Yu Liferay Portal Enterprise Intranets.pdf - Dr Jonas X Yuan Các tài liệu hướng dẫn trang chủ Liferay: http://www.liferay.com/ documentation/ Tài liệu hướng dẫn Vaadin: https://vaadin.com/tutorial Và số tài liệu mở khác internet 61 | Page ... window) { // Switch the view according to the portlet mode if (request.getPortletMode () == PortletMode.EDIT) window.setContent(editContent); else if (request.getPortletMode () == PortletMode.VIEW)... HSSFWorkbook () ; wb.createSheet () ; null; null; r = s.createRow( 0); c = r.createCell( 0); 33 | Page c.setCellValue(new HSSFRichTextString("Cell_1 ")) ; c = r.createCell( 1); c.setCellValue(new HSSFRichTextString("Cell_2 ")) ;... Document () ; ByteArrayOutputStream baos = new ByteArrayOutputStream () ; PdfWriter.getInstance(document, baos); document.open () ; document.add(new Paragraph(msg )) ; document.add(Chunk.NEWLINE); document.add(new