This script places an Embedly frame in the Description of an entity created by the Fibery Chrome extension

This is a workaround for the limitations of using html iframes in Fibery.

  • Script 1 adds the URL to a dedicated URL field
  • Script 2 copies the embedly frame from a template entity and replaces the URL in it.

chrome_1UgnqHtDxO

Script 1

const fibery = context.getService('fibery');

for (const entity of args.currentEntities) {
    // Fetch the content of the Description field
    const descriptionContent = await fibery.getDocumentContent(entity.Description.Secret);

    // Extract the first URL from the Description content
    const urlRegex = /https?:\/\/[^\s)]+/g;
    const firstUrl = (descriptionContent.match(urlRegex) || [])[0];

    // If a URL was found, update the URL field
    if (firstUrl) {
        await fibery.updateEntity(entity.type, entity.id, {
            'URL': firstUrl
        });
    }
}

Script 2

const fibery = context.getService('fibery');

for (const entity of args.currentEntities) {
    // Use the UUID for the template entity ID
    const templateEntityId = 'f8d9eee0-7192-11ee-b1a4-a584e4600b45';

    // Fetch the content of the 'Description' field from the template entity
    const templateEntity = await fibery.getEntityById('Y Web Resource', templateEntityId, ['Description']);
    const templateDescriptionContent = await fibery.getDocumentContent(templateEntity['Description'].Secret, 'html');

    // Extract the URL from the template entity's 'Description' field
    const urlRegex = /data-url="([^"]+)"/;
    const match = templateDescriptionContent.match(urlRegex);
    const templateURL = match && match[1];

    // Replace the URL in the iframe with the URL from the current entity's 'URL' field
    const newDescriptionContent = templateDescriptionContent.replace(templateURL, entity['URL']);

    // Update the 'Description' field of the new entity with the modified HTML content
    await fibery.setDocumentContent(entity['Description'].Secret, newDescriptionContent, 'html');
}

Script 1:

  1. Fetches the content of the ‘Description’ field from the newly created entity.
  2. Extracts the first URL found in the ‘Description’ content using a regular expression.
  3. If a URL is found, updates the ‘URL’ field of the entity with the extracted URL.

Script 2:

  1. Fetches the content of the ‘Description’ field from a template entity identified by a specific UUID.
  2. Extracts the URL from the template entity’s ‘Description’ field content using a regular expression.
  3. Replaces the extracted URL in the template entity’s ‘Description’ field content with the URL from the current entity’s ‘URL’ field.
  4. Updates the ‘Description’ field of the current entity with the modified content.

Note: Script 2 Replaces the Description field. To maintain existing text in the Descritpion field, see the Script 2B: This script places an Embedly frame in the Description of an entity created by the Fibery Chrome extension - #6 by Yuri_BC


USE A SECOND TEMPLATE ENTITY AND AUTOMATION FOR COMPATIBILITY MODE

  1. Embedly Compatibility Mode: Embedly has a feature called “Compatibility Mode” that allows it to support webpages that are otherwise not supported by the standard Embedly embed feature.
  2. Creating a Second Entity Template for Compatibility Mode:
  • If you want to use Embedly’s Compatibility Mode, you need to create a second entity template in Fibery.
  • In this second template, the ‘Description’ field should contain an Embedly frame that is already set to Compatibility Mode.
  1. Using the Second UUID in Automation Rule:
  • Once you have the second template with Compatibility Mode set up, you can create a second automation rule.
  • This second rule will be the same as the first, but you will replace the UUID of the template entity with the UUID of the second template (the one with Compatibility Mode).
  1. Testing with Buttons:
  • In the gif mentioned (which is not visible here), there are two buttons created for testing both Embedly automations.
  • These buttons are not necessary for the script to work, but they provide a convenient way to switch between standard and Compatibility Mode Embedly frames with a single click.

chrome_ymJEhWz8Ft

TODO:

  1. Create script that recognizes whether the URL needs compatibility mode or not.
  2. Even in compatibility mode, lots of links in Embedly don’t work like an iframe. Need to check why that is.
5 Likes

That’s awesome!

1 Like

you dont know how hard i tried to find the solution for this html keyword thing. You’re genius when apply using template entity and regex replacement.

I’m using both script in 1 Set Rule

:confused: I’m considering do we have any way to merge this mode? @Chr1sG @Yuri_BC the Condition to let it recognize which current mode’s and then decide which script need to run

