- can retrieve controller without scope()
- extracted ui to its own project primo-explore-dom-ui
- added user.loans
- add Helper.loadScript()
- Primo.version now displays library version and Primo version & hot fix
- Possibility to drill down on a service in the UI
- Better check if reloadWithDebugInfo() was ran
- explorer UI pops up automatically when Primo UI is loaded with angular.reloadWithDebugInfo()
- some general refactoring
- fixed an issue that would prevent explore.ui.toggle() from running twice
- refactoring of ui
- better component ctrl discovery
- ui component property display
- unhandle promise
- user fines
- better ctrl discovery
- removed angularLoad reference
- refactored: user, view, records, facets, ui
- added user.email
- added view.interfaceLanguage
- user, view, records, facets returns a promise
- removed Primo.explore.session.id
Watch my EPUG-UKI AGM 2017 presentation to get an idea of what it is and what it can do.
A domain object model according to Tim Howard is a logical container of domain information. You might assume that a model is present in every component and that is kind of true. When you examine a component you get a long list of context(component) specific information and there is no obvious way to access the most common(session, user, record, facet) information from within this component. And if you use an newUI service Ex Libris does not garentee that this service will still be present in the next newUI release.
I'm not saying that we need an SDK but we definitely need something that will withstand the test of time and maybe even is AngularJS agnostic. Currently the newUI is written using AngularJS 1 but plans are in place to upgrade to a future AngularJS and when this happens everybody who has written custom newUI code has to rewrite it for that AngularJS version.
TODO:write more documentation
This package will extend the newUI through a "Template Package" or "Central Package".
- Install and configure primo-explore-devenv
- Download a "Template Package" or "Central Package" from the Primo Back Office
- Extract the downloaded package to
primo-explore-devenv/primo-explore/custom
- Rename the "Template Package" directory to reflect your view code for example to
YOUR_VIEW_CODE
- Create a
package.json
file inside your package directory *cd YOUR_VIEW_CODE
*npm init -y
- Install and store a reference to this package
*
npm install primo-explore-dom --save-dev
- Test.
*
gulp run --view YOUR_VIEW_CODE --proxy http://my.primo.com
* Open your web browser and go to http://localhost:8003/primo-explore/search?vid=YOUR_VIEW_CODE
PS: YOUR_VIEW_CODE must be replaced with the code you use for your view.
If you haven't installed primo-explore-devenv but do want to explore you can load primo-explore-dom from your web browser console.
//enable debug information. Wait for the screen to reload.
angular.reloadWithDebugInfo();
//When screen is reloaded
//Get a pointer to AngularJs and angularLoad
var appInjector = angular.injector(['ng','angularLoad']);
//Get a reference to angularLoad
var angularLoad = appInjector.get('angularLoad');
//Load the script;
angularLoad.loadScript('https://npmcdn.com/primo-explore-dom/js/primo-explore-dom.js').then(function(){
console.log('script loaded');
});
If you are using this library to understand the newUI always load debug info first.
angular.reloadWithDebugInfo();
For now it is not possible to access the $scope and $ctrl without the debug info. The library will throw an error if this is the case and try an alternative method but this does not work for component access. (± will mark methods that absolutely need $scope access)
Primo.isDebugEnabled()
Primo.isPrimoAvailable()
Primo.version
Primo.user
returns a promise
Primo.user.then(user => console.log(user.id));
Primo.user.then(user => console.log(user.name));
Primo.user.then(user => console.log(user.email));
Primo.user.then(user => console.log(user.isLoggedIn()));
Primo.user.then(user => console.log(user.isOnCampus()));
Primo.user.then(user => console.log(user.fines.length));
Primo.user.then(user => console.log(user.fines.map(f => parseFloat(f.finesum)).reduce((p,c)=> p+c)))
Primo.user.then(user => console.log(user.loans.length))
Primo.view
returns a promise
Primo.view.then(view => console.log(view.code));
Primo.view.then(view => console.log(view.institution.code));
Primo.view.then(view => console.log(view.institution.name));
Primo.view.then(view => console.log(view.interfaceLanguage));
Primo.view.then(view => console.log(view.ip.address));
Primo.records
returns a promise
This is a pointer to the new UI result set
Primo.records.then(records => console.log(records));
Primo.records.then(records => console.log(records.map((m) => m.pnx.control.recordid[0])));
Primo.facets
returns a promise
This is a pointer to the new UI facet set
Primo.facets.then(facets => console.log(facets));
Primo.facets.then(facets => console.log(facets[0].name));
Primo.facets.then(facets => console.log(facets[0].count));
Primo.facets.then(facets => console.log(facets[0].values));
The components list changes over time. Some components are only available in certain situations
Primo.explore.components.keys();
var prmIcons = Primo.explore.components.get('prm-icon');
primIcons[0].name
primIcons[0].element
primIcons[0].cssPath
primIcons[0].scope()
primIcons[0].ctrl()
primIcons[0].blink()
Primo.explore.helper.isDebugEnabled();
Primo.explore.helper.isPrimoAvailable();
Primo.explore.helper.componentNames
Primo.explore.helper.querySelectorAll(selector)
Primo.explore.helper.injector()
Primo.explore.helper.http
Primo.explore.helper.loadScript()
Primo.explore.helper.rootScope()
Primo.explore.helper.userSessionManagerService()
Primo.explore.helper.jwtData()
Primo.explore.helper.userDetails()
Primo.explore.helper.userDetailsHTTP()
Primo.explore.helper.userFinesHTTP()
Primo.explore.helper.userLoansHTTP()
Primo.explore.helper.blink(component, numberOfBlinks = 4)
Primo.explore.ui.toggle()
app.component('prmLogoAfter', {
bindings: {
parentCtrl : '<'
},
template: '<div>{{$ctrl.user}}</div>',
controller: function(){
let ctrl = this;
ctrl.user = '';
Primo.user.then(u => ctrl.user = u.name);
}
});