diff --git a/package.json b/package.json
index 95980b9..b67fdd6 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@livelike/custom-widgets",
- "version": "1.0.3",
+ "version": "1.0.4",
"main": "dist/livelike.umd.cjs",
"module": "dist/livelike.es.js",
"types": "dist/index.d.ts",
diff --git a/src/circular-text-predictor/circular-text-predictor.ts b/src/circular-text-predictor/circular-text-predictor.ts
index de2c9ed..8c917e5 100644
--- a/src/circular-text-predictor/circular-text-predictor.ts
+++ b/src/circular-text-predictor/circular-text-predictor.ts
@@ -52,7 +52,7 @@ export class CircularPredictor extends LitElement {
if (this.hasInteracted) {
this.isUserCorrect =
res[this.widgetPayload.kind][0].is_correct === true;
- this.interactedValue = Number(
+ this.interactedValue = parseInt(
this.widgetPayload.options.find(
(obj: any) => obj.id === res[this.widgetPayload.kind][0].option_id
)?.description
@@ -71,8 +71,8 @@ export class CircularPredictor extends LitElement {
}
setWidgetRange() {
- const option1 = Number(this.widgetPayload.options[0].description);
- const option2 = Number(this.widgetPayload.options[1].description);
+ const option1 = parseInt(this.widgetPayload.options[0].description);
+ const option2 = parseInt(this.widgetPayload.options[1].description);
const optionLength = this.widgetPayload.options.length;
const step = option2 - option1;
this.range = {
@@ -88,7 +88,7 @@ export class CircularPredictor extends LitElement {
handleSubmitButtonClicked = async () => {
const selectedOptionItem = this.widgetPayload.options.find(
- (obj: any) => Number(obj.description) === this.widgetValue
+ (obj: any) => parseInt(obj.description) === this.widgetValue
);
try {
//@ts-ignore
@@ -125,23 +125,18 @@ export class CircularPredictor extends LitElement {
}
renderFooterButton(label: string, disabled: boolean) {
- return html``;
+ return html``;
}
render() {
return html`
${this.widgetPayload?.question}
- o.description) ?? []}
.value=${this.hasInteracted ? this.interactedValue : 0}
- @change=${this.handleSliderChange}
- .disabled=${this.isFollowupPublished || this.hasInteracted || this.isExpired}
- .hasInteracted=${this.hasInteracted}
- >
+ @change=${this.handleSliderChange} .disabled=${this.isFollowupPublished || this.hasInteracted || this.isExpired}
+ .hasInteracted=${this.hasInteracted}>
`;
}
diff --git a/src/circular-text-predictor/components/circular-slider/circular-slider.ts b/src/circular-text-predictor/components/circular-slider/circular-slider.ts
index 78b6809..a27c79a 100644
--- a/src/circular-text-predictor/components/circular-slider/circular-slider.ts
+++ b/src/circular-text-predictor/components/circular-slider/circular-slider.ts
@@ -11,6 +11,7 @@ export class CircularSlider extends LitElement {
step: number;
} = { min: 0, max: 10, step: 1 };
@property({ type: Number }) value = 0;
+ @property({ type: Array }) labels: string[] = [];
@property() disabled: boolean = false;
@state() hasInteracted: boolean = false;
@@ -49,48 +50,20 @@ export class CircularSlider extends LitElement {
const [x, y] = this.angleToCoordinates(angle || 0);
return html`
-
@@ -180,6 +153,10 @@ export class CircularSlider extends LitElement {
if (!hasInteracted) {
return "-";
}
+ const index = Math.round((value - this.range.min) / this.range.step);
+ if (this.labels.length > 0 && index >= 0 && index < this.labels.length) {
+ return this.labels[index];
+ }
return value;
};
diff --git a/src/image-poll/image-poll.css b/src/image-poll/image-poll.css
index 9b5cf52..424ef2e 100644
--- a/src/image-poll/image-poll.css
+++ b/src/image-poll/image-poll.css
@@ -2,6 +2,7 @@ image-poll {
background: var(--white);
border-radius: 16px;
}
+
image-poll livelike-widget-root {
margin-bottom: 0;
}
@@ -40,6 +41,7 @@ image-poll livelike-select {
border: 0;
color: var(--black);
}
+
image-poll livelike-select[disabled] {
border: none;
}
@@ -62,6 +64,7 @@ image-poll livelike-option {
gap: 10px;
flex-direction: row;
}
+
image-poll livelike-option[selected] {
border-radius: 8px;
border: 2px solid var(--brand-blue);
@@ -77,10 +80,8 @@ image-poll livelike-option .livelike-voting-image-container {
row-gap: 2px;
flex-direction: row;
}
-image-poll
- livelike-option
- .livelike-voting-image-container
- livelike-description {
+
+image-poll livelike-option .livelike-voting-image-container livelike-description {
font-size: 14px;
color: var(--brand-title-color);
font-style: normal;
@@ -88,20 +89,13 @@ image-poll
line-height: normal;
padding: 0;
}
-image-poll
- livelike-option
- .livelike-voting-image-container
- livelike-description[selected],
-image-poll
- livelike-option
- .livelike-voting-image-container
- livelike-percentage[selected] {
+
+image-poll livelike-option .livelike-voting-image-container livelike-description[selected],
+image-poll livelike-option .livelike-voting-image-container livelike-percentage[selected] {
opacity: 1;
}
-image-poll
- livelike-option
- .livelike-voting-image-container
- livelike-percentage {
+
+image-poll livelike-option .livelike-voting-image-container livelike-percentage {
font-style: normal;
color: var(--black);
font-size: 16px;
@@ -109,14 +103,17 @@ image-poll
line-height: normal;
padding: 0;
}
+
image-poll livelike-option livelike-image img {
height: 50px;
width: 50px;
}
+
image-poll livelike-option[disabled] .livelike-voting-image-container {
align-items: center;
margin-bottom: 0;
}
+
image-poll livelike-option .livelike-voting-image-container {
color: var(--brand-game-center-text);
font-size: 14px;
@@ -168,6 +165,7 @@ image-poll livelike-footer .widget-button {
opacity: 0.5;
cursor: not-allowed;
}
+
image-poll livelike-footer .widget-button:disabled {
background: var(--brand-button-gradient);
color: var(--white);
@@ -201,7 +199,7 @@ image-poll livelike-footer .widget-button[notInteractedExpire] {
font-size: 20px;
font-style: normal;
font-weight: 700;
- line-height: 110%; /* 22px */
+ line-height: 110%;
text-transform: uppercase;
opacity: 1;
}
@@ -218,3 +216,7 @@ image-poll livelike-title {
width: 93%;
background: var(--white);
}
+
+image-poll .livelike-voting-image-container {
+ justify-content: space-between;
+}
\ No newline at end of file