apps 2 customizing the document library
TRANSCRIPT
![Page 1: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/1.jpg)
1
Mike HatfieldSenior Software Engineer, Alfresco
twitter: @mikehatfield
![Page 2: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/2.jpg)
2
What We’ll Cover
• Architecture• Challenges to customization and extension
• Plans for improvement
• Case Study: the DoD 5015.2 Extensions• Extension Example
• Status Indicators• Custom Actions• Custom Metadata• Filters
![Page 3: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/3.jpg)
3
![Page 4: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/4.jpg)
4
Custom UICustom UI
Custom UICustom UI
Custom UICustom UI
New FiltersNew Filters
New FiltersNew Filters
New FiltersNew Filters
![Page 5: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/5.jpg)
5
• Consolidate scattered action configuration• share-config-custom.xml instead of webscriptconfig• Still possible to restrict & specialise actions on details pages
• New actions via configuration where practicable• jar file for client-side UI assets, I18N• CSS and JS dependencies via config (see Forms & Header)
• Leverage Repository Actions & scripts• Custom Views
• Web-tier rendering• Open CMIS
![Page 6: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/6.jpg)
6
![Page 7: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/7.jpg)
7
Custom Actions
Numerous new and overridden actions to support the DoD requirements specification.
![Page 8: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/8.jpg)
8
Custom Toolbar
Sensitive to current folder type. New and overridden actions.
Custom Filters
Removed unsuitable filters (user filters, tags). One static, one dynamic (populated from list of saved searches on the Repository).
![Page 9: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/9.jpg)
9
“documentLibrary” container type determines components
![Page 10: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/10.jpg)
10
![Page 11: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/11.jpg)
11
documentlibrary.js
connector.get("/slingshot/doclib/container/" + siteId + "/" + containerId);"dod:filePlan"
model.doclibType = fromRepoType("dod:filePlan");“dod5015”
documentlibrary.js
connector.get("/slingshot/doclib/container/" + siteId + "/" + containerId);"dod:filePlan"
model.doclibType = fromRepoType("dod:filePlan");“dod5015”
documentlibrary.ftl
<@region id=doclibType+ "documentlist" scope="template" protected=true />
documentlibrary.ftl
<@region id=doclibType+ "documentlist" scope="template" protected=true />
Surf Component Binding
template.dod5015-documentlist.documentlibrary.xml
<url>/components/documentlibrary/dod5015/documentlist</url>
Surf Component Binding
template.dod5015-documentlist.documentlibrary.xml
<url>/components/documentlibrary/dod5015/documentlist</url>
![Page 12: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/12.jpg)
12
DoD 5015.2 Method
documentlibrary.js
page = sitedata.getPage("site/" + siteId + "/dashboard");pageMeta = eval('(' + p.properties.pageMetadata + ')');contentType = doclibMeta.type;
connector.get("/slingshot/doclib/container/" + siteId + "/" + containerId+ “?type=“ + toRepoType(contentType));
”dod:filePlan”
documentlibrary.js
page = sitedata.getPage("site/" + siteId + "/dashboard");pageMeta = eval('(' + p.properties.pageMetadata + ')');contentType = doclibMeta.type;
connector.get("/slingshot/doclib/container/" + siteId + "/" + containerId+ “?type=“ + toRepoType(contentType));
”dod:filePlan”
presets.xml
<preset id="rm-site-dashboard"><page id="site/${siteid}/dashboard"><properties><pageMetadata>{"documentlibrary":{…, "type":"dod5015"}}</pageMetadata>
presets.xml
<preset id="rm-site-dashboard"><page id="site/${siteid}/dashboard"><properties><pageMetadata>{"documentlibrary":{…, "type":"dod5015"}}</pageMetadata>
![Page 13: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/13.jpg)
13
Web QuickStart Method
LoadWebSiteDataGet.java
NodeRefdocLib = siteService.getContainer(siteId, COMPONENT_DOCUMENT_LIBRARY);
siteService.createContainer(siteId, COMPONENT_DOCUMENT_LIBRARY, WebSiteModel.TYPE_WEBSITE_CONTAINER, null);
ornodeService.setType(docLib, WebSiteModel.TYPE_WEBSITE_CONTAINER);
LoadWebSiteDataGet.java
NodeRefdocLib = siteService.getContainer(siteId, COMPONENT_DOCUMENT_LIBRARY);
siteService.createContainer(siteId, COMPONENT_DOCUMENT_LIBRARY, WebSiteModel.TYPE_WEBSITE_CONTAINER, null);
ornodeService.setType(docLib, WebSiteModel.TYPE_WEBSITE_CONTAINER);
dashlet
connector.get("/api/loadwebsitedata?site=" + siteId);
dashlet
connector.get("/api/loadwebsitedata?site=" + siteId);
![Page 14: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/14.jpg)
14
YUI Helps
YUI developers added a number of helper functions to allow OO-style JavaScript modules.
• Notice:• constructor• superclass• extend• augment• etc…
![Page 15: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/15.jpg)
15
• Full override / replacement control on all tiers.
• Your code can be almost completely independent of Alfresco’s.
Pros
• Mandatory component mapping , even for “native” components.
• Still have to copy/paste where <include> cannot be used, e.g. I18N.
• Repository folder type to component prefix issue.
• Not a 100% “clean” override mechanism.
Cons
![Page 16: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/16.jpg)
16
Big Development Overhead
template.dod5015-actions-common.documentlibrary.xmltemplate.dod5015-documentlist.documentlibrary.xmltemplate.dod5015-file-upload.documentlibrary.xmltemplate.dod5015-fileplan.documentlibrary.xmltemplate.dod5015-flash-upload.documentlibrary.xmltemplate.dod5015-html-upload.documentlibrary.xmltemplate.dod5015-navigation.documentlibrary.xmltemplate.dod5015-savedsearch.documentlibrary.xmltemplate.dod5015-title.documentlibrary.xmltemplate.dod5015-toolbar.documentlibrary.xmltemplate.dod5015-tree.documentlibrary.xml…And that’s just the browse page!
![Page 17: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/17.jpg)
17
• Overview • Customisations
• Status Indicators• Custom Metadata• New Filters• Custom Action
• Based on Alfresco Community 3.4.b• Need to use AMP on the Repository until refactoring work is complete• Share extensions via .jar and web-extension folder
![Page 18: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/18.jpg)
18
Overview
![Page 19: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/19.jpg)
19
![Page 20: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/20.jpg)
20
Provide the user a quick indication of the current status of a folder or document, e.g. aspects applied.
Calculated in evaluator.lib.js
• Repository• evaluator.lib.js
• Share• I18N messages• Indicator images
![Page 21: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/21.jpg)
21
/* Exif metadata */
if (node.hasAspect("exif:exif"))
{
status["exif"] = true;
}
/* Geographic */
if (node.hasAspect("cm:geographic"))
{
status["geographic"] = true;
}
![Page 22: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/22.jpg)
22
1. share.jar!/org/springframework/extensions/surf/custom-slingshot-geographic-context.xml
<bean id="geographic.custom.resources" class="org.springframework.extensions.surf.util.ResourceBundleBootstrapComponent">
<property name="resourceBundles">
<list>
<value>alfresco.messages.geographic</value>
</list>
</property>
</bean>
1. share.jar!/alfresco/messages/geographic.properties
tip.geographic=Geo Location
tip.exif=EXIF Metadata
![Page 23: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/23.jpg)
23
status[”exif"] = true;
status["geographic"] = true;
share.jar!/META-INF/components/documentlibrary/images
1.exif-indicator-16.png
2.geographic-indicator-16.png
![Page 24: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/24.jpg)
24
Rendered entirely by the web browser from JSON data.
• Repository• item.lib.ftl• Maybe also JavaScript logic
• Share• I18N messages• Override cell renderer
![Page 25: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/25.jpg)
25
1. alfresco.amp!/WEB-INF/classes/alfresco/templates/webscripts/org/alfresco/slingshot/documentlibrary/item.lib.ftl
<#if node.hasAspect("cm:geographic")>“geolocation”:{ "latitude": ${(node.properties["cm:latitude"]!0)?c}, "longitude": ${(node.properties["cm:longitude"]!0)?c}},</#if>
<#if node.hasAspect(”exif:exif")>“exif”:{ …},</#if>
![Page 26: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/26.jpg)
26
1. shared/classes/alfresco/web-extension/site-webscripts/org/alfresco/components/documentlibrary/actions-common.get.head.ftl
<@script type="text/javascript" src="${page.url.context}/res/components/geographic/geographic-extension.js"></@script>
![Page 27: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/27.jpg)
27
1. Override fnRenderCellDescription
share.jar!/META-INF/components/geographic/geographic-extension.js
YAHOO.util.Event.onContentReady("alf-hd", function(){ if (Alfresco.DocumentList) {Alfresco.DocumentList.prototype.fnRenderCellDescription = function
DL_fnRenderCellDescription() { … if (record.exif) {desc += scope.msg(“detail.exposure”) + record.exif.exposureTime; } … } }}
![Page 28: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/28.jpg)
28
Allow easy filtering by any Repository logic, most commonly a Lucene or Alfresco FTS search query.
• Repository• filters.lib.js
• Share• I18N messages• Filter webscriptconfig
![Page 29: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/29.jpg)
29
1. shared/classes/alfresco/web-extension/site-webscripts/org/alfresco/components/documentlibrary/filter.get.config.xml
<filters>
…
<filter id="geo" label="link.geo-located" />
<filter id="exif" label="link.exif" />
…
</filters>
![Page 30: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/30.jpg)
30
1. alfresco.amp!/WEB-INF/classes/alfresco/templates/webscripts/org/alfresco/slingshot/documentlibrary/filters.lib.js
case "geo":filterQuery = "+PATH:\"" +parsedArgs.rootNode.qnamePath + "//*\"";filterQuery += "+ASPECT:\"cm:geographic\"";filterParams.query = filterQuery break;
case "exif":filterQuery = "+PATH:\"" +parsedArgs.rootNode.qnamePath + "//*\"";filterQuery += "+ASPECT:\"exif:exif\"";filterParams.query = filterQuery break;
![Page 31: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/31.jpg)
31
Can be configured to only appear if a folder or document is in a particular state and/or the user has the correct permission(s) and/or the page is within a Site context and/or the action is on the browse or details page.
• Repository• evaluator.lib.js• Action processing (optional)
• Share• I18N messages• Action configuration• Client-side logic & images
![Page 32: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/32.jpg)
32
/* Geographic */
if (node.hasAspect("cm:geographic"))
{
status["geographic"] = true;
permissions["geographic"] = true;
}
![Page 33: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/33.jpg)
33
1. shared/classes/alfresco/web-extension/site-webscripts/org/alfresco/components/documentlibrary/documentlist.get.config.xml
2. shared/classes/alfresco/web-extension/site-webscripts/org/alfresco/components/document-details/document-actions.get.config.xml
3. etc…
<actionSet id="document">
…
<action type="simple-link" id="onActionGeographic" permission="geographic" href="{geographicUrl}" label="actions.document.geographic" />
</actionSet>
![Page 34: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/34.jpg)
34
1. shared/classes/alfresco/web-extension/site-webscripts/org/alfresco/components/documentlibrary/actions-common.get.head.ftl
<@link rel="stylesheet" type="text/css" href="${page.url.context}/res/components/geographic/geographic-extension.css" />
2. share.jar!/META-INF/components/geographic/geographic-extension.css
.doclist .onActionGeographica{ background-image: url(pin.png) !important;}
![Page 35: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/35.jpg)
35
var override = Alfresco.DocumentList || Alfresco.DocumentActions;
// Store reference to getActionUrls() function to allow extension.
vargetActionUrls_geographic = override.prototype.getActionUrls;
override.prototype.getActionUrls = function(recordData)
{
varactionUrls = getActionUrls_geographic.apply(this,
arguments);
actionUrls["geographicUrl"] = Alfresco.util.siteURL(
"geographic-map?nodeRef=" + recordData.nodeRef);
return actionUrls;
};
![Page 36: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/36.jpg)
36
![Page 37: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/37.jpg)
37
![Page 38: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/38.jpg)
38
• Consolidate scattered action configuration• New actions via configuration where practicable• Remove references to non-core Share code• Leverage Repository Actions & scripts• Custom Views
![Page 39: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/39.jpg)
39
• Feedback
![Page 40: APPS 2 Customizing the Document Library](https://reader033.vdocuments.us/reader033/viewer/2022061123/5470d8cbb4af9f0a418b46cc/html5/thumbnails/40.jpg)
40
wiki.alfresco.com/wiki/Shareblogs.alfresco.com/wp/mikeh/