Merge branch 'master' into feature/1-metadata

.circleci/config.yml

@@ -0,0 +1,38 @@
+# Javascript Node CircleCI 2.0 configuration file
+#
+# Check https://circleci.com/docs/2.0/language-javascript/ for more details
+#
+version: 2
+jobs:
+  build:
+    docker:
+      # specify the version you desire here
+      - image: circleci/node:8.12.0
+
+      # Specify service dependencies here if necessary
+      # CircleCI maintains a library of pre-built images
+      # documented at https://circleci.com/docs/2.0/circleci-images/
+      # - image: circleci/mongo:3.4.4
+
+    working_directory: ~/repo
+
+    steps:
+      - checkout
+
+      # Download and cache dependencies
+      - restore_cache:
+          keys:
+          - v1-dependencies-{{ checksum "package.json" }}
+          # fallback to using the latest cache if no exact match is found
+          - v1-dependencies-
+
+      - run: yarn install
+
+      - save_cache:
+          paths:
+            - node_modules
+          key: v1-dependencies-{{ checksum "package.json" }}
+
+      # run tests!
+      - run: echo "$FIREBASE_ENV64" | base64 --decode > .env && yarn build && ./node_modules/.bin/firebase deploy --project "$FIREBASE_PRJ" --token "$FIREBASE_TOKEN"
+

.gitignore

@@ -23,4 +23,6 @@ yarn-error.log*
 *.sln
 *.sw*
 
+.firebase
+
 .env

package.json

@@ -37,6 +37,7 @@
     "@vue/eslint-config-typescript": "^3.0.0-rc.4",
     "@vue/test-utils": "^1.0.0-beta.20",
     "babel-core": "7.0.0-bridge.0",
+    "firebase-tools": "^6.0.1",
     "lint-staged": "^7.2.0",
     "node-sass": "^4.9.0",
     "sass-loader": "^7.0.1",

src/components/Modules/Book/Card.vue

@@ -2,7 +2,7 @@
   <transition name="book">
     <router-link class="BookCard" :to="{name: 'project', params: {id: book.props.identifier}}">
       <div class="BookCard__Thumbnail">
-        <img :src="book.props.thumbanilUrl || 'https://images-na.ssl-images-amazon.com/images/I/5191wb7GxtL._SX350_BO1,204,203,200_.jpg'" alt="">
+        <img :src="book.props.thumbanilUrl || 'https://via.placeholder.com/350.png?text=No Image'" alt="">
       </div>
       <div class="BookCard__Info">
         <div class="BookCard__Title">{{ book.props.name }}</div>

src/components/Modules/Editor.vue

@@ -1,12 +1,19 @@
 <template>
-  <div class="Editor">
-    <MarkdownEditor :value="pageContent.props.content" @input="updateContent" :configs="configs" />
+  <div class="Editor" @drop.prevent="onDrop" >
+    <MarkdownEditor
+      ref="markdownEditor"
+      :value="pageContent.props.content"
+      @input="updateContent"
+      :configs="configs"
+    />
     <Button class="Editor__Save" text="保存" :loading="isSaving" :size="ButtonSize.Small" @click="handleSave"/>
   </div>
 </template>
 
 <script lang="ts">
 import Vue from "vue";
+import store from "@/store";
+import firebase from "firebase";
 import MarkdownEditor from "vue-simplemde/src/markdown-editor.vue";
 import Button, { Size as ButtonSize } from "@/components/Base/Button.vue";
 import PageContentEntity from "@/entities/PageContent";
@@ -52,12 +59,60 @@ export default Vue.extend({
       }
     }
   },
+  computed: {
+    simplemde() {
+      return this.$refs.markdownEditor.simplemde;
+    },
+    fileAllowedTypes() {
+      return {
+        "image/jpeg": "jpg",
+        "image/png": "png",
+        "image/jpg": "jpg",
+        "image/gif": "gif",
+        "image/svg+xml": "svg"
+      };
+    }
+  },
   methods: {
     handleSave() {
       this.$emit("save", this.pageContent);
     },
     updateContent(content: string) {
       (this.pageContent as PageContentEntity).updateContent(content);
+    },
+    uploadFileName(file, filename) {
+      return `books/${store.state.book.item.identifier}/assets/${filename}.${
+        this.fileAllowedTypes[file.type]
+      }`;
+    },
+    onDrop(event) {
+      let files = event.target.files
+        ? event.target.files
+        : event.dataTransfer.files;
+      if (files.length > 0) {
+        let file = files[0];
+        if (file.type in this.fileAllowedTypes) {
+          var cm = this.simplemde.codemirror;
+          var line = cm.getCursor().line;
+          var ch = cm.getCursor().ch;
+          var fileName = this.uploadFileName(file, new Date().getTime());
+          var storageRef = firebase.storage().ref(fileName);
+          storageRef.put(file).then(function(snapshot) {
+            storageRef.getDownloadURL().then(function(url) {
+              var text = "\n![" + file.name + "](" + url + ")\n";
+              cm.replaceRange(
+                text,
+                { line: line, ch: ch },
+                { line: line, ch: ch }
+              );
+            });
+          });
+        } else {
+          console.log(`unknown file type: ${file.type}`);
+        }
+      } else {
+        console.log("files.length <= 0");
+      }
     }
   }
 });

src/containers/Book/Detail/index.vue

@@ -113,6 +113,7 @@ export default Vue.extend({
 
 .BookDetail__Left {
   flex: 2;
+  min-width: 200px;
   height: 100vh;
   background-color: #2e3235;
 }