@@ -30,7 +31,8 @@ import DOMPurify from 'dompurify';
import { DateTime, NewsItemType } from "../../../types";
import type { PropType } from 'vue'
import { defineProps, ref } from "vue";
-import {ISOToDatetime} from "../../../chill/js/date";
+import {ISOToDatetime} from 'ChillMainAssets/chill/js/date';
+
const props = defineProps({
item: {
@@ -40,7 +42,12 @@ const props = defineProps({
maxLength: {
type: Number,
required: false,
- default: 200,
+ default: 350,
+ },
+ maxLines: {
+ type: Number,
+ required: false,
+ default: 3
}
})
@@ -58,53 +65,68 @@ const closeModal = () => {
};
const shouldTruncate = (content: string): boolean => {
- return content.length > props.maxLength;
+ const lines = content.split('\n');
+
+ // Check if any line exceeds the maximum length
+ const tooManyLines = lines.length > props.maxLines;
+
+ return content.length > props.maxLength || tooManyLines;
};
const truncateContent = (content: string): string => {
- if (shouldTruncate(content)) {
- let truncatedContent = content.slice(0, props.maxLength);
- let linkDepth = 0;
- let linkStartIndex = -1;
+ console.log('max length', props.maxLength)
+ console.log('content', content)
+ let truncatedContent = content.slice(0, props.maxLength);
+ console.log('truncated content', truncatedContent)
+ let linkDepth = 0;
+ let linkStartIndex = -1;
+ const lines = content.split('\n');
- for (let i = 0; i < truncatedContent.length; i++) {
- const char = truncatedContent[i];
-
- if (char === '[') {
- linkDepth++;
- if (linkDepth === 1) {
- linkStartIndex = i;
- }
- } else if (char === ']') {
- linkDepth = Math.max(0, linkDepth - 1);
- } else if (char === '(' && linkDepth === 0) {
- truncatedContent = truncatedContent.slice(0, i);
- break;
- }
- }
-
- while (linkDepth > 0) {
- truncatedContent += ']';
- linkDepth--;
- }
-
- // If a link was found, append the URL inside the parentheses
- if (linkStartIndex !== -1) {
- const linkEndIndex = content.indexOf(')', linkStartIndex);
- const url = content.slice(linkStartIndex + 1, linkEndIndex);
- truncatedContent = truncatedContent.slice(0, linkStartIndex) + `(${url})`;
- }
-
- truncatedContent += '...';
-
- return truncatedContent;
- } else {
- return content;
+ // Truncate if amount of lines are too many
+ if (lines.length > props.maxLines && content.length < props.maxLength) {
+ console.log('how many lines', lines.length)
+ const truncatedContent = lines.slice(0, props.maxLines).join('\n').trim();
+ return truncatedContent + '...';
}
+
+ for (let i = 0; i < truncatedContent.length; i++) {
+ const char = truncatedContent[i];
+
+ if (char === '[') {
+ linkDepth++;
+ if (linkDepth === 1) {
+ linkStartIndex = i;
+ }
+ } else if (char === ']') {
+ linkDepth = Math.max(0, linkDepth - 1);
+ } else if (char === '(' && linkDepth === 0) {
+ truncatedContent = truncatedContent.slice(0, i);
+ break;
+ }
+ }
+
+ while (linkDepth > 0) {
+ truncatedContent += ']';
+ linkDepth--;
+ }
+
+ // If a link was found, append the URL inside the parentheses
+ if (linkStartIndex !== -1) {
+ const linkEndIndex = content.indexOf(')', linkStartIndex);
+ const url = content.slice(linkStartIndex + 1, linkEndIndex);
+ truncatedContent = truncatedContent.slice(0, linkStartIndex) + `(${url})`;
+ }
+
+ console.log('truncated content later on', truncatedContent)
+
+ truncatedContent += '...';
+
+ return truncatedContent;
};
const convertMarkdownToHtml = (markdown: string): string => {
const rawHtml = marked(markdown);
+ // console.log(rawHtml)
return DOMPurify.sanitize(rawHtml)
};
@@ -116,6 +138,7 @@ const prepareContent = (content: string): string => {
const newsItemStartDate = (): null|Date => {
return ISOToDatetime(props.item?.startDate.datetime);
}
+
diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/MyCustoms.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/MyCustoms.vue
index 5f6439123..0e215f556 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/MyCustoms.vue
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/MyCustoms.vue
@@ -39,10 +39,12 @@
-