@live-change/content-frontend 0.2.12 → 0.2.16

package/front/src/components/Metadata.vue

@@ -58,75 +58,77 @@
   const canonicalUrl = `https://${canonicalUrlDomain}/${canonical.value?.path ?? ''}`
 
   let ogImage = []
-  if(m.ogImage) {
-    const image = m.ogImage
-    ogImage = [
-      { property: 'og:image', content: `https://${canonicalUrlDomain}/api/image/image/${image.id}` },
-      { property: 'og:image:width', content: image.width },
-      { property: 'og:image:height', content: image.height },
-      { property: 'og:image:type', content: 'image/'+image.extension }
-    ]
-  }
+  if(m) {
+    if (m.ogImage) {
+      const image = m.ogImage
+      ogImage = [
+        {property: 'og:image', content: `https://${canonicalUrlDomain}/api/image/image/${image.id}`},
+        {property: 'og:image:width', content: image.width},
+        {property: 'og:image:height', content: image.height},
+        {property: 'og:image:type', content: 'image/' + image.extension}
+      ]
+    }
 
-  useMeta({
-    title: m.title,
-    description: m.description,
-    link: [
-      { rel: 'canonical', href: canonicalUrl }
-    ],
-    meta: [
-      metaProperty('og:title', m.og.title),
-      metaProperty('og:description', m.og.description),
-      ...ogImage,
-      metaProperty('og:determiner', m.og.determiner),
-      metaProperty('og:locale', m.og.locale),
-      ...metaProperties('og:locale:alternate', m.og.localeAlternate),
-      metaProperty('og:type', m.og.type),
-
-      metaProperty('og:music:duration', m.og.music.duration),
-      ...metaPropertiesObjects('og:music:album', m.og.music.album),
-      ...metaPropertiesObjects('og:music:song', m.og.music.song),
-      ...metaProperties('og:music:musician', m.og.music.duration),
-      metaProperty('og:music:release_date', m.og.music.releaseDate),
-      ...metaProperties('og:music:creator', m.og.music.creator),
-
-      metaProperty('og:video:duration', m.og.video.duration),
-      metaProperty('og:viceo:release_date', m.og.video.releaseDate),
-      ...metaPropertiesObjects('og:video:duration', m.og.video.actors),
-      ...metaProperties('og:video:director', m.og.video.director),
-      ...metaProperties('og:video:writer', m.og.video.writer),
-      ...metaProperties('og:video:series', m.og.video.series),
-      ...metaProperties('og:video:tag', m.og.video.tag),
-
-      ...metaProperties('og:profile:first_name', m.og.profile.firstName),
-      ...metaProperties('og:profile:last_name', m.og.profile.lastName),
-      ...metaProperties('og:profile:username', m.og.profile.username),
-      ...metaProperties('og:profile:gender', m.og.profile.gender),
-
-      metaProperty('og:article:published_time', m.og.article.publishedTime),
-      metaProperty('og:article:modified_time', m.og.article.modifiedTime),
-      metaProperty('og:article:expiration_time', m.og.article.expirationTime),
-      ...metaProperties('og:article:author', m.og.article.author),
-      metaProperty('og:article:section', m.og.article.section),
-      ...metaProperties('og:article:tag', m.og.article.tag),
-
-      ...metaProperties('og:book:author', m.og.book.author),
-      metaProperty('og:book:isbn', m.og.book.isbn),
-      metaProperty('og:book:release_date', m.og.book.releaseDate),
-      ...metaProperties('og:book:tag', m.og.book.tag),
-
-      { property: 'og:url', content: canonicalUrl },
-
-
-      /*      { property: 'og:url', content: m.url },
-            { property: 'og:type', content: 'website' },
-            { property: 'twitter:card', content: 'summary_large_image' },
-            { property: 'twitter:title', content: metadata.value.title },
-            { property: 'twitter:description', content: metadata.value.description },
-            { property: 'twitter:image', content: metadata.value.image },
-            { property: 'twitter:url', content: metadata.value.url }*/
-    ].filter(x => !!x)
-  })
+    useMeta({
+      title: m.title,
+      description: m.description,
+      link: [
+        {rel: 'canonical', href: canonicalUrl}
+      ],
+      meta: [
+        metaProperty('og:title', m.og.title),
+        metaProperty('og:description', m.og.description),
+        ...ogImage,
+        metaProperty('og:determiner', m.og.determiner),
+        metaProperty('og:locale', m.og.locale),
+        ...metaProperties('og:locale:alternate', m.og.localeAlternate),
+        metaProperty('og:type', m.og.type),
+
+        metaProperty('og:music:duration', m.og.music.duration),
+        ...metaPropertiesObjects('og:music:album', m.og.music.album),
+        ...metaPropertiesObjects('og:music:song', m.og.music.song),
+        ...metaProperties('og:music:musician', m.og.music.duration),
+        metaProperty('og:music:release_date', m.og.music.releaseDate),
+        ...metaProperties('og:music:creator', m.og.music.creator),
+
+        metaProperty('og:video:duration', m.og.video.duration),
+        metaProperty('og:viceo:release_date', m.og.video.releaseDate),
+        ...metaPropertiesObjects('og:video:duration', m.og.video.actors),
+        ...metaProperties('og:video:director', m.og.video.director),
+        ...metaProperties('og:video:writer', m.og.video.writer),
+        ...metaProperties('og:video:series', m.og.video.series),
+        ...metaProperties('og:video:tag', m.og.video.tag),
+
+        ...metaProperties('og:profile:first_name', m.og.profile.firstName),
+        ...metaProperties('og:profile:last_name', m.og.profile.lastName),
+        ...metaProperties('og:profile:username', m.og.profile.username),
+        ...metaProperties('og:profile:gender', m.og.profile.gender),
+
+        metaProperty('og:article:published_time', m.og.article.publishedTime),
+        metaProperty('og:article:modified_time', m.og.article.modifiedTime),
+        metaProperty('og:article:expiration_time', m.og.article.expirationTime),
+        ...metaProperties('og:article:author', m.og.article.author),
+        metaProperty('og:article:section', m.og.article.section),
+        ...metaProperties('og:article:tag', m.og.article.tag),
+
+        ...metaProperties('og:book:author', m.og.book.author),
+        metaProperty('og:book:isbn', m.og.book.isbn),
+        metaProperty('og:book:release_date', m.og.book.releaseDate),
+        ...metaProperties('og:book:tag', m.og.book.tag),
+
+        {property: 'og:url', content: canonicalUrl},
+
+
+        /*      { property: 'og:url', content: m.url },
+              { property: 'og:type', content: 'website' },
+              { property: 'twitter:card', content: 'summary_large_image' },
+              { property: 'twitter:title', content: metadata.value.title },
+              { property: 'twitter:description', content: metadata.value.description },
+              { property: 'twitter:image', content: metadata.value.image },
+              { property: 'twitter:url', content: metadata.value.url }*/
+      ].filter(x => !!x)
+    })
+  }
 </script>
 
 <style scoped>

