first step work embed mp3

backend/package.json

@@ -54,6 +54,7 @@
     "apollo-server": "~2.14.2",
     "apollo-server-express": "^2.14.2",
     "aws-sdk": "^2.652.0",
+    "axios": "^0.23.0",
     "babel-core": "~7.0.0-0",
     "babel-eslint": "~10.1.0",
     "babel-jest": "~25.2.6",

backend/src/schema/resolvers/embeds.js

@@ -1,6 +1,10 @@
 import scrape from './embeds/scraper.js'
 import { undefinedToNullResolver } from './helpers/Resolver'
 
+
+console.log("----0- backend/src/schema/resolvers/embeds.js")
+
+
 export default {
   Query: {
     embed: async (object, { url }, context, resolveInfo) => {

backend/src/schema/resolvers/embeds/findProvider.js

@@ -13,6 +13,8 @@ oEmbedProvidersFile = oEmbedProvidersFile.replace(/\{format\}/g, 'json')
 const oEmbedProviders = JSON.parse(oEmbedProvidersFile)
 
 export default function (embedUrl) {
+  console.log("---------4  findProvider.js >  ",embedUrl)
+  
   for (const provider of oEmbedProviders) {
     for (const endpoint of provider.endpoints) {
       const { schemes = [], url } = endpoint
@@ -23,8 +25,12 @@ export default function (embedUrl) {
       const {
         endpoints: [{ url }],
       } = provider
+      console.log("--------- 4.1 Find Provider  RETURN URL >  ", url)
       return url
     }
   }
+  console.log("--------- 4.2 Find Provider  RETURN NULL>  ")
+
+  
   return null
 }

backend/src/schema/resolvers/embeds/scraper.js

@@ -29,7 +29,12 @@ const metascraper = Metascraper([
   // require('./rules/metascraper-embed')()
 ])
 
+import axios from 'axios'
+
+
+
 const fetchEmbed = async (url) => {
+  console.log("---------3 resolvers/embeds/scraper.js fetchEmbed")
   let endpointUrl = findProvider(url)
   if (!endpointUrl) return {}
   endpointUrl = new URL(endpointUrl)
@@ -37,6 +42,7 @@ const fetchEmbed = async (url) => {
   endpointUrl.searchParams.append('format', 'json')
   let json
   try {
+    console.log("--------- resolvers/embeds/scraper.js endpointUrl", endpointUrl)
     const response = await fetch(endpointUrl)
     json = await response.json()
   } catch (err) {
@@ -54,29 +60,83 @@ const fetchEmbed = async (url) => {
 }
 
 const fetchResource = async (url) => {
+  console.log("-----------2 backend/src/schema/resolvers/embeds/scraper.js fetchResource = async")
   const response = await fetch(url)
+  console.log(" ------------2.1  response")
+
   const html = await response.text()
+  //console.log("const html => ", html)
+ 
   const resource = await metascraper({ html, url })
   return {
     sources: ['resource'],
-    ...resource,
+    ...resource
   }
 }
 
 export default async function scrape(url) {
+  console.log("-----------1 backend/src/schema/resolvers/embeds/scraper.js scrape()", url)
+
   const [meta, embed] = await Promise.all([fetchResource(url), fetchEmbed(url)])
+
+  console.log("Object.keys(meta).length) => ", Object.keys(meta).length)
+  console.log("Object.keys(embed).length) => ", Object.keys(embed).length)
+   /*
+  if ( Object.keys(embed).length === 0 ) { 
+
+
+  const resAxios =  await axios.get(url)
+    .then(function (res) {
+      // handle success
+      console.log(" - ------------------------------ resAxios response")
+      console.log(res.headers['content-type']);
+      return res.headers['content-type']
+      
+      //console.log(response.headers);
+      
+    })
+    .catch(function (error) {
+      // handle error
+      console.log("resAxios error",error);
+    })
+
+    console.log(">>>>>>>>>>>>>>>> EMBED === '' ")
+    if (resAxios === 'audio/mpeg') { 
+      console.log(">>>>>>>>>>> IF MPEG ")
+    } else { 
+      console.log(">>>>>>>>>>> IF NOT A MPEG ")
+    }
+
+   }
+*/
+ 
+ 
+
+  
   const output = mergeWith(meta, embed, (objValue, srcValue) => {
+    console.log("------------ output objValue ", objValue);
+    console.log("------------ output  srcValue", srcValue);
     if (isArray(objValue)) {
       return objValue.concat(srcValue)
     }
   })
 
   if (isEmpty(output)) {
+    console.log("------------ NOT FOUND output");
     throw new ApolloError('Not found', 'NOT_FOUND')
   }
+  console.log("-----------5 backend/src/schema/resolvers/embeds/scraper.js retrun ")
 
-  return {
-    type: 'link',
-    ...output,
-  }
+  //if (res.headers['content-type'] === 'audio/mpeg'){
+  //  console.log("-----------1 SSSUUUCCEESSSSS")
+
+  //}else {
+    return {
+    
+      type: 'link',
+      ...output,
+    }
+  //}
+ 
+ 
 }

webapp/components/Editor/Editor.vue

@@ -130,6 +130,7 @@ export default {
         new History(),
       ],
       onUpdate: (e) => {
+        console.log('---- mounted onUpdate')
         clearTimeout(throttleInputEvent)
         throttleInputEvent = setTimeout(() => this.onUpdate(e), 300)
       },
@@ -241,6 +242,7 @@ export default {
       this.editor.focus()
     },
     onUpdate(e) {
+      console.log('---- Editor.vue onUpdate')
       const content = e.getHTML()
       this.$emit('input', content)
     },
@@ -248,6 +250,7 @@ export default {
       this.editor.commands.mention({ id: message.id, label: message.slug })
     },
     toggleLinkInput(attrs, element) {
+      console.log('----- Editor.vue toggleLinkInput')
       if (!this.isLinkInputActive && attrs && element) {
         this.$refs.linkInput.linkUrl = attrs.href
         this.isLinkInputActive = true
@@ -259,6 +262,7 @@ export default {
       }
     },
     setLinkUrl(url) {
+      console.log('------ Editor.vue setLinkUrl')
       const normalizedLinks = url ? linkify().match(url) : null
       const command = this.editor.commands.link
       if (normalizedLinks) {

webapp/components/Editor/nodes/Embed.js

@@ -4,6 +4,7 @@ import { compileToFunctions } from 'vue-template-compiler'
 import Vue from 'vue'
 import EmbedComponent from '~/components/Embed/EmbedComponent'
 
+console.log('---- webapp/components/Editor/nodes/Embed.js CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC')
 Vue.component(EmbedComponent)
 const template = `<component :dataEmbedUrl="dataEmbedUrl" :embedData="embedData" :is="componentType" />`
 

webapp/components/Editor/nodes/LegacyEmbed.js

@@ -8,7 +8,7 @@ Vue.component(EmbedComponent)
 const template = `<component :dataEmbedUrl="dataEmbedUrl" :embedData="embedData" :is="componentType" />`
 
 const compiledTemplate = compileToFunctions(template)
-
+console.log('----------0  webapp/components/Editor/nodes/LegacyEmbed.js')
 export default class Embed extends Node {
   get name() {
     return 'embed'
@@ -21,6 +21,7 @@ export default class Embed extends Node {
   }
 
   pasteRules({ type, schema }) {
+    console.log('---------- webapp/components/Editor/nodes/LegacyEmbed.js function  pasteRules')
     return [
       pasteRule(
         // source: https://stackoverflow.com/a/3809435

webapp/components/Editor/plugins/eventHandler.js

@@ -14,6 +14,9 @@ export default class EventHandler extends Extension {
             return text.trim()
           },
           transformPastedHTML(html) {
+            console.log(
+              '----- webapp/components/Editor/plugins/eventHandler.js transformPastedHTML',
+            )
             html = html
               // remove all tags with "space only"
               .replace(/<[a-z-]+>[\s]+<\/[a-z-]+>/gim, '')

webapp/components/Embed/EmbedComponent.vue

@@ -83,6 +83,7 @@ export default {
       currentUser: 'auth/user',
     }),
     embedHtml() {
+      console.log('--------- webapp/components/Embed/EmbedComponent.vue embedHtml')
       const { html = '' } = this.embedData
       return html
     },

webapp/pages/settings/embeds.vue

@@ -59,6 +59,7 @@ export default {
   },
   mounted() {
     axios.get('/api/providers.json').then((response) => {
+      console.log(' ------ AXIOS MOUNTED')
       this.providers = response.data
     })
     if (this.currentUser.allowEmbedIframes) this.disabled = this.currentUser.allowEmbedIframes