updated publishing of pages to allow for more options in selecting pr…

backend/README.md

@@ -57,4 +57,4 @@ firebase deploy --only functions:generateThumbnail
 ### create-page-collaboration
 > This function is triggered every time a record is added to the pageCollaborations collection.
 
-* firebase deploy --only functions:onCreatePageCollaboration
+* firebase deploy --only functions:onCreatePage

backend/functions/create-page.js

@@ -6,6 +6,7 @@ const common = require('./common')
 exports.handler = async (newPagesDoc, context, database) => {
   console.log(`In onCreatePages:[${newPagesDoc.id}]`)
 
+  // if this page is part of a collaboration then we also publish preview
   if (newPagesDoc.data().parentPagesRef) {
     console.log(`Page document is child record`)
 
@@ -44,7 +45,28 @@ exports.handler = async (newPagesDoc, context, database) => {
     }
 
     console.log('story data:', storiesDoc.data())
-    console.log('newPagesDoc1:', newPagesDoc.id)
+    console.log('newPagesDoc id:', newPagesDoc.id)
+
+    let background = '#000000'
+    if (newPagesDoc.data().quote && newPagesDoc.data().quote.background) {
+      background = newPagesDoc.data().quote.background
+    } else if (
+      newPagesDoc.data().background &&
+      newPagesDoc.data().background.color
+    ) {
+      background = newPagesDoc.data().background.color
+    }
+
+    let fontColor = '#ffffff'
+    if (newPagesDoc.data().quote && newPagesDoc.data().quote.color) {
+      fontColor = newPagesDoc.data().quote.color
+    } else if (
+      newPagesDoc.data().background &&
+      newPagesDoc.data().background.font &&
+      newPagesDoc.data().background.font.color
+    ) {
+      fontColor = newPagesDoc.data().background.font.color
+    }
 
     // save record in the previews collection
     const preview = {
@@ -60,6 +82,9 @@ exports.handler = async (newPagesDoc, context, database) => {
       uid: user.uid,
       usersRef: usersRef,
       userDisplayName: user.displayName || '',
+      quote: newPagesDoc.data().quote ? newPagesDoc.data().quote.src : '',
+      fontColor: fontColor,
+      backgroundColor: background,
       previewImageUrl: imagePreviewUrl,
       imageFilenameOid: imageOid,
       created: Date.now(),

backend/functions/delete-page.js

@@ -19,25 +19,47 @@ exports.handler = async (snap, context, database, storage, bucketName) => {
   const bookFilename = common.getBookFilename(deletedValue.book)
   console.log(`bookFilename:${bookFilename}`)
   if (bookFilename) {
-    await removeFile(bucket, 'books', bookFilename)
+    try {
+      await removeFile(bucket, 'books', bookFilename)
+    } catch (e) {
+      console.log(
+        `Error removing file:[books/${bookFilename}] for rich text`,
+        e
+      )
+    }
   }
 
   const richTextsFilename = common.getRichTextFilename(deletedValue.richText)
   console.log(`richTextsFilename:${richTextsFilename}`)
   if (richTextsFilename) {
-    await removeFile(bucket, 'richTexts', richTextsFilename)
+    try {
+      await removeFile(bucket, 'richTexts', richTextsFilename)
+    } catch (e) {
+      console.log(
+        `Error removing file:[richTexts/${richTextsFilename}] for rich text`,
+        e
+      )
+    }
   }
 
   const imageFilename = common.getImageFilename(deletedValue.image)
   console.log(`imageFilename:${imageFilename}`)
   if (imageFilename) {
-    await common.deleteImageFromDB(database, imageFilename)
+    try {
+      await common.deleteImageFromDB(database, imageFilename)
+    } catch (e) {
+      console.log(`Error deleting image:[${imageFilename}] from DB`, e)
+    }
   }
 
   if (common.pageIsCoverToStory(database, pageOid, imageFilename)) {
     console.log('Page image is cover story')
     if (deletedValue.storyOid) {
-      await common.updateStoryCoverImage(database, deletedValue.storyOid)
+      try {
+        await common.updateStoryCoverImage(database, deletedValue.storyOid)
+      } catch (e) {
+        console.log(`Error updating story cover image`, e)
+      }
     }
   }
 

ui/api/service/page.js

@@ -18,12 +18,14 @@ function findPages(pagesRef) {
         image: { ...m.data().image },
         book: { ...m.data().book },
         richText: { ...m.data().richText },
+        quote: { ...m.data().quote },
         parentPagesOid: m.data().parentPagesOid,
         // parentPagesRef: m.data().parentPagesRef,
         parentPagesRef: `pages/${m.data().parentPagesOid}`,
         summary: m.data().summary,
         comments: m.data().comments,
         likes: m.data().likes,
+        background: { ...m.data().background },
         wallpaperUrl: m.data().wallpaperUrl
       }
       log('page:', page)

ui/api/service/preview.js

@@ -12,6 +12,9 @@ function findPreviews(previewsRef) {
         imageFilenameOid: m.data().imageFilenameOid,
         pageOid: m.data().pageOid,
         pagesRef: m.data().pagesRef,
+        quote: m.data().quote,
+        fontColor: m.data().fontColor,
+        backgroundColor: m.data().backgroundColor,
         previewImageUrl: m.data().previewImageUrl,
         wallpaperUrl: m.data().wallpaperUrl,
         storyOid: m.data().storyOid,
@@ -68,3 +71,7 @@ export function addPreview(preview) {
   log(`Adding preview:[${preview}]`)
   return DB.collection('previews').add(preview)
 }
+
+
+export const BACKGROUND_COLOURS = ['#26c6da', '#3f51b5', '#ffffff', '#000000', '#C2185B', '#ff8f00']
+

ui/components/BaseMediumViewer.vue

@@ -44,7 +44,7 @@
                 >
                   <upload-button
                     :selected-callback="previewMediaFile"
-                    :acceptedFileTypes="acceptedFileTypes"
+                    :accepted-file-types="acceptedFileTypes"
                     icon="mdi-cloud-upload-outline"
                   />
                 </span>
@@ -61,6 +61,19 @@
               class="transparent"
               mandatory
             >
+              <v-tooltip bottom>
+                <template #activator="{ on }">
+                  <v-btn
+                    v-if="showQuoteToolbarBtn"
+                    :value="4"
+                    text
+                    v-on="on"
+                  >
+                    <v-icon>mdi-comment-quote-outline</v-icon>
+                  </v-btn>
+                </template>
+                <span>Quote</span>
+              </v-tooltip>
               <v-tooltip bottom>
                 <template #activator="{ on }">
                   <v-btn
@@ -82,7 +95,9 @@
                     text
                     v-on="on"
                   >
-                    <v-icon>mdi-book-outline</v-icon>
+                    <v-icon>
+                      mdi-book-open-page-variant
+                    </v-icon>
                   </v-btn>
                 </template>
                 <span>Words</span>
@@ -123,12 +138,12 @@
         fill-height
         class="dialog-content"
       >
-        <!--        <v-flex xs12 fill-height>-->
+        <v-flex xs12 fill-height>
         <slot
           name="content-container"
           :activeMedium="activeMedium"
         />
-        <!--        </v-flex>-->
+        </v-flex>
       </v-layout>
       <!--</v-responsive>-->
     </v-card>
@@ -161,6 +176,10 @@ export default {
       type: Boolean,
       default: false
     },
+    isQuoteEnabled: {
+      type: Boolean,
+      default: false
+    },
     isBookEnabled: {
       type: Boolean,
       default: false
@@ -215,6 +234,13 @@ export default {
       if (this.isImageEnabled) count++
       return count
     },
+    showQuoteToolbarBtn: function() {
+      return (
+        this.enabledMediumTypeCount > 1 &&
+        this.isQuoteEnabled &&
+        !this.canDelete
+      )
+    },
     showRichTextToolbarBtn: function() {
       return (
         this.enabledMediumTypeCount > 1 &&