Custom actions in KCenter

The following sample demonstrates how to create a new custom action in the KCenter.

Sample based in a JSP

Step 1 - Create a sample JSP file

Create the following sample JSP file and copy it to the webapps/openkm folder with name test.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ page isErrorPage="true" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

<html>
<head>
  <script type="text/javascript" src="<%=request.getContextPath() %>/kcenter/api/common.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath() %>/kcenter/api/modal.js"></script>
</head>
<body>
  <h1>Quick sample about how to create a custom action in the KCenter</h1>

  <p><b>UserId:</b> <%=request.getParameter("userId")%></p>
  <p><b>Uuid:</b> <%=request.getParameter("uuid")%></p>
  <p><b>Encrypted token:</b> <%=request.getParameter("token")%></p>

  <button onclick="_closeCustomFeatureModal()">Close popup</button>
</body>
</html>

Step 2 - Register the custom action

Create a new custom action with these values. More information at Custom actions.

Field	Value
Name	test
Label	Label test
Icon	mdi-copy-all
Description
Document	false
Folder	true
Record	false
Mail	false
URL	../test.jsp Another option: http://localhost:8080/openkm/test.jsp
Action	popup-wizard
Location	node-toolbar
Width	50%
Height	50%
Show close	true

Step 3 - Enable the custom action in the profile

Go to Administration > Profiles
Edit a profile and enable the custom action in the Misc tab.

Step 4 - Check the feature

Refresh the KCenter UI
Select a folder in the browser view.
In the contextual menu or in the toolbar menu is shown a new menu option named "Extra"

Full JSP sample

The next JSP sample allows everybody to unlock a node.

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

<%@ page import="com.openkm.util.ContextWrapper" %>
<%@ page import="com.openkm.util.StackTraceUtils" %>
<%@ page import="com.openkm.api.OKMDocument" %>
<%@ page import="com.openkm.module.db.DbNodeModule" %>
<%@ page import="com.openkm.bean.Document" %>
<%@ page import="com.openkm.principal.PrincipalUtils" %>
<%@ page import="com.openkm.module.db.stuff.DbSessionManager" %>
<%@ page import="org.apache.commons.lang3.StringUtils" %>

<html>
<head>
  <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/kcenter/css/bootstrap/bootstrap.css" />
  <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/kcenter/css/mdb/mdb.css" />
  <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/kcenter/css/okm.css" />
  <script type="text/javascript" src="<%=request.getContextPath() %>/kcenter/api/common.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath() %>/kcenter/api/modal.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath() %>/kcenter/api/browser.js"></script>
  <script>
    function closeButton() {
      _refreshUI();
      _closeCustomFeatureModal();
    }
  </script>
</head>
<body>

<%
  String error = "";
  boolean isCheckedOut = false;
  boolean isLocked = false;

  try {
    String uuid = request.getParameter("uuid");
    OKMDocument okmDocument = ContextWrapper.getContext().getBean(OKMDocument.class);
    DbNodeModule dbNodeModule = ContextWrapper.getContext().getBean(DbNodeModule.class);
    boolean isDocument = okmDocument.isValid(null, uuid);

    if (isDocument) {
      Document doc = okmDocument.getProperties(null, uuid);
      if (doc.isCheckedOut()) {
        isCheckedOut = true;
      } else if (doc.isLocked()) {
        isLocked = true;
      }
    } else {
      isLocked = dbNodeModule.isLocked(null, uuid);
    }

    if (isLocked) {
      long tenantId = PrincipalUtils.getTenantId();
      String systemToken = DbSessionManager.getInstance().getSystemToken(tenantId);

      dbNodeModule.forceUnlock(systemToken, uuid);
    }
  } catch (Exception e) {
    error = StackTraceUtils.toString(e).replaceAll("\n","<br/>");
    e.printStackTrace();
  }
%>

  <div class="d-flex justify-content-center w-100 my-2">
    <% if (StringUtils.isEmpty(error)) { %>
      <% if (isCheckedOut) { %>
        <p class="text-danger">Can not unlock a document in edition.</p>
      <% } else if (!isLocked) { %>
        <p class="text-danger">The node is not locked.</p>
      <% } else { %>
        <p class="text-success">The node has been unlocked</p>
      <% } %>
    <% } %>
  </div>

  <div class=" d-flex justify-content-center w-100 my-2">
    <button type="button" class="btn btn-success btn-sm my-0 m-0" onclick="closeButton()">
      Tancar
    </button>
  </div>

  <% if (StringUtils.isNotEmpty(error)) { %>
    <div class="d-flex justify-content-center w-100 my-2">
      <p class="text-danger">Error found:</p>
      <%= error %>
    </div>
  <% } %>

</body>
</html>

Sample based in a Javascript

Step 1 - Register the custom action

Create a new custom action with these values. More information at Custom actions.

Field	Value
Name	test
Label	Label test
Icon	mdi-assistant-direction
Description
Document	true
Folder	false
Record	false
Mail	false
URL
Action	run-script
Location	node-toolbar
Width	50%
Height	50%
Show close	true
Script	const kcenterApp = window.kcenterApp; // kcenter app const uuid = '1aff985f-9243-4c1a-8d43-482026f3fa93'; // uuid to jump kcenterApp.$store.dispatch('browser/refreshByUuid', uuid, { root: true }); // internal function to jump Accessing webservices sample: kcenterApp.$ws.node.getNodeByUuid('095cdb6e-c28e-410c-a6e3-19e23bd4b3ef').then(response => { console.log('here1'); console.log(response); console.log('here2'); });

Step 2 - Enable the custom action in the profile

Go to Administration > Profiles
Edit a profile and enable the custom action in the Misc tab.

Step 3 - Check the feature

Refresh the KCenter UI
Select a document in the browser view.
In the toolbar menu, a new menu icon will appear.

Sample with validation

Step 1 - Register the custom action

Create a new custom action with these values. More information at Custom actions.

Field	Value
Name	test
Label	Label test
Icon	mdi-assistant-direction
Description
Document	true
Folder	false
Record	false
Mail	false
URL
Action	run-script
Location	node-toolbar
Width	50%
Height	50%
Show close	true
Script	console.log('The document have the group okg:consulting');
Validation script	Available since version 8.1.15. The return statement must be a boolean variable or a promise, like the sample below. async function main() { console.log('execute main'); const kcenterApp = window.kcenterApp; const currentNode = kcenterApp.$store.getters['browser/currentNode']; const isValid = await hasGroup(currentNode.uuid); console.log('isValid: ' + isValid); return isValid; // Return is valid } async function hasGroup(uuid) { const response = await kcenterApp.$ws.propertyGroup.getGroups(uuid); console.log(response); // Groups of the node const found = response.some(group => group.name === 'okg:consulting'); return found; } // Return the promise ( will be executed in the UI ) or a boolean value return main();

Step 2 - Enable the custom action in the profile

Go to Administration > Profiles
Edit a profile and enable the custom action in the Misc tab.

Step 3 - Check the feature

Refresh the KCenter UI
Select a document in the browser view.
In the toolbar menu, a new menu icon will appear.
The menu option is enabled when the document have the okg:consulting metadata assigned.