cancel
Showing results for 
Search instead for 
Did you mean: 

Adding a new button to Aikau Search Component

francesco_forna
Confirmed Champ
Confirmed Champ

Dear All,

could you suggest me how to add a new button on the search results page? The Search is an Aikau component and I'm looking to add a new action button to call a new repo webscript.

Could you help me to solve my problem?

Thank you,

Regards.

Francesco.

1 ACCEPTED ANSWER

francesco_forna
Confirmed Champ
Confirmed Champ

Dear All,

thanks to the help Krutik Jayswal.

So the correct way to do this particular customisation is:

1) Create AMP o JAR Share project as usual;

2) create a new extension module, for exampe:

<?xml version="1.0" encoding="UTF-8"?>
<extension>
    <modules>
        <module>
            <id>Add Export Excel - Search Page</id>
            <version>1.0</version>
            <auto-deploy>true</auto-deploy>
            <customizations>
                <customization>
                    <targetPackageRoot>org.alfresco.share.pages.faceted-search</targetPackageRoot>
                    <sourcePackageRoot>YOUR_PACKAGE.share.pages.faceted-search</sourcePackageRoot>
                </customization>
            </customizations>
        </module>
    </modules>
</extension>

3) add your JS file in the site-webscript project directory to override the
faceted-search.js file.
Keep in mind to get existing widgets or push newone; avoid to modify directly the source code.
For example, for the specific question:
var searchResultsMenuBar  = widgetUtils.findObject(model.jsonModel, "id", "SEARCH_RESULTS_MENU_BAR");
searchResultsMenuBar.config.widgets.push({
    id: "YOUR_BUTTON",
    name: "alfresco/buttons/AlfButton",
    config: {
        label : "old",
        publishTopic : "GIVE_NAME_TOPIC"
    }
});
4) package and deploy the AMP/JAR. You'll your new fantastic button... Eureka!

View answer in original post

7 REPLIES 7

openpj
Elite Collaborator
Elite Collaborator

I found an existent and old thread about the same problem but there is no effective solution published yet:

Adding a new button to Aikau Search Component 

In that thread Dave Draper said (2013!!!) that the search results page is the most tricky to customize but I'm wondering if also in 5.x version it is the same.

Does anybody have some good hints about this?

faceted-search.get.js is the file which is responsible for rendering search result page.

You need to extend above file and add the aikau widget in json configuration..

For handling the onclick event , aiaku is using pubsub mechanism.

Meaning of Pubsub is publication and subscript.In the widget configuration you need to add publishTopic, and you need to subscribe it inside the javascript service file(it is a dijit file).Refer below code for creating aikau button.

{     name : "alfresco/buttons/AlfButton",     config : {         label : "old",         publishTopic : "GIVE_NAME_TOPIC",         }     }  } 

Refer below link for subscripton of a topic.If you take a look on registerSubscriptions function on below file link,that shows how you can subscribe to a publish topic.

JSDoc: Source: services/CrudService.js 

Thank you Krutik. So we have to modify directly the faceted-search.get.js source code.

No, you should extend it, how to extend this is defined in below links.its not the exact example.But it demonstrates how you can extend javascript controller.

5. Customize Alfresco Share JavaScript controllers | Alfresco Documentation 

Modifying Out-of-the-box Aikau Pages | Alfresco Documentation 

francesco_forna
Confirmed Champ
Confirmed Champ

Ok ok,

I mean that we have to replace the original faceted-search.get.js by adding our custom logic. For example, if we have to add the button to SEARCH_RESULTS_MENU_BAR, we'll have to override this widget by adding our piece of code.

yes

francesco_forna
Confirmed Champ
Confirmed Champ

Dear All,

thanks to the help Krutik Jayswal.

So the correct way to do this particular customisation is:

1) Create AMP o JAR Share project as usual;

2) create a new extension module, for exampe:

<?xml version="1.0" encoding="UTF-8"?>
<extension>
    <modules>
        <module>
            <id>Add Export Excel - Search Page</id>
            <version>1.0</version>
            <auto-deploy>true</auto-deploy>
            <customizations>
                <customization>
                    <targetPackageRoot>org.alfresco.share.pages.faceted-search</targetPackageRoot>
                    <sourcePackageRoot>YOUR_PACKAGE.share.pages.faceted-search</sourcePackageRoot>
                </customization>
            </customizations>
        </module>
    </modules>
</extension>

3) add your JS file in the site-webscript project directory to override the
faceted-search.js file.
Keep in mind to get existing widgets or push newone; avoid to modify directly the source code.
For example, for the specific question:
var searchResultsMenuBar  = widgetUtils.findObject(model.jsonModel, "id", "SEARCH_RESULTS_MENU_BAR");
searchResultsMenuBar.config.widgets.push({
    id: "YOUR_BUTTON",
    name: "alfresco/buttons/AlfButton",
    config: {
        label : "old",
        publishTopic : "GIVE_NAME_TOPIC"
    }
});
4) package and deploy the AMP/JAR. You'll your new fantastic button... Eureka!