Foren

Toggle Edit Control and Add Application Link in theme

thumbnail
Dhrutika Vyas, geändert vor 10 Jahren.

Toggle Edit Control and Add Application Link in theme

Expert Beiträge: 435 Beitrittsdatum: 09.02.09 Neueste Beiträge
Hi All,

I am using Liferay 6.1 EE GA2.

I want to have toggle edit control and add application link same as dockbar menu in my custom theme.

I tried some ways. For toggle edit I added below code.

<li class="toggle-controls"><a onclick="Liferay.Util.toggleControls();" href="javascript:void(0);">Edit control</a></li>

I also tried same as mentioned in one of comments http://www.liferay.com/community/wiki/-/wiki/Main/Link+to+Dockbar in this wiki

But it gives me alternate behviour. On first click it doesn't work and and on 2nd click it works. Would anyone please let me know how to invoke liferay's toggle edit control?

Other is Add Application Link. I added below code.

<li><a onclick="Liferay.LayoutConfiguration.toggle('87');" href="javascript:void(0);" id="addApplication"> $languageUtil.get($locale, "add-application")</a></li>

It works fine when I access using Portal Administrator.But when I access same link using other custom role like site admin, I get below js errors.

"TypeError: i is undefined" on click of 'Add'
"Error: i.DEFAULT_LAYOUT_OPTIONS is undefined" when i click on + sign to expand each category.

Please provide your inputs or suggestions. It would be really helpful.

Note: In past I have worked on same functionality in 6.0 sp1,it was working fine using below code.

<li class="toggle-controls" id="<portlet:namespace />toggleControls">
<a href="$toggle_controls_url"><span title="$toggle_controls_text"></span></a>
</li>
<li class="add-app">
<a href="javascript:void(0);" onclick="$add_content_url"><span title="$add_content_text"></span></a>
</li>

Regards,
Dhrutika
thumbnail
Nick Piesco, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

New Member Beiträge: 8 Beitrittsdatum: 09.07.12 Neueste Beiträge
This may not be the 'Official Liferay Way', but you can toggle edit controls by manipulating the classes 'controls-hidden' and 'controls-visible' on the <body> element.

HTML:

<a id="toggle-controls" href="#">
	Toggle Controls
</a>


JS (jQuery):

$('#toggle-controls').click(function(e) {
	e.preventDefault();
	if ($('body').hasClass('controls-visible')) {
		$('body').removeClass('controls-visible')
			.addClass('controls-hidden');
	} else {
		$('body').removeClass('controls-hidden')
			.addClass('controls-visible');
	}
});


JS (AUI):

A.one('#toggle-controls').on('click', function(e) {
	e.preventDefault();
	if (A.one('body').hasClass('controls-visible')) {
		A.one('body').removeClass('controls-visible')
			.addClass('controls-hidden');
	} else {
		A.one('body').removeClass('controls-hidden')
			.addClass('controls-visible');
	}
});


I'm still working through some 'Add Application' funtime, but I hope this helps with part of your issue....
thumbnail
Amit Doshi, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Liferay Master Beiträge: 550 Beitrittsdatum: 29.12.10 Neueste Beiträge
Hi Dhrutika,

Have you found any solution for this?

I am currently struggling on both Edit control and Add Application.

Thanks & Regards,
Amit Doshi
thumbnail
Dhrutika Vyas, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme (Antwort)

Expert Beiträge: 435 Beitrittsdatum: 09.02.09 Neueste Beiträge
Hi All,

I have found solution for the query I had asked.

You can check out solution on below link: http://liferayshare.blogspot.in/2013/11/links-to-add-application-toggle-edit.html

Regards,
Dhrutika
R DS, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 41 Beitrittsdatum: 15.10.13 Neueste Beiträge
'Add application' link is not working for me.
I'm on Liferay 6.2 RC4.
thumbnail
Dhrutika Vyas, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Expert Beiträge: 435 Beitrittsdatum: 09.02.09 Neueste Beiträge
Hi ,

I have done those things for 6.1 GA2.

Are you using same thing for 6.2 as I mentioned in my blog or you have written your custom code?

Regards,
Dhrutika
R DS, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 41 Beitrittsdatum: 15.10.13 Neueste Beiträge
Hi, i've used code from your blog.
When i click 'Add application' link nothing happens (no errors).
thumbnail
Dhrutika Vyas, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Expert Beiträge: 435 Beitrittsdatum: 09.02.09 Neueste Beiträge
Hi,

In that case we need to check with 6.2.

Liferay may has changed their way of implementation in 6.2.

May be you can also go through dockbar's view.jsp to get some idea.

Regards,
Dhrutika
R DS, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 41 Beitrittsdatum: 15.10.13 Neueste Beiträge
Is this the involved part of view.jsp of dockbar?


<c:if test="<%= !group.isControlPanel() &amp;&amp; (hasLayoutAddPermission || hasLayoutUpdatePermission || (layoutTypePortlet.isCustomizable() &amp;&amp; layoutTypePortlet.isCustomizedView() &amp;&amp; hasLayoutCustomizePermission)) %>">
		<portlet:renderurl var="addURL" windowstate="<%= LiferayWindowState.EXCLUSIVE.toString() %>">
			<portlet:param name="struts_action" value="/dockbar/add_panel" />
			<portlet:param name="stateMaximized" value="<%= String.valueOf(themeDisplay.isStateMaximized()) %>" />
			<portlet:param name="viewEntries" value="<%= Boolean.TRUE.toString() %>" />
		</portlet:renderurl>

		<aui:nav-item anchorId="addPanel" cssClass="site-add-controls" data-panelURL="<%= addURL %>" href="javascript:;" iconClass="icon-plus" label="add" />