package/front/src/components/NotAuthorizedAdminButtons.vue

@@ -0,0 +1,32 @@
+<template>
+  <div class="absolute top-0 right-0 pr-4 max-h-0 flex align-items-center z-5">
+    <router-link :to="{ name: 'content:pageEditor', params: { pageId: target } }" class="no-underline">
+      <Button icon="pi pi-pencil"
+              class="p-button p-button-icon-only p-button-rounded p-button-warning mr-2" />
+    </router-link>
+  </div>
+</template>
+
+<script setup>
+  import Button from 'primevue/button'
+
+  const props = defineProps({
+    path: {
+      type: String,
+      required: true
+    },
+    target: {
+      type: String,
+      required: true
+    }
+  })
+
+  import { toRefs } from "@vueuse/core"
+
+  const { target } = toRefs(props)
+
+</script>
+
+<style scoped>
+
+</style>

package/front/src/components/Page.vue

@@ -5,12 +5,17 @@
       <LimitedAccess :requiredRoles="['writer']" objectType="content_Page" :object="target" hidden>
         <PageAdminButtons :page="target" :style="style" :class="clazz" :name="urlPath.value" />
       </LimitedAccess>
-      <Content objectType="content_Page" :object="target" />
+      <Content objectType="content_Page" :object="target" class="w-full" />
     </template>
     <template #notFound="{ path, style, class: clazz }">
       <NotFoundAdminButtons v-if="canCreatePage" :path="urlPath" :style="style" :class="clazz" />
       <NotFound :style="style" :class="clazz" />
     </template>
