Create Banner with Adrapid API on New Run State Changed from OpenAI (ChatGPT) API

Pipedream makes it easy to connect APIs for Adrapid, OpenAI (ChatGPT) and 2,200+ other apps remarkably fast.

Trigger workflow on

New Run State Changed from the OpenAI (ChatGPT) API

Next, do this

Create Banner with the Adrapid API

No credit card required

▶

Watch us build a workflow

8 min

Watch now ➜

Trusted by 1,000,000+ developers from startups to Fortune 500 companies

Developers ♥ Pipedream

Getting Started#

This integration creates a workflow with a OpenAI (ChatGPT) trigger and Adrapid action. When you configure and deploy the workflow, it will run on Pipedream's servers 24x7 for free.

Select this integration
Configure the New Run State Changed trigger
1. Connect your OpenAI (ChatGPT) account
2. Configure timer
3. Configure Thread ID
Configure the Create Banner action
1. Connect your Adrapid account
2. Select a Template Id
3. Optional- Select one or more Modes
4. Optional- Configure Overrides
5. Optional- Configure Sync
6. Optional- Configure Editable
7. Optional- Configure Exclude Base Size
Deploy the workflow
Send a test event to validate your setup
Turn on the trigger

Details#

This integration uses pre-built, source-available components from Pipedream's GitHub repo. These components are developed by Pipedream and the community, and verified and maintained by Pipedream.

To contribute an update to an existing component or create a new component, create a PR on GitHub. If you're new to Pipedream component development, you can start with quickstarts for trigger span and action development, and then review the component API reference.

Trigger#

New Run State Changed on OpenAI (ChatGPT)

