diff --git a/README.md b/README.md index cf68e91..d38744a 100644 --- a/README.md +++ b/README.md @@ -7,7 +7,7 @@ TODO: - Addhit - Galerie (Kommentare fixen, Rest geht) - BuLi-Tipp (Paarungsergebnisse Ladescreen fehlt noch, evtl. IFrame entfernen?) -- Startseite (Events testen, type=fotos?) +- Startseite Event Markdown-HTML Support - Footer, Texte? - Navbar Hamburger Menu - Klönkasten ungelesen Punkt (localStorage) diff --git a/package.json b/package.json index 4c6d488..5347484 100644 --- a/package.json +++ b/package.json @@ -18,11 +18,13 @@ "embla-carousel-vue": "^8.6.0", "jarallax": "^2.2.1", "jquery": "^3.7.1", + "katex": "^0.16.27", "moment": "^2.30.1", "sloc": "^0.3.2", "striptags": "^3.2.0", "vue": "^3.5.13", "vue-async-computed": "^4.0.1", + "vue-renderer-markdown": "^0.0.62", "vue-router": "^4.5.0" }, "devDependencies": { diff --git a/src/components/startseite/Events.vue b/src/components/startseite/Events.vue index 6a5aa07..e7466c9 100644 --- a/src/components/startseite/Events.vue +++ b/src/components/startseite/Events.vue @@ -4,30 +4,32 @@ import striptags from "striptags"; import moment, { Moment } from "moment"; import Modal from "../Modal.vue"; import $ from "jquery"; +import MarkdownRender from 'vue-renderer-markdown' +import 'katex/dist/katex.min.css' export default { - data() { - let openedModals: number[] = []; - return { - openedModals, - modaltypes: ["text", "html"], - RitzenbergenLib: RitzenbergenLib.RitzenbergenLib, - }; - }, - computed: { - events() { - let result: any[]=[]; + data() { + let openedModals: number[] = []; + return { + openedModals, + modaltypes: ["text", "html"], + RitzenbergenLib: RitzenbergenLib.RitzenbergenLib, + }; + }, + computed: { + events() { + let result: any[] = []; - $.ajax(RitzenbergenLib.RitzenbergenLib.api("get_events.php"),{ - crossDomain: true, - async: false, - success: function (data:string) { - result = JSON.parse(data); - }, - }); - console.log(result); - return result; - /* + $.ajax(RitzenbergenLib.RitzenbergenLib.api("get_events.php"), { + crossDomain: true, + async: false, + success: function (data: string) { + result = JSON.parse(data); + }, + }); + console.log(result); + return result; + /* Beispiel-Event-Array: [ { @@ -38,6 +40,7 @@ export default { content: "

Test

", link: undefined, foto: "erntefest/2011/pic08.jpg", + minitext: "" }, { id: 1, @@ -47,6 +50,8 @@ export default { content: "

Testlink

", link: "#/test", foto: "erntefest/2011/pic08.jpg", + minitext: "" + }, }, { id: 2, @@ -56,6 +61,8 @@ export default { content: "

Testlink2

", link: "/", foto: "erntefest/2011/pic08.jpg", + minitext: "" + }, }, { id: 3, @@ -65,6 +72,8 @@ export default { content: "Fotos vom Erntefest 2011", link: "erntefest/2011", foto: "erntefest/2011/pic08.jpg", + minitext: "" + }, }, { id: 4, @@ -74,105 +83,133 @@ export default { content: "

Test2

", link: undefined, foto: "erntefest/2011/pic08.jpg", + minitext: "" + }, }, ];*/ - }, - }, - methods:{ - vorschautext(content:string) { - let stripped=striptags(content); - let vorschaulen=30; - if(stripped.length>vorschaulen){ - return stripped.substring(0,vorschaulen)+"..."; - }else{ - return stripped; - } - }, - format_date(date: string){ - let mymoment:Moment=moment(date); - - return mymoment.format("DD.MM.YYYY"); - } - }, - components: { - Modal, - }, + }, + }, + methods: { + vorschautext(content: string) { + let stripped = striptags(content); + let vorschaulen = 30; + if (stripped.length > vorschaulen) { + return stripped.substring(0, vorschaulen) + "..."; + } else { + return stripped; + } + }, + format_date(date: string) { + let mymoment: Moment = moment(date); + + return mymoment.format("DD.MM.YYYY"); + }, + galerie(content: string) { + this.$router.push({ path: "/bild/" + content }); + }, + }, + components: { + Modal, + MarkdownRender + }, };