1 files changed, 275 insertions, 17 deletions

diff --git a/public/bundle.js b/public/bundle.js
index f0b9e28..e2ceee0 100644
--- a/public/bundle.js
+++ b/public/bundle.js
@@ -2497,14 +2497,20 @@ var _db = __webpack_require__(21);
 
 var _db2 = _interopRequireDefault(_db);
 
-var _lethargy = __webpack_require__(53);
-
 var _reactRouterDom = __webpack_require__(22);
 
-var _Scroller = __webpack_require__(55);
+var _Scroller = __webpack_require__(57);
 
 var _Scroller2 = _interopRequireDefault(_Scroller);
 
+var _Details = __webpack_require__(59);
+
+var _Details2 = _interopRequireDefault(_Details);
+
+var _Modal = __webpack_require__(58);
+
+var _Modal2 = _interopRequireDefault(_Modal);
+
 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"); } }
@@ -2516,13 +2522,14 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
 var App = function (_Component) {
   _inherits(App, _Component);
 
-  function App() {
+  function App(props) {
     _classCallCheck(this, App);
 
     var _this = _possibleConstructorReturn(this, (App.__proto__ || Object.getPrototypeOf(App)).call(this));
 
     _this.state = {
-      data: _db2.default.backupDB
+      data: _db2.default.backupDB,
+      painting: null
     };
     _db2.default.fetch(function (data) {
       document.body.parentNode.classList.remove('loading');
@@ -2532,8 +2539,36 @@ var App = function (_Component) {
   }
 
   _createClass(App, [{
+    key: 'setIdFromLocation',
+    value: function setIdFromLocation(props) {
+      var id = props.location.pathname.split('/')[2];
+      if (id) {
+        this.setState({ painting: id });
+      }
+    }
+  }, {
+    key: 'componentWillMount',
+    value: function componentWillMount() {
+      this.setIdFromLocation(this.props);
+    }
+  }, {
+    key: 'componentWillReceiveProps',
+    value: function componentWillReceiveProps(props) {
+      this.setIdFromLocation(props);
+    }
+  }, {
     key: 'render',
     value: function render() {
+      var _this2 = this;
+
+      var painting = void 0;
+      this.state.data.painting.some(function (el) {
+        if (el.id == _this2.state.painting) {
+          painting = el;
+          return true;
+        }
+        return false;
+      });
       return (0, _preact.h)(
         'div',
         null,
@@ -2542,7 +2577,12 @@ var App = function (_Component) {
           { 'class': 'header' },
           'Procedural Paintings by Pepper'
         ),
-        (0, _preact.h)(_Scroller2.default, { data: this.state.data })
+        (0, _preact.h)(_Scroller2.default, { data: this.state.data }),
+        (0, _preact.h)(
+          _Modal2.default,
+          { visible: this.props.location.pathname !== '/' },
+          (0, _preact.h)(_Details2.default, { painting: painting })
+        )
       );
     }
   }]);
@@ -2550,11 +2590,7 @@ var App = function (_Component) {
   return App;
 }(_preact.Component);
 
-//         <Modal visible={this.props.location !== '/'}>
-//         </Modal>
-
-
-exports.default = App;
+exports.default = (0, _reactRouterDom.withRouter)(App);
 
 /***/ }),
 /* 21 */
@@ -5692,7 +5728,9 @@ exports.default = { isIphone: isIphone, isIpad: isIpad, isAndroid: isAndroid, is
 
 /***/ }),
 /* 54 */,
-/* 55 */
+/* 55 */,
+/* 56 */,
+/* 57 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -5728,16 +5766,16 @@ var Scroller = function (_Component) {
       index: 0
     };
     _this.lastScroll = Date.now();
-    _this.onScroll = _this.onScroll.bind(_this);
+    _this.onWheel = _this.onWheel.bind(_this);
     _this.lethargy = new _lethargy.Lethargy(8, 100, 1.1, 1000);
-    document.body.addEventListener('wheel', _this.onScroll);
-    document.body.addEventListener('DOMMouseScroll', _this.onScroll);
+    document.body.addEventListener('wheel', _this.onWheel);
+    document.body.addEventListener('DOMMouseScroll', _this.onWheel);
     return _this;
   }
 
   _createClass(Scroller, [{
-    key: 'onScroll',
-    value: function onScroll(e) {
+    key: 'onWheel',
+    value: function onWheel(e) {
       e.preventDefault();
       e.stopPropagation();
       var scrollDirection = this.lethargy.check(e);
@@ -5814,6 +5852,226 @@ var Scroller = function (_Component) {
 
 exports.default = Scroller;
 
+/***/ }),
+/* 58 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+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 _preact = __webpack_require__(7);
+
+var _reactRouterDom = __webpack_require__(22);
+
+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 Modal = function (_Component) {
+  _inherits(Modal, _Component);
+
+  function Modal() {
+    _classCallCheck(this, Modal);
+
+    return _possibleConstructorReturn(this, (Modal.__proto__ || Object.getPrototypeOf(Modal)).apply(this, arguments));
+  }
+
+  _createClass(Modal, [{
+    key: 'render',
+    value: function render() {
+      var className = this.props.visible ? 'modal visible' : 'modal';
+      return (0, _preact.h)(
+        'div',
+        { 'class': className },
+        this.props.children
+      );
+    }
+  }]);
+
+  return Modal;
+}(_preact.Component);
+
+exports.default = Modal;
+
+/***/ }),
+/* 59 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+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 _preact = __webpack_require__(7);
+
+var _reactRouterDom = __webpack_require__(22);
+
+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 Details = function (_Component) {
+  _inherits(Details, _Component);
+
+  function Details() {
+    _classCallCheck(this, Details);
+
+    return _possibleConstructorReturn(this, (Details.__proto__ || Object.getPrototypeOf(Details)).call(this));
+  }
+
+  _createClass(Details, [{
+    key: 'onWheel',
+    value: function onWheel(e) {
+      e.stopPropagation();
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var painting = this.props.painting;
+      if (!painting) return;
+      var source_images = findImages(painting.parameters);
+      var parameters = breakUpJSON(painting.parameters);
+      return (0, _preact.h)(
+        'div',
+        { 'class': 'details', onWheel: this.onWheel },
+        (0, _preact.h)(
+          _reactRouterDom.Link,
+          { to: '/' },
+          '< Go back'
+        ),
+        (0, _preact.h)(
+          'h1',
+          null,
+          painting.title
+        ),
+        (0, _preact.h)(
+          'div',
+          { 'class': 'stats' },
+          painting.medium,
+          (0, _preact.h)('br', null),
+          painting.date,
+          (0, _preact.h)('br', null),
+          painting.image.caption
+        ),
+        (0, _preact.h)('img', { src: painting.image.uri }),
+        painting.originalImage && (0, _preact.h)(
+          'div',
+          null,
+          (0, _preact.h)(
+            'h2',
+            null,
+            'Original Image'
+          ),
+          (0, _preact.h)('img', { src: painting.originalImage.uri })
+        ),
+        painting.parameters && (0, _preact.h)(
+          'div',
+          null,
+          (0, _preact.h)(
+            'h2',
+            null,
+            'Creation Parameters'
+          ),
+          (0, _preact.h)(
+            'div',
+            { 'class': 'parameters' },
+            parameters
+          ),
+          (0, _preact.h)(
+            'h2',
+            null,
+            'Source Images'
+          ),
+          source_images
+        )
+      );
+    }
+  }]);
+
+  return Details;
+}(_preact.Component);
+
+exports.default = Details;
+
+var PossiblyBadImage = function (_Component2) {
+  _inherits(PossiblyBadImage, _Component2);
+
+  function PossiblyBadImage() {
+    _classCallCheck(this, PossiblyBadImage);
+
+    var _this2 = _possibleConstructorReturn(this, (PossiblyBadImage.__proto__ || Object.getPrototypeOf(PossiblyBadImage)).call(this));
+
+    _this2.state = { error: false };
+    _this2.onError = _this2.onError.bind(_this2);
+    return _this2;
+  }
+
+  _createClass(PossiblyBadImage, [{
+    key: 'onError',
+    value: function onError() {
+      this.setState({ error: true });
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      if (this.state.error) return;
+      return (0, _preact.h)('img', { src: this.props.source, onError: this.onError });
+    }
+  }]);
+
+  return PossiblyBadImage;
+}(_preact.Component);
+
+function findImages(s) {
+  s = s || "";
+  var urlRegex = /(https?:\/\/[^\s]+)/g;
+  var match = urlRegex.exec(s);
+  var urls = [];
+  var url = void 0;
+  var seen = {};
+  while (match != null) {
+    url = match[0].replace(/",?/, "");
+    if (url && !seen[url]) {
+      seen[url] = true;
+      urls.push((0, _preact.h)(
+        'a',
+        { href: url, key: url },
+        (0, _preact.h)(PossiblyBadImage, {
+          source: url
+        })
+      ));
+    }
+    match = urlRegex.exec(s);
+  }
+  return urls;
+}
+
+function breakUpJSON(ss) {
+  return (ss || '').split("} {").map(function (s) {
+    return (0, _preact.h)(
+      'div',
+      null,
+      s,
+      (0, _preact.h)('br', null),
+      (0, _preact.h)('br', null)
+    );
+  });
+}
+
 /***/ })
 /******/ ]);
 //# sourceMappingURL=bundle.js.map
\ No newline at end of file