From daecf21e36f7713d9af0587da0c872834b3a017a Mon Sep 17 00:00:00 2001 From: Patrick Date: Sun, 28 Feb 2021 18:03:38 +0200 Subject: [PATCH] Add an example for Border and fix code highlights --- __docTemplate/src/tmpl/site/_layout.hbs | 1 + __docTemplate/src/utils/docletHelper.js | 2 +- __docTemplate/template/tmpl.js | 2 +- __docTemplate/template/utils/docletHelper.js | 2 +- src/actions/border.ts | 66 +++++++++++++++----- src/assets/CloudinaryTransformable.ts | 4 +- src/transformation/Transformation.ts | 4 +- 7 files changed, 60 insertions(+), 21 deletions(-) diff --git a/__docTemplate/src/tmpl/site/_layout.hbs b/__docTemplate/src/tmpl/site/_layout.hbs index 884d87f8..17a00ce4 100644 --- a/__docTemplate/src/tmpl/site/_layout.hbs +++ b/__docTemplate/src/tmpl/site/_layout.hbs @@ -228,6 +228,7 @@ + {{#if options.search}} diff --git a/__docTemplate/src/utils/docletHelper.js b/__docTemplate/src/utils/docletHelper.js index b29fea8e..75f2ac85 100644 --- a/__docTemplate/src/utils/docletHelper.js +++ b/__docTemplate/src/utils/docletHelper.js @@ -384,4 +384,4 @@ exports.hasDetails = function (doclet) { || (doclet.tutorials && doclet.tutorials.length) || (doclet.see && doclet.see.length) || (doclet.todo && doclet.todo.length)) -}; \ No newline at end of file +}; diff --git a/__docTemplate/template/tmpl.js b/__docTemplate/template/tmpl.js index 3f56bb40..120bf9c3 100644 --- a/__docTemplate/template/tmpl.js +++ b/__docTemplate/template/tmpl.js @@ -269,7 +269,7 @@ Handlebars.registerPartial("site/layout", this["tmpl"]["site/layout"] = Handleba + ((stack1 = (helpers.block || (depth0 && depth0.block) || alias2).call(alias1,"footer",{"name":"block","hash":{},"fn":container.program(53, data, 0, blockParams, depths),"inverse":container.noop,"data":data})) != null ? stack1 : "") + " \r\n" + ((stack1 = helpers["if"].call(alias1,((stack1 = (depth0 != null ? depth0.config : depth0)) != null ? stack1.debug : stack1),{"name":"if","hash":{},"fn":container.program(60, data, 0, blockParams, depths),"inverse":container.noop,"data":data})) != null ? stack1 : "") - + " \r\n \r\n \r\n \r\n \r\n" + + " \r\n \r\n \r\n \r\n \r\n \r\n" + ((stack1 = helpers["if"].call(alias1,((stack1 = (depth0 != null ? depth0.options : depth0)) != null ? stack1.search : stack1),{"name":"if","hash":{},"fn":container.program(62, data, 0, blockParams, depths),"inverse":container.noop,"data":data})) != null ? stack1 : "") + ((stack1 = helpers.each.call(alias1,((stack1 = (depth0 != null ? depth0.options : depth0)) != null ? stack1.scripts : stack1),{"name":"each","hash":{},"fn":container.program(64, data, 0, blockParams, depths),"inverse":container.noop,"data":data})) != null ? stack1 : "") + " " diff --git a/__docTemplate/template/utils/docletHelper.js b/__docTemplate/template/utils/docletHelper.js index b29fea8e..75f2ac85 100644 --- a/__docTemplate/template/utils/docletHelper.js +++ b/__docTemplate/template/utils/docletHelper.js @@ -384,4 +384,4 @@ exports.hasDetails = function (doclet) { || (doclet.tutorials && doclet.tutorials.length) || (doclet.see && doclet.see.length) || (doclet.todo && doclet.todo.length)) -}; \ No newline at end of file +}; diff --git a/src/actions/border.ts b/src/actions/border.ts index 0649b729..d21c9966 100644 --- a/src/actions/border.ts +++ b/src/actions/border.ts @@ -5,6 +5,7 @@ import {prepareColor} from "../internal/utils/prepareColor"; import {SystemColors} from "../qualifiers/color"; import RoundCornersAction from "./roundCorners/RoundCornersAction"; + /** * @summary action * @description Adds a solid border around an image or video. @@ -13,23 +14,42 @@ import RoundCornersAction from "./roundCorners/RoundCornersAction"; * {@link https://cloudinary.com/documentation/image_transformations#adding_image_borders | Adding image borders} * @memberOf Actions * @namespace Border + * @example + * import {Cloudinary} from "@cloudinary/base/instance/Cloudinary"; + * + * const yourCldInstance = new Cloudinary({cloud:{cloudName:'demo'}}); + * const image = yourCldInstance.image('woman'); + * image.border( + * Border.solid(15, 'green'), + * // Or alternatively + * Border.solid().width(15).color('green') + * ); + * */ -class Border extends Action { + + + +/** + * @memberOf Actions.Border + * @example + * // Used through a builder function Border.solid(), and not by creating a new instance + * import {Cloudinary} from "@cloudinary/base/instance/Cloudinary"; + * + * const yourCldInstance = new Cloudinary({cloud:{cloudName:'demo'}}); + * const image = yourCldInstance.image('woman'); + * image.border( + * Border.solid(15, 'green'), + * // Or alternatively + * Border.solid().width(15).color('green') + * ); + */ +class BorderAction extends Action { private borderWidth: number | string; private borderColor: string; private borderType: string; private _roundCorners: RoundCornersAction; - /** - * @summary action - * @memberOf Actions.Border - * @description Sets the style of the border. - * @return {Border} - */ - static solid(width: number | string, color: SystemColors): Border { - return new Border('solid', color, width); - } /** * @description Adds a border of the specified type around an image or video. @@ -46,9 +66,9 @@ class Border extends Action { /** * @description Sets the width of the border - * @param {number} borderWidth The width in pixels. + * @param {number | string} borderWidth The width in pixels. */ - width(borderWidth: number): this { + width(borderWidth: number | string): this { this.borderWidth = borderWidth; return this; } @@ -82,6 +102,24 @@ class Border extends Action { } } -const {solid} = Border; -export {Border, solid}; + + +/** + * @summary action + * @memberOf Actions.Border + * @description Sets the style of the border. + * @param {number | string} width The width in pixels. + * @param {string} color The color of the border, e.g 'green', 'yellow'. + * @return {Actions.Border.BorderAction} + */ +function solid(width: number | string, color: SystemColors): BorderAction { + return new BorderAction('solid', color, width); +} + + +const Border = { + solid +}; + +export {BorderAction, Border, solid}; diff --git a/src/assets/CloudinaryTransformable.ts b/src/assets/CloudinaryTransformable.ts index c55c096a..40fedac8 100644 --- a/src/assets/CloudinaryTransformable.ts +++ b/src/assets/CloudinaryTransformable.ts @@ -1,4 +1,4 @@ -import {Border} from "../actions/border"; +import {Border, BorderAction} from "../actions/border"; import {IReshape} from "../actions/reshape"; import ResizeSimpleAction from "../actions/resize/ResizeSimpleAction"; import RoundCornersAction from "../actions/roundCorners/RoundCornersAction"; @@ -43,7 +43,7 @@ class CloudinaryTransformable extends CloudinaryFile { * @param {Actions.Border} border * @return {this} */ - border(border: Border): this { + border(border: BorderAction): this { this.transformation.border(border); return this; } diff --git a/src/transformation/Transformation.ts b/src/transformation/Transformation.ts index a5a27af5..8dfb10f1 100644 --- a/src/transformation/Transformation.ts +++ b/src/transformation/Transformation.ts @@ -15,7 +15,7 @@ import {IReshape} from "../actions/reshape"; import {SystemColors} from "../qualifiers/color"; import {prepareColor} from "../internal/utils/prepareColor"; import {Extract} from "../actions/extract"; -import {Border} from "../actions/border"; +import {Border, BorderAction} from "../actions/border"; import {FlagQualifier} from "../qualifiers/flag/FlagQualifier"; import {EffectActions} from "../actions/effect"; import {videoEditType} from "../actions/videoEdit"; @@ -93,7 +93,7 @@ class Transformation { * @param {Border} borderAction * @return {this} */ - border(borderAction: Border): this{ + border(borderAction: BorderAction): this{ return this.addAction(borderAction); }