CODEWITHSUNDEEP
liferayportlet
Juan Sebastian
Juan Sebastian

Reputation: 33

Liferay 6.2 CE ga2 - AlloyUI breaks the portal. Any suggestions?

How to use AlloyUI 3.0.1 within a portlet in Liferay 6.2 The version without losing functionality in the rest of the portal.

happens whether or not I import the following

<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet"></link>

this is my code...

liferay-portlet.xml

<?xml version="1.0"?>
<!DOCTYPE liferay-portlet-app PUBLIC "-//Liferay//DTD Portlet Application 6.2.0//EN" "http://www.liferay.com/dtd/liferay-portlet-app_6_2_0.dtd">

<liferay-portlet-app>
    <portlet>
        <portlet-name>example-input-alert</portlet-name>
        <icon>/icon.png</icon>
        <header-portlet-css>/css/main.css</header-portlet-css>
        <header-portlet-css>http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css</header-portlet-css>
        <header-portlet-javascript>http://cdn.alloyui.com/3.0.1/aui/aui-min.js</header-portlet-javascript>
        <footer-portlet-javascript>/js/main.js</footer-portlet-javascript>
        <css-class-wrapper>example-input-alert-portlet</css-class-wrapper>
    </portlet>
    <role-mapper>
        <role-name>administrator</role-name>
        <role-link>Administrator</role-link>
    </role-mapper>
    <role-mapper>
        <role-name>guest</role-name>
        <role-link>Guest</role-link>
    </role-mapper>
    <role-mapper>
        <role-name>power-user</role-name>
        <role-link>Power User</role-link>
    </role-mapper>
    <role-mapper>
        <role-name>user</role-name>
        <role-link>User</role-link>
    </role-mapper>
</liferay-portlet-app>


Resource "http://cdn.alloyui.com/3.0.1/aui/aui-min.js" not found.

view.jsp

<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet"%>

<portlet:defineObjects />


<div id="myAlert"></div>

<script>
    YUI()
            .use(
                    'aui-alert',
                    function(Y) {
                        new Y.Alert(
                                {
                                    animated : true,
                                    bodyContent : 'Thank You Mario! But Our Princess Is In That Castle!',
                                    boundingBox : '#myAlert',
                                    closeable : true,
                                    cssClass : 'alert-warning',
                                    destroyOnHide : false,
                                    duration : 1,
                                    render : true
                                });
                    });
</script>

before enter image description here

after enter image description here

some elements disappear portal and portlets lose other functionality...

thx !

Upvotes: 1

Views: 393

Answers (2)

Juan Sebastian
Juan Sebastian

Reputation: 33

This is the response of staff Liferay...

enter image description here

Upvotes: 1

Systemmanic
Systemmanic

Reputation: 3130

You need to import the library using liferay-portlet.xml in your portlet:

<header-portlet-css>http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css</header-portlet-css>
<header-portlet-javascript>http://cdn.alloyui.com/3.0.1/aui/aui-min.js</header-portlet-javascript>

See the docs (It's explained at the bottom)

Upvotes: 0

Related Questions