Fixed multiple Issues (#785)

* Actually trigger a download on media download * PlaylistAddToCourseDialog rename Element * Fix MessageBox closable * Make the 'mark for deletion' action more clearly * Limit input length in PlaylistAddDialog * Improve subtitleDialog * Rephrase Server delete dialog * Make sure the server id is a Number in globalOptions * fix typo * Remove server selection from caption dialog
elan-ev · Sep 11, 2023 · 4ba6620 · 4ba6620
1 parent 7a5ece2
commit 4ba6620
Show file tree

Hide file tree

Showing 10 changed files with 114 additions and 80 deletions.
diff --git a/lib/Providers/OpencastConstants.php b/lib/Providers/OpencastConstants.php
@@ -44,7 +44,8 @@ public function register(\Pimple\Container $container)
  'OPENCAST_RESOURCE_PROPERTY_ID',
  'OPENCAST_SUPPORT_EMAIL',
  'OPENCAST_API_TOKEN',
- 'OPENCAST_DEFAULT_SERVER'
+ 'OPENCAST_DEFAULT_SERVER',
+ 'OPENCAST_CLEAR_RECYCLE_BIN_INTERVAL'
  ]
  ];
  }

diff --git a/vueapp/components/Config/EditServer.vue b/vueapp/components/Config/EditServer.vue
@@ -192,7 +192,7 @@ export default {
  },
 
  deleteConfig() {
- if (confirm(this.$gettext('Sind sie, dass sie diese Serverkonfiguration löschen möchten? Es werden auch alle Videos aus Stud.IP rausgelöscht, die zu diesem Server gehören!'))) {
+ if (confirm(this.$gettext('Sind Sie sicher, dass Sie die Serverkonfiguration löschen möchten? Die damit verbundenen Videos werden danach nicht mehr in Stud.IP zur Verfügung stehen!'))) {
  if (this.id == 'new') {
  this.currentConfig = {}
  } else {

diff --git a/vueapp/components/Config/GlobalOptions.vue b/vueapp/components/Config/GlobalOptions.vue
@@ -107,7 +107,7 @@ export default {
 
  this.config_list.server.forEach(server => {
  options.push({
- value: server.id,
+ value: Number(server.id),
  description: '[#' + server.id + '] ' + server.service_url + ''
  })
  });

diff --git a/vueapp/components/MessageBox.vue b/vueapp/components/MessageBox.vue
@@ -2,7 +2,7 @@
  <div class="messagebox"
  :class="`messagebox_` + type">
  <div class="messagebox_buttons">
- <a class="close" title="Nachrichtenbox schliessen" @click.stop="hide">
+ <a class="close" href="#" title="Nachrichtenbox schliessen">
  <span>Nachrichtenbox schliessen</span>
  </a>
  </div>

diff --git a/vueapp/components/Playlists/PlaylistAddCard.vue b/vueapp/components/Playlists/PlaylistAddCard.vue
@@ -16,6 +16,7 @@
  <label>
  <span class="required">Titel</span>
  <input type="text"
+ maxlength="255"
  :placeholder="$gettext('Titel der Wiedergabeliste')"
  v-model="playlist.title"
  >

diff --git a/vueapp/components/Playlists/PlaylistAddToCourseDialog.vue b/vueapp/components/Playlists/PlaylistAddToCourseDialog.vue
@@ -15,7 +15,7 @@
  <thead>
  <tr>
  <th>
- {{ $gettext('Veranstaltung') }}
+ {{ $gettext('Verknüpfte Veranstaltungen') }}
  </th>
  <th></th>
  </tr>

diff --git a/vueapp/components/Videos/Actions/CaptionUpload.vue b/vueapp/components/Videos/Actions/CaptionUpload.vue
@@ -14,72 +14,66 @@
  >
  <template v-slot:dialogContent ref="upload-dialog">
  <form class="default" style="max-width: 50em;" ref="upload-form">
- <label v-if="config && config['server'] && config['server'].length > 1">
- <span class="required">
- {{ $gettext('Server auswählen:') }}
- </span>
-
- <select v-model="selectedServer" required>
- <option v-for="server in config['server']"
- :key="server.id"
- :value="server"
- >
- #{{ server.id }} - {{ server.name }} (Opencast V {{ server.version }}.X)
- </option>
-
- </select>
- </label>
-
- <div v-for="language in languages">
- <div v-if="!uploadProgress">
- <h4 class="oc--file-type">
- {{
- $gettext('Untertitel für %{ lang }', {
- lang: language.lang
- })
- }}
- </h4>
-
- <div class="oc--file-preview" v-if="files[language.flavor] && files[language.flavor].size">
- <span class="oc--file-name">
- <b>{{ $gettext('Name:') }}</b> {{ files[language.flavor].name }}
- </span>
-
- <span class="oc--file-size" v-if="files[language.flavor].size">
- <b>{{ $gettext('Größe:') }}</b> {{files[language.flavor].size }}
- </span>
- </div>
-
- <div class="oc--button-bar">
- <label v-if="files[language.flavor] && files[language.flavor].url">
- <a :href="files[language.flavor].url">
- <button class='button download' type=button>
- {{ $gettext('Herunterladen') }}
- </button>
- </a>
- </label>
-
- <label v-if="files[language.flavor]">
- <StudipButton icon="trash" @click.prevent="removeCaption(language.flavor)">
- {{ $gettext('Löschen') }}
- </StudipButton>
- </label>
-
- <label class="oc--file-upload">
- <StudipButton icon="accept" @click.prevent="chooseFiles('oc-file-' + language.lang)">
- {{ $gettext('Untertiteldatei auswählen') }}
- </StudipButton>
- <input
- type="file" class="caption_upload" :data-flavor="language.flavor"
- @change="previewFiles" :ref="'oc-file-' + language.lang"
- accept=".vtt"
- >
- </label>
- </div>
+ <fieldset>
+ <legend >
+ {{ $gettext('Datei(en)') }}
+ </legend>
+
+ <p class="help" v-translate>
+ Unterstützt wird das WebVTT Format mit der Endung .vtt
+ </p>
+
+ <div v-for="language in languages">
+ <fieldset v-if="!uploadProgress">
+ <legend class="oc--file-type">
+ {{
+ $gettext('Untertitel für %{ lang }', {
+ lang: language.lang
+ })
+ }}
+ </legend>
+
+ <div class="oc--file-preview" v-if="files[language.flavor] && files[language.flavor].size">
+ <span class="oc--file-name">
+ <b>{{ $gettext('Name:') }}</b> {{ files[language.flavor].name }}
+ </span>
+
+ <span class="oc--file-size" v-if="files[language.flavor].size">
+ <b>{{ $gettext('Größe:') }}</b> {{files[language.flavor].size }}
+ </span>
+ </div>
+
+ <div class="oc--button-bar">
+ <label v-if="files[language.flavor] && files[language.flavor].url">
+ <a :href="files[language.flavor].url">
+ <button class='button download' type=button>
+ {{ $gettext('Herunterladen') }}
+ </button>
+ </a>
+ </label>
+
+ <label v-if="files[language.flavor]">
+ <StudipButton icon="trash" @click.prevent="removeCaption(language.flavor)">
+ {{ $gettext('Löschen') }}
+ </StudipButton>
+ </label>
+
+ <label class="oc--file-upload">
+ <StudipButton icon="accept" @click.prevent="chooseFiles('oc-file-' + language.lang)">
+ {{ $gettext('Untertiteldatei auswählen') }}
+ </StudipButton>
+ <input
+ type="file" class="caption_upload" :data-flavor="language.flavor"
+ @change="previewFiles" :ref="'oc-file-' + language.lang"
+ accept=".vtt"
+ >
+ </label>
+ </div>
+ </fieldset>
+
+ <ProgressBar v-if="uploadProgress && uploadProgress.flavor == language.flavor" :progress="uploadProgress.progress" />
  </div>
-
- <ProgressBar v-if="uploadProgress && uploadProgress.flavor == language.flavor" :progress="uploadProgress.progress" />
- </div>
+ </fieldset>
 
  <Error :float="true" />
 
@@ -239,6 +233,10 @@ export default {
  }
  },
  uploadDone: () => {
+ this.$store.dispatch('addMessage', {
+ type: 'success',
+ text: this.$gettext('Die Datei wurde erfolgreich hochgeladen.')
+ });
  view.$emit('done');
  }
  }

diff --git a/vueapp/components/Videos/Actions/VideoDelete.vue b/vueapp/components/Videos/Actions/VideoDelete.vue
@@ -1,23 +1,29 @@
 <template>
  <div>
  <StudipDialog
- :title="$gettext('Aufzeichnung entfernen')"
+ :title="$gettext('Aufzeichnung zum Löschen markieren')"
  :confirmText="$gettext('Akzeptieren')"
  :confirmClass="'accept'"
  :closeText="$gettext('Abbrechen')"
  :closeClass="'cancel'"
- height="175"
+ height="275"
  @close="decline"
  @confirm="removeVideo"
  >
  <template v-slot:dialogContent>
- <translate>Möchten Sie die Aufzeichnung wirklich entfernen?</translate>
+ <translate>
+ Möchten Sie die Aufzeichnung wirklich zum Löschen markieren?<br/><br/>
+ Die Aufzeichnung wird damit in den "Gelöschte Videos" Bereich Ihres Arbeitsplatzes verschoben und wird nach {{simple_config_list.settings.OPENCAST_CLEAR_RECYCLE_BIN_INTERVAL}} Tagen automatisch gelöscht. 
+ Bis zu diesem Zeitpunkt können Sie die Aufzeichnung wiederherstellen.
+ </translate>
  </template>
  </StudipDialog>
  </div>
 </template>
 
 <script>
+import { mapGetters } from "vuex";
+
 import StudipDialog from '@studip/StudipDialog'
 
 export default {
@@ -31,6 +37,12 @@ export default {
 
  emits: ['done', 'cancel'],
 
+ computed: {
+ ...mapGetters([
+ 'simple_config_list'
+ ]),
+ },
+
  methods: {
  async removeVideo() {
  await this.$store.dispatch('deleteVideo', this.event.token)

diff --git a/vueapp/components/Videos/Actions/VideoDownload.vue b/vueapp/components/Videos/Actions/VideoDownload.vue
@@ -12,9 +12,8 @@
  <h2>
  ReferentIn
  </h2>
- <a v-for="(media, index) in presenters" :key="index"
- :href="media['url']" target="_blank">
- <StudipButton>
+ <a v-for="(media, index) in presenters" :key="index">
+ <StudipButton @click.prevent="downloadFile(media)">
  {{ getMediaText(media) }}
  </StudipButton>
  </a>
@@ -23,9 +22,8 @@
  <h2>
  Bildschirm
  </h2>
- <a v-for="(media, index) in presentations" :key="index"
- :href="media['url']" target="_blank">
- <StudipButton>
+ <a v-for="(media, index) in presentations" :key="index">
+ <StudipButton @click.prevent="downloadFile(media)">
  {{ getMediaText(media) }}
  </StudipButton>
  </a>
@@ -39,6 +37,8 @@
 import StudipDialog from '@studip/StudipDialog'
 import StudipButton from '@studip/StudipButton'
 
+import axios from "@/common/axios.service";
+
 export default {
  name: 'VideoDownload',
 
@@ -57,6 +57,28 @@ export default {
  },
 
  methods: {
+ async downloadFile(media) {
+ axios.get(media.url, {
+ crossDomain: true,
+ withCredentials: true,
+ responseType: 'blob'
+ }).then(response => {
+ const blob = new Blob([response.data]);
+ const link = document.createElement('a');
+ link.href = URL.createObjectURL(blob);
+ link.download = this.getFileName(media);
+ link.click();
+ URL.revokeObjectURL(link.href);
+ }).catch(console.error);
+ },
+
+ getFileName(media) {
+ let res = media.info;
+ res = res.replace(' * ', ' x ').replace(/\s+/g, '');
+ let ext = media.url.split(".").pop();
+ return this.event.title + ' (' + res + ').' + ext;
+ },
+
  getMediaText(media) {
  var text = media?.info || '';
  text = text.replace(' * ', ' x ');

diff --git a/vueapp/components/Videos/VideoCard.vue b/vueapp/components/Videos/VideoCard.vue
@@ -328,7 +328,7 @@ export default {
 
  menuItems.push({
  id: 8,
- label: this.$gettext('Entfernen'),
+ label: this.$gettext('Zum Löschen markieren'),
  icon: 'trash',
  emit: 'performAction',
  emitArguments: 'VideoDelete'