UNPKG

twreporter-react

Version:

React-Redux site for The Reporter Foundation in Taiwan

402 lines (340 loc) 26.5 kB
/* eslint no-unused-vars:0*/ 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.Article = undefined; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _reactRedux = require('react-redux'); var _index = require('../utils/index'); var _article = require('../actions/article'); var _articles = require('../actions/articles'); var _header = require('../actions/header'); var _index2 = require('../constants/index'); var _lodash = require('lodash'); var _lodash2 = _interopRequireDefault(_lodash); var _index3 = require('../components/article/index'); var ArticleComponents = _interopRequireWildcard(_index3); var _Footer = require('../components/Footer'); var _Footer2 = _interopRequireDefault(_Footer); var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _reactDom = require('react-dom'); var _reactDom2 = _interopRequireDefault(_reactDom); var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames); var _Common = { "inner-block": "Common__inner-block___2cOrF", "disable-inner-block": "Common__disable-inner-block___1MLd0", "text-color": "Common__text-color___1TD3U", "desc-text-color": "Common__desc-text-color___2fV3l", "desc-text-block": "Common__desc-text-block___1Z4b-", "text-link": "Common__text-link___1jaLy", "topic-box": "Common__topic-box___2Q-kN" }; var _Common2 = _interopRequireDefault(_Common); var _reactDocumentTitle = require('react-document-title'); var _reactDocumentTitle2 = _interopRequireDefault(_reactDocumentTitle); var _fb = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IHNrZXRjaHRvb2wgMzkuMSAoMzE3MjApIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPgogICAgPHRpdGxlPkM0NEUwM0UyLTc2N0MtNDMxNy04OEYxLUM3N0YzRDdDRkE3OTwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggc2tldGNodG9vbC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iVGFibGV0IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0iQXJ0aWNsZS3igJMtVGFibGV0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTA2LjAwMDAwMCwgLTI5MS4wMDAwMDApIiBmaWxsPSIjN0Y3RjdGIj4KICAgICAgICAgICAgPGcgaWQ9IlNoYXJlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMDYuMDAwMDAwLCAyOTEuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMS4zMjQ2MTU3NiwyNCBDMC41OTI4MzYzMjgsMjQgMCwyMy40MDY3OTU4IDAsMjIuNjc1MzAxNCBMMCwxLjMyNDYwNTQ4IEMwLDAuNTkyOTI0ODUyIDAuNTkyOTI5NDU0LDAgMS4zMjQ2MTU3NiwwIEwyMi42NzU0Nzc0LDAgQzIzLjQwNjk3NzQsMCAyNCwwLjU5MjkyNDg1MiAyNCwxLjMyNDYwNTQ4IEwyNCwyMi42NzUzMDE0IEMyNCwyMy40MDY4ODg5IDIzLjQwNjg4NDMsMjQgMjIuNjc1NDc3NCwyNCBMMTYuNTU5NjUyNiwyNCBMMTYuNTU5NjUyNiwxNC43MDU4NzczIEwxOS42NzkyNjA2LDE0LjcwNTg3NzMgTDIwLjE0NjM3NzYsMTEuMDgzNzkyOCBMMTYuNTU5NjUyNiwxMS4wODM3OTI4IEwxNi41NTk2NTI2LDguNzcxMzIwNyBDMTYuNTU5NjUyNiw3LjcyMjY0MzY1IDE2Ljg1MDg1NTgsNy4wMDgwMDQ4NCAxOC4zNTQ2NDQ4LDcuMDA4MDA0ODQgTDIwLjI3MjY1NTcsNy4wMDcxNjY3MiBMMjAuMjcyNjU1NywzLjc2NzU0NTI3IEMxOS45NDA5NDMsMy43MjM0MDQxNyAxOC44MDIzOTE4LDMuNjI0Nzg1MTMgMTcuNDc3Nzc2LDMuNjI0Nzg1MTMgQzE0LjcxMjQxNzEsMy42MjQ3ODUxMyAxMi44MTkxNzc2LDUuMzEyNzYzMTMgMTIuODE5MTc3Niw4LjQxMjYwNDQzIEwxMi44MTkxNzc2LDExLjA4Mzc5MjggTDkuNjkxNTYwOSwxMS4wODM3OTI4IEw5LjY5MTU2MDksMTQuNzA1ODc3MyBMMTIuODE5MTc3NiwxNC43MDU4NzczIEwxMi44MTkxNzc2LDI0IEwxLjMyNDYxNTc2LDI0IFoiIGlkPSJpY29uLXNoYXJlLWZhY2Vib29rIj48L3BhdGg+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg=="; var _fb2 = _interopRequireDefault(_fb); var _line = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCAzOS4xICgzMTcyMCkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+aWNvbi1zaGFyZS1saW5lPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IkRlc2t0b3AtSEQiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJBcnRpY2xlLeKAky1EZXNrdG9wLUhEIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNDU0LjAwMDAwMCwgLTI5MS4wMDAwMDApIiBmaWxsPSIjN0Y3RjdGIj4KICAgICAgICAgICAgPGcgaWQ9IlNoYXJlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNzAuMDAwMDAwLCAyOTEuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iaWNvbi1zaGFyZS1saW5lIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4NC4wMDAwMDAsIDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTE5LjYzLDAuMTE1IEw0LjQyMTY2NjY3LDAuMTE1IEMyLjAyOTM4OTM2LDAuMTEwMzcwNDQ2IDAuMDgzNzY1MzY5NiwyLjA0MTA5MTE1IDAuMDcsNC40MzMzMzMzMyBMMC4wNywxOS42NDE2NjY3IEMwLjA2MjYwNzAyNzIsMjIuMDM2MTY3MSAxLjk5Mzg2NjU1LDIzLjk4NTMxNTUgNC4zODgzMzMzMywyNCBMMTkuNTk2NjY2NywyNCBDMjEuOTk0Nzc1OCwyNC4wMDQ2MDc1IDIzLjk0MjgxNjQsMjIuMDY0NzczOSAyMy45NDgzMzMzLDE5LjY2NjY2NjcgTDIzLjk0ODMzMzMsNC40NjY2NjY2NyBDMjMuOTUyOTYyOSwyLjA3NDM4OTM2IDIyLjAyMjI0MjIsMC4xMjg3NjUzNyAxOS42MywwLjExNSBaIE0yMC42NjY2NjY3LDExIEMyMC42NjY2NjY3LDcuMTEgMTYuNzY2NjY2NywzLjk0NSAxMS45NzMzMzMzLDMuOTQ1IEM3LjE4LDMuOTQ1IDMuMjgsNy4xMTE2NjY2NyAzLjI4LDExIEMzLjI4LDE0LjQ4ODMzMzMgNi4zNzMzMzMzMywxNy40MDgzMzMzIDEwLjU1MTY2NjcsMTcuOTYgQzEwLjgzNSwxOC4wMjE2NjY3IDExLjIxODMzMzMsMTguMTQ2NjY2NyAxMS4zMTgzMzMzLDE4LjM4ODMzMzMgQzExLjM4NjE5OTksMTguNjQ1MTggMTEuMzk1ODc5NywxOC45MTM5MzY1IDExLjM0NjY2NjcsMTkuMTc1IEMxMS4zNDY2NjY3LDE5LjE3NSAxMS4yNDUsMTkuNzg4MzMzMyAxMS4yMjMzMzMzLDE5LjkyIEMxMS4xODUsMjAuMTQgMTEuMDU2NjY2NywyMC43OCAxMS45NzY2NjY3LDIwLjM4ODMzMzMgQzEyLjg5NjY2NjcsMTkuOTk2NjY2NyAxNi45NzY2NjY3LDE3LjQ0IDE4LjgxLDE1LjM0IEMyMC4wNywxMy45NTgzMzMzIDIwLjY3MzMzMzMsMTIuNTU2NjY2NyAyMC42NzMzMzMzLDExLjAwNjY2NjcgTDIwLjY2NjY2NjcsMTEgWiIgaWQ9IkNvbWJpbmVkLVNoYXBlIj48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTEwLjIwMzMzMzMsOS4xMjUgTDkuNTkzMzMzMzMsOS4xMjUgQzkuNTAxMjg1ODgsOS4xMjUgOS40MjY2NjY2Nyw5LjE5OTYxOTIxIDkuNDI2NjY2NjcsOS4yOTE2NjY2NyBMOS40MjY2NjY2NywxMy4wOCBDOS40MjY2NjY2NywxMy4xNzIwNDc1IDkuNTAxMjg1ODgsMTMuMjQ2NjY2NyA5LjU5MzMzMzMzLDEzLjI0NjY2NjcgTDEwLjIwMzMzMzMsMTMuMjQ2NjY2NyBDMTAuMjk1MzgwOCwxMy4yNDY2NjY3IDEwLjM3LDEzLjE3MjA0NzUgMTAuMzcsMTMuMDggTDEwLjM3LDkuMjkzMzMzMzMgQzEwLjM3LDkuMjAxMjg1ODggMTAuMjk1MzgwOCw5LjEyNjY2NjY3IDEwLjIwMzMzMzMsOS4xMjY2NjY2NyIgaWQ9IlNoYXBlIj48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTE0LjQwMTY2NjcsOS4xMjUgTDEzLjc5MTY2NjcsOS4xMjUgQzEzLjY5OTYxOTIsOS4xMjUgMTMuNjI1LDkuMTk5NjE5MjEgMTMuNjI1LDkuMjkxNjY2NjcgTDEzLjYyNSwxMS41NDE2NjY3IEwxMS44ODY2NjY3LDkuMiBMMTEuODczMzMzMyw5LjE4MzMzMzMzIEwxMS44NzMzMzMzLDkuMTgzMzMzMzMgTDExLjg2MzMzMzMsOS4xNzMzMzMzMyBMMTEuODYzMzMzMyw5LjE3MzMzMzMzIEwxMS44NTUsOS4xNzMzMzMzMyBMMTEuODU1LDkuMTczMzMzMzMgTDExLjg0NjY2NjcsOS4xNzMzMzMzMyBMMTEuODQ2NjY2Nyw5LjE3MzMzMzMzIEwxMS44MzgzMzMzLDkuMTczMzMzMzMgTDExLjgzODMzMzMsOS4xNzMzMzMzMyBMMTEuODI4MzMzMyw5LjE3MzMzMzMzIEwxMS44MjgzMzMzLDkuMTczMzMzMzMgTDExLjgxODMzMzMsOS4xNzMzMzMzMyBMMTEuMTYxNjY2Nyw5LjE3MzMzMzMzIEMxMS4wNjk2MTkyLDkuMTczMzMzMzMgMTAuOTk1LDkuMjQ3OTUyNTQgMTAuOTk1LDkuMzQgTDEwLjk5NSwxMy4xMjgzMzMzIEMxMC45OTUsMTMuMjIwMzgwOCAxMS4wNjk2MTkyLDEzLjI5NSAxMS4xNjE2NjY3LDEzLjI5NSBMMTEuNzcxNjY2NywxMy4yOTUgQzExLjg2MzcxNDEsMTMuMjk1IDExLjkzODMzMzMsMTMuMjIwMzgwOCAxMS45MzgzMzMzLDEzLjEyODMzMzMgTDExLjkzODMzMzMsMTAuODMzMzMzMyBMMTMuNjc2NjY2NywxMy4xOCBDMTMuNjg4NDY2MiwxMy4xOTY0MDA2IDEzLjcwMzE0OTQsMTMuMjEwNTE5MSAxMy43MiwxMy4yMjE2NjY3IEwxMy43MiwxMy4yMjE2NjY3IEwxMy43MywxMy4yMjE2NjY3IEwxMy43MywxMy4yMjE2NjY3IEwxMy43MywxMy4yMjE2NjY3IEwxMy43MywxMy4yMjE2NjY3IEwxMy43MywxMy4yMjE2NjY3IEwxMy43NDE2NjY3LDEzLjIyMTY2NjcgTDEzLjc0MTY2NjcsMTMuMjIxNjY2NyBDMTMuNzU2MDQ5NiwxMy4yMjM1NTI0IDEzLjc3MDYxNzEsMTMuMjIzNTUyNCAxMy43ODUsMTMuMjIxNjY2NyBMMTQuMzk1LDEzLjIyMTY2NjcgQzE0LjQ4NzA0NzUsMTMuMjIxNjY2NyAxNC41NjE2NjY3LDEzLjE0NzA0NzUgMTQuNTYxNjY2NywxMy4wNTUgTDE0LjU2MTY2NjcsOS4yOTMzMzMzMyBDMTQuNTYxNjY2Nyw5LjIwMTI4NTg4IDE0LjQ4NzA0NzUsOS4xMjY2NjY2NyAxNC4zOTUsOS4xMjY2NjY2NyIgaWQ9IlNoYXBlIj48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTguNzMzMzMzMzMsMTIuMzAxNjY2NyBMNy4wNzY2NjY2NywxMi4zMDE2NjY3IEw3LjA3NjY2NjY3LDkuMjkzMzMzMzMgQzcuMDc2NjY2NjcsOS4yMDEyODU4OCA3LjAwMjA0NzQ2LDkuMTI2NjY2NjcgNi45MSw5LjEyNjY2NjY3IEw2LjMsOS4xMjY2NjY2NyBDNi4yMDc5NTI1NCw5LjEyNjY2NjY3IDYuMTMzMzMzMzMsOS4yMDEyODU4OCA2LjEzMzMzMzMzLDkuMjkzMzMzMzMgTDYuMTMzMzMzMzMsMTMuMDgxNjY2NyBMNi4xMzMzMzMzMywxMy4wODE2NjY3IEM2LjEzMzA3MjA5LDEzLjEyNTE1NDYgNi4xNDk4MTkxNCwxMy4xNjcwMjIyIDYuMTgsMTMuMTk4MzMzMyBMNi4xOCwxMy4xOTgzMzMzIEw2LjE4LDEzLjE5ODMzMzMgQzYuMjExMzExMDksMTMuMjI4NTE0MiA2LjI1MzE3ODczLDEzLjI0NTI2MTIgNi4yOTY2NjY2NywxMy4yNDUgTDguNzMzMzMzMzMsMTMuMjQ1IEM4LjgyNTM4MDc5LDEzLjI0NSA4LjksMTMuMTcwMzgwOCA4LjksMTMuMDc4MzMzMyBMOC45LDEyLjQ2ODMzMzMgQzguOSwxMi4zNzYyODU5IDguODI1MzgwNzksMTIuMzAxNjY2NyA4LjczMzMzMzMzLDEyLjMwMTY2NjciIGlkPSJTaGFwZSI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0xNy43NjgzMzMzLDEwLjA3MzMzMzMgQzE3Ljg2MDM4MDgsMTAuMDczMzMzMyAxNy45MzUsOS45OTg3MTQxMiAxNy45MzUsOS45MDY2NjY2NyBMMTcuOTM1LDkuMjk2NjY2NjcgQzE3LjkzNSw5LjIwNDYxOTIxIDE3Ljg2MDM4MDgsOS4xMyAxNy43NjgzMzMzLDkuMTMgTDE1LjMzMzMzMzMsOS4xMyBDMTUuMjg5NjEsOS4xMzAxODQxIDE1LjI0NzcxMDEsOS4xNDc1NDI2NCAxNS4yMTY2NjY3LDkuMTc4MzMzMzMgTDE1LjIxNjY2NjcsOS4xNzgzMzMzMyBMMTUuMjE2NjY2Nyw5LjE3ODMzMzMzIEMxNS4xODY0ODU4LDkuMjA5NjQ0NDMgMTUuMTY5NzM4OCw5LjI1MTUxMjA2IDE1LjE3LDkuMjk1IEwxNS4xNyw5LjI5NSBMMTUuMTcsMTMuMDgzMzMzMyBMMTUuMTcsMTMuMDgzMzMzMyBDMTUuMTY5NzM4OCwxMy4xMjY4MjEzIDE1LjE4NjQ4NTgsMTMuMTY4Njg4OSAxNS4yMTY2NjY3LDEzLjIgTDE1LjIxNjY2NjcsMTMuMiBMMTUuMjE2NjY2NywxMy4yIEMxNS4yNDc5Nzc4LDEzLjIzMDE4MDkgMTUuMjg5ODQ1NCwxMy4yNDY5Mjc5IDE1LjMzMzMzMzMsMTMuMjQ2NjY2NyBMMTcuNzcsMTMuMjQ2NjY2NyBDMTcuODYyMDQ3NSwxMy4yNDY2NjY3IDE3LjkzNjY2NjcsMTMuMTcyMDQ3NSAxNy45MzY2NjY3LDEzLjA4IEwxNy45MzY2NjY3LDEyLjQ3IEMxNy45MzY2NjY3LDEyLjM3Nzk1MjUgMTcuODYyMDQ3NSwxMi4zMDMzMzMzIDE3Ljc3LDEyLjMwMzMzMzMgTDE2LjExMzMzMzMsMTIuMzAzMzMzMyBMMTYuMTEzMzMzMywxMS42NjY2NjY3IEwxNy43NywxMS42NjY2NjY3IEMxNy44NjIwNDc1LDExLjY2NjY2NjcgMTcuOTM2NjY2NywxMS41OTIwNDc1IDE3LjkzNjY2NjcsMTEuNSBMMTcuOTM2NjY2NywxMC44ODMzMzMzIEMxNy45MzY2NjY3LDEwLjc5MTI4NTkgMTcuODYyMDQ3NSwxMC43MTY2NjY3IDE3Ljc3LDEwLjcxNjY2NjcgTDE2LjExMzMzMzMsMTAuNzE2NjY2NyBMMTYuMTEzMzMzMywxMC4wNzY2NjY3IEwxNy43NjgzMzMzLDEwLjA3MzMzMzMgWiIgaWQ9IlNoYXBlIj48L3BhdGg+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg=="; var _line2 = _interopRequireDefault(_line); var _Article = { "article-container": "Article__article-container___1BnQY", "title-row": "Article__title-row___1sAcL", "article-meta": "Article__article-meta___2EX42", "leading-img": "Article__leading-img___c3aY8", "introduction": "Article__introduction___290ul" }; var _Article2 = _interopRequireDefault(_Article); var _twitter = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI4cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI4IDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IHNrZXRjaHRvb2wgMzkuMSAoMzE3MjApIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPgogICAgPHRpdGxlPkRGRkZEQTI3LTRENjItNDQxNy1CRDQwLUEzREZCRDMyRTYxNDwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggc2tldGNodG9vbC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iTW9iaWxlIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0iQXJ0aWNsZS3igJMtTW9iaWxlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNjQuMDAwMDAwLCAtMzMxLjAwMDAwMCkiIGZpbGw9IiM3RjdGN0YiPgogICAgICAgICAgICA8ZyBpZD0iU2hhcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI0LjAwMDAwMCwgMzMxLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPHBhdGggZD0iTTY4LDMgQzY2Ljk3MTE4MDQsMy4zMjMwNzY5MiA2NS44NjM0NzM2LDMuNjQ4OTcwNzUgNjUuMDUyNjMxNiwzLjc1IEM2NS44ODgxMjU4LDMuMDQ1NzIwNDggNjYuNzk4NjE0OCwxLjg1ODI4ODE5IDY3LjI2MzE1NzksMC43NSBDNjYuMTE2NTY5OCwxLjEzNzE2MTQzIDY0Ljg4ODg4ODksMS42NDE2MDM0NyA2My41Nzg5NDc0LDIuMjUgQzYyLjUzMjEzNTksMC43MzQ5OTQ1ODMgNjEuMDM4MjExLDAgNTkuMTU3ODk0NywwIEM1Ni4yMTQ1OTE4LDAgNTMuNjQyNTQyNywyLjcxMjg5Mjc0IDU0LDYgQzUzLjY0MjU0MjcsNi41MzM0Nzc3OSA1My42OTE4NDcyLDYuOTk0NTgyODggNTQsNy41IEM0OS4wMTYxNDEzLDcuMTg1MjY1NDQgNDQuNzg0MTc1Niw0Ljc3NTczMTMxIDQyLjIxMDUyNjMsMC43NSBDNDEuNDU0NDgxNCwyLjAwMzkwMDMzIDQxLjE3MTgwMjUsMy4wNDU3MjA0OCA0MS40NzM2ODQyLDQuNSBDNDEuMTcxODAyNSw2LjI1NjEyMTM0IDQyLjE4NTgzMDgsOC4xMTA5NDI1OCA0My42ODQyMTA1LDkgQzQyLjc4NzM0NTIsOS4xNjgzNjQwMyA0MS44OTk4NjUsOC44OTI3NDEwNiA0MS40NzM2ODQyLDguMjUgTDQxLjQ3MzY4NDIsOC4yNSBDNDEuMTI0MTQxNiwxMS40NTMwODc4IDQzLjEwNDUzNzIsMTMuOTAyNDkxOSA0NS44OTQ3MzY4LDE0LjI1IEM0NS4yNTI1Njc5LDE0LjU5OTM0OTkgNDQuNzQ0NzMyMSwxNC42NzA0MjI1IDQ0LjQyMTA1MjYsMTUgQzQzLjg1MDY3NzksMTQuNjcwNDIyNSA0My40ODkxMTE5LDE0LjYzNDAxOTUgNDIuOTQ3MzY4NCwxNC4yNSBDNDMuODcwMzk5NywxNi45NjkwMTQxIDQ1Ljk5MDQ5MTMsMTguNzIxNTYwMSA0OC44NDIxMDUzLDE4Ljc1IEM0Ni41Mzk0MTQyLDIwLjM5NDM2NjIgNDQuMDYxMDQzNiwyMS4zNjMzODAzIDQxLjQ3MzY4NDIsMjEgQzQwLjkwNzIwMiwyMS4zNjMzODAzIDQwLjQ0ODY3MDUsMjEuMzM1NjQ0NiA0MCwyMSBDNDIuNTQyNDY2NCwyMi45OTYzMTY0IDQ1LjU2MzE4NiwyNCA0OC44NDIxMDUzLDI0IEM1OS4zNzMzNjM5LDI0IDY1LjE1MDIwMjUsMTQuNzY5MjMwOCA2NS4wNTI2MzE2LDYuNzUgQzY1LjE1MDIwMjUsNi40OTg4MDgyMyA2NS4xNDUyNzIxLDYuMjM1MzE5NjEgNjUuMDUyNjMxNiw2IEM2Ni4yNTc5MDkzLDUuMTIyNDI2ODcgNjcuMjMyNDk0LDQuMDU2MzM4MDMgNjgsMyIgaWQ9Imljb24tc2hhcmUtdHdpdHRlciI+PC9wYXRoPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4="; var _twitter2 = _interopRequireDefault(_twitter); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } var articlePostition = { beginY: 120, endY: 200, percent: 0 }; var Article = function (_Component) { _inherits(Article, _Component); _createClass(Article, null, [{ key: 'fetchData', value: function fetchData(_ref) { var params = _ref.params; var store = _ref.store; return store.dispatch((0, _article.fetchArticleIfNeeded)(params.slug)); } }]); function Article(props) { _classCallCheck(this, Article); var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Article).call(this, props)); _this.state = { topicId: null, topicName: null }; _this._setArticleBounding = _this._setArticleBounding.bind(_this); _this._handleScroll = _this._handleScroll.bind(_this); return _this; } _createClass(Article, [{ key: 'componentDidMount', value: function componentDidMount() { this.props.setPageType(_index2.ARTICLE); this._setArticleBounding(); window.addEventListener('resize', this._setArticleBounding); // detect sroll position window.addEventListener('scroll', this._handleScroll); var _props = this.props; var fetchArticlesByIdsIfNeeded = _props.fetchArticlesByIdsIfNeeded; var fetchArticlesByTopicIdIfNeeded = _props.fetchArticlesByTopicIdIfNeeded; var setPageTitle = _props.setPageTitle; var selectedArticle = _props.selectedArticle; var entities = _props.entities; var topicId = this.state.topicId; if (!selectedArticle.error && !selectedArticle.isFetching) { // set topic var topicName = topicId ? _lodash2.default.get(entities, ['topics', topicId, 'name'], null) : null; this.setState({ topicName: topicName }); // set navbar title for this article setPageTitle(_lodash2.default.get(entities, ['articles', selectedArticle.id, 'title'], ''), topicName); // fetch related articles var relatedIds = _lodash2.default.get(entities, ['articles', selectedArticle.id, 'relateds'], []); fetchArticlesByIdsIfNeeded(relatedIds); } } }, { key: 'componentDidUpdate', value: function componentDidUpdate() { this._setArticleBounding(); } }, { key: 'componentWillMount', value: function componentWillMount() { var slug = this.props.params.slug; var _props2 = this.props; var fetchArticleIfNeeded = _props2.fetchArticleIfNeeded; var selectedArticle = _props2.selectedArticle; var entities = _props2.entities; if (selectedArticle.slug !== slug || selectedArticle.isFetching === false && selectedArticle.error !== null) { fetchArticleIfNeeded(slug); } // fetch other aritcles in the same topic var topicId = _lodash2.default.get(entities, ['articles', selectedArticle.id, 'topics']); if (topicId) { this.setState({ topicId: topicId }); (0, _articles.fetchArticlesByTopicIdIfNeeded)(topicId); } } }, { key: 'componentWillReceiveProps', value: function componentWillReceiveProps(nextProps) { var slug = nextProps.params.slug; var fetchArticleIfNeeded = nextProps.fetchArticleIfNeeded; var selectedArticle = nextProps.selectedArticle; if (selectedArticle.slug !== slug || selectedArticle.isFetching === false && selectedArticle.error !== null) { fetchArticleIfNeeded(slug); } } }, { key: 'componentWillUnmount', value: function componentWillUnmount() { window.removeEventListener('resize', this._setArticleBounding); window.removeEventListener('scroll', this._handleScroll); } }, { key: '_getCumulativeOffset', value: function _getCumulativeOffset(element) { var top = 0; do { top += element.offsetTop || 0; element = element.offsetParent; } while (element); return top; } }, { key: '_setArticleBounding', value: function _setArticleBounding() { var beginEl = _reactDom2.default.findDOMNode(this.refs.progressBegin); var endEl = _reactDom2.default.findDOMNode(this.refs.progressEnding); articlePostition.beginY = beginEl.offsetTop; articlePostition.endY = endEl.offsetTop; } }, { key: '_handleScroll', value: function _handleScroll() { var beginY = articlePostition.beginY; var endY = articlePostition.endY; var percent = articlePostition.percent; var scrollRatio = Math.abs((window.scrollY - beginY) / (endY - beginY)); if (window.scrollY < beginY) { scrollRatio = 0; } else if (scrollRatio > 1) { scrollRatio = 1; } var curPercent = Math.round(scrollRatio * 100); if (percent !== curPercent) { articlePostition.percent = curPercent; // update the header progress bar this.props.setReadProgress(curPercent); } } }, { key: '_composeAuthors', value: function _composeAuthors(article) { article = article || {}; var authors = []; var list = ['writters', 'photographers', 'designers', 'engineers']; list.forEach(function (item) { if (Array.isArray(article[item])) { article[item].forEach(function (author) { // remove 's'. writters -> writter var type = item.slice(0, -1); authors.push(_lodash2.default.merge({}, author, { type: type })); }); } }); return authors; } }, { key: 'render', value: function render() { var _props3 = this.props; var selectedArticle = _props3.selectedArticle; var entities = _props3.entities; var _state = this.state; var topicId = _state.topicId; var topicName = _state.topicName; var article = (0, _index.denormalizeArticles)(selectedArticle.id, entities)[0]; var authors = this._composeAuthors(article); var bodyData = _lodash2.default.get(article, ['content', 'extended', 'apiData'], []); var deduppedAuthors = _lodash2.default.uniq(authors, 'id'); var heroImage = _lodash2.default.get(article, ['heroImage'], null); var heroImageSize = _lodash2.default.get(article, ['heroImageSize'], 'normal'); var introData = _lodash2.default.get(article, ['content', 'brief', 'apiData'], []); var copyright = _lodash2.default.get(article, ['copyright'], []); var cUrl = (0, _index.getAbsPath)(this.context.location.pathname, this.context.location.search); var topicBox = topicName ? _react2.default.createElement( 'h3', { className: _Common2.default['topic-box'] }, topicName ) : null; return _react2.default.createElement( _reactDocumentTitle2.default, { title: article.title + _index2.SITE_NAME.SEPARATOR + _index2.SITE_NAME.SHORT }, _react2.default.createElement( 'div', null, _react2.default.createElement( 'div', { className: _Article2.default['article-container'] }, _react2.default.createElement( 'div', { className: (0, _classnames2.default)(_Article2.default['title-row'], _Common2.default['inner-block']) }, _react2.default.createElement( 'hgroup', null, topicBox, _react2.default.createElement( 'h1', null, article.title ) ) ), _react2.default.createElement( 'div', { ref: 'progressBegin', className: (0, _classnames2.default)(_Article2.default['article-meta'], _Common2.default['inner-block']) }, _react2.default.createElement( ArticleComponents.HeadingAuthor, { authors: authors, extendByline: _lodash2.default.get(article, 'extendByline') }, _react2.default.createElement(ArticleComponents.PublishDate, { date: article.publishedDate }) ), _react2.default.createElement(ArticleComponents.ShareBt, { appId: _index2.appId, url: cUrl, title: article.title, fbIcon: _fb2.default, twitterIcon: _twitter2.default, lineIcon: _line2.default }) ), _react2.default.createElement( 'div', { className: _Article2.default['leading-img'] }, _react2.default.createElement(ArticleComponents.LeadingImage, { size: heroImageSize, image: _lodash2.default.get(heroImage, ['image', 'resizedTargets']), id: _lodash2.default.get(heroImage, 'id'), description: _lodash2.default.get(heroImage, 'description') }) ), _react2.default.createElement( 'div', { className: (0, _classnames2.default)(_Article2.default.introduction, _Common2.default['inner-block']) }, _react2.default.createElement(ArticleComponents.Introduction, { data: introData }) ), _react2.default.createElement(ArticleComponents.Body, { data: bodyData }), _react2.default.createElement( 'div', { ref: 'progressEnding', className: 'inner-max center-block' }, _react2.default.createElement( 'div', { className: 'row' }, _react2.default.createElement( 'div', { className: 'col-md-12' }, _react2.default.createElement(ArticleComponents.BottomTags, { data: article.tags }) ) ), _react2.default.createElement(ArticleComponents.BottomAuthor, { authors: deduppedAuthors }) ), _react2.default.createElement(ArticleComponents.BottomRelateds, { relateds: article.relateds }) ), _react2.default.createElement(ArticleComponents.PageNavigation, { article: _lodash2.default.get(article, ['relateds', 0]), navigate: 'next' }), _react2.default.createElement(ArticleComponents.PageNavigation, { article: _lodash2.default.get(article, ['relateds', 1]), navigate: 'previous' }), _react2.default.createElement(_Footer2.default, { copyright: copyright }) ) ); } }]); return Article; }(_react.Component); exports.default = Article; function mapStateToProps(state) { return { selectedArticle: state.selectedArticle, entities: state.entities }; } Article.contextTypes = { device: _react2.default.PropTypes.string, location: _react2.default.PropTypes.object }; exports.Article = Article; exports.default = (0, _reactRedux.connect)(mapStateToProps, { fetchArticleIfNeeded: _article.fetchArticleIfNeeded, fetchArticlesByIdsIfNeeded: _articles.fetchArticlesByIdsIfNeeded, fetchArticlesByTopicIdIfNeeded: _articles.fetchArticlesByTopicIdIfNeeded, setReadProgress: _header.setReadProgress, setPageType: _header.setPageType, setPageTitle: _header.setPageTitle })(Article);