+    <template #notAuthorized="{ path, style, class: clazz, target, access }">
+      <NotAuthorizedAdminButtons v-if="(access?.roles ?? []).includes('writer')"
+                                 :path="urlPath" :style="style" :class="clazz" :target="target" />
+      <NotAuthorized :style="style" :class="clazz" />
+    </template>
   </ResolveUrl>
 </template>
 
@@ -18,8 +23,9 @@
   import Button from "primevue/button"
   import PageAdminButtons from "./PageAdminButtons.vue"
   import NotFoundAdminButtons from "./NotFoundAdminButtons.vue"
+  import NotAuthorizedAdminButtons from "./NotAuthorizedAdminButtons.vue"
 
-  import { ResolveUrl, NotFound } from "@live-change/url-frontend"
+  import { ResolveUrl, NotFound, NotAuthorized } from "@live-change/url-frontend"
   import { LimitedAccess } from "@live-change/access-control-frontend";
   import Content from "./Content.vue"
   import Metadata from "./Metadata.vue"

package/front/src/components/PageEditor.vue

@@ -23,10 +23,13 @@
   </Accordion>
 
   <DocumentEditor v-if="pageData" targetType="content_Page" :target="pageId" purpose="page"
-                  :config="contentConfig" type="content" v-model:saveState="saveState" v-model:version="version">
+                  :config="contentConfig" type="page" v-model:saveState="saveState" v-model:version="version">
     <template #menuEnd="{}">
 
-      <Button icon="pi pi-eye" label="Preview" class="p-button-secondary p-button-sm mr-1 mb-1" />
+      <router-link :to="{name: 'content:pagePreview', params: { page: pageId }}" target="_blank"
+                   class="no-underline">
+        <Button icon="pi pi-eye" label="Preview" class="p-button-secondary p-button-sm mr-1 mb-1" />
+      </router-link>
 
       <div class="p-buttonset mr-1 mb-1 border-round">
         <button type="button"
@@ -110,7 +113,7 @@
     live(liveCanonicalUrlPath),
     live(livePublicAccessPath),
     live(liveMetadataPath)
