Support multiple image sets

src/components/big_picture.tsx

@@ -3,7 +3,6 @@ import * as Model from "../model";
 import * as React from "react";
 
 export interface Props {
-    src: string;
     image: Model.Image;
     onClose: () => void;
     width: number;
@@ -13,7 +12,7 @@ export class BigPicture extends React.PureComponent<Props, {}> {
     static displayName = "BigPicture";
 
     render() {
-        const src = `img/1600/${this.props.src}`;
+        const src = `img/1600/${this.props.image.src}`;
         return <div className="BigPicture">
             <div
                 className="BigPicture-image"
@@ -23,16 +22,23 @@ export class BigPicture extends React.PureComponent<Props, {}> {
             </div>
             <div className="BigPicture-footer">
                 <a className="BigPicture-footerLink"
-                    href={`img/${this.props.src}`}
+                    href={`img/${this.props.image.src}`}
                     target="_blank">
                     Download
                 </a>
                 <span className="BigPicture-footerLink"
                     onClick={this.props.onClose}
-                    tabIndex={1} >
+                    onKeyPress={this._keyPress}
+                    tabIndex={0} >
                     Close
                 </span>
             </div>
         </div>;
     }
+
+    private _keyPress = (e: React.KeyboardEvent) => {
+        if (e.key === "Enter") {
+            this.props.onClose();
+        }
+    }
 }