</c:if>
thumbnail
Dhrutika Vyas, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Expert Beiträge: 435 Beitrittsdatum: 09.02.09 Neueste Beiträge
Hi,

Liferay 6.2 has changed many things in dockbar in 6.2

You are correct it is coming from piece of code you have mentioned.

Try out by adding same class name 'site-add-controls' as they have may written some js on that.

Also have a look at dockbar_add_application.js and add_application.jsp, that may give you some pointer.

In Add_application.js, they have written aui script for the functionality.

Sorry can't help out much on this as I have not worked on this version yet.

Hopefully you get some solution.

Regards,
Dhrutika
R DS, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 41 Beitrittsdatum: 15.10.13 Neueste Beiträge
Thank you. I'll look these jsps.
thumbnail
Dhrutika Vyas, geändert vor 10 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Expert Beiträge: 435 Beitrittsdatum: 09.02.09 Neueste Beiträge
Hi RD S,

If you get any solution , please post it here so if can help community members in future.

Regards,
Dhrutika
thumbnail
Rautureau Jérôme, geändert vor 9 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 52 Beitrittsdatum: 22.02.08 Neueste Beiträge
Hi everybody !

I think i have foudn the solution to the add application link in a Liferay 6.2 theme :

Try this :

<a href="javascript:;" onclick="$add_content_url">$add_content_text</a>


for me it does the job.

For the Manage page link : i use :

<a href="javascript:;" rel="$page_settings_url" id="show-page-settings" title="$page_settings_text">$page_settings_text</a>


And in main.js :

AUI().ready('liferay-hudcrumbs', 'liferay-navigation-interaction','aui-dialog',
		function(A) {			
			var showLayouts = A.one('#show-page-layouts');
			
			if (showLayouts != null){
				showLayouts.on('click', function(event) {
		            var configurationURL = this.get('rel') + '#layout';
		            var title = this.get('title');
		            Liferay.Util.openWindow( {
		                cache: false,
		                dialog: {
		                    align: Liferay.Util.Window.ALIGN_CENTER,
		                    draggable: false,
			                resizable: false,
			                modal: true,
		                    width: '98%',height:'98%',
		                    on: {
		                        close: function() {
		                            // Refresh on close to show new layout
		                            document.location.href = Liferay.currentURL
		                        }
		                    }
		                },
		                dialogIframe: {
		                    id: 'showPageLayouts_layoutIframe',
		                    uri: configurationURL
		                },
		                title: title,
		                uri: configurationURL
		            });
				});
			}
			
			var showSettings = A.one('#show-page-settings');
			
			if (showSettings != null){
				showSettings.on('click', function(event) {
		            var configurationURL = this.get('rel');
	                var title = this.get('title');
		            Liferay.Util.openWindow( {
		                cache: false,
		                dialog: {
		                    align: Liferay.Util.Window.ALIGN_CENTER,
		                    draggable: false,
			                resizable: false,
			                modal: true,
		                    width: '98%',height:'98%',
		                    on: {
		                        close: function() {
		                            // Refresh on close to show new layout
		                            document.location.href = Liferay.currentURL
		                        }
		                    }
		                },
		                dialogIframe: {
		                    id: 'showSettings_layoutIframe',
		                    uri: configurationURL
		                },
		                title: title,
		                uri: configurationURL
		            });
				});
			}
			
			var showMyPlaces = A.all('.show-my-places');
			
			if (showMyPlaces != null){
				showMyPlaces.each( function( node ) {
					node.on('click', function(event) {
						var link = this.get('rel');
						var title = this.get('title');
						Liferay.Util.openWindow( {
			                cache: false,
			                dialog: {
			                    align: Liferay.Util.Window.ALIGN_CENTER,
			                    draggable: false,
				                resizable: false,
				                modal: true,
			                    width: 700
			                },
			                dialogIframe: {
			                    id: 'showMyPlaces_layoutIframe',
			                    uri: link
			                },
			                title: title,
			                uri: link
			            });
				});
				});
			}
			
		}
	);
Divine Touch, geändert vor 9 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

New Member Beitrag: 1 Beitrittsdatum: 28.01.14 Neueste Beiträge
I've tried your solution but it's not working. The AUI script that you included does not handle the click for "add_content_url". I tried to handle click for "add_content_url" but no prevail.

Can you reconfirm that this solution work.
R DS, geändert vor 9 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 41 Beitrittsdatum: 15.10.13 Neueste Beiträge
Divine Touch:
I've tried your solution but it's not working. The AUI script that you included does not handle the click for "add_content_url". I tried to handle click for "add_content_url" but no prevail.


I agree, Rautureau Jérôme's solution didn't work for me.
thumbnail
Aston Pearl, geändert vor 9 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 62 Beitrittsdatum: 04.02.13 Neueste Beiträge
Hi All,

Does somebody find any solution?

Thanks in advance.
Srinivas KK, geändert vor 9 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 33 Beitrittsdatum: 04.12.11 Neueste Beiträge
I didn't find clean solution . But managed to make it work.

1. Patched the dockbar to enable only add button and disable all other buttons on dockbar for non-admin users.
2. hide the orginal Add button on dockbar , which we don't want to show.
3. register click handler to custom link.
handler {
Liferay.Dockbar.toggleAddPanel();
}
thumbnail
Rautureau Jérôme, geändert vor 8 Jahren.

RE: Toggle Edit Control and Add Application Link in theme

Junior Member Beiträge: 52 Beitrittsdatum: 22.02.08 Neueste Beiträge
Hi everybody,

did you tried

<li><a href="javascript:;" onclick="Liferay.Dockbar.toggleAddPanel()"><i class="icon-plus-circle icon-fw"></i>$add_content_text</a></li>


for the add application right menu ?

For me it's working