Customizing your Innovative Encore library catalogue with JavaScript - EIUG 2012 presentation.
•Descargar como PPTX, PDF•
1 recomendación•3,063 vistas
I presented this talk on JavaScript in Encore 4.2 at the European Innovative Users Group (EIUG) 2012 conference held at University of Leeds, 20-21 June 2012. I describe a new feature in Encore 4.2 that allows for customising the Encore record display using JavaScript. I discuss examples of what I have done at Senate House Library using this.
Recomendados
Recomendados
Más contenido relacionado
Más de Andrew Preater
Más de Andrew Preater (20)
Último
Último (20)
Customizing your Innovative Encore library catalogue with JavaScript - EIUG 2012 presentation.
- 1. Customizing Encore 4.2 with JavaScript Andrew Preater Senate House Libraries University of London
- 3. What I’ll talk about Your JavaScript in Encore 4.2 Examples
- 4. Examples 1. Persistent link 2. Social bookmarking buttons 3. QR codes 4. Tweaking Amazon jackets 5. Store requests 6. LibraryThing for Libraries
- 5. Encore 4.2 Beta testing from January 2012 Live in March 2012
- 9. div#custom Sidebar div#customTop div#customBottom
- 10. Examples
- 11. Persistent link
- 12. Simple example
- 13. 1. Get bib number from document.URL http://encore.ulrls.lon.ac.uk/iii/encore/r ecord/C__Rb1000880__SJos%C3%A9%20Saramago_ _Ff%3Afacetlocations%3Aull%3Aull%3ASENATE% 20HOUSE%20LIBRARY%3A%3A__Ff%3Afacetlanguag es%3Aeng%3Aeng%3AEnglish%3A%3A__Ff%3Afacet fields%3Aauthor%3Aauthor%3AAuthor%3A%3A__F f%3Afacetavailability%3Atrue%3Atrue%3AAt%2 0the%20library%3A%3A__P0%2C11__Orightresul t__X4?lang=eng&suite=cobalt
- 14. 2. Create a div using document.createElement 3. Write the innerHTML of the div Include the persistent URL: http://encore.ulrls.lon.ac.uk/iii/enco re/record/C__R + bib number
- 15. 4. Attach it to the customBottom div using appendChild
- 18. QR codes
- 19. QR codes bit.ly/L6YtmR http://encore.ulrls.lon.ac.uk/iii /mobile/record/C__Rb1000880?lang= eng&utm_source=encore&utm_medium= qr&utm_campaign=mobile
- 20. QR codes
- 22. Amazon jackets
- 23. Amazon jackets Get your ISBN here: var key = "ISBN:9781844678785"
- 24. Amazon jackets 1. If length is 13, convert it to an ISBN-10 2. Rewrite jacket img src and href
- 27. Store requests Done in WebBridge in classic catalogue No WebBridge bib resource table in Encore
- 35. LibraryThing 1. Append an element with LTfL divs in it. 2. Source LTfL JS after
- 37. Similar items Tag browser Reviews
- 42. Limitations Bib record display only Limit is what you can do with JavaScript
- 43. Please steal and improve my JavaScript: http://bit.ly/encore42js
- 45. Thank you Me: @preater andrew.preater@london.ac.uk www.preater.com
Notas del editor
- I work for the central University of London, the central administrative body of the federal university of 18 colleges and 10 institutes.Senate House Libraries is:Senate House Library, a spectacular collection of about 3 million items concentrated in the arts and humanities plus another 1 million items from the libraries of the institutes of our central university.That bit.ly URL is an online exhibition for our 175th anniversary which includes this picture of Lord Beauchamp inspecting the University of London officers’ training corps in 1930.
- What I’ll talk about:I’ll quickly show you how the custom JavaScript feature works in the new Encore release.Then examples of things you can do with this. This is the fun bit.
- These are the examples, just wanted to point out we have small improvements and some relatively big enhancements.
- We have Millennium R2011 and Encore Discovery.Live with Encore last year and now using it as the “main” catalogue.Year to date, Encore usage is about is 51% total Encore & WebPAC use. Must try harder…We are a best test partner for Release 4.2. This is a great process to be involved with and I’d recommend anyone take it up if you can. There is work, but it’s good and a useful experience.We went live with that in March as our public-facing catalogue.
- Here’s our Encore front page.There are no huge surprises here: still the Cobalt skin – nice.Still the provocative “single search” box to encourage keyword searchingYou can customisea few things for yourself.
- This is Encoreadministration - /iii/admin on your Encore server.It now has a “customization” section where you can do various things including adding custom JavaScript.It’s as simple as it looks, whatever you put in that box goes into the bib record.So put some JavaScript in there, or just source your remote JavaScript there.
- Important to realise it’s the bib record display only. You’re not putting script on the Encore search results page or anywhere else for example the front page.Where does the script go?Simple answer, “right at the bottom”.Custom scripts appear just below this div with id footerArea, but above the Google Analytics script inserted by the server.This is just above the closing </body> tag of the page.
- You could manipulate the Encore bib display however you like with Javascript.However Innovative provide three divs:customTopcustomBottom andcustomSidebarwhere they Innovative suggest you put things.This is where they are on the Encore bib record.You can write in their innerHTML to put your own things in them.
- You can put your own JavaScript in the Encore bib display to mess around with it and do various useful things: Useful customisations that are unlikely to be developed as part of regular Encore development workWorkarounds.
- First thing I decided to do was add a persistent link to the Encore bib display for bookmarking and linking.Encore URLs are persistent but it’s nice to have a “clean” and obvious one on the bib display.Librarians at our college libraries in particular like this for linking to our records.
- 1. Get bib number from document.URL i.e. the URL of the pageGetting the record number from the URL of the page seemed simplest. Look at that long Encore URL. You can get the bib number from it using indexOf and then substring to get the part of the URL that is the bib number.indexOf('record/C__R')substring(urlindex + 11,urlindex + 19)
- I create somewhere for the link to live using document.createElementThen I write the innerHTML of the div which I make sure includes my my link in to the Encore record number.
- Finally I attach it using appendChild.I’m going to append my div to the customBottom div I mentioned earlier.
- Social bookmarkingThis is actually an example innovative provide for Encore 4.2 so I’ll be brief.There it is.I think that: nowadays I expect sites I visit to include some social bookmarking features even if they are not especially social spaces or destinations themselves.I think current library catalogues are relatively unsupportive of social use. But I expect this stuff just to ‘be there’.(Blog post with thoughts on the ‘anti social catalogue’ here: http://www.preater.com/2012/05/28/the-anti-social-catalogue-at-library-camp-leeds/ )Most people are no longer surprised to see a ‘tweet this’ or Google +1 button and I have wanted this in Encore since the start.Let’s zoom in...
- This shows where I’ve moused-over the popup for additional services.I used Addthis.com. This makes things very easy. If you register an account you can get analytics information for clicks and “viral lift” – meaning traffic driven by sharing.You can as I have customise what social networking sites appear.In consultation with our research librarians – I emphasised accounts with some academic use such as bibliographic citation sites:Connotea, Cite u Like, Diigo, Mendeley, and Email!
- A QR code is a two dimensional barcode readable by a smartphone.I added this because we get readers bringing phones to the enquiries desk to show us a bib record so we wanted to create a quick way for a smartphone user link between bib record and Mobile Encore.Our Encore mobile use is quite small, about 3.3% total visitors so use will not be spectacular. But it’s easy to do and very low risk.My blog posts on adding QR to our catalogue here: http://www.preater.com/tag/qr-codes/
- Here’s the zoomed in version of the QR code, and this is what it links to on Mobile Encore.And this is what it expands to.Just a few points here. I shorten that URL with bit.ly for a less complex QR code, easier to read on older phones. I include tracking parameters for Google Analytics as a “campaign” in the URL. That’s the stuff on the end. I use the Google Chart API to render the QR code.This API is deprecated now so will need to change this at some point.
- This is where we end up on our phone.There are other approaches to using QR in the catalogue.For example University of Glasgow include text about the item – title and shelfmark – as a QR code.
- Amazon book jackets are a popular zero cost option for adding jacket images to your catalogue.But they’re not perfect. I’m currently looking at OpenLibrary jacket images as an alternative but I digress.
- Problem is Amazon needs an ISBN10 (Amazon actually needs an “Amazon Standard Identification Number” but that is an ISBN-10 for a book).If you have the ISBN-13 first in a record, this carries through onto the markup of the page.The ISBN-13 will be used by Encore and won’t retrieve a jacket image although the equivalent ISBN-10 might.We can do is use JavaScript to alter this!
- Briefly, we can get the ISBN from a variable Encore declares called “key”. For example this one.It uses this to check forpreviewability at Google Books.In general, this is a good way to get the ISBN of an item in Encore.I’ve used it for adding links to pin records to Pinterest... but won’t be covering that today!
- So if it’s 13 characters, we can convert that to an ISBN-10Then: rewrite the link to the Amazon jacket image and the link to an Amazon page.
- Here’s what you get on the bib display: note ISBN13 first, but we get the jacket image too.
- Store journals. One of the less exciting parts of our business, but bear with me.Changes to our library space have made easy access to our journals held in closed store more important.Everything but recent issues of journals are now in store.We used to use paper forms. These are not longer going to cut it.
- In WebPAC I was able to add links to a journal request form using WebBridge.It’s quite powerful as you can use various conditions to work out if something was a journal in a store location and also reuse data from the bib record when linking out.Unfortunately this feature called the “bib resource table” doesn’t exist in Encore.
- In case you’re unsure: I mean the panel you can make appear on the bib record. Not the pop-up window that also appears in Encore!
- What to do?Going back to paper forms would not be welcomed.We can do it with some JavaScript...
- If there is an attached checkin records, this div id toggleAnyComponent exists. So we check if it exists, and then if it matches a regular expression for “STACK SERVICE”.If so we add in a link in the customTop area.Here’s what that looks like:
- Now all that button does is send a link with the bib record number to a form on our Web site.If you click on that...
- You get to our store request form.This page uses Html Agility Pack for .NET (http://htmlagilitypack.codeplex.com/). It scrapes the Encore bib display & fillsup the request form.I wanted to do it this way rather than 100% on the front-end to move some of the heavy lifting away from the client Web browser. (We also wanted some experience using Html Agility Pack for bigger projects.)The important point is title, location and classmarkare pre-filled. This is where our library members often go wrong when trying to copy something manually.It all works but the form isn’t quite ready to go live yet. So I haven’t shown you how to try it.
- Librarythingoffers various enhancements for your catalogue based on Librarything’s data and user-generated content.Basically – catalogue enrichment at tempting prices.The ones you’re probably most familiar with: Book recommendations / similar books Discovery of your own collections based on tags added by Librarything users Links to translations and other editions Reviews by your own patrons and Librarything users. A visual shelf-browserand other things.I’m not here to sell this product though, I want to show you how to make it work in Encore…
- As a little test to get this working in Encore I uploaded a MARC file of records for books with with ISBNs. I just exported these in data exchange and uploaded them here.I’m working with 360,000 ISBNs, overlap with LibraryThing is 61% (219,000).I’ve enabled three of these enhancements: tags, similar items, and reviews.
- How’s this work in Encore?Basic concept with Librarything for Libraries is: You source Librarything’s JavaScript You insert divs with the right ID on your catalog bib display.The enhancements magically appear: Librarything does the rest.With Encore we can use custom JavaScript to both insert the correct divs on the record and source the Librarything JavaScript.So you just create a div with the appropriate content and append this somewhere on your page.Need to source the Librarything JavaScript after the divs have been inserted.
- Live example here – this is very beta! You can enable our LTfL test on an Encore bib display by including the parameter “ltfl=1”.http://encore.ulrls.lon.ac.uk/iii/encore/record/C__Rb1785752?lang=eng&ltfl=1Let’s see this in action. If I scroll down on this bib record you’ll see it...
- That stuff is all from LibraryThing – it’s even not that obvious as it fits in so well with Encore.I haven’t enabled absolutely everything. To be perfectly clear you can see: Similar books / recommendations A tag browser Reviews from LibraryThing users
- Let me show you it workingusing the Tag Browser for example.Look at that tag “magic realism” - if we click that...
- We get the LibraryThing tag browser in a lightbox.The books you can see are all from the set of records I uploaded.If I follow that link to “Lighthousekeeping”, I get to the record.
- Note this is just an ISBN search to get into the bib record. Ideally this needs changing so LibraryThing can link in based on the record number of the exported bib record.
- This is how our bib record now looks.I am using only the customBottom div so far and need to experiment with putting things elsewhere.
- That’s all the examples I have for you.Somelimitations of this approach:Once again, you can only alter the bib record screen!The only reallimit is what you can do with JavaScript.
- I would be pleased for you to improve my efforts at modifying the encore bib record.That URL is a Pastebin where you can find our current JavaScript.Our just take a look at a record in my catalogue.
- There’s also a wiki on CSdirect where I’ve put some of these scripts including further explanation about what each one does.
- You can contact me on Twitter @preater or by emailMy blog Ginformation Systems is at preater.com