Article HTML
├── .npmignore ├── .gitignore ├── .babelrc ├── lib └── index.js ├── package.json ├── README.md └── test ├── article.instant-article.html ├── index.js ├── article.amp.html ├── article.html └── article.apple-news.json /.npmignore: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | /dist 3 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015"] 3 | } 4 | -------------------------------------------------------------------------------- /lib/index.js: -------------------------------------------------------------------------------- 1 | import createHtmlToArticleJson from 'html-to-article-json'; 2 | import articleJsonToAmp from 'article-json-to-amp'; 3 | import articleJsonToIA from 'article-json-to-fbia'; 4 | import articleJsonToAppleNews from 'article-json-to-apple-news'; 5 | 6 | const htmlToArticleJson = createHtmlToArticleJson({}); 7 | 8 | export function format (html, opts = {}) { 9 | const articleJson = htmlToArticleJson(html); 10 | 11 | const amp = articleJsonToAmp(articleJson); 12 | const instantArticle = articleJsonToIA(articleJson); 13 | const appleNews = articleJsonToAppleNews({ 14 | title: 'Untitled', 15 | author: { 16 | name: '' 17 | }, 18 | body: articleJson 19 | }, { 20 | identifier: 'ID' 21 | }); 22 | 23 | return { 24 | amp, 25 | instantArticle, 26 | appleNews: { 27 | article: appleNews.article.components[1].components /* body only */, 28 | bundlesToUrls: appleNews.bundlesToUrls 29 | } 30 | }; 31 | } 32 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "distro-mic", 3 | "version": "1.0.0", 4 | "description": "Automatically transform article HTML for third-party platforms such as Facebook Instant Articles, Apple News and Google AMP", 5 | "main": "dist/index.js", 6 | "scripts": { 7 | "lint": "semistandard | snazzy", 8 | "test": "babel-node test/index.js && npm run lint", 9 | "build": "babel lib --out-dir dist", 10 | "watch": "babel lib --out-dir dist --watch", 11 | "prepublish": "npm run build" 12 | }, 13 | "repository": { 14 | "type": "git", 15 | "url": "git+https://github.com/micnews/distro.git" 16 | }, 17 | "author": "mic.com", 18 | "license": "MIT", 19 | "bugs": { 20 | "url": "https://github.com/micnews/distro/issues" 21 | }, 22 | "homepage": "https://github.com/micnews/distro#readme", 23 | "devDependencies": { 24 | "babel-cli": "^6.4.5", 25 | "babel-core": "^6.5.2", 26 | "babel-preset-es2015": "^6.3.13", 27 | "semistandard": "^9.0.0", 28 | "snazzy": "^5.0.0", 29 | "tape": "^4.5.1" 30 | }, 31 | "dependencies": { 32 | "article-json-to-amp": "^1.7.1", 33 | "article-json-to-apple-news": "^3.2.0", 34 | "article-json-to-fbia": "^1.1.0", 35 | "html-to-article-json": "^1.13.0" 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Distro.Mic 2 | Transform article HTML for [Facebook Instant Articles](https://developers.facebook.com/docs/instant-articles), [Apple News](https://developer.apple.com/library/ios/documentation/General/Conceptual/Apple_News_Format_Ref/AppleNewsFormat.html) and [Google AMP](https://www.ampproject.org/docs/get_started/about-amp.html). 3 | 4 | Note, this module is designed to transform article body only, other elements of the article page like header, byline and custom stylesheets should be added separately for each format. 5 | 6 | ## USAGE 7 | 8 | Install using npm: 9 | 10 | ```bash 11 | npm install distro-mic 12 | ``` 13 | 14 | ```js 15 | var format = require('distro-mic').format; 16 | var html = '
Article HTML
' 17 | 18 | var output = format(html); 19 | ``` 20 | 21 | Output: 22 | 23 | ```js 24 | { 25 | amp: 'Article HTML
Article HTML
Astronomers just announced the universe might be expanding up to 9% faster than we thought.
4 |It's a surprising insight that could put us one step closer to finally figuring out what the hell dark energy and dark matter are. Or it could mean that we've gotten something fundamentally wrong in our understanding of physics, perhaps even poking a hole in Einstein's theory of gravity.
5 |
7 | Source: https://mic.com
10 |Astronomers just announced the universe might be expanding up to 9% faster than we thought.
4 |It's a surprising insight that could put us one step closer to finally figuring out what the hell dark energy and dark matter are. Or it could mean that we've gotten something fundamentally wrong in our understanding of physics, perhaps even poking a hole in Einstein's theory of gravity.
5 |Source: https://mic.com
14 |Astronomers just announced the universe might be 6 | expanding up to 9% faster 7 | than we thought.
8 | 9 | 10 |It's a surprising insight that could put us one step closer to finally figuring out what the 11 | hell dark energy and dark matter are. 12 | Or it could mean that we've gotten something fundamentally wrong in our understanding of physics, 13 | perhaps even poking a hole in Einstein's theory of gravity.
14 | 15 | 16 |
27 | Source: https://mic.com
33 | -------------------------------------------------------------------------------- /test/article.apple-news.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "text": "Universe Might Be Expanding Faster Than We Thought, Scientists Say", 4 | "additions": [], 5 | "inlineTextStyles": [], 6 | "role": "heading1", 7 | "layout": "bodyLayout" 8 | }, 9 | { 10 | "text": "Astronomers just announced the universe might be expanding up to 9% faster than we thought.\n", 11 | "additions": [ 12 | { 13 | "type": "link", 14 | "rangeStart": 59, 15 | "rangeLength": 8, 16 | "URL": "http://hubblesite.org/newscenter/archive/releases/2016/17/text/" 17 | } 18 | ], 19 | "inlineTextStyles": [ 20 | { 21 | "rangeStart": 59, 22 | "rangeLength": 8, 23 | "textStyle": "bodyLinkTextStyle" 24 | } 25 | ], 26 | "role": "body", 27 | "layout": "bodyLayout" 28 | }, 29 | { 30 | "text": "It's a surprising insight that could put us one step closer to finally figuring out what the hell dark energy and dark matter are. Or it could mean that we've gotten something fundamentally wrong in our understanding of physics, perhaps even poking a hole in Einstein's theory of gravity.\n", 31 | "additions": [ 32 | { 33 | "type": "link", 34 | "rangeStart": 98, 35 | "rangeLength": 27, 36 | "URL": "http://science.nasa.gov/astrophysics/focus-areas/what-is-dark-energy/" 37 | } 38 | ], 39 | "inlineTextStyles": [ 40 | { 41 | "rangeStart": 98, 42 | "rangeLength": 27, 43 | "textStyle": "bodyLinkTextStyle" 44 | } 45 | ], 46 | "role": "body", 47 | "layout": "bodyLayout" 48 | }, 49 | { 50 | "role": "container", 51 | "components": [ 52 | { 53 | "role": "photo", 54 | "URL": "bundle://image-0.jpg", 55 | "style": "embedMediaStyle", 56 | "layout": "embedMediaLayout", 57 | "caption": { 58 | "text": "Universe Might Be Expanding Faster Than We Thought, Scientists Say\n", 59 | "additions": [], 60 | "inlineTextStyles": [], 61 | "textStyle": "embedCaptionTextStyle" 62 | } 63 | } 64 | ], 65 | "layout": "embedLayout", 66 | "style": "embedStyle" 67 | }, 68 | { 69 | "role": "container", 70 | "components": [ 71 | { 72 | "role": "photo", 73 | "URL": "bundle://image-1.jpg", 74 | "style": "embedMediaStyle", 75 | "layout": "embedMediaLayout", 76 | "caption": { 77 | "text": "Astronomers used the brightness of Cepheid stars and the distance of Type 1a supernovas to measure how fast the universe is expanding.\n", 78 | "additions": [], 79 | "inlineTextStyles": [], 80 | "textStyle": "embedCaptionTextStyle" 81 | } 82 | } 83 | ], 84 | "layout": "embedLayout", 85 | "style": "embedStyle" 86 | }, 87 | { 88 | "text": "Source: https://mic.com\n", 89 | "additions": [], 90 | "inlineTextStyles": [ 91 | { 92 | "rangeStart": 0, 93 | "rangeLength": 23, 94 | "textStyle": "bodyItalicStyle" 95 | } 96 | ], 97 | "role": "body", 98 | "layout": "bodyLayout" 99 | } 100 | ] 101 | --------------------------------------------------------------------------------