scriptable-testlab
Version:
A lightweight, efficient tool designed to manage and update scripts for Scriptable.
174 lines • 4.56 kB
JavaScript
import { AbsWidgetImage } from "scriptable-abstract";
import { MockData } from "../../data";
import { MockImage } from "../../media/image";
import { MockColor } from "../color";
import { MockSize } from "../size";
const DEFAULT_STATE = {
image: MockImage.fromData(MockData.fromString("")),
resizable: true,
imageSize: new MockSize(100, 100),
imageOpacity: 1,
cornerRadius: 0,
borderWidth: 0,
borderColor: new MockColor("#000000"),
containerRelativeShape: false,
tintColor: new MockColor("#000000"),
url: "",
contentMode: "fitting",
alignment: "center"
};
class MockWidgetImage extends AbsWidgetImage {
/**
* Creates a new widget image element with the specified image.
*/
constructor(image) {
super({
...DEFAULT_STATE,
...image ? { image } : {}
});
}
/**
* Creates a new widget image instance.
* @param image - The image to display in the widget.
* @returns A new widget image instance.
*/
static create(image) {
return new MockWidgetImage(image);
}
// Property accessors
get image() {
return this.state.image;
}
set image(value) {
this.setState({ image: value });
}
get resizable() {
return this.state.resizable;
}
set resizable(value) {
this.setState({ resizable: value });
}
get imageSize() {
return this.state.imageSize;
}
set imageSize(value) {
this.setState({ imageSize: value });
}
/**
* Gets or sets the opacity of the image.
* Value should be between 0 (fully transparent) and 1 (fully opaque).
*/
get imageOpacity() {
return this.state.imageOpacity;
}
set imageOpacity(value) {
const numValue = Number(value);
const clampedValue = isNaN(numValue) ? 0 : Math.max(0, Math.min(1, numValue));
this.setState({ imageOpacity: clampedValue });
}
/**
* Gets or sets the corner radius of the image.
* Negative values will be converted to 0.
*/
get cornerRadius() {
return this.state.cornerRadius;
}
set cornerRadius(value) {
const numValue = Number(value);
const validValue = isNaN(numValue) || numValue < 0 ? 0 : numValue;
this.setState({ cornerRadius: validValue });
}
/**
* Gets or sets the border width of the image.
* Negative values will be converted to 0.
*/
get borderWidth() {
return this.state.borderWidth;
}
set borderWidth(value) {
const numValue = isNaN(Number(value)) ? 0 : Number(value);
this.setState({ borderWidth: Math.max(0, numValue) });
}
get borderColor() {
return this.state.borderColor;
}
set borderColor(value) {
this.setState({ borderColor: value });
}
get containerRelativeShape() {
return this.state.containerRelativeShape;
}
set containerRelativeShape(value) {
this.setState({ containerRelativeShape: value });
}
get tintColor() {
return this.state.tintColor;
}
set tintColor(value) {
this.setState({ tintColor: value });
}
get url() {
return this.state.url;
}
set url(value) {
this.setState({ url: value });
}
/**
* Aligns the image to the left of its container.
* @returns this for method chaining
*/
leftAlignImage() {
this.setState({ alignment: "left" });
return this;
}
/**
* Centers the image in its container.
* @returns this for method chaining
*/
centerAlignImage() {
this.setState({ alignment: "center" });
return this;
}
/**
* Aligns the image to the right of its container.
* @returns this for method chaining
*/
rightAlignImage() {
this.setState({ alignment: "right" });
return this;
}
/**
* Sets the content mode to fitting, which scales the image to fit within its container while maintaining aspect ratio.
* @returns this for method chaining
*/
applyFittingContentMode() {
this.setState({ contentMode: "fitting" });
return this;
}
/**
* Sets the content mode to filling, which scales the image to fill its container while maintaining aspect ratio.
* @returns this for method chaining
*/
applyFillingContentMode() {
this.setState({ contentMode: "filling" });
return this;
}
/**
* Gets the current alignment of the image.
* @returns The current alignment ('left', 'center', or 'right').
*/
getAlignment() {
return this.state.alignment;
}
/**
* Gets the current content mode of the image.
* @returns The current content mode ('fitting' or 'filling').
*/
getContentMode() {
return this.state.contentMode;
}
}
export {
MockWidgetImage
};
//# sourceMappingURL=image.js.map