I am using liferay 6.2 for migrating my existing web application to liferay.I have done below things:
-->created my own theme extending the _styled theme
-->customized the navigation to have fixed sidebar on the left and content area on the right.
-->Added 3 web content display portlets dynamically and added the content into each of them.
I have all the portlets residing on the same page,these are traversed by using navigation bar on the left side. Now I have new requirement to show content depending on the client.
For e.g. I have 3 client's data right now mixed all together across all portlets ,I have requirement to segregate all the content.For e.g. If user logging in work for X client ,he/she should only see the relevant content . If there is some content which is common to all it should be displayed as it is.
There should also be a way to add/remove client at runtime.Is liferay multi-site capability something I can make use of?
How can I go ahead and achieve this? Any inputs will be highly appreciated.
Related
To improve my programming skills I would like to set up a little project for my work. I would like to create a kind of to do list, with several columns (Note, PO Order, Shipping, Done (as a Checkbox), ect.).
At the end of a day, I want to be able to click on the checkbox for every row which is done and save them in a data file. Also I would like to create this as a web application, running on the server in the company.
Since I would like to improve especially my java skills I would like to do this (if possible) mostly in java and to get in touch with frameworks, so I started to read about Vaadin.
My question is, if you guys could give maybe some experience about a project like this and if it's in general possible to realise this with Vaadin.
To improve my programming skills
If you want to build web apps using pure Java on the server-side, Vaadin fits the bill.
You describe the layout and widgets you want to appear in the user interface using Java code. Then, at runtime, Vaadin automatically generates the necessary HTML, CSS, JavaScript, DOM, AJAX, WebSocket, and Push code needed to render that UI on the client-side in the user’s web browser.
The beautiful part is that you get all the benefits of using those web standards technologies without having to learn them or code them.
create a kind of to do list, with several columns (Note, PO Order, Shipping, Done (as a Checkbox), ect.).
Vaadin provides a powerful and well-designed data-grid widget, Vaadin Grid, that can display such columns including the checkbox.
I want to be able to click on the checkbox for every row
The Vaadin Grid tool has an interactive mode that allows the user to directly edit the row, including clicking on the checkbox.
You could alternatively let the user select several rows and click a button (that you programmed) than would mark them as done, checking the checkboxes of the group at once.
Also, Grid has a built-in feature where it displays a column of checkboxes to be clicked en masse as an alternative to selecting rows. This helps the many users who are not adept at maneuvering through a multi-row selection with mouse-and-keyboard gestures.
I would like to create this as a web application, running on the server in the company.
Your Vaadin-based web app is built on standard Java Servlet technology. So you can deploy to your choice of any of a dozen or more web containers such as Apache Tomcat, Eclipse Jetty, Glassfish, Wildfly, and many more.
I would like to do this (if possible) mostly in java
You can build your web app entirely with Java code by using Vaadin. All Java on the server-side, no Java on the client-side.
You may eventually want to learn a bit of CSS to tweak the fonts and colors and such. But this is optional.
if it's in general possible to realise this with Vaadin.
Indeed, this project sounds like an ideal match to Vaadin.
In contrast, where Vaadin is contraindicated would be:
For web sites with crazy complicated layouts such as slick magazine sites. Vaadin is aimed at business-oriented data-entry apps.
For programmers who want to grapple directly with the HTML, CSS, JavaScript, etc. rather than avoid it.
First question: I am trying to create web app using Vaadin 8.3.1 but I am struggling to understand concept of the UI class. I was reading docs but still I can not somehow understand it. I thought that it is just a basic web page which is currently displayed but I am not sure about that definition. So my question is what exactly is UI, how can I navigate between UI's, when to use view and when to use UI ?
Second question: I was reading docs about navigation between views but I was not able to display anything. In UI all we have to do is to setContent and that is it. But what about Views ? How can I display something using views ?
Thanks for any help !
The basic concept of Vaadin is to create single page web applications. The UI class is the root of the dynamic web page, which has changing content, the views. So typical Vaadin application does not consist of multiple UI's, but single one. (It can have many, but I said typical)
One UI can thus have many views. Usually in main UI you set root content, a main layout that consist of menu and content container (a layout) for Views. When Navigator is setup, it is given that content holder, and then based on navigation Navigator will be placing the views to content area. This is described in detail here:
https://vaadin.com/docs/v8/framework/advanced/advanced-navigator.html
Apparently you want to integrate Spring with Vaadin, and for this you need Vaadin Spring add-on. The documentation is here:
https://vaadin.com/docs/v8/framework/advanced/advanced-spring.html
To get most out of the documentation, you need example application, which you and inspect and play with. On Vaadin web page, there is full stack functional demo application, which demonstrates application architecture made with Vaadin + Spring.
https://vaadin.com/start/v8-full-stack-spring
I have one Spring MVC Application and I want to split it in to multiple applications (each one deployed separetely) but having one main application that manage the security and the header, lateral menu and footer of the classic layout.
What I really want is that whenever the user clicks a button on the side menu, the main application calls the appropriate application to fill the body. The main application has to be able to call the application server that contains the appropriate WAR, but instead to give it the control to draw the entire page only allow him drawing the body.
Sorry for my horrible english.
I am in the process of migrating my current web application to liferay.I have requirement to customize left navigation bar according to my app.
For e.g. I have left side vertical navigation menu with items as below
Home
Company Info
Revenue Details
When clicked on each of the menu items separate portlet would be opened in the right content pane. For instance,company information should go to to the custom company portlet I have created .
Could you please help me understand how can I acheive this in Liferay 6.2? Thank you.
If you want to display portlets deployed on a page using left navigation bar then you can use Panel Pages. Search for "Panel Pages" section on this page.
If you want to have the liferay page navigation itself as a vertical bar instead of horizontal then you can create Theme to style the navigation. navigation.vm is the file you are looking for.
As per the comment below, here are my suggestions:
Suggestion I
Use 30-70 layout.
On the 70-side (right-hand) you can put all your portlets one after another.
On the 30-side (left-hand) you can put a web-content display portlet.
So in the web-content display portlet, in the editor you can use Source tab to include javascript/css/html for the clickable links to portlet.
There are various javascript libraries available for giving scrolling effect on click of the link.
Suggestion II
This is also similar suggestion, atleast the concept is the same.
the only difference is that you can have a custom layout with web-content already embedded in the layout and also have the libraries and javascript written in the layout.
Suggestion III
if you want automated left navigation pane i.e. when the page loads it has the portlet-name and links to the portlets on the right side without manual intervention.
This would require a lot of coding inside layout.
You can utilize the different variables available in the layout to find the portlets on the page and create the links.
Have a left section in layout and populate the links found in (3) and the right side would be as usual.
You can utilize the portlet-Ids or css classes for scrolling to them when a particular link in web-content is clicked from the Look & Feel tab from Configuration tab as follows:
Hope this helps.
Liferay wraps portlet content that get displayed inside a div tag having unique portlet instance id.
In portlet header, Look and Feel -> Advanced Styling, it displays that portlet id for example
Portlet ID: #p_p_id_73_INSTANCE_xZVK6VFSqAzJ_
This ID may be used to hash tag in anchor to move focus to that portlet section.
Note: If the portlets on the page are instanceable, then removing an instance and adding instance again get new instance id. So, previous hash tag link doesn't work.
If you want the Left Navigation then use 30-70 Layout and use SiteMap portlet on left side
I have built two web applications lets call them App1 and App2.
App1 has multiple pages (Page1.jsp and Page2.jsp). App1 is a standalone application which has a menu which links to the two pages.
App2 has multiple pages (Page3.jsp and Page4.jsp). App2 is also a standalone application which has a menu which links to the two pages.
Now I would like to combine App1 and App2 into a super-application without modifying App1 or App2. This super-application should have a menu which links to App1/Page1.jsp, App1/Page2.jsp, App2/Page3.jsp, and App2/Page4.jsp.
I think of a couple of approaches to doing this:
Solution 1: Frames
I can create a menu frame which has a menu which links to the pages of App1 and App2.
I can have a seperate frame which is used to display the content for App1 and App2.
However, I am not keen to use frames (http://www.html-faq.com/htmlframes/?framesareevil).
Solution 2: Dynamically build the menu based on URL parameter
Super application can have a div-based menu which links to App1 and App2. It can pass a parameter on the URL, e.g. App1/Page1.jsp?parent=SuperApp.
App1 and App2 can dynamically build a menu based on the parent parameter.
For example, if the parent parameter is not present then App1 will use its normal menu which links to Page1.jsp and Page2.jsp.
However, if the parent parameter is present then App1 will use the SuperApp menu (SuperApp/header.html) - it will dynamically include this HTML in the JSP page. This SuperApp menu will link to all the pages provided in App1 and App2.
This second solution will work without using frames, but I wanted to explore if there are other solutions I haven't considered?
How about having a third web application responsible for menus:
Configure a very small JavaScript component in each page that makes an AJAX call to the menu application to populate it. Typically this would be implemented with an empty <div> with a special class or ID. You also have a script (downloaded from MenuApp) that locates the <div> and adds the menu.
Some ideas:
Simplest implementation is that the MenuApp uses servlet config to configure menu options. A more flexible approach could use a SQL or NoSQL DB
Parameterized call, where the calling page could call in with a menu context (eg LoggedIn, AdvancedUser, Configuration) and the MenuApp returns an appropriate subset of menu items
Even more advanced: The user can configure their own favorites
The main disadvantage with this is the additional callback, although if you are already using AJAX this might be a very low overhead.
BTW, this is similar to how FaceBook, Google+, Twitter, Pinterest, etc implement their Like, PlusOne, etc, buttons, while being minimally invasive in the third-party web application. Eg see: https://developers.google.com/+/plugins/+1button/
One possible solution is to use portlets when you want to use two applications together. Deployment will be the same, you don't need to make any changes in App1 and App2. Depending on which portlet container you would like to use, configuration is different, but finally you will have one portlet for each application and configure menu of that portal to target urls of each application.
Two possible solutions are Liferay and Jetspeed. With thous two I worked. Also there is JBoss GateIn portlet container.