@asd20/ui 3.2.811 → 3.2.813

package/package.json

@@ -5,7 +5,7 @@
     "*.scss",
     "*.vue"
   ],
-  "version": "3.2.811",
+  "version": "3.2.813",
   "private": false,
   "license": "MIT",
   "repository": {

package/src/components/organisms/Asd20AppHeader/index.vue

@@ -25,7 +25,7 @@
       </div>
       <asd20-district-logo link="https://www.asd20.org" />
     </h1>
-    <span class="version" v-if="version && !zoomed" v-html="version"></span>
+    <!-- <span class="version" v-if="version && !zoomed" v-html="version"></span> -->
     <slot />
   </header>
 </template>

package/src/components/organisms/Asd20EventModal/index.vue

@@ -2,9 +2,7 @@
   <asd20-modal
     v-if="event"
     :open="open"
-    :title="
-      `${event.calendarOrganizationTitle || event.calendarLocation} Event`
-    "
+    :title="`${event.calendarOrganizationTitle || event.calendarLocation} Event`"
     icon="calendar-alt"
     dismissable
     class="asd20-event-modal"
@@ -19,11 +17,11 @@
           <div class="bottom">{{ event.month }}</div>
           <small>{{ event.year }}</small>
         </div>
-        <h2 class="name">{{ event.summary }}</h2>
+        <h2 class="name">{{ sanitizedSummary }}</h2>
       </header>
       <Asd20List class="description">
         <Asd20ListItem
-          v-if="time"
+          v-if="time !== null"
           icon="hours-alt"
           icon-size="lg"
           label="Time"
@@ -37,9 +35,9 @@
           :description="event.location"
         />
         <Asd20ListItem
-          v-if="event.description"
+          v-if="sanitizedDescription"
           label="Description"
-          :description="event.description"
+          :description="sanitizedDescription"
         />
       </Asd20List>
       <div class="tags">
@@ -55,18 +53,12 @@
 </template>
 
 <script>
-// import parse from 'date-fns/parse'
-// import Vue from 'vue'
-
-import { truncate } from 'lodash-es'
 import { format, parse } from 'date-fns'
 import Asd20Modal from '../../molecules/Asd20Modal'
 import Asd20Tag from '../../atoms/Asd20Tag'
 import Asd20List from '../../organisms/Asd20List'
 import Asd20ListItem from '../../molecules/Asd20ListItem'
 import Asd20Viewport from '../../atoms/Asd20Viewport'
-// import VScrollLock from 'v-scroll-lock'
-// Vue.use(VScrollLock)
 
 export default {
   name: 'Asd20EventModal',
@@ -76,34 +68,81 @@ export default {
     open: { type: Boolean, default: false },
   },
   computed: {
+    sanitizedSummary() {
+      return this.sanitizeSummary(this.event.summary)
+    },
+    sanitizedDescription() {
+      return this.sanitizeDescription(this.event.description)
+    },
     title() {
-      return truncate(this.event.summary, { length: 75 })
+      return truncate(this.sanitizedSummary, { length: 75 })
     },
-
     time() {
-      if (!this.event) return
+      if (!this.event) return null
 
-      if (this.event.allDay) return 'All Day'
+      const startTime = parse(
+        this.event.start,
+        "yyyy-MM-dd'T'HH:mm:ssX",
+        new Date()
+      )
+      const endTime = parse(
+        this.event.end,
+        "yyyy-MM-dd'T'HH:mm:ssX",
+        new Date()
+      )
 
-      if (this.event.multiDay) {
-        return `${format(
-          parse(this.event.originalStart),
-          '<b>h:mm aa</b>, dddd, MMMM DD, YYYY'
-        )}<br>ending ${format(
-          parse(this.event.end),
-          '<b>h:mm aa</b>, dddd, MMMM DD, YYYY'
-        )}`
+      const startHour = startTime.getHours()
+      // Display 'TBD' if start time is the same as end time and falls between 11 PM and 3 AM
+      if (
+        startTime.getTime() === endTime.getTime() &&
+        (startHour >= 23 || startHour < 3)
+      ) {
+        return 'TBD'
       }
 
-      let time = `${format(parse(this.event.start), '<b>h:mm aa</b>')}`
-      if (this.event.endTimeUndetermined) {
-        time += `${format(parse(this.event.end))}`
+      let time = `${format(startTime, '<b>h:mm aa</b>').replace(/:00/g, '')}`
+
+      // Check if end time is the same as start time
+      if (startTime.getTime() === endTime.getTime()) {
+        time += '' // No end time needed if they are the same
+      } else if (this.event.endTimeUndetermined) {
+        time += `${format(endTime).replace(/:00/g, '')}`
       } else {
-        time += ` - ${format(parse(this.event.end), '<b>h:mm aa</b>')}`
+        time += ` - ${format(endTime, '<b>h:mm aa</b>')
+          .replace(/#/g, '&nbsp;')
+          .replace(/:00/g, '')}`
       }
+
       return time
     },
   },
+  methods: {
+    // specifically for rSchool events that have extraneous school names in the summary
+    sanitizeSummary(summary) {
+      if (!summary) return summary
+      const pattern = /vs\.[^>]*>Multiple Schools/
+      return summary.replace(pattern, 'vs. Multiple Schools')
+    },
+    // Function to sanitize the description
+    sanitizeDescription(description) {
+      if (!description) return description
+
+      // Remove text between the ">" backwards to the first "." or ":" and replace '>Multiple Schools' with '.'
+      description = description.replace(/([.:][^>]*?)>([^>]*Multiple Schools)/, '$1.')
+
+      // Separate capital letters preceded by lowercase letters with ', '
+      description = description.replace(/([a-z])([A-Z])/g, '$1, $2')
+
+      // Remove unmatched quotes between "." or ":" and ">"
+      const quotePattern = /[.:][^>]*['"][^'"]*$|[^'"]*['"][^>]*['"]>Multiple Schools/g
+      description = description.replace(quotePattern, match => {
+        const quotes = match.match(/['"]/g) || []
+        return quotes.length % 2 !== 0 ? match.replace(/['"]/g, '') : match
+      })
+
+      return description
+    },
+  },
 }
 </script>
 

package/src/data/events/district-events.json

@@ -80,8 +80,8 @@
       "id": null,
       "uid": "MDQwMDAwMDA4MjAwRTAwMDc0QzVCNzEwMUE4MkUwMDgwMDAwMDAwMEVGRDJDOEZCQ0RFN0Q4MDEwMDAwMDAwMDAwMDAwMDAwMTAwMDAwMDBDMUEwRTM5NTYwQTRGMjQzOEQyN0MzRjAxQzdGRkQ4QQ==",
       "type": "event",
-      "summary": "Parent Council - College Info Meeting",
-      "description": "Admissions officers from several local and regional colleges/universities will be in attendance sharing information about their schools.",
+      "summary": "Boys Varsity  vs. CoronadoDohertyLibertyMullenPalmer RidgePine CreekPueblo WestRampartRock CanyonThunderRidge'>Multiple Schools (Home)",
+      "description": "Type: Kadet Kickoff Tournament Opponent: CoronadoDohertyLibertyMullenPalmer RidgePine CreekPueblo WestRampartRock CanyonThunderRidge'>Multiple Schools Comments: Confirmed",
       "location": "AAHS Media Center",
       "start": "2023-01-19T08:20:00Z",
       "end": "2023-01-19T08:20:00Z",

package/src/helpers/mapEventToCard.js

@@ -1,60 +1,34 @@
-// import format from 'date-fns/format'
-// import parse from 'date-fns/parse'
-
-// const formattedTime = event => {
-//   if (!event) return
-
-//   if (event.allDay) return 'All Day'
-
-//   if (event.multiDay) {
-//     return `${format(
-//       parse(event.originalStart),
-//       '<b>h:mm aa</b>, dddd, MMMM DD, YYYY'
-//     )
-//       .replace(/#/g, '&nbsp;')
-//       .replace(/:00/g, '')}<br>ending ${format(
-//       parse(event.end),
-//       '<b>h:mm aa</b>, dddd, MMMM DD, YYYY'
-//     )
-//       .replace(/#/g, '&nbsp;')
-//       .replace(/:00/g, '')}`
-//   }
-
-//   let time = `${format(parse(event.start), '<b>h:mm aa</b>').replace(
-//     /:00/g,
-//     ''
-//   )}`
-//   if (event.endTimeUndetermined) {
-//     time += `${format(parse(event.end)).replace(/:00/g, '')}`
-//   } else {
-//     time += ` - ${format(parse(event.end), '<b>h:mm aa</b>')
-//       .replace(/#/g, '&nbsp;')
-//       .replace(/:00/g, '')}`
-//   }
-//   return time
-// }
-
-// export default function mapEventToCard(event) {
-//   return {
-//     title: event.summary,
-//     // subtitle: 'Some subtitle goes here',
-//     description: event.description,
-//     categories: event.calendarCategories.concat([event.calendarName]),
-//     date: format(event.start),
-//     time: formattedTime(event),
-//     weekday: event.weekday,
-//     day: event.day,
-//     month: event.month,
-//     year: event.year,
-//     emphasizedDate: true,
-//     location: event.location || event.calendarLocation,
-//     isFeatured: event.isFeatured || event.isDistrictFeatured,
-//   }
-// }
-
 import format from 'date-fns/format'
 import parse from 'date-fns/parse'
 
+// Function to sanitize the summary
+const sanitizeSummary = summary => {
+  if (!summary) return summary
+
+  const pattern = /vs\.[^>]*>Multiple Schools/
+  return summary.replace(pattern, 'vs. Multiple Schools')
+}
+
+// Function to sanitize the description
+const sanitizeDescription = description => {
+  if (!description) return description
+
+  // Remove text between the ">" backwards to the first "." or ":"
+  description = description.replace(/([.:][^>]*?)>([^>]*Multiple Schools)/, '$1>$2')
+
+  // Separate capital letters preceded by lowercase letters with ', '
+  description = description.replace(/([a-z])([A-Z])/g, '$1, $2')
+
+  // Remove unmatched quotes between "." or ":" and ">"
+  const quotePattern = /[.:][^>]*['"][^'"]*$|[^'"]*['"][^>]*['"]>Multiple Schools/g
+  description = description.replace(quotePattern, match => {
+    const quotes = match.match(/['"]/g) || []
+    return quotes.length % 2 !== 0 ? match.replace(/['"]/g, '') : match
+  })
+
+  return description
+}
+
 const formattedTime = event => {
   if (!event) return
 
@@ -76,17 +50,16 @@ const formattedTime = event => {
 
   const startTime = parse(event.start, "yyyy-MM-dd'T'HH:mm:ssX", new Date())
   const endTime = parse(event.end, "yyyy-MM-dd'T'HH:mm:ssX", new Date())
-  // if start and end time are the same AND the start time is between 11pm and 3am, then set the start time as TBD and do not include an end time
   const startHour = startTime.getHours()
+
   if (startTime.getTime() === endTime.getTime() && (startHour >= 23 || startHour < 3)) {
     return 'TBD'
   }
 
   let time = `${format(startTime, '<b>h:mm aa</b>').replace(/:00/g, '')}`
 
-  // Check if end time is the same as start time
   if (startTime.getTime() === endTime.getTime()) {
-    time += '' // No end time needed if they are the same
+    time += ''
   } else if (event.endTimeUndetermined) {
     time += `${format(endTime).replace(/:00/g, '')}`
   } else {
@@ -99,10 +72,12 @@ const formattedTime = event => {
 }
 
 export default function mapEventToCard(event) {
+  const sanitizedSummary = sanitizeSummary(event.summary)
+  const sanitizedDescription = sanitizeDescription(event.description)
+
   return {
-    title: event.summary,
-    // subtitle: 'Some subtitle goes here',
-    description: event.description,
+    title: sanitizedSummary,
+    description: sanitizedDescription,
     categories: event.calendarCategories.concat([event.calendarName]),
     date: format(parse(event.start, "yyyy-MM-dd'T'HH:mm:ssX", new Date())),
     time: formattedTime(event),
@@ -115,4 +90,3 @@ export default function mapEventToCard(event) {
     isFeatured: event.isFeatured || event.isDistrictFeatured,
   }
 }
-