Also, after setting this, I get a big mess. It’s not append write the iframe URL in rich text, It clear all text (overwrite) in description, which means i lost all infor in those. Hmm any suggestion for conditions ?

@Minh_Tri_Do_Hang
You are correct, it replaced the description field text. Here is a script that appends the Embedly at the top of the Description field, maintaining all content of it.

const fibery = context.getService('fibery');

for (const entity of args.currentEntities) {
    // Use the UUID for the template entity ID
    const templateEntityId = 'f8d9eee0-7192-11ee-b1a4-a584e4600b45';

    // Fetch the content of the 'Description' field from the template entity
    const templateEntity = await fibery.getEntityById('Y Web Resource', templateEntityId, ['Description']);
    const templateDescriptionContent = await fibery.getDocumentContent(templateEntity['Description'].Secret, 'html');
    console.log('Template Description Content:', templateDescriptionContent);

    // Fetch the current content of the 'Description' field from the entity
    const currentDescriptionContent = await fibery.getDocumentContent(entity['Description'].Secret, 'html');
    console.log('Current Description Content:', currentDescriptionContent);

    // Extract the first URL from the current description content
    const currentLink = currentDescriptionContent.match(/(https?:\/\/[^\s]+)/);
    console.log('Current Link:', currentLink);

    // Extract the URL from the template description content
    const templateLink = templateDescriptionContent.match(/(https?:\/\/[^\s]+)/);
    console.log('Template Link:', templateLink);

    // Replace the template URL with the current URL in the template description content
    const newTemplateDescriptionContent = templateDescriptionContent.replace(templateLink[0], currentLink[0]);
    console.log('New Template Description Content:', newTemplateDescriptionContent);

    // Append the modified template description content to the top of the current description content
    const newDescriptionContent = newTemplateDescriptionContent + currentDescriptionContent;
    console.log('New Description Content:', newDescriptionContent);

    // Update the 'Description' field of the entity with the new content
    await fibery.setDocumentContent(entity['Description'].Secret, newDescriptionContent, 'html');
}

  1. It fetches the first URL from the current entity’s Description field.
  2. It fetches the complete HTML content of the Template Description field.
  3. It extracts the URL from the Template Description field.
  4. It replaces the template URL with the current URL in the Template Description content.
  5. It appends the modified Template Description content to the top of the current entity’s Description field.

So this is the replacement of Script 2 mentioned before.

1 Like

Awesome!
Do you consider to find the way to let it recognize between normal mode and compatibility mode. It’d be better to set automation rather than seperated button. I still cant figure out how to merge this

For a webpage to be compatible with Embedly, it should have certain HTML tags that Embedly can use to extract the relevant content. These tags include:

  1. Open Graph Tags: These are meta tags that provide information about the webpage, such as the title, description, and image. They are used by Embedly to generate rich previews of the webpage.
  2. Twitter Card Tags: These are similar to Open Graph tags, but are specific to Twitter. They are used to generate rich previews of the webpage when it is shared on Twitter.
  3. Article Tag: This is an HTML tag that specifies the main content of the webpage. Embedly uses this tag to extract the article content from the webpage.
  4. Schema.org Markup: This is a set of HTML tags that provide structured data about the webpage. Embedly uses this data to generate rich previews of the webpage.

It the article tag is not present it will still retun useful information, but likely a summary instead of the whole content.

Here is an approach to create a script that checks compatibility

  1. Embedly Method with Article Tag:
  • Use Embedly to embed the webpage.
  • Check if the embedded content contains an <article> tag. ( Fetch the HTML content of a webpage using the HTTP service, parse it to extract the embedded content, and then check if the extracted content contains an <article> tag.)
  • If yes, display the embedded content.
  1. Embedly with Compatibility Mode:
  • If the embedded content from step 1 does not contain an <article> tag, switch to compatibility mode in Embedly.
  • Display the embedded content in compatibility mode.
  1. HTTP Service for Scraping:
  • If steps 1 and 2 do not provide the desired content, use the HTTP service in Fibery to send a GET request to the webpage URL.
  • Extract the HTML content from the response.
  • Use a web scraping technique to extract the main content from the HTML.
  • Display the extracted content.

EDIT: probably more efficient than using the HTTP service:

The script can analyze the HTML content after Embedly has fetched and embedded the content in the description field. This way, the script can assess the final output that is displayed in the description field and make any necessary adjustments based on the presence or absence of the <article> tag.

1 Like

hmm, I’m not familiar to this, how can we merge this to script 2 in effectively way, trying chat gpt to custom but seem not work at all