jf2: Difference between revisions

From Microformats Wiki
Jump to navigation Jump to search
(stub with dfn, an illustrative basic example, prior work, prior simplifications, see also)
 
(Undo revision 65369 by Benthatmustbeme (Talk) nevermind, this is actually a bug in webmention.io, misunderstanding there.)
(22 intermediate revisions by 5 users not shown)
Line 5: Line 5:


== Basic Example ==
== Basic Example ==
<source type="javascript">
<source lang="javascript">
{
{
   "type": "entry",
   "type": "entry",
Line 12: Line 12:
     "name": "Tantek Çelik",
     "name": "Tantek Çelik",
     "url": "http:\/\/tantek.com\/",
     "url": "http:\/\/tantek.com\/",
     "photo": "http:\/\/tantek.com\/photo.jpg",
     "photo": "http:\/\/tantek.com\/photo.jpg"
   },
   },
   "published": "2015-10-21T12:34-0700",
   "published": "2015-10-21T12:34-0700",
  "category": ["simple", "example"],
   "content": "Example of a simple note"
   "content": "Example of a simple note"
}
}
</source>
</source>
== Specification ==
* [https://github.com/dissolve/jf2 github.com/dissolve/jf2] - Primary development
== Implementations ==
=== Parsers ===
Open source parsers:
* [https://github.com/dissolve/socialstream github.com/dissolve/socialstream] - Sample php code to convert MF2 -> JS2
* [http://www.unmung.com/ unmung.com] - another conversion service that can convert mf2 to jf2
=== Consuming Code ===
Service that converts jf2 into readable HTML:
* [http://stream.thatmustbe.us/ stream.thatmustbe.us] - Service running the socialstream code
== Name Candidates ==
As 'jf2' is only a working name let's collect alternatives:
;JFDI
:Backronym: JSON For Data Interchange
;jf2
:Minimal JSON for mf2


== Prior Work ==
== Prior Work ==
Line 24: Line 49:
== Prior Simplifications ==
== Prior Simplifications ==
Output from:
Output from:
* webmention.io
* webmention.herokuapp.com


(need specific examples from those two)
=== [http://webmention.io webmention.io] ===
This service outputs a list of webmentions received for a post. It recognizes when a post is a reply, like, repost, invitation, RSVP, and mention. Example JSON output:
 
<source lang="javascript">
{
  "source": "http://tantek.com/2013/112/t2/milestone-show-indieweb-comments-h-entry-pingback",
  "verified": true,
  "verified_date": "2013-04-25T17:09:33-07:00",
  "id": 900,
  "data": {
    "author": {
      "name": "Tantek Çelik",
      "url": "http://tantek.com/",
      "photo": "http://tantek.com/logo.jpg"
    },
    "name": "Another milestone: @eschnou automatically shows #indieweb comments with h-entry sent via pingback http://eschnou.com/entry/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html",
    "content": "Another milestone: <a class=\"auto-link h-x-username\" href=\"https:\/\/twitter.com\/eschnou\">@eschnou<\/a> automatically shows #indieweb comments with h-entry sent via pingback <a class=\"auto-link\" href=\"http:\/\/eschnou.com\/entry\/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html\">http:\/\/eschnou.com\/entry\/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html<\/a>",
    "published": "2013-04-22T15:03:00-07:00",
    "published_ts": 1366668180,
    "url": "http://tantek.com/2013/112/t2/milestone-show-indieweb-comments-h-entry-pingback"
  }
}
</source>
 
=== webmention.herokuapp.com ===
 
This site outputs in multiple formats, based on receiving webmentions, parsing them for microformats and consolidating into a single feed. Live examples for kevinmarks.com:
*[https://webmention.herokuapp.com/api/mentions?site=kevinmarks.com&format=html HTML mf2 markup]
<source lang=html4strict>
<div class="h-entry">
  <a href="http://waterpigs.co.uk/" class="p-author h-card">
    <img src="http://waterpigs.co.uk/photo.jpg" alt="">
    Barnaby Walters
  </a>
    <div class="p-summary p-name">@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf</div>
  <footer>
    <time class="dt-published" datetime="2014-04-01T14:25:14.000Z" pubdate="">
      <a class="u-url u-uid" href="http://waterpigs.co.uk/notes/4VMERE/">2 years ago</a>
    </time>
    mentioning <a href="http://kevinmarks.com/">http://kevinmarks.com/</a>
  </footer>
</div>
</source>
*[http://www.unmung.com/mf2?url=https%3A%2F%2Fwebmention.herokuapp.com%2Fapi%2Fmentions%3Fsite%3Dkevinmarks.com%26format%3Dhtml&html=&pretty=on parsed JSON form of the HTML]
 
<source lang=javascript>
{
"type": ["h-entry"],
"properties": {
    "uid": ["http://waterpigs.co.uk/notes/4VMERE/"],
    "author": [
        {"type": ["h-card"],
            "properties": {
                "url": ["http://waterpigs.co.uk/"],
                "photo": ["http://waterpigs.co.uk/photo.jpg"],
                "name": [""]
            },
            "value": "Barnaby Walters"
        }],
    "url": ["http://waterpigs.co.uk/notes/4VMERE/"],
    "summary": ["@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf"],
    "published": ["2014-04-01T14:25:14Z"],
    "name": [ "@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf"]
    }
}
</source>
 
*[https://webmention.herokuapp.com/api/mentions?site=kevinmarks.com&format=json simplified JSON] (whitespace added)
 
<source lang=javascript>
{
  "url":"http://waterpigs.co.uk/notes/4VMERE/",
  "name":null,
  "published":1396362314000,
  "summary":"@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf",
  "author": {
    "name":"Barnaby Walters",
    "photo":"http://waterpigs.co.uk/photo.jpg",
    "url":"http://waterpigs.co.uk/"
  },
  "interactions": ["http://www.kevinmarks.com/indiewebsfdemowrapup.html"],
  "targets":["http://kevinmarks.com/"],
  "type":"reply",
  "interactionTarget":false
}
</source>
 
=== [https://github.com/indieweb/php-comments php-comments] library ===
This library takes HTML and converts it to a simple PHP data structure. Example post:
 
<source lang="php"> 
  $result = array(
    'type' => 'reply',
    'author' => array(
      'name' => 'Aaron Parecki',
      'photo' => 'http://aaronparecki.com/images/aaronpk.png',
      'url' => 'http://aaronparecki.com/'
    ),
    'published' => '2014-02-16T18:48:17-0800',
    'name' => 'Example Note',
    'text' => 'this text is displayed as the comment',
    'url' => 'http://aaronparecki.com/post/1'
  );
</source>


== See Also ==
== See Also ==
* [[json]]
* [[json]]
* [[microformats2]]
* [[microformats2]]
* [[microformats-parsing]]
* [[microformats2-parsing]]

Revision as of 22:06, 4 January 2016

This article is a stub. You can help the microformats.org wiki by expanding it.


jf2 is a working name for a simplified more minimal JSON representation of microformats2.

Basic Example

{
  "type": "entry",
  "author": {
     "type": "card",
     "name": "Tantek Çelik",
     "url": "http:\/\/tantek.com\/",
     "photo": "http:\/\/tantek.com\/photo.jpg"
  },
  "published": "2015-10-21T12:34-0700",
  "category": ["simple", "example"],
  "content": "Example of a simple note"
}

Specification


Implementations

Parsers

Open source parsers:

Consuming Code

Service that converts jf2 into readable HTML:


Name Candidates

As 'jf2' is only a working name let's collect alternatives:

JFDI
Backronym: JSON For Data Interchange
jf2
Minimal JSON for mf2


Prior Work

Prior Simplifications

Output from:

webmention.io

This service outputs a list of webmentions received for a post. It recognizes when a post is a reply, like, repost, invitation, RSVP, and mention. Example JSON output:

{
  "source": "http://tantek.com/2013/112/t2/milestone-show-indieweb-comments-h-entry-pingback",
  "verified": true,
  "verified_date": "2013-04-25T17:09:33-07:00",
  "id": 900,
  "data": {
    "author": {
      "name": "Tantek Çelik",
      "url": "http://tantek.com/",
      "photo": "http://tantek.com/logo.jpg"
    },
    "name": "Another milestone: @eschnou automatically shows #indieweb comments with h-entry sent via pingback http://eschnou.com/entry/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html",
    "content": "Another milestone: <a class=\"auto-link h-x-username\" href=\"https:\/\/twitter.com\/eschnou\">@eschnou<\/a> automatically shows #indieweb comments with h-entry sent via pingback <a class=\"auto-link\" href=\"http:\/\/eschnou.com\/entry\/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html\">http:\/\/eschnou.com\/entry\/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html<\/a>",
    "published": "2013-04-22T15:03:00-07:00",
    "published_ts": 1366668180,
    "url": "http://tantek.com/2013/112/t2/milestone-show-indieweb-comments-h-entry-pingback"
  }
}

webmention.herokuapp.com

This site outputs in multiple formats, based on receiving webmentions, parsing them for microformats and consolidating into a single feed. Live examples for kevinmarks.com:

<div class="h-entry">
  <a href="http://waterpigs.co.uk/" class="p-author h-card">
    <img src="http://waterpigs.co.uk/photo.jpg" alt="">
    Barnaby Walters
  </a>
    <div class="p-summary p-name">@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf</div>
  <footer>
    <time class="dt-published" datetime="2014-04-01T14:25:14.000Z" pubdate="">
      <a class="u-url u-uid" href="http://waterpigs.co.uk/notes/4VMERE/">2 years ago</a>
    </time>
     mentioning <a href="http://kevinmarks.com/">http://kevinmarks.com/</a>
  </footer>
</div>
{
"type": ["h-entry"], 
"properties": {
    "uid": ["http://waterpigs.co.uk/notes/4VMERE/"], 
    "author": [
        {"type": ["h-card"], 
            "properties": {
                "url": ["http://waterpigs.co.uk/"], 
                "photo": ["http://waterpigs.co.uk/photo.jpg"], 
                "name": [""]
            }, 
            "value": "Barnaby Walters"
        }], 
    "url": ["http://waterpigs.co.uk/notes/4VMERE/"], 
    "summary": ["@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf"], 
    "published": ["2014-04-01T14:25:14Z"], 
    "name": [ "@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf"]
    }
}
{
  "url":"http://waterpigs.co.uk/notes/4VMERE/",
  "name":null,
  "published":1396362314000,
  "summary":"@kevinmarks awesome demos as always! Thanks for live posting! #indiewebcampsf",
  "author": {
    "name":"Barnaby Walters",
    "photo":"http://waterpigs.co.uk/photo.jpg",
    "url":"http://waterpigs.co.uk/"
  },
  "interactions": ["http://www.kevinmarks.com/indiewebsfdemowrapup.html"],
  "targets":["http://kevinmarks.com/"],
  "type":"reply",
  "interactionTarget":false
}

php-comments library

This library takes HTML and converts it to a simple PHP data structure. Example post:

  
  $result = array(
    'type' => 'reply',
    'author' => array(
      'name' => 'Aaron Parecki',
      'photo' => 'http://aaronparecki.com/images/aaronpk.png',
      'url' => 'http://aaronparecki.com/'
    ),
    'published' => '2014-02-16T18:48:17-0800',
    'name' => 'Example Note',
    'text' => 'this text is displayed as the comment',
    'url' => 'http://aaronparecki.com/post/1'
  );

See Also