import app from "../../shotstack.app.mjs";
import constants from "../../common/constants.mjs";
const { SEP } = constants;
export default {
key: "shotstack-create-timeline",
name: "Create Timeline",
description: "Generate a timeline with layers and assets for a new video project. [See the documentation here](https://github.com/shotstack/shotstack-sdk-node#timeline).",
type: "action",
version: "0.0.1",
props: {
app,
howManyTracks: {
type: "integer",
label: "How Many Tracks?",
description: "The number of tracks to create.",
reloadProps: true,
min: 1,
},
soundtrackSrc: {
type: "string",
label: "Soundtrack Source",
description: "The URL of the soundtrack to use.",
optional: true,
},
soundtrackEffect: {
type: "string",
label: "Soundtrack Effect",
description: "The effect to apply to the soundtrack.",
optional: true,
options: Object.values(constants.SOUNDTRACK_EFFECT),
},
background: {
type: "string",
label: "Background",
description: "A hexadecimal value for the timeline background colour. Defaults to `#000000` (black).",
optional: true,
},
fonts: {
type: "string[]",
label: "Fonts",
description: "An array of custom fonts to be downloaded for use by the HTML assets. The URL must be publicly accessible or include credentials. E.g. `https://s3-ap-northeast-1.amazonaws.com/my-bucket/open-sans.ttf`",
optional: true,
},
},
methods: {
getClip({
start, length, type, src, text, html,
}) {
return {
start,
length,
asset: {
src,
html,
text,
type,
},
};
},
getClips(trackNumber, assetType, length) {
return Array.from({
length,
}).map((_, index) => {
const clipNumber = index + 1;
const trackName = `track${trackNumber}`;
const clipName = `${trackName}${SEP}clip${clipNumber}${SEP}${assetType}`;
const clipAssetStart = `${clipName}${SEP}start`;
const clipAssetLength = `${clipName}${SEP}length`;
const clipAssetSrc = `${clipName}${SEP}src`;
const clipAssetText = `${clipName}${SEP}text`;
const clipAssetHtml = `${clipName}${SEP}html`;
return this.getClip({
start: this[clipAssetStart],
length: this[clipAssetLength],
type: assetType,
src: this[clipAssetSrc],
text: this[clipAssetText],
html: this[clipAssetHtml],
});
});
},
getTracks(length) {
return Array.from({
length,
}).map((_, index) => {
const trackNumber = index + 1;
const trackName = `track${trackNumber}`;
const trackHowManyVideoClips = `${trackName}${SEP}HowManyVideoClips`;
const trackHowManyImageClips = `${trackName}${SEP}HowManyImageClips`;
const trackHowManyAudioClips = `${trackName}${SEP}HowManyAudioClips`;
const trackHowManyTitleClips = `${trackName}${SEP}HowManyTitleClips`;
const trackHowManyHtmlClips = `${trackName}${SEP}HowManyHtmlClips`;
const trackHowManyLumaClips = `${trackName}${SEP}HowManyLumaClips`;
return {
clips: [
...this.getClips(trackNumber, constants.ASSET_TYPE.VIDEO, this[trackHowManyVideoClips]),
...this.getClips(trackNumber, constants.ASSET_TYPE.IMAGE, this[trackHowManyImageClips]),
...this.getClips(trackNumber, constants.ASSET_TYPE.AUDIO, this[trackHowManyAudioClips]),
...this.getClips(trackNumber, constants.ASSET_TYPE.TITLE, this[trackHowManyTitleClips]),
...this.getClips(trackNumber, constants.ASSET_TYPE.HTML, this[trackHowManyHtmlClips]),
...this.getClips(trackNumber, constants.ASSET_TYPE.LUMA, this[trackHowManyLumaClips]),
],
};
});
},
getClipProps(trackNumber, assetType, length) {
return Array.from({
length,
}).map((_, index) => {
const clipNumber = index + 1;
const trackName = `track${trackNumber}`;
const clipName = `${trackName}${SEP}clip${clipNumber}${SEP}${assetType}`;
const clipAssetStart = `${clipName}${SEP}start`;
const clipAssetLength = `${clipName}${SEP}length`;
const description = `Track ${trackNumber} - ${assetType} clip ${clipNumber}.`;
const commonProps = {
[clipAssetStart]: {
type: "integer",
label: "Start",
description: `${description} The start time of the asset`,
},
[clipAssetLength]: {
type: "integer",
label: "Length",
description: `${description} The length of the asset.`,
},
};
if (assetType === constants.ASSET_TYPE.TITLE) {
return {
...commonProps,
[`${clipName}${SEP}text`]: {
type: "string",
label: "Text",
description: `${description} The text of the title.`,
},
};
}
if (assetType === constants.ASSET_TYPE.HTML) {
return {
...commonProps,
[`${clipName}${SEP}html`]: {
type: "string",
label: "HTML",
description: `${description} The HTML of the asset.`,
},
};
}
return {
...commonProps,
[`${clipName}${SEP}src`]: {
type: "string",
label: "Source",
description: `${description} The source url of the asset.`,
},
};
})
.reduce((acc, next) => ({
...acc,
...next,
}), {});
},
},
additionalProps() {
return Array.from({
length: this.howManyTracks,
}).reduce((acc, _, index) => {
const trackNumber = index + 1;
const trackName = `track${trackNumber}`;
const trackHowManyVideoClips = `${trackName}${SEP}HowManyVideoClips`;
const trackHowManyImageClips = `${trackName}${SEP}HowManyImageClips`;
const trackHowManyAudioClips = `${trackName}${SEP}HowManyAudioClips`;
const trackHowManyTitleClips = `${trackName}${SEP}HowManyTitleClips`;
const trackHowManyHtmlClips = `${trackName}${SEP}HowManyHtmlClips`;
const trackHowManyLumaClips = `${trackName}${SEP}HowManyLumaClips`;
const commonDescription = `Track ${trackNumber}:`;
return {
...acc,
[trackHowManyVideoClips]: {
type: "integer",
label: "How Many Video Clips?",
description: `${commonDescription} The number of video clips to create.`,
reloadProps: true,
optional: true,
},
[trackHowManyImageClips]: {
type: "integer",
label: "How Many Image Clips?",
description: `${commonDescription} The number of image clips to create.`,
reloadProps: true,
optional: true,
},
[trackHowManyAudioClips]: {
type: "integer",
label: "How Many Audio Clips?",
description: `${commonDescription} The number of audio clips to create.`,
reloadProps: true,
optional: true,
},
[trackHowManyTitleClips]: {
type: "integer",
label: "How Many Title Clips?",
description: `${commonDescription} The number of title clips to create.`,
reloadProps: true,
optional: true,
},
[trackHowManyHtmlClips]: {
type: "integer",
label: "How Many HTML Clips?",
description: `${commonDescription} The number of HTML clips to create.`,
reloadProps: true,
optional: true,
},
[trackHowManyLumaClips]: {
type: "integer",
label: "How Many Luma Clips?",
description: `${commonDescription} The number of luma clips to create.`,
reloadProps: true,
optional: true,
},
...this.getClipProps(trackNumber, constants.ASSET_TYPE.VIDEO, this[trackHowManyVideoClips]),
...this.getClipProps(trackNumber, constants.ASSET_TYPE.IMAGE, this[trackHowManyImageClips]),
...this.getClipProps(trackNumber, constants.ASSET_TYPE.AUDIO, this[trackHowManyAudioClips]),
...this.getClipProps(trackNumber, constants.ASSET_TYPE.TITLE, this[trackHowManyTitleClips]),
...this.getClipProps(trackNumber, constants.ASSET_TYPE.HTML, this[trackHowManyHtmlClips]),
...this.getClipProps(trackNumber, constants.ASSET_TYPE.LUMA, this[trackHowManyLumaClips]),
};
}, {});
},
async run({ $: step }) {
const {
howManyTracks,
soundtrackSrc,
soundtrackEffect,
background,
fonts,
} = this;
const timeline = {
soundtrack: {
src: soundtrackSrc,
effect: soundtrackEffect,
},
background,
fonts: Array.isArray(fonts)
? fonts.map((src) => ({
src,
}))
: fonts?.split(",").map((src) => ({
src,
})),
tracks: this.getTracks(howManyTracks),
};
step.export("$summary", "Successfully created a timeline.");
return timeline;
},
};
Chase Roberts@chsrbrts@benedictevans If you haven’t used @pipedream yet, then you haven’t lived.
✨Ellie Day✨@heyelliedayEvaluation update: @pipedream has quite literally been a dream to work with! I’m excited to leverage this tool for all the various workflows I need to write. I’m currently at 11k invocations a day from the initial workflows I’ve written in the past couple weeks.
Michael Braedley@MBraedleyUpdate: I got it working properly, and it's working so well that I'm dropping IFTTT. @pipedream can do everything that IFTTT basic can, and most (if not all things) IFTTT pro can for free or at a reasonable price if you need it. I am recommending it for basically any power user.
Thomas Cutting@mrthomascuttingWant quick+dirty integrations for a serverless workflow - @pipedream is my new go-to 😃
Matthew Roberts@mattdotrobertsday 013 - finally hit node js. This is the secret sauce of taking #nocode projects that one step further. Pumped about getting deeper into @pipedream now
Kenneth Auchenberg 💭@auchenbergYahoo Pipes is back! Kinda 😍 @pipedream
Raymond Camden 🥑@raymondcamdenAwesome video by the @pipedream folks showing real time twitter sentiment analysis integrated with Google Sheets. This is where Pipedream *really* shines, connecting systems together in easy workflows.
Nacho Caballero@nachocaballeroI couldn't recommend @pipedream more. It's an amazing service to integrate different APIs. Much more powerful than Zapier and more user-friendly than AWS Lambda. I'm very proud to wear this t-shirt #NoCode
Jason Snow@jyksnwDeveloped a working prototype environmental sensor IoT solution with @particle Photon, @pipedream, and @MongoDB with full graphing and alerting in less than a day! All amazing technology, will def. be exploring these more.
Steven Terrana@steven_terrana@burgwyn you've inspired me to finally set up my own blog. I'll make sure my first blog post explains the tech behind the setup. think @obsdmd + @GatsbyJS + @pipedream.
🚄 James Augeri, PhD@DotDotJamesWant to low-code your back end, need more horsepower than @Bubble / @KnackHQ, or just miss Yahoo! Pipes? Check out @PipeDream
Sébastien Chopin@AtinuxGitHub issues should be like @linear_app for maintainers. Looking forward more integrations with GH actions or tools like @pipedream 👀
Raul@raul_predescuIf you're a dev and not using @pipedream, you're missing out. Been using it for months, daily. FREE for devs. Plenty of integrations and good limits. Absolutely love it.
Bruno Skvorc@bitfallsSo @pipedream is pretty amazing. In 3 minutes I just made a flow which adds @rickastley's Never Gonna Give You Up to my @spotify playlist whenever a new pull request arrives in an old repo of mine.
Zach Lanich@ZachLanichUm, wow 🤯 @pipedream
Steven Bell@bellontechI just used @pipedream to build a Shopify App. Wow, they make small backed tasks easy.
Jay Hack 🎩🇺🇸@_jayhack_Very impressed with this bad boi - it reminds me of a @PalantirTech internal tool, but geared towards integrations instead of data analysis and far more customizable. Great expectations here 🚀🤩
Tree Sturgeon 🔥🚴♂️🌳@philsturgeonFor context this is day 2 of a really challenging and stupid migration from Notion to @airtable with disparate/missing data. It's going better than expected and thanks to @pipedream I don't have to bother the iOS dev to add W3W.