Description:Emit new event every time a run changes its status. [See the documentation](https://platform.openai.com/docs/api-reference/runs/listRuns)

Version:0.0.5

Key:openai-new-run-state-changed

View on GitHub

OpenAI (ChatGPT) Overview#

OpenAI provides a suite of powerful AI models through its API, enabling developers to integrate advanced natural language processing and generative capabilities into their applications. Here’s an overview of the services offered by OpenAI's API:

Use Python or Node.js code to make fully authenticated API requests with your OpenAI account:

Trigger Code#

import common from "../common/common.mjs";
import sampleEmit from "./test-event.mjs";

export default {
  ...common,
  key: "openai-new-run-state-changed",
  name: "New Run State Changed",
  description: "Emit new event every time a run changes its status. [See the documentation](https://platform.openai.com/docs/api-reference/runs/listRuns)",
  version: "0.0.5",
  type: "source",
  dedupe: "unique",
  props: {
    ...common.props,
    threadId: {
      propDefinition: [
        common.props.openai,
        "threadId",
      ],
    },
  },
  methods: {
    ...common.methods,
    getStatusItems() {
      return this.db.get("statusItems");
    },
    setStatusItems(value) {
      this.db.set("statusItems", value);
    },
    async getData() {
      const {
        openai,
        threadId,
      } = this;

      const { data } = await openai.listRuns({
        threadId,
      });

      return data;
    },
    getMeta(item) {
      const ts = Date.now();
      return {
        id: `${item.id}-${ts}`,
        summary: `Run State Changed: ${item.id}`,
        ts,
      };
    },
    statusByItemId(itemId, statusItems) {
      const { [itemId]: status } = statusItems || {};
      return status;
    },
    buildStatusItems(data) {
      return data?.reduce((acc, item) => ({
        ...acc,
        [item.id]: item.status,
      }), {});
    },
    async getAndProcessItems(maxEvents) {
      const {
        getData,
        getStatusItems,
        setStatusItems,
        statusByItemId,
        buildStatusItems,
        getMeta,
        $emit: emit,
      } = this;

      const data = await getData();
      const statusItems = getStatusItems();

      Array.from(data)
        .reverse()
        .forEach((item, index) => {
          const statusChanged = statusByItemId(item.id, statusItems) !== item.status;
          if ((!maxEvents || index < maxEvents) && statusChanged) {
            emit(item, getMeta(item));
          }
        });

      setStatusItems(buildStatusItems(data));
    },
  },
  sampleEmit,
};

Trigger Configuration#

This component may be configured based on the props defined in the component code. Pipedream automatically prompts for input values in the UI and CLI.

Label	Prop	Type	Description
OpenAI (ChatGPT)	`openai`	`app`	This component uses the OpenAI (ChatGPT) app.
N/A	`db`	`$.service.db`	This component uses `$.service.db` to maintain state between executions.
	`timer`	`$.interface.timer`
Thread ID	`threadId`	`string`	The unique identifier for the thread. Example: `thread_abc123`. To locate the thread ID, make sure your OpenAI Threads setting (Settings -> Organization/Personal -> General -> Features and capabilities -> Threads) is set to "Visible to organization owners" or "Visible to everyone". You can then access the list of threads and click on individual threads to reveal their IDs

Trigger Authentication#

OpenAI (ChatGPT) uses API keys for authentication. When you connect your OpenAI (ChatGPT) account, Pipedream securely stores the keys so you can easily authenticate to OpenAI (ChatGPT) APIs in both code and no-code steps.

About OpenAI (ChatGPT)#

OpenAI is an AI research and deployment company with the mission to ensure that artificial general intelligence benefits all of humanity. They are the makers of popular models like ChatGPT, DALL-E, and Whisper.

Action#

Create Banner on Adrapid

Description:Generates a new banner using provided data. This action can create different types of banners, such as animated HTML5, image, or video banners. [See the documentation](https://docs.adrapid.com/api/overview)

Version:0.0.1

Key:adrapid-create-banner

View on GitHub

Action Code#

import adrapid from "../../adrapid.app.mjs";
import { parseObject } from "../../common/utils.mjs";

export default {
  key: "adrapid-create-banner",
  name: "Create Banner",
  description: "Generates a new banner using provided data. This action can create different types of banners, such as animated HTML5, image, or video banners. [See the documentation](https://docs.adrapid.com/api/overview)",
  version: "0.0.1",
  type: "action",
  props: {
    adrapid,
    templateId: {
      propDefinition: [
        adrapid,
        "templateId",
      ],
      reloadProps: true,
    },
    modes: {
      type: "string[]",
      label: "Modes",
      description: "Modes for the resulting banners, previously set on configuration block.",
      options: [
        "html5",
        "amp",
        "png",
        "jpeg",
        "pdf",
        "webp",
        "video",
        "gif",
      ],
      reloadProps: true,
      optional: true,
    },
    overrides: {
      type: "object",
      label: "Overrides",
      description: "With this parameter we override the default template content. We use the name of the item we want to override, valid properties are text, url (for external images) and css. [See the documentation](https://docs.adrapid.com/api/overview).",
      optional: true,
    },
    sync: {
      type: "boolean",
      label: "Sync",
      description: "Get banner url in the same response. Delay the response until the banner is ready. Usually in a few seconds with a maxtime of two minutes.",
      optional: true,
    },
    editable: {
      type: "boolean",
      label: "Editable",
      description: "Make banner editable, creating a template that is a copy of the banner.",
      optional: true,
    },
    excludeBaseSize: {
      type: "boolean",
      label: "Exclude Base Size",
      description: "Exclude base size from the banner. Only applies to multisize banners.",
      optional: true,
    },
  },
  async additionalProps() {
    const props = {};
    if (this.templateId) {
      const { sizes } = await this.adrapid.getTemplate({
        templateId: this.templateId,
      });
      props.sizeIds = {
        type: "string[]",
        label: "Size Ids",
        description: "The template sizes. To use all of them you can set this parameter to 'all'. If you remove this parameter only the default size of the template will be used.",
        reloadProps: true,
        optional: true,
        options: sizes.map(({
          id: value, name: label,
        }) => ({
          value,
          label,
        })),
      };
    }

    if (this.modes) {
      if (this.modes.includes("html5")) {
        props.html5Packed = {
          type: "boolean",
          label: "HTML5 Packed",
          description: "Set banner in a single file with embedded images.",
        };
        props.html5Flexible = {
          type: "boolean",
          label: "HTML5 Flexible",
          description: "Set a flexible banner that will adapt to his container.",
        };
      }
      if (this.modes.includes("video")) {
        props.videoFps = {
          type: "integer",
          label: "Video FPS",
          description: "Frame Per Second of resulting video.",
          default: 14,
          max: 60,
        };
        props.videoCrf = {
          type: "integer",
          label: "Video CRF",
          description: "Constant Rate Factor. Less is more quality.",
          default: 18,
          max: 60,
        };
        props.videoOffset = {
          type: "string",
          label: "Audio Offset",
          description: "Audio offset. Can be negative number.",
        };
        props.videoSrc = {
          type: "string",
          label: "Audio SRC",
          description: "URL of the audio file.",
        };
      }
      if (this.modes.includes("gif")) {
        props.gifFps = {
          type: "boolean",
          label: "GIF FPS",
          description: "Frame per second of resulting gif.",
        };
        props.gifFrames = {
          type: "integer[]",
          label: "GIF Frames",
          description: "Select specific seconds in the timeline to be used as frames.",
        };
      }
    }
    return props;
  },
  async run({ $ }) {

    const modes = {};

    if (this.modes) {
      this.modes.forEach((item) => {
        modes[item] = true;
      });

      if (this.modes.includes("html5")) {
        modes.html5 = {
          packed: this.html5Packed,
          flexibe: this.html5Flexible,
        };
      }
      if (this.modes.includes("video")) {
        modes.video = {
          fps: this.videoFps,
          crf: this.videoCrf,
          audio: {
            offset: parseInt(this.videoOffset),
            src: this.videoSrc,
          },
        };
      }
      if (this.modes.includes("gif")) {
        modes.html5 = {
          fps: this.gifFps,
          frames: this.gifFrames,
        };
      }
    }

    const response = await this.adrapid.createBanner({
      $,
      data: {
        sizeIds: this.sizeIds,
        templateId: this.templateId,
        modes,
        overrides: parseObject(this.overrides),
        sync: this.sync,
        editable: this.editable,
        excludeBaseSize: this.excludeBaseSize,
      },
    });

    $.export("$summary", `Banner created successfully with ID: ${response.id}`);
    return response;
  },
};

Action Configuration#

This component may be configured based on the props defined in the component code. Pipedream automatically prompts for input values in the UI.

Label	Prop	Type	Description
Adrapid	`adrapid`	`app`	This component uses the Adrapid app.
Template Id	`templateId`	`string`	Select a value from the drop down menu.
Modes	`modes`	`string[]`	Select a value from the drop down menu:`html5amppngjpegpdfwebpvideogif`
Overrides	`overrides`	`object`	With this parameter we override the default template content. We use the name of the item we want to override, valid properties are text, url (for external images) and css. See the documentation.
Sync	`sync`	`boolean`	Get banner url in the same response. Delay the response until the banner is ready. Usually in a few seconds with a maxtime of two minutes.
Editable	`editable`	`boolean`	Make banner editable, creating a template that is a copy of the banner.
Exclude Base Size	`excludeBaseSize`	`boolean`	Exclude base size from the banner. Only applies to multisize banners.

Create Banner with Adrapid API on New Run State Changed from OpenAI (ChatGPT) API

Pipedream makes it easy to connect APIs for Adrapid, OpenAI (ChatGPT) and 2,200+ other apps remarkably fast.

Trusted by 1,000,000+ developers from startups to Fortune 500 companies

Developers ♥ Pipedream

1-24of2,200+apps by most popular

1
-
24
of
2,200+
apps by most popular