Skip to content

Latest commit

 

History

History
164 lines (135 loc) · 4.13 KB

File metadata and controls

164 lines (135 loc) · 4.13 KB

Areas API

Table of Contents

Getters

Get area type

Gets area type. Possible values for area types are: text, image, video.

console.log(projectDataInstance.getScreen(1)
  .getArea(0)
  .getAreaType()
)

Get recommended character count

Gets recommended character count for text areas. On other types throws error.

console.log(projectDataInstance.getScreen(1)
  .getArea(0)
  .getRecommendedCharacterCount()
)

Setters

Set text

If area is text, then sets given value, otherwise throws error.

Renderforest.getProjectData(15220886)
  .then((projectDataInstance) => {
    projectDataInstance.getScreen(0)
      .getArea(0)
      .setText('sample-text')
  })

Set text scale

It's possible to set text scale by percentage. The value must be between 80 and 120.

projectDataInstance.getScreen(0)
  .getArea(0)
  .setText('sample-text')
  .setTextScale(120)

Set image

If area is image, then sets given image params, otherwise throws error.

Renderforest.getProjectData(15220886)
  .then((projectDataInstance) => {
    projectDataInstance.getScreen(1)
      .getArea(0)
      .setImage({
        fileName: 'sample file name', // optional
        mime: 'image/png', // optional
        filePath: 'https://example.com/sample.png',
        webpPath: 'https://example.com/sample.webp', // optional
        fileType: 'image', // optional
        thumbnailPath: 'https://example.com/sample-thumbnail.png', // optional
        imageCropParams: {
          transform: 0,
          top: 11,
          left: 0,
          width: 798,
          height: 456
        },
        colorFilters: { // optional
          sepia: 0, // optional (range is between 0-1, default value is 0)
          contrast: 1, // optional (range is between 0-2.5, default value is 1)
          grayscale: 0, // optional (range is between 0-1, default value is 0)
          saturate: 1, // optional (range is between 0-2.5, default value is 1)
          huerotate: 0, // optional (range is between 0-360)
          brightness: 1 // optional (range is between 0-2.5, default value is 1)
        }
    })
  })

Set video

If area is video, then sets given video params, otherwise throws error.

Renderforest.getProjectData(15220886)
  .then((projectDataInstance) => {
    projectDataInstance.getScreen(2)
      .getArea(0)
      .setVideo({
        fileName: 'sample file name', // optional
        mime: 'video/mp4', // optional
        filePath: 'https://example.com/sample.png',
        webpPath: 'https://example.com/sample.webp', // optional
        fileType: 'video', // optional
        videoCropParams: {
          duration: 6,
          mime: 'video/mp4',
          transform: 0, // angle of the video. Valid values are 0, 90, 180, 270
          thumbnail: 'https://example.com/sample-thumbnail.png',
          thumbnailVideo: 'https://example.com/sample-thumbnail-video.mp4',
          trims: [0, 2, 3, 5],
          volume: {
            music: 10,
            video: 100
          }
        }
    })
  })

Return project data

For project data manipulation sometimes there is need to step back from area object to project data for further development.

projectDataInstance.getScreen(0)
  .getArea(1)
  .setText('sample-text')
  .setTextScale(100)
  .returnProjectData()
  .getScreen(1)
  .getArea(0)
  .setText('mock-text')

Save

Save method works with the same logic as the project data one. From the hood it steps back to project data then calls save method.

projectDataInstance.getScreen(0)
  .getArea(1)
  .setText('sample-text')
  .setTextScale(100)
  .save()

See advanced example for areas

⬆ back to the top