-  ])
+  ]).catch(e => [null, null, null, null])
 
   const publicAccessLevel = computed(() => {
     if(publicAccessData?.sessionRoles?.includes('reader')) return 'session'
@@ -129,7 +132,7 @@
       acceptClass: 'p-button-danger',
       accept: async () => {
         api.actions.content.publish({
-          objectType: 'content_Page', object: pageId.value, version: snapshotVersion, type: 'content'
+          objectType: 'content_Page', object: pageId.value, version: snapshotVersion, type: 'page'
         }).then(() => {
           toast.add({ severity: 'success', summary: 'Published', detail: 'Page published', life: 3000 })
         }).catch(e => {

package/front/src/components/contentConfig.js

@@ -1,6 +1,6 @@
 import { config } from "@live-change/wysiwyg-frontend"
 
-const { basicMarks, richEditorNodes } = config
+const { basicMarks, pageNodes } = config
 
 const contentConfig = {
   marks: {
@@ -8,7 +8,8 @@ const contentConfig = {
   },
   nodes: {
     //...messageNodes,
-    ...richEditorNodes
+    //...richEditorNodes
+    ...pageNodes
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-change/content-frontend",
-  "version": "0.2.12",
+  "version": "0.2.16",
   "scripts": {
     "memDev": "lcli memDev --enableSessions --initScript ./init.js --dbAccess",
     "localDevInit": "rm tmp.db; lcli localDev --enableSessions --initScript ./init.js",
@@ -26,14 +26,10 @@
     "@live-change/dao-vue3": "0.5.8",
     "@live-change/dao-websocket": "0.5.8",
     "@live-change/framework": "0.7.5",
-    "@live-change/image-service": "0.3.4",
-    "@live-change/session-service": "0.3.4",
+    "@live-change/image-service": "0.3.5",
+    "@live-change/session-service": "0.3.5",
     "@live-change/vue3-components": "0.2.16",
     "@live-change/vue3-ssr": "0.2.16",
-    "@tiptap/extension-highlight": "^2.0.0-beta.33",
-    "@tiptap/extension-underline": "2.0.0-beta.23",
-    "@tiptap/starter-kit": "^2.0.0-beta.185",
-    "@tiptap/vue-3": "2.0.0-beta.91",
     "@vueuse/core": "^9.1.0",
     "codeceptjs-assert": "^0.0.5",
     "compression": "^1.7.4",
@@ -67,5 +63,5 @@
   "author": "",
   "license": "ISC",
   "description": "",
-  "gitHead": "a7bc77253f1c4d3e832cd34b9c09caf399be6d65"
+  "gitHead": "6faf9721eb991a0d08289aa9a7914479afb893fb"
 }

package/server/page.documentType.js

@@ -0,0 +1,103 @@
+module.exports = {
+  "marks": {
+    "bold": {},
+    "italic": {},
+    "underline": {},
+    "strike": {}
+  },
+  "nodes": {
+    "paragraph": {
+      "content": "inline*",
+      "group": "block"
+    },
+    "horizontalRule": {
+      "group": "block"
+    },
+    "heading": {
+      "content": "inline*",
+      "group": "block",
+      "defining": true,
+      "attrs": {
+        "level": {
+          "default": 1
+        }
+      }
+    },
+    "blockquote": {
+      "content": "block+",
+      "group": "block",
+      "defining": true
+    },
+    "codeBlock": {
+      "content": "text*",
+      "marks": "",
+      "group": "block",
+      "code": true,
+      "defining": true,
+      "attrs": {
+        "language": {
+          "default": null
+        }
+      }
+    },
+    "bulletList": {
+      "content": "listItem+",
+      "group": "block list"
+    },
+    "orderedList": {
+      "content": "listItem+",
+      "group": "block list",
+      "attrs": {
+        "start": {
+          "default": 1
+        }
+      }
+    },
+    "listItem": {
+      "content": "paragraph block*",
+      "defining": true
+    },
+    "image": {
+      "content": "",
+      "marks": "",
+      "group": "block",
+      "inline": false,
+      "atom": true,
+      "selectable": true,
+      "draggable": true,
+      "attrs": {
+        "image": {
+          "default": null
+        }
+      }
+    },
+    "doc": {
+      "content": "block+"
+    },
+    "text": {
+      "group": "inline"
+    },
+    "hardBreak": {
+      "group": "inline",
+      "inline": true,
+      "selectable": false
+    },
+    "component": {
+      "content": "block*",
+      "marks": "",
+      "group": "block",
+      "inline": false,
+      "selectable": true,
+      "draggable": true,
+      "attrs": {
+        "is": {
+          "default": "card"
+        },
+        "attrs": {
+          "default": {}
+        }
+      }
+    }
+  },
+  "topNode": "doc"
+}

package/server/services.config.js

@@ -43,7 +43,8 @@ module.exports = {
       name: 'prosemirror',
       path: '@live-change/prosemirror-service',
       documentTypes: {
-        content: require('./content.documentType.js'),
+        page: require('./page.documentType.js'),
+        rich: require('./rich.documentType.js'),
       },
       testLatency: 2000
     },