From ef6733b6e3f892762b0542cb08663667d00acc53 Mon Sep 17 00:00:00 2001 From: Eduard Carrerars Date: Wed, 11 Dec 2024 10:30:08 +0100 Subject: [PATCH 1/2] feat(carousel): add new carousel widget container --- src/Carousel.ts | 24 ++++++++++++++++++++++++ src/WidgetFactory.ts | 4 ++++ src/index.ts | 2 ++ src/spec/Carousel.spec.ts | 32 ++++++++++++++++++++++++++++++++ 4 files changed, 62 insertions(+) create mode 100644 src/Carousel.ts create mode 100644 src/spec/Carousel.spec.ts diff --git a/src/Carousel.ts b/src/Carousel.ts new file mode 100644 index 0000000..3827f04 --- /dev/null +++ b/src/Carousel.ts @@ -0,0 +1,24 @@ +import ContainerWidget from "./ContainerWidget"; + +class Carousel extends ContainerWidget { + _autoPlay = false; + + get autoPlay(): boolean { + return this._autoPlay; + } + + set autoPlay(value: boolean) { + this._autoPlay = value; + } + + constructor(props?: any) { + super(props); + if (props) { + if (props.auto_play) { + this._autoPlay = props.auto_play; + } + } + } +} + +export default Carousel; diff --git a/src/WidgetFactory.ts b/src/WidgetFactory.ts index 10ac0c8..73bfa34 100644 --- a/src/WidgetFactory.ts +++ b/src/WidgetFactory.ts @@ -41,6 +41,7 @@ import Comments from "./Comments"; import JSONField from "./JSONField"; import Email from "./Email"; import Spinner from "./Spinner"; +import Carousel from "./Carousel"; class WidgetFactory { /** @@ -184,6 +185,9 @@ class WidgetFactory { case "spinner": this._widgetClass = Spinner; break; + case "carousel": + this._widgetClass = Carousel; + break; default: break; } diff --git a/src/index.ts b/src/index.ts index b92d49b..23041e0 100644 --- a/src/index.ts +++ b/src/index.ts @@ -53,6 +53,7 @@ import JSONField from "./JSONField"; import Comments from "./Comments"; import Email from "./Email"; import Spinner from "./Spinner"; +import Carousel from "./Carousel"; import { Graph, @@ -142,4 +143,5 @@ export { JSONField, Email, Spinner, + Carousel, }; diff --git a/src/spec/Carousel.spec.ts b/src/spec/Carousel.spec.ts new file mode 100644 index 0000000..4b2effd --- /dev/null +++ b/src/spec/Carousel.spec.ts @@ -0,0 +1,32 @@ +import WidgetFactory from "../WidgetFactory"; +import Carousel from "../Carousel"; +import { it, expect, describe } from "vitest"; + +describe("A Carousel", () => { + it("should have an id corresponding to field name", () => { + const widgetFactory = new WidgetFactory(); + const props = { + name: "carousel", + }; + + const widget = widgetFactory.createWidget("carousel", props); + expect(widget).toBeInstanceOf(Carousel); + }); + it("should have autoPlay as false by default", () => { + const widgetFactory = new WidgetFactory(); + const props = { + name: "carousel", + }; + const widget = widgetFactory.createWidget("carousel", props); + expect(widget.autoPlay).toBe(false); + }); + it("should allow autoPlay to be set", () => { + const widgetFactory = new WidgetFactory(); + const props = { + name: "carousel", + auto_play: true, + }; + const widget = widgetFactory.createWidget("carousel", props); + expect(widget.autoPlay).toBe(true); + }); +}); From 33eb72686af4601cb5c6914677f056af436d72f9 Mon Sep 17 00:00:00 2001 From: Eduard Carrerars Date: Wed, 11 Dec 2024 12:00:42 +0100 Subject: [PATCH 2/2] feat(carousel): add items --- src/Carousel.ts | 12 ++++++--- src/spec/Carousel.spec.ts | 51 ++++++++++++++++++++++++++++++++++++--- 2 files changed, 56 insertions(+), 7 deletions(-) diff --git a/src/Carousel.ts b/src/Carousel.ts index 3827f04..a7d0601 100644 --- a/src/Carousel.ts +++ b/src/Carousel.ts @@ -1,7 +1,9 @@ import ContainerWidget from "./ContainerWidget"; +import Group from "./Group"; +import { parseBoolAttribute } from "./helpers/nodeParser"; class Carousel extends ContainerWidget { - _autoPlay = false; + _autoPlay = true; get autoPlay(): boolean { return this._autoPlay; @@ -11,11 +13,15 @@ class Carousel extends ContainerWidget { this._autoPlay = value; } + get items(): Group[] { + return this._container.rows.flat().filter((g) => !g.invisible) as Group[]; + } + constructor(props?: any) { super(props); if (props) { - if (props.auto_play) { - this._autoPlay = props.auto_play; + if ("auto_play" in props) { + this._autoPlay = parseBoolAttribute(props.auto_play); } } } diff --git a/src/spec/Carousel.spec.ts b/src/spec/Carousel.spec.ts index 4b2effd..d0cb8b1 100644 --- a/src/spec/Carousel.spec.ts +++ b/src/spec/Carousel.spec.ts @@ -1,4 +1,5 @@ import WidgetFactory from "../WidgetFactory"; +import Form from "../Form"; import Carousel from "../Carousel"; import { it, expect, describe } from "vitest"; @@ -12,21 +13,63 @@ describe("A Carousel", () => { const widget = widgetFactory.createWidget("carousel", props); expect(widget).toBeInstanceOf(Carousel); }); - it("should have autoPlay as false by default", () => { + it("should have autoPlay as true by default", () => { const widgetFactory = new WidgetFactory(); const props = { name: "carousel", }; const widget = widgetFactory.createWidget("carousel", props); - expect(widget.autoPlay).toBe(false); + expect(widget.autoPlay).toBe(true); }); it("should allow autoPlay to be set", () => { const widgetFactory = new WidgetFactory(); const props = { name: "carousel", - auto_play: true, + auto_play: false, }; const widget = widgetFactory.createWidget("carousel", props); - expect(widget.autoPlay).toBe(true); + expect(widget.autoPlay).toBe(false); + }); + it("should have items with the first childs group items", () => { + const xml = ` +
+ + + + + + + + + + + +
+ `; + const fields = { + field1: { + string: "Field 1", + type: "char", + size: 10, + }, + field2: { + string: "Field 2", + type: "char", + size: 10, + }, + field3: { + string: "Field 3", + type: "char", + size: 10, + }, + }; + + const form = new Form(fields); + form.parse(xml); + const carousel = form.findById("carousel") as Carousel; + expect(carousel).toBeInstanceOf(Carousel); + expect(carousel.items.length).toBe(2); + expect(carousel.items[0].label).toBe("Group 1"); + expect(carousel.items[1].label).toBe("Group 2"); }); });