Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

initial commit

  • Loading branch information...
commit ee1d05e59d34475a32feaff74440af4e1d827988 0 parents
@nathan7 authored
4 .gitignore
@@ -0,0 +1,4 @@
+components
+build
+node_modules
+npm-debug.log
4 .jshintrc
@@ -0,0 +1,4 @@
+{
+ "asi": true,
+ "laxcomma": true
+}
48 README.md
@@ -0,0 +1,48 @@
+# microdata
+
+ a component for extracting HTML5 microdata in the browser
+
+## Installation
+
+ $ component install nathan7/microdata
+
+or
+
+ $ npm install microdata
+
+## API
+
+microdata(schema)
+-----------------
+find all the elements with the given itemtype, extracts their data and returns them in an array.
+example:
+```javascript
+microdata('http://data-vocabulary.org/Person')
+```
+example return value:
+```javascript
+[{
+ "_type": "http://data-vocabulary.org/Person",
+ "photo": "http://diveintohtml5.info/examples/2000_05_mark.jpg",
+ "name": "Mark Pilgrim",
+ "title": "Developer advocate",
+ "affiliation": "Google, Inc.",
+ "address": {
+ "_type": "http://data-vocabulary.org/Address",
+ "street-address": "100 Main Street",
+ "locality": "Anytown",
+ "region": "PA",
+ "postal-code": "19999",
+ "country-name": "USA"
+ },
+ "url": ["http://diveintomark.org/", "http://www.google.com/profiles/pilgrim", "http://www.reddit.com/user/MarkPilgrim", "http://www.twitter.com/diveintomark"]
+}]
+```
+
+microdata.extract(elem)
+-----------------------
+extract all the microdata from an element. if multiple values are found for a property, it's turned into an array.
+
+## License
+
+ MIT
15 component.json
@@ -0,0 +1,15 @@
+{
+ "name": "microdata",
+ "repo": "nathan7/microdata",
+ "description": "a component for extracting HTML5 microdata in the browser",
+ "version": "0.0.1",
+ "keywords": ["microdata", "html5"],
+ "dependencies": {},
+ "development": {
+ "component/assert": "*",
+ "component/underscore": "*"
+ },
+ "author": "Nathan Zadoks",
+ "license": "MIT",
+ "scripts": ["index.js"]
+}
57 index.js
@@ -0,0 +1,57 @@
+module.exports = microdata;
+var lookup = { meta :'content'
+ , audio :'src'
+ , embed :'src'
+ , iframe :'src'
+ , img :'src'
+ , source :'src'
+ , video :'src'
+ , a :'href'
+ , area :'href'
+ , link :'href'
+ , object :'data'
+ , time :'datetime'
+ , '*' :'textContent'
+ }
+
+function microdata(itemtype) {
+ var elems = document.querySelectorAll('[itemscope][itemtype=' + JSON.stringify(itemtype) + ']')
+ , arr = []
+ for (var i = 0, len = elems.length; i < len; i++) arr.push(extract(elems[i]))
+ return arr
+}
+
+microdata.extract = extract
+function extract(scope) {
+ var obj = {}
+ , elems = [].slice.call(scope.childNodes)
+ , elem
+ , key
+ , attr
+ , val
+
+ obj._type = scope.getAttribute('itemtype')
+
+ /*jshint boss:true*/
+ while (elem = elems.shift()) {
+ if (elem.nodeType == elem.TEXT_NODE) continue
+
+ if (key = elem.getAttribute('itemprop')) {
+ if (elem.getAttribute('itemscope') !== null) val = extract(elem)
+ else {
+ attr = lookup[elem.tagName.toLowerCase()] || lookup['*']
+ val = elem[attr] || elem.getAttribute(attr)
+ }
+
+ if (!Object.prototype.hasOwnProperty.call(obj, key)) obj[key] = val
+ else {
+ if (obj[key] instanceof Array) obj[key].push(val)
+ else obj[key] = [obj[key], val]
+ }
+ }
+
+ if (elem.getAttribute('itemscope') === null) [].push.apply(elems, elem.children)
+ }
+
+ return obj
+}
15 package.json
@@ -0,0 +1,15 @@
+{
+ "name": "microdata",
+ "repository": { "type": "git", "url": "git://github.com/nathan7/microdata.git" },
+ "description": "a component for extracting HTML5 microdata in the browser",
+ "version": "0.0.1",
+ "keywords": ["microdata", "html5"],
+ "dependencies": {},
+ "devDependencies": {
+ "underscore": "~1.3.3"
+
+ }
+ "author": "Nathan Zadoks",
+ "license": "MIT",
+ "main": "index.js",
+}
16 test/mark.json
@@ -0,0 +1,16 @@
+{
+ "_type": "http://data-vocabulary.org/Person",
+ "photo": "http://diveintohtml5.info/examples/2000_05_mark.jpg",
+ "name": "Mark Pilgrim",
+ "title": "Developer advocate",
+ "affiliation": "Google, Inc.",
+ "address": {
+ "_type": "http://data-vocabulary.org/Address",
+ "street-address": "100 Main Street",
+ "locality": "Anytown",
+ "region": "PA",
+ "postal-code": "19999",
+ "country-name": "USA"
+ },
+ "url": ["http://diveintomark.org/", "http://www.google.com/profiles/pilgrim", "http://www.reddit.com/user/MarkPilgrim", "http://www.twitter.com/diveintomark"]
+}
48 test/test.html
@@ -0,0 +1,48 @@
+<!doctype html>
+<html>
+ <title>microdata tests</title>
+
+ <body>
+ <section itemscope itemtype="http://data-vocabulary.org/Person">
+ <img itemprop="photo" class="me" width="204" height="250" src="http://diveintohtml5.info/examples/2000_05_mark.jpg" alt="[Mark Pilgrim, circa 2000]">
+ <h1>Contact Information</h1>
+ <dl>
+ <dt>Name</dt>
+ <dd itemprop="name">Mark Pilgrim</dd>
+ <dt>Position</dt>
+ <dd>
+ <span itemprop="title">Developer advocate</span>for
+ <span itemprop="affiliation">Google, Inc.</span>
+ </dd>
+ <dt>Mailing address</dt>
+ <dd itemprop="address" itemscope itemtype="http://data-vocabulary.org/Address">
+ <span itemprop="street-address">100 Main Street</span>
+ <br>
+ <span itemprop="locality">Anytown</span>,
+ <span itemprop="region">PA</span>
+ <span itemprop="postal-code">19999</span>
+ <br>
+ <span itemprop="country-name">USA</span>
+ </dd>
+ </dl>
+ <h1>My Digital Footprints</h1>
+ <ul>
+ <li>
+ <a href="http://diveintomark.org/" itemprop="url">weblog</a>
+ </li>
+ <li>
+ <a href="http://www.google.com/profiles/pilgrim" itemprop="url">Google profile</a>
+ </li>
+ <li>
+ <a href="http://www.reddit.com/user/MarkPilgrim" itemprop="url">Reddit.com profile</a>
+ </li>
+ <li>
+ <a href="http://www.twitter.com/diveintomark" itemprop="url">Twitter</a>
+ </li>
+ </ul>
+ </section>
+ <script src="../build/build.js"></script>
+ <script src="test.js"></script>
+ </body>
+
+</html>
45 test/test.js
@@ -0,0 +1,45 @@
+function _require(name, user) {
+ try {
+ return require(name)
+ }
+ catch(e) {
+ return require((user || 'component') + '-' + name)
+ }
+}
+
+var microdata = _require('microdata', 'nathan7')
+ , _ = _require('underscore')
+ , assert = _require('assert')
+
+var result = microdata('http://data-vocabulary.org/Person')
+ , expected = [{ _type: "http://data-vocabulary.org/Person"
+ , photo: "http://diveintohtml5.info/examples/2000_05_mark.jpg"
+ , name: "Mark Pilgrim"
+ , title: "Developer advocate"
+ , affiliation: "Google, Inc."
+ , address: { _type: "http://data-vocabulary.org/Address"
+ , "street-address": "100 Main Street"
+ , locality: "Anytown"
+ , region: "PA"
+ , "postal-code": "19999"
+ , "country-name": "USA"
+ }
+ , url: ["http://diveintomark.org/", "http://www.google.com/profiles/pilgrim", "http://www.reddit.com/user/MarkPilgrim", "http://www.twitter.com/diveintomark"]
+ }]
+
+var success = false
+ , e
+
+try {
+ assert(_.isEqual(result, expected))
+ success = true
+}
+catch(e_) {
+ e = e_
+ success = false
+}
+
+var elem = document.createElement('h1')
+elem.textContent = 'tests ' + (success ? 'succeeded' : 'failed')
+elem.style.color = success ? 'green' : 'red'
+document.body.insertBefore(elem, document.body.firstChild)
Please sign in to comment.
Something went wrong with that request. Please try again.