{"id":9837,"date":"2012-11-08T08:30:49","date_gmt":"2012-11-08T13:30:49","guid":{"rendered":"http:\/\/mith.umd.edu\/?p=9837"},"modified":"2020-10-08T16:00:51","modified_gmt":"2020-10-08T20:00:51","slug":"webdeveloperstoolkitforannotation","status":"publish","type":"post","link":"https:\/\/mith.umd.edu\/webdeveloperstoolkitforannotation\/","title":{"rendered":"“A Web Developer’s Toolkit for Annotation of Streaming Video”"},"content":{"rendered":"

If you haven’t heard of Open Annotation,<\/a> then you\u2019re missing out on the greatest thing since virtual sliced bread. Something as simple as saying, \u201cthis should be associated with that,\u201d is powerful. The simple things often are.<\/p>\n

We\u2019re used to blogs with comments. Each comment is a piece of text associated with the blog entry or another comment. Systems like WordPress<\/a> or Movable Type<\/a> own the comments. They store the comments in the same database as the other content. Comment providers such as Disqus<\/a> manage all of the comments in their own database and associate them with the appropriate blog page.<\/p>\n

Open Annotation goes one step further. With Open Annotation, the comments could be stored anywhere and still be associated with the blog entry.<\/p>\n

Open Annotation frees commentary by allowing anyone to own the commentary, anyone else to own the object under discussion, and yet another person to make the associations between the comments and the object. In fact, Open Annotation could be one of the enabling technologies for Alan Liu’s vision of opt-in communities for information authority (a.k.a. censorship and peer review).<\/a> You get to decide whose annotations you want to use.<\/p>\n

MITH has been part of the Open Annotation Collaboration for a few years now. Over the last year, we worked with Alexander Street Press<\/a> to develop a JavaScript library<\/a> that lets you add video annotation capabilities to your website.<\/p>\n

It’s a bit raw still, but it provides the basic framework. With a little effort and comfort with JavaScript (especially closures and anonymous functions), you can make it work with your application. If you want to use a video player other than HTML5, you need to write a driver<\/a> that lets the library control the player. If you want to allow annotations other than text, you need to write some JavaScript that lets the library know how you want the annotation body rendered. If you want to be able to pick out parts of images that aren\u2019t rectangles or ellipses, again, you can write a bit of JavaScript and you\u2019ll be good to go.<\/p>\n

In the spirit of Open Annotation, our library doesn’t demand any particular integration into your website. You get to decide how you want people to interact with the video annotation capabilities. You get to decide how annotations are stored or discovered. The source code<\/a> of our demo<\/a> is a good place to start to see how you can use the library.<\/p>\n

Of course, this flexibility means that you have to do a little work to use it. If the prospect of annotating video intrigues you but you don’t have time to incorporate it into a platform such as WordPress or Drupal, hang on for a year. We\u2019re going to be developing a Drupal plugin that will let you add video annotation to almost any HTML5 video on your Drupal site. We\u2019ll also add more documentation and tutorials.<\/p>\n

James Smith is MITH’s Software Architect. His research interests focus on narrative and enabling humanities research through computation; he works on a wide range of projects, from statistical models of prose to MUDs to web application frameworks.
\n<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"

If you haven’t heard of Open Annotation, then you\u2019re missing out on the greatest thing since virtual sliced bread. Something as simple as saying, \u201cthis […]<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[77],"tags":[61],"yoast_head":"\n"A Web Developer's Toolkit for Annotation of Streaming Video" – Maryland Institute for Technology in the Humanities<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mith.umd.edu\/webdeveloperstoolkitforannotation\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\""A Web Developer's Toolkit for Annotation of Streaming Video" – Maryland Institute for Technology in the Humanities\" \/>\n<meta property=\"og:description\" content=\"If you haven’t heard of Open Annotation, then you\u2019re missing out on the greatest thing since virtual sliced bread. Something as simple as saying, \u201cthis […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mith.umd.edu\/webdeveloperstoolkitforannotation\/\" \/>\n<meta property=\"og:site_name\" content=\"Maryland Institute for Technology in the Humanities\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/UMD.MITH\" \/>\n<meta property=\"article:published_time\" content=\"2012-11-08T13:30:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-10-08T20:00:51+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mith.umd.edu\/wp-content\/uploads\/2018\/10\/MITH-logostack-square-grn.png\" \/>\n\t<meta property=\"og:image:width\" content=\"300\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/mith.umd.edu\/#website\",\"url\":\"https:\/\/mith.umd.edu\/\",\"name\":\"Maryland Institute for Technology in the Humanities\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/mith.umd.edu\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/mith.umd.edu\/webdeveloperstoolkitforannotation\/#webpage\",\"url\":\"https:\/\/mith.umd.edu\/webdeveloperstoolkitforannotation\/\",\"name\":\"\\\"A Web Developer's Toolkit for Annotation of Streaming Video\\\" – Maryland Institute for Technology in the Humanities\",\"isPartOf\":{\"@id\":\"https:\/\/mith.umd.edu\/#website\"},\"datePublished\":\"2012-11-08T13:30:49+00:00\",\"dateModified\":\"2020-10-08T20:00:51+00:00\",\"author\":{\"@id\":\"https:\/\/mith.umd.edu\/#\/schema\/person\/633b50afdc95e02e4a65cdbcd6bf2455\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/mith.umd.edu\/webdeveloperstoolkitforannotation\/\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/mith.umd.edu\/#\/schema\/person\/633b50afdc95e02e4a65cdbcd6bf2455\",\"name\":\"James Smith\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/mith.umd.edu\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/695641dbe5634931693324988cd7f154?s=96&d=mm&r=g\",\"caption\":\"James Smith\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/posts\/9837"}],"collection":[{"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/comments?post=9837"}],"version-history":[{"count":1,"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/posts\/9837\/revisions"}],"predecessor-version":[{"id":21170,"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/posts\/9837\/revisions\/21170"}],"wp:attachment":[{"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/media?parent=9837"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/categories?post=9837"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mith.umd.edu\/wp-json\/wp\/v2\/tags?post=9837"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}