Feat/mac (#109)

* chore: upgrade dependencies * feat/mac: draft pipeline * feat/mac: use public folder for transient files * feat/mac: set app fullscreen * feat/mac: cmd + , toggles menu * feat/mac: update readme * refact: easier login process * refact prevent style issues with safari * refact reduce css download * style: cleanup paginator design * style: studio clock is responsive * style: fix spacing style issues with safari
2026-08-10 18:03:47 +00:00 · 2022-04-17 20:30:39 +02:00
parent 20d3ddbc18
commit db0eee3b9c
140 changed files with 10160 additions and 2139 deletions
@@ -0,0 +1,88 @@
+import React from 'react';
+import { VStack } from '@chakra-ui/react';
+import { FiMoreVertical } from '@react-icons/all-files/fi/FiMoreVertical';
+import EventTimesVertical from '../../../common/components/eventTimes/EventTimesVertical';
+import EditableText from '../../../common/input/EditableText';
+import PublicIconBtn from '../../../common/components/buttons/PublicIconBtn';
+import ActionButtons from '../list/ActionButtons';
+import DeleteIconBtn from '../../../common/components/buttons/DeleteIconBtn';
+import PropTypes from 'prop-types';
+import style from './EventBlock.module.scss';
+
+export default function ExpandedBlock(props) {
+  const { provided, data, eventIndex, next, delay, delayValue, previousEnd, actionHandler } = props;
+
+  const oscid = data?.id || '...';
+
+  return (
+    <>
+      <span className={style.drag} {...provided.dragHandleProps}>
+        <FiMoreVertical />
+      </span>
+
+      <div className={style.indicators}>
+        <span className={next ? style.next : style.nextDisabled}>Next</span>
+        {delayValue != null && <span className={style.delayValue}>{delayValue}</span>}
+      </div>
+      <div className={style.timeExpanded}>
+        <EventTimesVertical
+          actionHandler={actionHandler}
+          timeStart={data.timeStart}
+          timeEnd={data.timeEnd}
+          duration={data.duration}
+          delay={delay}
+          previousEnd={previousEnd}
+          className={style.time}
+        />
+      </div>
+
+      <div className={style.titleContainer}>
+        <EditableText
+          label='Title'
+          defaultValue={data.title}
+          placeholder='Add Title'
+          submitHandler={(v) => actionHandler('update', { field: 'title', value: v })}
+        />
+        <EditableText
+          label='Presenter'
+          defaultValue={data.presenter}
+          placeholder='Add Presenter name'
+          submitHandler={(v) => actionHandler('update', { field: 'presenter', value: v })}
+        />
+        <EditableText
+          label='Subtitle'
+          defaultValue={data.subtitle}
+          placeholder='Add Subtitle'
+          submitHandler={(v) => actionHandler('update', { field: 'subtitle', value: v })}
+        />
+        <EditableText
+          label='Note'
+          defaultValue={data.note}
+          placeholder='Add Note'
+          style={{ color: '#d69e2e' }}
+          maxchar={160}
+          submitHandler={(v) => actionHandler('update', { field: 'note', value: v })}
+        />
+        <span className={style.oscLabel}>
+          {`/ontime/goto ${eventIndex + 1}  << OSC >> /ontime/gotoid ${oscid}`}
+        </span>
+      </div>
+      <VStack spacing='0.5em' className={style.actionOverlay}>
+        <PublicIconBtn actionHandler={actionHandler} active={data.isPublic} />
+        <ActionButtons showAdd showDelay showBlock actionHandler={actionHandler} />
+        <DeleteIconBtn actionHandler={actionHandler} />
+      </VStack>
+    </>
+  );
+};
+
+ExpandedBlock.propTypes = {
+  provided: PropTypes.any.isRequired,
+  data: PropTypes.object.isRequired,
+  eventIndex: PropTypes.number.isRequired,
+  next: PropTypes.bool.isRequired,
+  delay: PropTypes.number,
+  delayValue: PropTypes.string,
+  previousEnd: PropTypes.number,
+  actionHandler: PropTypes.func.isRequired,
+};