psager
Upcoming SlideShare
Loading in...5
×
 

psager

on

  • 617 views

 

Statistics

Views

Total Views
617
Views on SlideShare
617
Embed Views
0

Actions

Likes
0
Downloads
2
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

psager psager Presentation Transcript

  • Content Outside of CONTENTdm: Part 1: Exhibit Creation Tool using Prototype and Script.aculo.us Phil Sager Ohio Historical Society psager@ohiohistory.org
  • Old Ohio Memory with scrapbook
  • New CONTENTdm-based Ohio Memory with exhibit creator tool: http://www.ohiomemory.org/
  • Exhibit creation tool http://www.ohiomemory.org/custom/exhibits/
  • Example Search on “Grant”
  • Mouseover titles
  • Drag and Drop
  • Example of dropped item plus extra information from CDM description field by clicking on question mark
  • Selections with annotations and title
  • After clicking on “Create Exhibit”
  • Exhibit is created
  • Different backgrounds available
  • Different background
  • “Add This” Button
  • Exhibit with annotation and CDM link
  • CONTENTdm Record
  • Prototype •  “Prototype is a JavaScript framework that aims to ease development of dynamic web applications. It offers a familiar class-style OO framework, extensive Ajax support, higher-order programming constructs, and easy DOM manipulation.”
  • Script.aculo.us •  “script.aculo.us is a set of JavaScript libraries to enhance the user interface of web sites. It provides a visual effects engine, a drag and drop library (including sortable lists), a couple of controls (Ajax- based autocompletion, in-place editing, sliders) and more.” •  “It's an add-on to the fantastic Prototype framework.”
  • Other Popular Libraries •  jQuery, jQuery UI –  http://jquery.com/ •  MooTools –  http://mootools.net/ •  Dojo –  http://www.dojotoolkit.org/ •  Yahoo! User Interface Library (YUI) –  http://developer.yahoo.com/yui/ •  Ext Core –  http://www.extjs.com/products/extcore/
  • Google AJAX Libraries API
  • Search form
  • Prototype DOM methods
  • Prototype AJAX Request
  • Server-side
  • JSON •  “JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate. It is based on a subset of JavaScript.” •  “The Fat-Free Alternative to XML” •  http://json.org
  • JSON Example
  • Prototype decodes JSON
  • Use Script.aculo.us to build results
  • Script.aculo.us “Draggable”
  • Scriptaculous “Droppables”
  • Create Exhibit
  • Exhibit uses Lightview http://www.nickstakenburg.com/projects/lightview/
  • Online Resources •  Prototype: http://www.prototypejs.org –  Tips and Tutorials: http://www.prototypejs.org/learn –  Prototype Framework Tutorial: http://www.tutorialspoint.com/prototype •  Script.aculo.us: http://script.aculo.us –  script.aculo.us Tutorial: http://www.tutorialspoint.com/script.aculo.us –  10 Useful tutorials to learn Scriptaculous: http://woork.blogspot.com/2008/10/10-useful-tutorials-to- learn.html •  Google AJAX Libraries API: http://code.google.com/apis/ajaxlibs –  Sign up for a Google API key: http://code.google.com/apis/ajaxsearch/signup.html •  Lightview: http://www.nickstakenburg.com/projects/lightview
  • Books •  Crane, Dave, Bear Bibeault, Tom Locke, and Thomas Fuchs. Prototype and Scriptaculous in Action. Manning Publications, 2007. •  Dupont, Andrew. Practical Prototype and Script.aculo.us. Apress, 2008 •  Porteneuve, Christophe. Prototype and script.aculo.us: You Never Knew JavaScript Could Do This! Pragmatic Bookshelf, 2007. •  Rao, Sridhar. PHP and script.aculo.us Web 2.0 Application Interfaces. Packt Publishing, 2009.
  • Phil Sager Ohio Historical Society psager@ohiohistory.org