diff --git a/resources/assets/stylesheets/scss/courseware.scss b/resources/assets/stylesheets/scss/courseware.scss
index eb3a9eaca46ad63ed85d4dd65460dd2583bb935a..ad7337257637e795b101c867d5674f2a13448711 100644
--- a/resources/assets/stylesheets/scss/courseware.scss
+++ b/resources/assets/stylesheets/scss/courseware.scss
@@ -2987,25 +2987,6 @@ b e f o r e a f t e r b l o c k
b e f o r e a f t e r b l o c k e n d
* * * * * * * * * * * * * * * * * * * */
-/* * * * * * * * * *
-c h a r t b l o c k
-* * * * * * * * * */
-
-.cw-block-chart {
- .cw-block-chart-item-remove {
- float: right;
- margin-right: 5px;
- cursor: pointer;
- img {
- vertical-align: text-top;
- }
- }
-}
-
-/* * * * * * * * * * * * * *
-c h a r t b l o c k e n d
-* * * * * * * * * * * * * */
-
/* * * * * * * * *
c o d e b l o c k
* * * * * * * * */
@@ -3240,119 +3221,119 @@ c a n v a s b l o c k
}
.cw-canvasblock-toolbar {
- border: solid thin $content-color-40;
+ border: solid thin var(--content-color-40);
border-bottom: none;
- }
- .cw-canvasblock-buttonset {
- display: inline-block;
- padding: 5px;
- margin-right: 0.5em;
- }
-
- .cw-canvasblock-tool-selected-text {
- cursor: text;
- }
-
- button {
- cursor: pointer;
- user-select: none;
- border: solid thin $content-color-40;
- height: 32px;
- width: 32px;
- background-color: white;
- background-position: center;
- background-repeat: no-repeat;
- background-size: 24px 24px;
-
- &.cw-canvasblock-color {
- $colors: (
- white: #ffffff,
- blue: #3498db,
- green: #2ecc71,
- purple: #9b59b6,
- red: #e74c3c,
- yellow: #fed330,
- orange: #f39c12,
- grey: #95a5a6,
- darkgrey: #34495e,
- black: #000000,
- );
-
- @each $name, $color in $colors {
- &.#{"" + $name} {
- background-color: $color;
+ .cw-canvasblock-buttonset {
+ display: inline-block;
+ padding: 5px;
+ margin-right: 0.5em;
+
+ button {
+ cursor: pointer;
+ user-select: none;
+ border: solid thin var(--content-color-40);
+ height: 32px;
+ width: 32px;
+ background-color: var(--white);
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: 24px 24px;
+
+ &.cw-canvasblock-color {
+ $colors: (
+ white: #ffffff,
+ blue: #3498db,
+ green: #2ecc71,
+ purple: #9b59b6,
+ red: #e74c3c,
+ yellow: #fed330,
+ orange: #f39c12,
+ grey: #95a5a6,
+ darkgrey: #34495e,
+ black: #000000,
+ );
+
+ @each $name, $color in $colors {
+ &.#{"" + $name} {
+ background-color: $color;
+ }
+ }
+
+ &.selected-color {
+ border: solid 2px var(--black);
+ }
+ }
+
+ &.cw-canvasblock-reset {
+ @include background-icon(refresh, clickable, 24);
+ }
+
+ &.cw-canvasblock-size {
+ @include background-icon(stop, clickable);
+
+ &.cw-canvasblock-size-small {
+ background-size: 8px 7px;
+ }
+ &.cw-canvasblock-size-normal {
+ background-size: 16px 14px;
+ }
+ &.cw-canvasblock-size-large {
+ background-size: 22px 20px;
+ }
+ &.cw-canvasblock-size-huge {
+ background-size: 26px 24px;
+ }
+ &.selected-size {
+ border: solid 2px var(--black);
+ }
+ }
+
+ &.cw-canvasblock-tool {
+ &.cw-canvasblock-tool-pen {
+ @include background-icon(comment, clickable);
+ }
+
+ &.cw-canvasblock-tool-text {
+ vertical-align: top;
+ font-size: 22px;
+ color: var(--base-color);
+ font-weight: 600;
+ }
+
+ &.selected-tool {
+ border: solid 2px var(--black);
+ }
+ }
+
+ &.cw-canvasblock-undo {
+ @include background-icon(arr_2left, clickable, 24);
+ }
+
+ &.cw-canvasblock-download {
+ @include background-icon(download, clickable, 24);
+ }
+ &.cw-canvasblock-store {
+ @include background-icon(upload, clickable, 24);
+ }
+ &.cw-canvasblock-show-all {
+ @include background-icon(group2, clickable, 24);
+ &.selected-view {
+ border: solid 2px var(--black);
+ }
+ }
+ &.cw-canvasblock-show-own {
+ @include background-icon(person, clickable, 24);
+ &.selected-view {
+ border: solid 2px var(--black);
+ }
}
}
-
- &.selected-color {
- border: solid 2px $black;
- }
- }
-
- &.cw-canvasblock-reset {
- @include background-icon(refresh, clickable, 24);
- }
-
- &.cw-canvasblock-size {
- @include background-icon(stop, clickable);
-
- &.cw-canvasblock-size-small {
- background-size: 8px 7px;
- }
- &.cw-canvasblock-size-normal {
- background-size: 16px 14px;
- }
- &.cw-canvasblock-size-large {
- background-size: 22px 20px;
- }
- &.cw-canvasblock-size-huge {
- background-size: 26px 24px;
- }
- &.selected-size {
- border: solid 2px $black;
- }
- }
-
- &.cw-canvasblock-tool {
- &.cw-canvasblock-tool-pen {
- @include background-icon(comment, clickable);
- }
-
- &.cw-canvasblock-tool-text {
- vertical-align: top;
- font-size: 22px;
- color: $base-color;
- font-weight: 600;
- }
-
- &.selected-tool {
- border: solid 2px $black;
- }
- }
-
- &.cw-canvasblock-undo {
- @include background-icon(arr_2left, clickable, 24);
}
+ }
- &.cw-canvasblock-download {
- @include background-icon(download, clickable, 24);
- }
- &.cw-canvasblock-store {
- @include background-icon(upload, clickable, 24);
- }
- &.cw-canvasblock-show-all {
- @include background-icon(group2, clickable, 24);
- &.selected-view {
- border: solid 2px $black;
- }
- }
- &.cw-canvasblock-show-own {
- @include background-icon(person, clickable, 24);
- &.selected-view {
- border: solid 2px $black;
- }
- }
+ .cw-canvasblock-tool-selected-text {
+ cursor: text;
}
}
/* * * * * * * * * * * * * * *
diff --git a/resources/assets/stylesheets/scss/select.scss b/resources/assets/stylesheets/scss/select.scss
index f7a44410fa1151e5a1fd26a1f1bfded48f8bc377..ff30ef5973418ba19a83ce40468c1e2ad11b945a 100644
--- a/resources/assets/stylesheets/scss/select.scss
+++ b/resources/assets/stylesheets/scss/select.scss
@@ -1,5 +1,6 @@
.studip-v-select, .studip-v-select-detachted-ul {
max-width: 48em;
+ margin-top: 0.5ex;
.vs__option-with-icon{
padding-left: 8px;
@@ -8,19 +9,23 @@
.vs__option-color {
border: solid thin $content-color-40;
padding-left: 20px;
- height: 20px;
+ height: 16px;
margin-right: 4px;
}
.vs__dropdown-toggle {
- border: solid thin $content-color-40;
- border-radius: 0;
+ max-height: 32px;
+ padding: 0 0 5px;
}
.vs__dropdown-menu, &.vs__dropdown-menu {
border-radius: 0;
}
+ .vs__actions {
+ align-items: end;
+ }
+
&.studip-v-select-drop-up {
border-bottom: solid thin $content-color-40;
border-top: none;
@@ -36,3 +41,8 @@
z-index: 3002;
}
}
+
+form.default .studip-v-select .vs__selected {
+ padding: 0;
+ margin: 2px 2px 0;
+}
\ No newline at end of file
diff --git a/resources/vue/components/courseware/CoursewareAudioBlock.vue b/resources/vue/components/courseware/CoursewareAudioBlock.vue
index 77e3166a5905260de18270027b35b9dd137e5165..afa164feb11fbffd3a750d2cc0aa46bd104c0c48 100644
--- a/resources/vue/components/courseware/CoursewareAudioBlock.vue
+++ b/resources/vue/components/courseware/CoursewareAudioBlock.vue
@@ -43,7 +43,7 @@
</div>
</div>
<div v-if="emptyAudio" class="cw-audio-empty">
- <p><translate>Es ist keine Audio-Datei verfügbar</translate></p>
+ <p>{{ $gettext('Es ist keine Audio-Datei verfügbar') }}</p>
</div>
<div v-show="currentSource === 'studip_folder'" class="cw-audio-playlist-wrapper" :class="[!showRecorder && emptyAudio ? 'empty' : '']">
<ul v-show="hasPlaylist" class="cw-audio-playlist" :class="[showRecorder ? 'with-recorder' : '']">
@@ -71,45 +71,45 @@
:title="enableRecorderTitle"
@click="enableRecorder"
>
- <translate>Aufnahme aktivieren</translate>
+ {{ $gettext('Aufnahme aktivieren') }}
</button>
<button
v-show="userRecorderEnabled && !isRecording && !newRecording"
class="button"
@click="startRecording"
>
- <translate>Aufnahme starten</translate>
+ {{ $gettext('Aufnahme starten') }}
</button>
<button
v-show="newRecording && !isRecording"
class="button"
@click="startRecording"
>
- <translate>Aufnahme wiederholen</translate>
+ {{ $gettext('Aufnahme wiederholen') }}
</button>
<button
v-show="isRecording"
class="button"
@click="stopRecording"
>
- <translate>Aufnahme beenden</translate>
+ {{ $gettext('Aufnahme beenden') }}
</button>
<button
v-show="newRecording && !isRecording"
class="button"
@click="resetRecorder"
>
- <translate>Aufnahme löschen</translate>
+ {{ $gettext('Aufnahme löschen') }}
</button>
<button
v-show="newRecording && !isRecording"
class="button"
@click="storeRecording"
>
- <translate>Aufnahme speichern</translate>
+ {{ $gettext('Aufnahme speichern') }}
</button>
<span v-show="isRecording">
- <translate>Aufnahme läuft</translate>: {{seconds2time(timer)}}
+ {{ $gettext('Aufnahme läuft') }}: {{seconds2time(timer)}}
</span>
</div>
</div>
@@ -117,23 +117,23 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Ãœberschrift</translate>
+ {{ $gettext('Ãœberschrift') }}
<input type="text" v-model="currentTitle" />
</label>
<label>
- <translate>Quelle</translate>
+ {{ $gettext('Quelle') }}
<select v-model="currentSource">
- <option value="studip_file"><translate>Dateibereich Datei</translate></option>
- <option value="studip_folder"><translate>Dateibereich Ordner</translate></option>
- <option value="web"><translate>Web-Adresse</translate></option>
+ <option value="studip_file">{{ $gettext('Dateibereich Datei') }}</option>
+ <option value="studip_folder">{{ $gettext('Dateibereich Ordner') }}</option>
+ <option value="web">{{ $gettext('Web-Adresse') }}</option>
</select>
</label>
<label v-show="currentSource === 'web'">
- <translate>URL</translate>
+ {{ $gettext('URL') }}
<input type="text" v-model="currentWebUrl" />
</label>
<label v-show="currentSource === 'studip_file'">
- <translate>Datei</translate>
+ {{ $gettext('Datei') }}
<courseware-file-chooser
v-model="currentFileId"
:isAudio="true"
@@ -141,24 +141,24 @@
/>
</label>
<label v-show="currentSource === 'studip_folder'">
- <translate>Ordner</translate>
+ {{ $gettext('Ordner') }}
<courseware-folder-chooser v-model="currentFolderId" allowUserFolders />
</label>
<label v-show="currentSource === 'studip_folder'">
- <translate>Audio Aufnahmen zulassen</translate>
+ {{ $gettext('Audio Aufnahmen zulassen') }}
<span
class="tooltip tooltip-icon"
:data-tooltip="$gettext('Um Aufnahmen zu ermöglichen, muss ein Ordner ausgewählt werden.')"
></span>
<select v-model="currentRecorderEnabled" :disabled="!folderSelected">
- <option :value="true"><translate>Ja</translate></option>
- <option :value="false"><translate>Nein</translate></option>
+ <option :value="true">{{ $gettext('Ja') }}</option>
+ <option :value="false">{{ $gettext('Nein') }}</option>
</select>
</label>
</form>
</template>
<template #info>
- <p><translate>Informationen zum Audio-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Audio-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareBeforeAfterBlock.vue b/resources/vue/components/courseware/CoursewareBeforeAfterBlock.vue
index f714f25bc4a7668135777950f4aeae1618b43d47..2770387ad7aeb12246048fbf91dd11a106a04cc3 100644
--- a/resources/vue/components/courseware/CoursewareBeforeAfterBlock.vue
+++ b/resources/vue/components/courseware/CoursewareBeforeAfterBlock.vue
@@ -11,68 +11,94 @@
>
<template #content>
<TwentyTwenty v-if="!isEmpty" :before="currentBeforeUrl" :after="currentAfterUrl" />
+ <courseware-companion-box
+ v-if="isEmpty && editMode"
+ :msgCompanion="$gettext('Bitte wählen Sie ein Vorher- und ein Nachher-Bild aus.')"
+ mood="pointing"
+ />
</template>
<template v-if="canEdit" #edit>
- <form class="default" @submit.prevent="">
- <label>
- <translate>Quelle vorher</translate>
- <select v-model="currentBeforeSource">
- <option value="studip"><translate>Dateibereich</translate></option>
- <option value="web"><translate>Web-Adresse</translate></option>
- </select>
- </label>
- <label v-if="currentBeforeSource === 'web'">
- <translate>URL</translate>:
- <input type="text" v-model="currentBeforeWebUrl" />
- </label>
- <label v-if="currentBeforeSource === 'studip'">
- <translate>Datei</translate>
- <courseware-file-chooser
- v-model="currentBeforeFileId"
- :isImage="true"
- @selectFile="updateCurrentBeforeFile"
- />
- </label>
- <label>
- <translate>Quelle nachher</translate>
- <select v-model="currentAfterSource">
- <option value="studip"><translate>Dateibereich</translate></option>
- <option value="web"><translate>Web-Adresse</translate></option>
- </select>
- </label>
- <label v-if="currentAfterSource === 'web'">
- <translate>URL</translate>
- <input type="text" v-model="currentAfterWebUrl" />
- </label>
- <label v-if="currentAfterSource === 'studip'">
- <translate>Datei</translate>
- <courseware-file-chooser
- v-model="currentAfterFileId"
- :isImage="true"
- @selectFile="updateCurrentAfterFile"
- />
- </label>
- </form>
+ <courseware-tabs>
+ <courseware-tab
+ :index="0"
+ :name="$gettext('Vorher')"
+ :selected="true"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Quelle') }}
+ <select v-model="currentBeforeSource">
+ <option value="studip">{{ $gettext('Dateibereich') }}</option>
+ <option value="web">{{ $gettext('Web-Adresse') }}</option>
+ </select>
+ </label>
+ <label v-if="currentBeforeSource === 'web'">
+ {{ $gettext('URL') }}
+ <input type="text" v-model="currentBeforeWebUrl" />
+ </label>
+ <label v-if="currentBeforeSource === 'studip'">
+ {{ $gettext('Bilddatei') }}
+ <courseware-file-chooser
+ v-model="currentBeforeFileId"
+ :isImage="true"
+ @selectFile="updateCurrentBeforeFile"
+ />
+ </label>
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="1"
+ :name="$gettext('Nachher')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Quelle') }}
+ <select v-model="currentAfterSource">
+ <option value="studip">{{ $gettext('Dateibereich') }}</option>
+ <option value="web">{{ $gettext('Web-Adresse') }}</option>
+ </select>
+ </label>
+ <label v-if="currentAfterSource === 'web'">
+ {{ $gettext('URL') }}
+ <input type="text" v-model="currentAfterWebUrl" />
+ </label>
+ <label v-if="currentAfterSource === 'studip'">
+ {{ $gettext('Bilddatei') }}
+ <courseware-file-chooser
+ v-model="currentAfterFileId"
+ :isImage="true"
+ @selectFile="updateCurrentAfterFile"
+ />
+ </label>
+ </form>
+ </courseware-tab>
+ </courseware-tabs>
</template>
- <template #info><translate>Informationen zum Bildvergleich-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Bildvergleich-Block') }}</template>
</courseware-default-block>
</div>
</template>
<script>
+import CoursewareCompanionBox from './CoursewareCompanionBox.vue';
import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
import CoursewareFileChooser from './CoursewareFileChooser.vue';
+import CoursewareTabs from './CoursewareTabs.vue';
+import CoursewareTab from './CoursewareTab.vue';
import { blockMixin } from './block-mixin.js';
import TwentyTwenty from 'vue-twentytwenty';
import 'vue-twentytwenty/dist/vue-twentytwenty.css';
-import { mapActions } from 'vuex';
+import { mapActions, mapGetters } from 'vuex';
export default {
name: 'courseware-before-after-block',
mixins: [blockMixin],
components: {
+ CoursewareCompanionBox,
CoursewareDefaultBlock,
CoursewareFileChooser,
+ CoursewareTabs,
+ CoursewareTab,
TwentyTwenty,
},
props: {
@@ -95,6 +121,9 @@ export default {
};
},
computed: {
+ ...mapGetters({
+ viewMode: 'viewMode'
+ }),
beforeSource() {
return this.block?.attributes?.payload?.before_source;
},
@@ -114,7 +143,7 @@ export default {
return this.block?.attributes?.payload?.after_web_url;
},
currentBeforeUrl() {
- if (this.currentBeforeSource === 'studip'&& this.currentBeforeFile?.meta) {
+ if (this.currentBeforeSource === 'studip' && this.currentBeforeFile?.meta) {
return this.currentBeforeFile.meta['download-url'];
} else if (this.currentBeforeSource === 'web') {
return this.currentBeforeWebUrl;
@@ -123,7 +152,7 @@ export default {
}
},
currentAfterUrl() {
- if (this.currentAfterSource === 'studip'&& this.currentAfterFile?.meta) {
+ if (this.currentAfterSource === 'studip' && this.currentAfterFile?.meta) {
return this.currentAfterFile.meta['download-url'];
} else if (this.currentAfterSource === 'web') {
return this.currentAfterWebUrl;
@@ -131,6 +160,12 @@ export default {
return '';
}
},
+ isEmpty() {
+ return this.currentBeforeUrl === '' || this.currentAfterUrl === '';
+ },
+ editMode() {
+ return this.viewMode === 'edit';
+ }
},
mounted() {
this.loadFileRefs(this.block.id).then((response) => {
diff --git a/resources/vue/components/courseware/CoursewareBiographyAchievementsBlock.vue b/resources/vue/components/courseware/CoursewareBiographyAchievementsBlock.vue
index a5e49556031d7961bae0812e5cfbf3d7ba5d9cd4..b59b85aa9643195fcfdec269d301295c7c737bfb 100644
--- a/resources/vue/components/courseware/CoursewareBiographyAchievementsBlock.vue
+++ b/resources/vue/components/courseware/CoursewareBiographyAchievementsBlock.vue
@@ -16,21 +16,21 @@
</div>
<div class="cw-block-biography-details">
<h3>
- <translate>Titel</translate>: {{currentData.title}}
+ {{ $gettext('Titel') }}: {{currentData.title}}
</h3>
<h4>
- <span v-show="currentData.type !== 'membership'"><translate>Datum</translate>:</span>
- <span v-show="currentData.type === 'membership'"><translate>Startdatum</translate>:</span>
+ <span v-show="currentData.type !== 'membership'">{{ $gettext('Datum') }}:</span>
+ <span v-show="currentData.type === 'membership'">{{ $gettext('Startdatum') }}:</span>
{{ getReadableDate(currentData.date) }}
</h4>
<h4 v-show="hasEndDate">
- <translate>Enddatum</translate>: {{ getReadableDate(currentData.end_date)}}
+ {{ $gettext('Enddatum') }}: {{ getReadableDate(currentData.end_date)}}
</h4>
<h4 v-show="hasParticipation">
- <translate>Beteiligung</translate>: <span v-html="currentData.role"></span>
+ {{ $gettext('Beteiligung') }}: <span v-html="currentData.role"></span>
</h4>
<div>
- <h4><translate>Beschreibung</translate>:</h4>
+ <h4>{{ $gettext('Beschreibung') }}:</h4>
<p v-html="currentData.description"></p>
</div>
</div>
@@ -39,40 +39,40 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Type</translate>
+ {{ $gettext('Type') }}
<select v-model="currentData.type">
- <option value="certificate"><translate>Zertifikat</translate></option>
- <option value="accreditation"><translate>Akkreditierung</translate></option>
- <option value="award"><translate>Auszeichnung</translate></option>
- <option value="book"><translate>Buch</translate></option>
- <option value="publication"><translate>Veröffentlichung</translate></option>
- <option value="membership"><translate>Mitgliedschaft</translate></option>
+ <option value="certificate">{{ $gettext('Zertifikat') }}</option>
+ <option value="accreditation">{{ $gettext('Akkreditierung') }}</option>
+ <option value="award">{{ $gettext('Auszeichnung') }}</option>
+ <option value="book">{{ $gettext('Buch') }}</option>
+ <option value="publication">{{ $gettext('Veröffentlichung') }}</option>
+ <option value="membership">{{ $gettext('Mitgliedschaft') }}</option>
</select>
</label>
<label>
- <translate>Titel</translate>
+ {{ $gettext('Titel') }}
<input type="text" v-model="currentData.title">
</label>
<label>
- <span v-show="!hasEndDate"><translate>Datum</translate></span>
- <span v-show="hasEndDate"><translate>Startdatum</translate></span>
+ <template v-if="!hasEndDate">{{ $gettext('Datum') }}</template>
+ <template v-else>{{ $gettext('Startdatum') }}</template>
<input type="date" v-model="currentData.date" />
</label>
<label v-show="hasEndDate">
- <translate>Enddatum</translate>
+ {{ $gettext('Enddatum') }}
<input type="date" v-model="currentData.end_date" />
</label>
<label v-show="hasParticipation">
- <translate>Beteiligung</translate>
+ {{ $gettext('Beteiligung') }}
<input type="text" v-model="currentData.role">
</label>
<div class="label-text">
- <translate>Beschreibung</translate>
+ {{ $gettext('Beschreibung') }}
</div>
<studip-wysiwyg v-model="currentData.description"></studip-wysiwyg>
</form>
</template>
- <template #info><translate>Informationen zum Erfolge-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Erfolge-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareBiographyCareerBlock.vue b/resources/vue/components/courseware/CoursewareBiographyCareerBlock.vue
index fb20809899ac1d0ee3388e8b8a658758d6af089b..6fd855067bf82f8199ce2d72a35dc8331459bc92 100644
--- a/resources/vue/components/courseware/CoursewareBiographyCareerBlock.vue
+++ b/resources/vue/components/courseware/CoursewareBiographyCareerBlock.vue
@@ -28,13 +28,13 @@
<article>
<header>{{ getItemTypeName(item.type) }}</header>
<div v-if="item.type === 'school'">
- <p><translate>Bezeichnung der Qualifikation</translate>: {{ item.qualification }}</p>
- <p><translate>Hauptfächer / Schwerpunkt</translate>: {{ item.focus }}</p>
- <p><translate>berufliche Fähigkeiten</translate>: {{ item.skills }}</p>
+ <p>{{ $gettext('Bezeichnung der Qualifikation') }}: {{ item.qualification }}</p>
+ <p>{{ $gettext('Hauptfächer / Schwerpunkt') }}: {{ item.focus }}</p>
+ <p>{{ $gettext('berufliche Fähigkeiten') }}: {{ item.skills }}</p>
</div>
<div v-if="item.type === 'experience'">
- <p><translate>Name des Arbeitgebers</translate>: {{ item.employer }}</p>
- <p><translate>Beruf / Funktion</translate>: {{ item.job }}</p>
+ <p>{{ $gettext('Name des Arbeitgebers') }}: {{ item.employer }}</p>
+ <p>{{ $gettext('Beruf / Funktion') }}: {{ item.job }}</p>
</div>
</article>
</div>
@@ -44,15 +44,15 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Zeitliche Sortierung</translate>
+ {{ $gettext('Zeitliche Sortierung') }}
<select v-model="currentSort">
- <option value="none"><translate>Keine</translate></option>
- <option value="asc"><translate>Aufsteigend</translate></option>
- <option value="desc"><translate>Absteigend</translate></option>
+ <option value="none">{{ $gettext('Keine') }}</option>
+ <option value="asc">{{ $gettext('Aufsteigend') }}</option>
+ <option value="desc">{{ $gettext('Absteigend') }}</option>
</select>
</label>
</form>
- <button class="button add" @click="addItem"><translate>Ereignis hinzufügen</translate></button>
+ <button class="button add" @click="addItem">{{ $gettext('Ereignis hinzufügen') }}</button>
<courseware-tabs
v-if="currentItems.length > 0"
:setSelected="setItemTab"
@@ -67,59 +67,59 @@
canBeEmpty
>
<form class="default" @submit.prevent="">
- <label>
- <translate>Startdatum</translate>
+ <label class="col-1">
+ {{ $gettext('Startdatum') }}
<input type="date" v-model="item.date" required />
</label>
- <label>
- <translate>Enddatum</translate>
+ <label class="col-1">
+ {{ $gettext('Enddatum') }}
<input type="date" v-model="item.enddate" />
</label>
<label>
- <translate>Art</translate>
+ {{ $gettext('Art') }}
<select v-model="item.type">
- <option value="school"><translate>Schul- und Berufsbildung</translate></option>
- <option value="experience"><translate>Berufserfahrung</translate></option>
+ <option value="school">{{ $gettext('Schul- und Berufsbildung') }}</option>
+ <option value="experience">{{ $gettext('Berufserfahrung') }}</option>
</select>
</label>
<div v-show="item.type === 'school'">
<label>
- <translate>Bezeichnung der Qualifikation</translate>
+ {{ $gettext('Bezeichnung der Qualifikation') }}
<input type="text" v-model="item.qualification" />
</label>
<label>
- <translate>Hauptfächer / Schwerpunkt</translate>
+ {{ $gettext('Hauptfächer / Schwerpunkt') }}
<input type="text" v-model="item.focus" />
</label>
<label>
- <translate>berufliche Fähigkeiten</translate>
+ {{ $gettext('berufliche Fähigkeiten') }}
<input type="text" v-model="item.skills" />
</label>
</div>
<div v-show="item.type === 'experience'">
<label>
- <translate>Name des Arbeitgebers</translate>
+ {{ $gettext('Name des Arbeitgebers') }}
<input type="text" v-model="item.employer" />
</label>
<label>
- <translate>Beruf / Funktion</translate>
+ {{ $gettext('Beruf / Funktion') }}
<input type="text" v-model="item.job" />
</label>
</div>
<label>
- <translate>Beschreibung</translate>
+ {{ $gettext('Beschreibung') }}
<textarea v-model="item.description" />
</label>
<label v-if="currentItems.length > 1">
<button class="button trash" @click="removeItem(index)">
- <translate>Ereignis entfernen</translate>
+ {{ $gettext('Ereignis entfernen') }}
</button>
</label>
</form>
</courseware-tab>
</courseware-tabs>
</template>
- <template #info><translate>Informationen zum Karriere-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Karriere-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareBiographyGoalsBlock.vue b/resources/vue/components/courseware/CoursewareBiographyGoalsBlock.vue
index ab21b7aa1bae76cd88d824b8d2c36ee4b01c96fc..8e352796ca31c97626e2a32626d3fe628e637c17 100644
--- a/resources/vue/components/courseware/CoursewareBiographyGoalsBlock.vue
+++ b/resources/vue/components/courseware/CoursewareBiographyGoalsBlock.vue
@@ -21,21 +21,21 @@
<template v-if="canEdit" #edit>
<form class="default">
<label for="type">
- <span><translate>Ziel</translate></span>
+ {{ $gettext('Ziel') }}
<select name="type" class="type" v-model="currentData.type">
- <option value="personal"><translate>Persönliches Ziel</translate></option>
- <option value="school"><translate>Schulisches Ziel</translate></option>
- <option value="academic"><translate>Akademisches Ziel</translate></option>
- <option value="professional"><translate>Berufliches Ziel</translate></option>
+ <option value="personal">{{ $gettext('Persönliches Ziel') }}</option>
+ <option value="school">{{ $gettext('Schulisches Ziel') }}</option>
+ <option value="academic">{{ $gettext('Akademisches Ziel') }}</option>
+ <option value="professional">{{ $gettext('Berufliches Ziel') }}</option>
</select>
</label>
<div class="label-text">
- <translate>Beschreibung</translate>
+ {{ $gettext('>Beschreibung') }}
</div>
<studip-wysiwyg v-model="currentData.description"></studip-wysiwyg>
</form>
</template>
- <template #info><translate>Informationen zum Ziele-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Ziele-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareBiographyPersonalInformationBlock.vue b/resources/vue/components/courseware/CoursewareBiographyPersonalInformationBlock.vue
index 14ba1be9acc1a59610df4a7d5cf3284aceec48e4..28e5ffc7994b7d4e234f4c64f145f33f98f1587b 100644
--- a/resources/vue/components/courseware/CoursewareBiographyPersonalInformationBlock.vue
+++ b/resources/vue/components/courseware/CoursewareBiographyPersonalInformationBlock.vue
@@ -15,16 +15,16 @@
<h2>{{currentData.name}}</h2>
</div>
<div class="cw-block-biography-details cw-block-biography-personal-information-details">
- <span><translate>Geburtsort</translate>:</span>
+ <span>{{ $gettext('Geburtsort') }}:</span>
<span>{{currentData.birthplace}}</span>
- <span><translate>Geburtsdatum</translate>:</span>
+ <span>{{ $gettext('Geburtsdatum') }}:</span>
<span>{{ getReadableDate(currentData.birthday) }}</span>
- <span><translate>Geschlecht</translate>:</span>
+ <span>{{ $gettext('Geschlecht') }}:</span>
<span>{{displayGenderText(currentData.gender)}}</span>
- <span><translate>Familienstand</translate>:</span>
+ <span>{{ $gettext('Familienstand') }}:</span>
<span>{{ displayStatusText(currentData.status) }}</span>
</div>
</div>
@@ -32,20 +32,20 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Name</translate>
+ {{ $gettext('Name') }}
<input type="text" v-model="currentData.name">
</label>
<label>
- <translate>Geburtsort</translate>
+ {{ $gettext('Geburtsort') }}
<input type="text" v-model="currentData.birthplace">
</label>
<label>
- <translate>Geburtsdatum</translate>
+ {{ $gettext('Geburtsdatum') }}
<input type="date" v-model="currentData.birthday" />
</label>
<label>
- <translate>Geschlecht</translate>
- <select v-model="currentData.gender">
+ {{ $gettext('Geschlecht') }}
+ <select v-model="currentData.gender">
<option value="none">{{ displayGenderText('none') }}</option>
<option value="male">{{ displayGenderText('male') }}</option>
<option value="female">{{ displayGenderText('female') }}</option>
@@ -53,20 +53,20 @@
</select>
</label>
<label>
- <translate>Familienstand</translate>
- <select v-model="currentData.status">
- <option value="none">{{ displayStatusText('none') }}</option>
- <option value="single">{{ displayStatusText('single') }}</option>
- <option value="married">{{ displayStatusText('married') }}</option>
- <option value="widowed">{{ displayStatusText('widowed') }}</option>
- <option value="divorced">{{ displayStatusText('divorced') }}</option>
- <option value="registered-civil-partnership">{{ displayStatusText('registered-civil-partnership') }}</option>
- <option value="annulled-civil-partnership">{{ displayStatusText('annulled-civil-partnership') }}</option>
- </select>
+ {{ $gettext('Familienstand') }}
+ <select v-model="currentData.status">
+ <option value="none">{{ displayStatusText('none') }}</option>
+ <option value="single">{{ displayStatusText('single') }}</option>
+ <option value="married">{{ displayStatusText('married') }}</option>
+ <option value="widowed">{{ displayStatusText('widowed') }}</option>
+ <option value="divorced">{{ displayStatusText('divorced') }}</option>
+ <option value="registered-civil-partnership">{{ displayStatusText('registered-civil-partnership') }}</option>
+ <option value="annulled-civil-partnership">{{ displayStatusText('annulled-civil-partnership') }}</option>
+ </select>
</label>
</form>
</template>
- <template #info><translate>Informationen zum Persönlichen-Informationen-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Persönlichen-Informationen-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareBlockEdit.vue b/resources/vue/components/courseware/CoursewareBlockEdit.vue
index a218ab52c4ebcc304518a92b45cb5b272568ff2b..e78008b70e20418a0cdb2895a5dfe9a3deada01c 100644
--- a/resources/vue/components/courseware/CoursewareBlockEdit.vue
+++ b/resources/vue/components/courseware/CoursewareBlockEdit.vue
@@ -1,13 +1,13 @@
<template>
<section class="cw-block-edit">
- <header><translate>Bearbeiten</translate></header>
+ <header>{{ $gettext('Bearbeiten') }}</header>
<div class="cw-block-features-content">
<div @click="deactivateToolbar(); exitHandler = true;">
<slot name="edit" />
</div>
<div class="cw-button-box">
- <button class="button accept" @click="$emit('store'); exitHandler = false;"><translate>Speichern</translate></button>
- <button class="button cancel" @click="$emit('close'); exitHandler = false;"><translate>Abbrechen</translate></button>
+ <button class="button accept" @click="$emit('store'); exitHandler = false;">{{ $gettext('Speichern') }}</button>
+ <button class="button cancel" @click="$emit('close'); exitHandler = false;">{{ $gettext('Abbrechen') }}</button>
</div>
</div>
</section>
diff --git a/resources/vue/components/courseware/CoursewareBlockFeedback.vue b/resources/vue/components/courseware/CoursewareBlockFeedback.vue
index 443745e00459b692b72b7973deb9a51ac0f803f4..88ac2d7747c085b18cc949e74327d17f79df0d0e 100644
--- a/resources/vue/components/courseware/CoursewareBlockFeedback.vue
+++ b/resources/vue/components/courseware/CoursewareBlockFeedback.vue
@@ -19,7 +19,7 @@
/>
<div v-if="userIsTeacher" class="cw-block-feedback-create">
<textarea v-model="feedbackText" :placeholder="placeHolder" spellcheck="true"></textarea>
- <button class="button" @click="postFeedback"><translate>Senden</translate></button>
+ <button class="button" @click="postFeedback">{{ $gettext('Senden') }}</button>
</div>
</div>
</section>
diff --git a/resources/vue/components/courseware/CoursewareBlockInfo.vue b/resources/vue/components/courseware/CoursewareBlockInfo.vue
index 5ef6e975d49b822feef298d0c069f11773143a3f..17a716553cc6eae88bb8348f1cb5958a6d06d2c7 100644
--- a/resources/vue/components/courseware/CoursewareBlockInfo.vue
+++ b/resources/vue/components/courseware/CoursewareBlockInfo.vue
@@ -1,30 +1,30 @@
<template>
<section class="cw-block-info">
- <header><translate>Informationen</translate></header>
+ <header>{{ $gettext('Informationen') }}</header>
<div class="cw-block-features-content cw-block-info-content">
<table class="cw-block-info-table">
<tr>
- <td><translate>Blockbeschreibung</translate></td>
+ <td>{{ $gettext('Blockbeschreibung') }}</td>
<td><slot name="info" /></td>
</tr>
<tr>
- <td><translate>Block wurde erstellt von</translate></td>
+ <td>{{ $gettext('Block wurde erstellt von') }}</td>
<td>{{ owner }}</td>
</tr>
<tr>
- <td><translate>Block wurde erstellt am</translate>:</td>
+ <td>{{ $gettext('Block wurde erstellt am') }}:</td>
<td><iso-date :date="block.attributes.mkdate" /></td>
</tr>
<tr>
- <td><translate>Zuletzt bearbeitet von</translate>:</td>
+ <td>{{ $gettext('Zuletzt bearbeitet von') }}:</td>
<td>{{ editor }}</td>
</tr>
<tr>
- <td><translate>Zuletzt bearbeitet am</translate>:</td>
+ <td>{{ $gettext('Zuletzt bearbeitet am') }}:</td>
<td><iso-date :date="block.attributes.chdate" /></td>
</tr>
</table>
- <button class="button" @click="$emit('close')"><translate>Schließen</translate></button>
+ <button class="button" @click="$emit('close')">{{ $gettext('Schließen') }}</button>
</div>
</section>
</template>
diff --git a/resources/vue/components/courseware/CoursewareCanvasBlock.vue b/resources/vue/components/courseware/CoursewareCanvasBlock.vue
index e1ea7e87cb564b376125b3bdcd07f37fdfba1a67..e7257988a7137517986375fdaa77818fa21d4044 100644
--- a/resources/vue/components/courseware/CoursewareCanvasBlock.vue
+++ b/resources/vue/components/courseware/CoursewareCanvasBlock.vue
@@ -99,47 +99,62 @@
/>
<div class="cw-canvasblock-hints">
<div v-show="write" class="messagebox messagebox_info cw-canvasblock-text-info">
- <translate>Texteingabe mit Enter-Taste bestätigen</translate>
+ {{ $gettext('Texteingabe mit Enter-Taste bestätigen') }}
</div>
</div>
</template>
<template v-if="canEdit" #edit>
- <form class="default" @submit.prevent="">
- <label>
- <translate>Ãœberschrift</translate>
- <input type="text" v-model="currentTitle" />
- </label>
- <label>
- <translate>Hintergrundbild</translate>
- <select v-model="currentImage">
- <option value="true"><translate>Ja</translate></option>
- <option value="false"><translate>Nein</translate></option>
- </select>
- </label>
- <label v-if="currentImage === 'true'">
- <translate>Bilddatei</translate>
- <courseware-file-chooser
- v-model="currentFileId"
- :isImage="true"
- @selectFile="updateCurrentFile"
- />
- </label>
- <label>
- <translate>Speicherort</translate>
- <courseware-folder-chooser v-model="currentUploadFolderId" :unchoose="true"/>
- </label>
- <label>
- <translate>Werte anderer Nutzer anzeigen</translate>
- <select v-model="currentShowUserData">
- <option value="off"><translate>deaktiviert</translate></option>
- <option value="teacher"><translate>nur für Lehrende</translate></option>
- <option value="all"><translate>für alle</translate></option>
- </select>
- </label>
- </form>
+ <courseware-tabs>
+ <courseware-tab
+ :index="0"
+ :name="$gettext('Grunddaten')"
+ :selected="true"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Ãœberschrift') }}
+ <input type="text" v-model="currentTitle" />
+ </label>
+ <label>
+ {{ $gettext('Hintergrundbild') }}
+ <select v-model="currentImage">
+ <option value="true">{{ $gettext('Ja') }}</option>
+ <option value="false">{{ $gettext('Nein') }}</option>
+ </select>
+ </label>
+ <label v-if="currentImage === 'true'">
+ {{ $gettext('Bilddatei') }}
+ <courseware-file-chooser
+ v-model="currentFileId"
+ :isImage="true"
+ @selectFile="updateCurrentFile"
+ />
+ </label>
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="1"
+ :name="$gettext('Einstellungen')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Speicherort') }}
+ <courseware-folder-chooser v-model="currentUploadFolderId" :unchoose="true"/>
+ </label>
+ <label>
+ {{ $gettext('Werte anderer Nutzer anzeigen') }}
+ <select v-model="currentShowUserData">
+ <option value="off">{{ $gettext('deaktiviert') }}</option>
+ <option value="teacher">{{ $gettext('nur für Lehrende') }}</option>
+ <option value="all">{{ $gettext('für alle') }}</option>
+ </select>
+ </label>
+ </form>
+ </courseware-tab>
+ </courseware-tabs>
</template>
<template #info>
- <p><translate>Informationen zum Leinwand-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Leinwand-Block') }}</p>
</template>
</courseware-default-block>
</div>
@@ -149,6 +164,8 @@
import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
import CoursewareFileChooser from './CoursewareFileChooser.vue';
import CoursewareFolderChooser from './CoursewareFolderChooser.vue';
+import CoursewareTabs from './CoursewareTabs.vue';
+import CoursewareTab from './CoursewareTab.vue';
import { blockMixin } from './block-mixin.js';
import { mapActions, mapGetters } from 'vuex';
@@ -159,6 +176,8 @@ export default {
CoursewareDefaultBlock,
CoursewareFileChooser,
CoursewareFolderChooser,
+ CoursewareTabs,
+ CoursewareTab,
},
props: {
block: Object,
diff --git a/resources/vue/components/courseware/CoursewareChartBlock.vue b/resources/vue/components/courseware/CoursewareChartBlock.vue
index 96726bf9e5812bafbcbc19ac4e7794b5735c4907..4d1c6dd09fcbe2bcc3250fd06733ed3006cd79fa 100644
--- a/resources/vue/components/courseware/CoursewareChartBlock.vue
+++ b/resources/vue/components/courseware/CoursewareChartBlock.vue
@@ -14,70 +14,91 @@
</template>
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
- <label>
- <translate>Beschriftung</translate>
+ <label class="col-3">
+ {{ $gettext('Beschriftung') }}
<input type="text" v-model="currentLabel" @focusout="buildChart" />
</label>
- <label>
- <translate>Typ</translate>
- <select v-model="currentType">
- <option value="bar"><translate>Säulendiagramm</translate></option>
- <option value="horizontalBar"><translate>Balkendiagramm</translate></option>
- <option value="pie"><translate>Kreisdiagramm</translate></option>
- <option value="doughnut"><translate>Ringdiagramm</translate></option>
- <option value="polarArea"><translate>Polardiagramm</translate></option>
- <option value="line"><translate>Liniendiagramm</translate></option>
- </select>
+ <label class="col-3">
+ {{ $gettext('Typ') }}
+ <studip-select
+ v-model="currentType"
+ :options="chartTypes"
+ :reduce="chartTypes => chartTypes.value"
+ :clearable="false"
+ @option:selected="buildChart"
+ >
+ <template #open-indicator="selectAttributes">
+ <span v-bind="selectAttributes"><studip-icon shape="arr_1down" :size="10"/></span>
+ </template>
+ <template #selected-option="{name}">
+ <span>{{name}}</span>
+ </template>
+ <template #option="{name}">
+ <span>{{name}}</span>
+ </template>
+ </studip-select>
</label>
- <fieldset v-for="(item, index) in currentContent" :key="index">
- <legend>
- <translate>Datensatz</translate> {{ index + 1 }}
- <span
- v-if="!onlyRecord"
- class="cw-block-chart-item-remove"
- :title="textRecordRemove"
- @click="removeItem(index)">
- <studip-icon shape="trash" />
- </span>
- </legend>
- <label>
- <translate>Wert</translate>
- <input type="number" v-model="item.value" @change="buildChart" />
- </label>
- <label>
- <translate>Bezeichnung</translate>
- <input type="text" v-model="item.label" @focusout="buildChart" />
- </label>
- <label>
- <translate>Farbe</translate>
- <studip-select
- :options="colors"
- :reduce="colors => colors.value"
- label="rgb"
- :clearable="false"
- v-model="item.color"
- @option:selected="buildChart"
- >
- <template #open-indicator="selectAttributes">
- <span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
- </template>
- <template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
- </template>
- <template #selected-option="{name, rgb}">
- <span class="vs__option-color" :style="{'background-color': 'rgb(' + rgb + ')'}"></span><span>{{name}}</span>
- </template>
- <template #option="{name, rgb}">
- <span class="vs__option-color" :style="{'background-color': 'rgb(' + rgb + ')'}"></span><span>{{name}}</span>
- </template>
- </studip-select>
- </label>
- </fieldset>
</form>
- <button class="button add" @click="addItem"><translate>Datensatz hinzufügen</translate></button>
+ <button class="button add" @click="addItem">{{ $gettext('Datensatz hinzufügen') }}</button>
+ <courseware-tabs
+ v-if="currentContent.length > 0"
+ :setSelected="setItemTab"
+ @selectTab="setItemTab = (parseInt($event.name.replace($gettext('Datensatz') + ' ', ''), 10) - 1)"
+ >
+ <courseware-tab
+ v-for="(item, index) in currentContent"
+ :key="index"
+ :index="index"
+ :name="$gettext('Datensatz') + ' ' + (index + 1).toString()"
+ :selected="index === 0"
+ canBeEmpty
+ >
+ <form class="default" @submit.prevent="">
+ <label class="col-1">
+ {{ $gettext('Wert') }}
+ <input type="number" v-model="item.value" @change="buildChart" />
+ </label>
+ <label class="col-2">
+ {{ $gettext('Farbe') }}
+ <studip-select
+ :options="colors"
+ :reduce="colors => colors.value"
+ label="rgb"
+ :clearable="false"
+ v-model="item.color"
+ @option:selected="buildChart"
+ >
+ <template #open-indicator="selectAttributes">
+ <span v-bind="selectAttributes"><studip-icon shape="arr_1down" :size="10"/></span>
+ </template>
+ <template #no-options>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
+ </template>
+ <template #selected-option="{name, rgb}">
+ <span class="vs__option-color" :style="{'background-color': 'rgb(' + rgb + ')'}"></span><span>{{name}}</span>
+ </template>
+ <template #option="{name, rgb}">
+ <span class="vs__option-color" :style="{'background-color': 'rgb(' + rgb + ')'}"></span><span>{{name}}</span>
+ </template>
+ </studip-select>
+ </label>
+ <label class="col-3">
+ {{ $gettext('Bezeichnung') }}
+ <input type="text" v-model="item.label" @focusout="buildChart" />
+ </label>
+ <button
+ v-if="currentContent.length > 1"
+ class="button trash"
+ @click="removeItem(index)"
+ >
+ {{ $gettext('Datensatz entfernen') }}
+ </button>
+ </form>
+ </courseware-tab>
+ </courseware-tabs>
</template>
<template #info>
- <p><translate>Informationen zum Diagramm-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Diagramm-Block') }}</p>
</template>
</courseware-default-block>
</div>
@@ -85,16 +106,21 @@
<script>
import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
+import CoursewareTabs from './CoursewareTabs.vue';
+import CoursewareTab from './CoursewareTab.vue';
+import StudipIcon from '../StudipIcon.vue';
import { blockMixin } from './block-mixin.js';
import Chart from 'chart.js';
import { mapActions } from 'vuex';
-import StudipIcon from '../StudipIcon.vue';
+
export default {
name: 'courseware-chart-block',
mixins: [blockMixin],
components: {
CoursewareDefaultBlock,
+ CoursewareTabs,
+ CoursewareTab,
StudipIcon,
},
props: {
@@ -120,7 +146,16 @@ export default {
{ name:this.$gettext('Hellgrau'), value: 'lightgrey', rgb: '149, 165, 166' },
{ name:this.$gettext('Schwarz'), value: 'black', rgb: '0, 0, 0' },
],
+ chartTypes: [
+ { name: this.$gettext('Säulendiagramm'), value: 'bar'},
+ { name: this.$gettext('Balkendiagramm'), value: 'horizontalBar'},
+ { name: this.$gettext('Kreisdiagramm'), value: 'pie'},
+ { name: this.$gettext('Ringdiagramm'), value: 'doughnut'},
+ { name: this.$gettext('Polardiagramm'), value: 'polarArea'},
+ { name: this.$gettext('Liniendiagramm'), value: 'line'},
+ ],
textRecordRemove: this.$gettext('Datensatz entfernen'),
+ setItemTab: 0,
};
},
computed: {
@@ -148,6 +183,7 @@ export default {
this.currentContent = this.content;
this.currentLabel = this.label;
this.currentType = this.type;
+ this.setItemTab = 0;
},
storeBlock() {
let attributes = {};
@@ -165,6 +201,7 @@ export default {
addItem() {
this.currentContent.push({ value: '0', label: '', color: 'blue' });
+ this.$nextTick(() => { this.setItemTab = this.currentContent.length - 1; });
},
removeItem(recordIndex) {
@@ -172,6 +209,7 @@ export default {
return !(index === recordIndex);
});
this.buildChart();
+ this.$nextTick(() => { this.setItemTab = 0; });
},
buildChart() {
diff --git a/resources/vue/components/courseware/CoursewareCodeBlock.vue b/resources/vue/components/courseware/CoursewareCodeBlock.vue
index db383735a4284d9d75e7110da20986a0a42e9cf5..3ed8d226368f27f78940b161765e26bec640dfcc 100644
--- a/resources/vue/components/courseware/CoursewareCodeBlock.vue
+++ b/resources/vue/components/courseware/CoursewareCodeBlock.vue
@@ -18,17 +18,17 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Sprache</translate>
+ {{ $gettext('Sprache') }}
<input type="text" v-model="currentLang" />
</label>
<label>
- <translate>Quelltext</translate>
+ {{ $gettext('Quelltext') }}
<textarea v-model="currentContent"></textarea>
</label>
</form>
</template>
<template #info>
- <p><translate>Informationen zum Quelltext-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Quelltext-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareConfirmBlock.vue b/resources/vue/components/courseware/CoursewareConfirmBlock.vue
index 2a3f9b5a4dd26abcf1c015f456283ff2bb23d58b..d3d04dd00767981dfa9488ffa512bebd80101ce0 100644
--- a/resources/vue/components/courseware/CoursewareConfirmBlock.vue
+++ b/resources/vue/components/courseware/CoursewareConfirmBlock.vue
@@ -12,7 +12,7 @@
>
<template #content>
<div class="cw-block-title">
- <translate>Bestätigung</translate>
+ {{ $gettext('Bestätigung') }}
</div>
<div class="cw-block-confirm-content">
<div class="cw-block-confirm-checkbox">
@@ -27,12 +27,12 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Text</translate>
+ {{ $gettext('Text') }}
<input type="text" v-model="currentText" />
</label>
</form>
</template>
- <template #info><translate>Informationen zum Bestätigungs-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Bestätigungs-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareDateBlock.vue b/resources/vue/components/courseware/CoursewareDateBlock.vue
index 21623f755796d8359714c5733d5243e2a8597668..1361b60a9779d6f7cf57d770f6e527c8547cee8c 100644
--- a/resources/vue/components/courseware/CoursewareDateBlock.vue
+++ b/resources/vue/components/courseware/CoursewareDateBlock.vue
@@ -14,37 +14,37 @@
<div class="cw-date-countdown-digit" data-countdown="days">
<div class="cw-date-countdown-number">{{ countdownDays }}</div>
<div v-show="countdownDays === '01'" class="cw-date-countdown-label-sg">
- <translate>Tag</translate>
+ {{ $gettext('Tag') }}
</div>
<div v-show="countdownDays !== '01'" class="cw-date-countdown-label-pl">
- <translate>Tage</translate>
+ {{ $gettext('Tage') }}
</div>
</div>
<div class="cw-date-countdown-digit" data-countdown="hours">
<div class="cw-date-countdown-number">{{ countdownHours }}</div>
<div v-show="countdownHours === '01'" class="cw-date-countdown-label-sg">
- <translate>Stunde</translate>
+ {{ $gettext('Stunde') }}
</div>
<div v-show="countdownHours !== '01'" class="cw-date-countdown-label-pl">
- <translate>Stunden</translate>
+ {{ $gettext('Stunden') }}
</div>
</div>
<div class="cw-date-countdown-digit" data-countdown="minutes">
<div class="cw-date-countdown-number">{{ countdownMinutes }}</div>
<div v-show="countdownMinutes === '01'" class="cw-date-countdown-label-sg">
- <translate>Minute</translate>
+ {{ $gettext('Minute') }}
</div>
<div v-show="countdownMinutes !== '01'" class="cw-date-countdown-label-pl">
- <translate>Minuten</translate>
+ {{ $gettext('Minuten') }}
</div>
</div>
<div class="cw-date-countdown-digit" data-countdown="seconds">
<div class="cw-date-countdown-number">{{ countdownSeconds }}</div>
<div v-show="countdownSeconds === '01'" class="cw-date-countdown-label-sg">
- <translate>Sekunde</translate>
+ {{ $gettext('Sekunde') }}
</div>
<div v-show="countdownSeconds !== '01'" class="cw-date-countdown-label-pl">
- <translate>Sekunden</translate>
+ {{ $gettext('Sekunden') }}
</div>
</div>
</div>
@@ -61,23 +61,23 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Datum</translate>
+ {{ $gettext('Datum') }}
<input type="date" v-model="currentDate" @change="computeTimestamp" />
</label>
<label>
- <translate>Uhrzeit</translate>
+ {{ $gettext('Uhrzeit') }}
<input type="time" v-model="currentTime" @change="computeTimestamp" />
</label>
<label>
- <translate>Layout</translate>
+ {{ $gettext('Layout') }}
<select v-model="currentStyle">
- <option value="countdown"><translate>Countdown</translate></option>
- <option value="date"><translate>Datum</translate></option>
+ <option value="countdown">{{ $gettext('Countdown') }}</option>
+ <option value="date">{{ $gettext('Datum') }}</option>
</select>
</label>
</form>
</template>
- <template #info><translate>Informationen zum Termin-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Termin-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareDialogCardsBlock.vue b/resources/vue/components/courseware/CoursewareDialogCardsBlock.vue
index 9c14597aaa45b089ef38ae222ee8e53831c035ff..4df490b4c73df2e92d555379a51b76d60d72c28d 100644
--- a/resources/vue/components/courseware/CoursewareDialogCardsBlock.vue
+++ b/resources/vue/components/courseware/CoursewareDialogCardsBlock.vue
@@ -56,7 +56,7 @@
</div>
</template>
<template v-if="canEdit" #edit>
- <button class="button add" @click="addCard"><translate>Karte hinzufügen</translate></button>
+ <button class="button add" @click="addCard">{{ $gettext('Karte hinzufügen') }}</button>
<courseware-tabs
v-if="currentCards.length > 0"
:setSelected="setCardTab"
@@ -72,7 +72,7 @@
>
<form class="default" @submit.prevent="">
<label>
- <translate>Bild Vorderseite</translate>:
+ {{ $gettext('Bild Vorderseite') }}:
<courseware-file-chooser
v-model="card.front_file_id"
:isImage="true"
@@ -81,11 +81,11 @@
/>
</label>
<label>
- <translate>Text Vorderseite</translate>:
+ {{ $gettext('Text Vorderseite') }}:
<input type="text" v-model="card.front_text" />
</label>
<label>
- <translate>Bild Rückseite</translate>:
+ {{ $gettext('Bild Rückseite') }}:
<courseware-file-chooser
v-model="card.back_file_id"
:isImage="true"
@@ -94,12 +94,12 @@
/>
</label>
<label>
- <translate>Text Rückseite</translate>:
+ {{ $gettext('Text Rückseite') }}:
<input type="text" v-model="card.back_text" />
</label>
<label v-if="!onlyCard">
<button class="button trash" @click="removeCard(index)">
- <translate>Karte entfernen</translate>
+ {{ $gettext('Karte entfernen') }}
</button>
</label>
</form>
@@ -107,7 +107,7 @@
</courseware-tabs>
</template>
<template #info>
- <p><translate>Informationen zum Lernkarten-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Lernkarten-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareDownloadBlock.vue b/resources/vue/components/courseware/CoursewareDownloadBlock.vue
index 403de4b0f9bd0e250b6aa3e361b0017300242f26..e642e79af1a699986a9c80f6be8cece384896c7c 100644
--- a/resources/vue/components/courseware/CoursewareDownloadBlock.vue
+++ b/resources/vue/components/courseware/CoursewareDownloadBlock.vue
@@ -35,41 +35,63 @@
</div>
<div v-else class="cw-block-download-content">
<div class="cw-block-download-file-item-not-available">
- <span class="cw-block-file-info cw-block-file-icon-none">
- <translate>Datei ist nicht verfügbar</translate>
- </span>
+ <span class="cw-block-file-info cw-block-file-icon-none">
+ {{ $gettext('Datei ist nicht verfügbar') }}
+ </span>
</div>
</div>
</template>
<template v-if="canEdit" #edit>
- <form class="default" @submit.prevent="">
- <label>
- <translate>Ãœberschrift</translate>
- <input type="text" v-model="currentTitle" />
- </label>
- <label>
- <translate>Datei</translate>
- <courseware-file-chooser v-model="currentFileId" @selectFile="updateCurrentFile" />
- </label>
- <label>
- <translate>Infobox vor Download</translate>
- <input type="text" v-model="currentInfo" />
- </label>
- <label>
- <translate>Infobox nach Download</translate>
- <input type="text" v-model="currentSuccess" />
- </label>
- <label>
- <translate>Fortschritt erst beim Herunterladen</translate>
- <select v-model="currentGrade">
- <option value="false"><translate>Nein</translate></option>
- <option value="true"><translate>Ja</translate></option>
- </select>
- </label>
- </form>
+ <courseware-tabs>
+ <courseware-tab
+ :index="0"
+ :name="$gettext('Datei')"
+ :selected="true"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Ãœberschrift') }}
+ <input type="text" v-model="currentTitle" />
+ </label>
+ <label>
+ {{ $gettext('Datei') }}
+ <courseware-file-chooser v-model="currentFileId" @selectFile="updateCurrentFile" />
+ </label>
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="1"
+ :name="$gettext('Infobox')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Infobox vor Download') }}
+ <input type="text" v-model="currentInfo" />
+ </label>
+ <label>
+ {{ $gettext('Infobox nach Download') }}
+ <input type="text" v-model="currentSuccess" />
+ </label>
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="2"
+ :name="$gettext('Fortschritt')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Fortschritt erst beim Herunterladen') }}
+ <select v-model="currentGrade">
+ <option value="false">{{ $gettext('Nein') }}</option>
+ <option value="true">{{ $gettext('Ja') }}</option>
+ </select>
+ </label>
+ </form>
+ </courseware-tab>
+ </courseware-tabs>
</template>
<template #info>
- <p><translate>Informationen zum Download-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Download-Block') }}</p>
</template>
</courseware-default-block>
</div>
@@ -78,6 +100,8 @@
<script>
import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
import CoursewareFileChooser from './CoursewareFileChooser.vue';
+import CoursewareTabs from './CoursewareTabs.vue';
+import CoursewareTab from './CoursewareTab.vue';
import { blockMixin } from './block-mixin.js';
import { mapActions, mapGetters } from 'vuex';
@@ -87,6 +111,8 @@ export default {
components: {
CoursewareDefaultBlock,
CoursewareFileChooser,
+ CoursewareTabs,
+ CoursewareTab,
},
props: {
block: Object,
diff --git a/resources/vue/components/courseware/CoursewareEmbedBlock.vue b/resources/vue/components/courseware/CoursewareEmbedBlock.vue
index 8ee8808fb926903db199cf86dbd63b1452506fb3..59457ce17145598be0916f4227d683e03f5f9f55 100644
--- a/resources/vue/components/courseware/CoursewareEmbedBlock.vue
+++ b/resources/vue/components/courseware/CoursewareEmbedBlock.vue
@@ -11,7 +11,7 @@
>
<template #content>
<div v-if="currentTitle !== ''" class="cw-block-title">{{ currentTitle }}</div>
- <div v-if="oembedData !== null">
+ <template v-if="oembedData">
<div
v-if="oembedData.type === 'rich' || oembedData.type === 'video'"
v-html="oembedData.html"
@@ -26,37 +26,37 @@
<div v-if="oembedData.type === 'link' && oembedData.provider_name === 'DeviantArt'">
<img :src="oembedData.fullsize_url" />
</div>
- </div>
- <div class="cw-block-embed-info" v-if="oembedData !== null">
- <span class="cw-block-embed-title">{{ oembedData.title }}</span>
- <span class="cw-block-embed-author-name">
- <translate>erstellt von</translate>
- <a :href="oembedData.author_url" target="_blank">{{ oembedData.author_name }}</a></span
- >
- <span class="cw-block-embed-source">
- <translate>veröffentlicht auf</translate>
- <a :href="oembedData.provider_url" target="_blank">{{ oembedData.provider_name }}</a></span
- >
- </div>
+ <div class="cw-block-embed-info">
+ <span class="cw-block-embed-title">{{ oembedData.title }}</span>
+ <span class="cw-block-embed-author-name">
+ {{ $gettext('erstellt von') }}
+ <a :href="oembedData.author_url" target="_blank">{{ oembedData.author_name }}</a></span
+ >
+ <span class="cw-block-embed-source">
+ {{ $gettext('veröffentlicht auf') }}
+ <a :href="oembedData.provider_url" target="_blank">{{ oembedData.provider_name }}</a></span
+ >
+ </div>
+ </template>
</template>
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Ãœberschrift</translate>
+ {{ $gettext('Ãœberschrift') }}
<input type="text" v-model="currentTitle" />
</label>
<label>
- <translate>Quelle</translate>
+ {{ $gettext('Quelle') }}
<select v-model="currentSource">
<option v-for="(value, key) in endPoints" :key="key" :value="key">{{ key }}</option>
</select>
</label>
<label>
- <translate>URL</translate>
+ {{ $gettext('URL') }}
<input type="text" v-model="currentUrl" />
</label>
- <label v-if="currentSource === 'youtube'">
- <translate>Startpunkt wählen</translate>
+ <label v-if="currentSource === 'youtube'" class="col-1">
+ {{ $gettext('Startpunkt') }}
<input
type="time"
v-model="currentStartTime"
@@ -66,8 +66,8 @@
@change="updateTime"
/>
</label>
- <label v-if="currentSource === 'youtube'">
- <translate>Endpunkt wählen</translate>
+ <label v-if="currentSource === 'youtube'" class="col-1">
+ {{ $gettext('Endpunkt') }}
<input
type="time"
v-model="currentEndTime"
@@ -80,7 +80,7 @@
</form>
</template>
<template #info>
- <p><translate>Informationen zum Embed-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Embed-Block') }}</p>
</template>
</courseware-default-block>
</div>
@@ -181,14 +181,14 @@ export default {
this.currentStartTime = this.startTime;
this.currentEndTime = this.endTime;
this.oembedData = this.oembed;
- if (this.oembedData !== null) {
+ if (this.oembedData) {
this.updateTime();
this.calcContentHeight();
}
},
recalculateContentHeight(data){
if (this.$parent._uid === data.uid) {
- if (this.oembedData !== null) {
+ if (this.oembedData) {
this.calcContentHeight();
}
}
diff --git a/resources/vue/components/courseware/CoursewareIframeBlock.vue b/resources/vue/components/courseware/CoursewareIframeBlock.vue
index 57c5c098b144ad6c7e5ef109c7ead10b8e4b342e..e1aa21e5b5d5415739593d2e214f013fb10e437e 100644
--- a/resources/vue/components/courseware/CoursewareIframeBlock.vue
+++ b/resources/vue/components/courseware/CoursewareIframeBlock.vue
@@ -22,82 +22,104 @@
<div v-if="currentCcInfo" class="cw-block-iframe-cc-data">
<span class="cw-block-iframe-cc" :class="['cw-block-iframe-cc-' + currentCcInfo]"></span>
<div class="cw-block-iframe-cc-infos">
- <p v-if="currentCcWork !== ''"><translate>Werk</translate> {{ currentCcWork }}</p>
- <p v-if="currentCcAuthor !== ''"><translate>Autor</translate> {{ currentCcAuthor }}</p>
- <p v-if="currentCcBase !== ''"><translate>Lizenz der Plattform</translate> {{ currentCcBase }}</p>
+ <p v-if="currentCcWork">{{ $gettext('Werk') }}: {{ currentCcWork }}</p>
+ <p v-if="currentCcAuthor">{{ $gettext('Autor') }}: {{ currentCcAuthor }}</p>
+ <p v-if="currentCcBase">{{ $gettext('Lizenz der Plattform') }}: {{ currentCcBase }}</p>
</div>
</div>
<div v-show="!currentUrl.includes('http')" :style="{ height: currentHeight + 'px' }"></div>
</template>
<template v-if="canEdit" #edit>
- <form class="default" @submit.prevent="">
- <label>
- <translate>Titel</translate>
- <input type="text" v-model="currentTitle" />
- </label>
- <label>
- <translate>URL</translate>
- <input type="text" v-model="currentUrl" @change="setProtocol" />
- </label>
- <label>
- <translate>Höhe</translate>
- <input type="number" v-model="currentHeight" min="0" />
- </label>
- <label>
- <translate>Nutzerspezifische ID übergeben</translate>
- <select v-model="currentSubmitUserId">
- <option value="false"><translate>Nein</translate></option>
- <option value="true"><translate>Ja</translate></option>
- </select>
- </label>
+ <courseware-tabs>
+ <courseware-tab
+ :index="0"
+ :name="$gettext('Grunddaten')"
+ :selected="true"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Titel') }}
+ <input type="text" v-model="currentTitle" />
+ </label>
+ <label>
+ {{ $gettext('URL') }}
+ <input type="text" v-model="currentUrl" @change="setProtocol" />
+ </label>
+ <label>
+ {{ $gettext('Höhe') }}
+ <input type="number" v-model="currentHeight" min="0" />
+ </label>
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="1"
+ :name="$gettext('Nutzerspezifische ID')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Nutzerspezifische ID übergeben') }}
+ <select v-model="currentSubmitUserId">
+ <option value="false">{{ $gettext('Nein') }}</option>
+ <option value="true">{{ $gettext('Ja') }}</option>
+ </select>
+ </label>
- <label v-if="currentSubmitUserId === 'true'">
- <translate>Name des Ãœbergabeparameters</translate>
- <input type="text" v-model="currentSubmitParam" />
- </label>
- <label v-if="currentSubmitUserId === 'true'">
- <translate>Zufallszeichen für Verschlüsselung (Salt)</translate>
- <input type="text" v-model="currentSalt" />
- </label>
- <label>
- <translate>Creative Commons Angaben</translate>
- <select v-model="currentCcInfo">
- <option value="false"><translate>Keine</translate></option>
- <option value="by">(by) <translate>Namensnennung</translate></option>
- <option value="by-sa">
- (by-sa) <translate>Namensnennung & Weitergabe unter gleichen Bedingungen</translate>
- </option>
- <option value="by-nc">
- (by-nc) <translate>Namensnennung & Nicht kommerziell</translate>
- </option>
- <option value="by-nd">
- (by-nd) <translate>Namensnennung & Keine Bearbeitung</translate>
- </option>
- <option value="by-nc-nd">
- (by-nc-nd) <translate>Namensnennung & Nicht kommerziell & Keine Bearbeitung</translate>
- </option>
- <option value="by-nc-sa">
- (by-nc-sa)
- <translate>Namensnennung & Nicht kommerziell & Weitergabe unter gleichen Bedingungen</translate>
- </option>
- </select>
- </label>
- <label v-if="currentCcInfo !== 'false'">
- CC <translate>Werk</translate>
- <input type="text" v-model="currentCcWork" />
- </label>
- <label v-if="currentCcInfo !== 'false'">
- CC <translate>Author</translate>
- <input type="text" v-model="currentCcAuthor" />
- </label>
- <label v-if="currentCcInfo !== 'false'">
- CC <translate>Lizenz der Plattform</translate>
- <input type="text" v-model="currentCcBase" />
- </label>
- </form>
+ <label v-if="currentSubmitUserId === 'true'">
+ {{ $gettext('Name des Ãœbergabeparameters') }}
+ <input type="text" v-model="currentSubmitParam" />
+ </label>
+ <label v-if="currentSubmitUserId === 'true'">
+ {{ $gettext('Zufallszeichen für Verschlüsselung (Salt)') }}
+ <input type="text" v-model="currentSalt" />
+ </label>
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="2"
+ :name="$gettext('Creative Commons')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Creative Commons Lizenz') }}
+ <select v-model="currentCcInfo">
+ <option value="false">{{ $gettext('Keine') }}</option>
+ <option value="by">(by) {{ $gettext('Namensnennung') }}</option>
+ <option value="by-sa">
+ (by-sa) {{ $gettext('Namensnennung & Weitergabe unter gleichen Bedingungen') }}
+ </option>
+ <option value="by-nc">
+ (by-nc) {{ $gettext('Namensnennung & Nicht kommerziell') }}
+ </option>
+ <option value="by-nd">
+ (by-nd) {{ $gettext('Namensnennung & Keine Bearbeitung') }}
+ </option>
+ <option value="by-nc-nd">
+ (by-nc-nd) {{ $gettext('Namensnennung & Nicht kommerziell & Keine Bearbeitung') }}
+ </option>
+ <option value="by-nc-sa">
+ (by-nc-sa)
+ {{ $gettext('Namensnennung & Nicht kommerziell & Weitergabe unter gleichen Bedingungen') }}
+ </option>
+ </select>
+ </label>
+ <label v-if="currentCcInfo !== 'false'">
+ CC {{ $gettext('Werk') }}
+ <input type="text" v-model="currentCcWork" />
+ </label>
+ <label v-if="currentCcInfo !== 'false'">
+ CC {{ $gettext('Author') }}
+ <input type="text" v-model="currentCcAuthor" />
+ </label>
+ <label v-if="currentCcInfo !== 'false'">
+ CC {{ $gettext('Lizenz der Plattform') }}
+ <input type="text" v-model="currentCcBase" />
+ </label>
+ </form>
+ </courseware-tab>
+ </courseware-tabs>
</template>
<template #info>
- <p><translate>Informationen zum IFrame-Block</translate></p>
+ <p>{{ $gettext('Informationen zum IFrame-Block') }}</p>
</template>
</courseware-default-block>
</div>
@@ -105,6 +127,8 @@
<script>
import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
+import CoursewareTabs from './CoursewareTabs.vue';
+import CoursewareTab from './CoursewareTab.vue';
import { blockMixin } from './block-mixin.js';
import { mapActions, mapGetters } from 'vuex';
import md5 from 'md5';
@@ -114,6 +138,8 @@ export default {
mixins: [blockMixin],
components: {
CoursewareDefaultBlock,
+ CoursewareTabs,
+ CoursewareTab,
},
props: {
block: Object,
diff --git a/resources/vue/components/courseware/CoursewareImageMapBlock.vue b/resources/vue/components/courseware/CoursewareImageMapBlock.vue
index a3dd875eef15678a8ec11b6fd70524b87c467b3f..cfcd8f769dee4ac6b1fdcda68e456cdb47679773 100644
--- a/resources/vue/components/courseware/CoursewareImageMapBlock.vue
+++ b/resources/vue/components/courseware/CoursewareImageMapBlock.vue
@@ -71,7 +71,7 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Bilddatei</translate>
+ {{ $gettext('Bilddatei') }}
<courseware-file-chooser
v-model="currentFileId"
:isImage="true"
@@ -79,9 +79,9 @@
/>
</label>
<label>
- <a class="button add" @click="addShape('arc')"><translate>Kreis hinzufügen</translate></a>
- <a class="button add" @click="addShape('ellipse')"><translate>Oval hinzufügen</translate></a>
- <a class="button add" @click="addShape('rect')"><translate>Rechteck hinzufügen</translate></a>
+ <a class="button add" @click="addShape('arc')">{{ $gettext('Kreis hinzufügen') }}</a>
+ <a class="button add" @click="addShape('ellipse')">{{ $gettext('Oval hinzufügen') }}</a>
+ <a class="button add" @click="addShape('rect')">{{ $gettext('Rechteck hinzufügen') }}</a>
</label>
<courseware-tabs v-if="currentShapes.length > 0">
<courseware-tab
@@ -92,8 +92,8 @@
:icon="shape.title === '' ? 'link-extern' : ''"
:selected="index === 0"
>
- <label>
- <translate>Farbe</translate>
+ <label class="col-2">
+ {{ $gettext('Farbe') }}
<studip-select
:options="colors"
label="name"
@@ -106,7 +106,7 @@
<span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
</template>
<template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
</template>
<template #selected-option="{name, rgba}">
<span class="vs__option-color" :style="{'background-color': rgba}"></span><span>{{name}}</span>
@@ -116,38 +116,8 @@
</template>
</studip-select>
</label>
- <label v-if="shape.type === 'arc'" class="cw-block-image-map-dimensions">
- X: <input type="number" v-model="shape.data.centerX" @change="drawScreen" /> Y:
- <input type="number" v-model="shape.data.centerY" @change="drawScreen" />
- <translate>Radius</translate>
- <input type="number" v-model="shape.data.radius" @change="drawScreen" />
- </label>
- <label v-if="shape.type === 'rect'" class="cw-block-image-map-dimensions">
- X: <input type="number" v-model="shape.data.X" @change="drawScreen" /> Y:
- <input type="number" v-model="shape.data.Y" @change="drawScreen" />
- <translate>Höhe</translate>
- <input type="number" v-model="shape.data.height" @change="drawScreen" />
- <translate>Breite</translate>
- <input type="number" v-model="shape.data.width" @change="drawScreen" />
- </label>
- <label v-if="shape.type === 'ellipse'" class="cw-block-image-map-dimensions">
- X: <input type="number" v-model="shape.data.X" @change="drawScreen" /> Y:
- <input type="number" v-model="shape.data.Y" @change="drawScreen" />
- <translate>Radius</translate> X:
- <input type="number" v-model="shape.data.radiusX" @change="drawScreen" />
- <translate>Radius</translate> Y:
- <input type="number" v-model="shape.data.radiusY" @change="drawScreen" />
- </label>
- <label>
- <translate>Bezeichnung</translate>
- <input type="text" v-model="shape.title" />
- </label>
- <label>
- <translate>Beschriftung</translate>
- <input type="text" v-model="shape.data.text" @change="drawScreen" />
- </label>
- <label>
- <translate>Textfarbe</translate>
+ <label class="col-2">
+ {{ $gettext('Textfarbe') }}
<studip-select
:options="colors"
label="name"
@@ -160,7 +130,7 @@
<span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
</template>
<template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
</template>
<template #selected-option="{name, rgba}">
<span class="vs__option-color" :style="{'background-color': rgba}"></span><span>{{name}}</span>
@@ -170,23 +140,83 @@
</template>
</studip-select>
</label>
- <label>
- <translate>Art des Links</translate>
+ <br>
+ <template v-if="shape.type === 'arc'">
+ <label class="col-1">
+ X
+ <input type="number" v-model="shape.data.centerX" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ Y
+ <input type="number" v-model="shape.data.centerY" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ {{ $gettext('Radius') }}
+ <input type="number" v-model="shape.data.radius" @change="drawScreen" />
+ </label>
+ </template>
+ <template v-if="shape.type === 'rect'">
+ <label class="col-1">
+ X
+ <input type="number" v-model="shape.data.X" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ Y
+ <input type="number" v-model="shape.data.Y" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ {{ $gettext('Höhe') }}
+ <input type="number" v-model="shape.data.height" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ {{ $gettext('Breite') }}
+ <input type="number" v-model="shape.data.width" @change="drawScreen" />
+ </label>
+ </template>
+ <template v-if="shape.type === 'ellipse'">
+ <label class="col-1">
+ X
+ <input type="number" v-model="shape.data.X" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ Y
+ <input type="number" v-model="shape.data.Y" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ {{ $gettext('Radius') }} X
+ <input type="number" v-model="shape.data.radiusX" @change="drawScreen" />
+ </label>
+ <label class="col-1">
+ {{ $gettext('Radius') }} Y
+ <input type="number" v-model="shape.data.radiusY" @change="drawScreen" />
+ </label>
+ </template>
+ <label class="col-4">
+ {{ $gettext('Bezeichnung') }}
+ <input type="text" v-model="shape.title" />
+ </label>
+ <label class="col-4">
+ {{ $gettext('Beschriftung') }}
+ <input type="text" v-model="shape.data.text" @change="drawScreen" />
+ </label>
+ <br>
+ <label class="col-2">
+ {{ $gettext('Art des Links') }}
<select v-model="shape.link_type">
- <option value="internal"><translate>Interner Link</translate></option>
- <option value="external"><translate>Externer Link</translate></option>
+ <option value="internal">{{ $gettext('Interner Link') }}</option>
+ <option value="external">{{ $gettext('Externer Link') }}</option>
</select>
</label>
- <label v-if="shape.link_type === 'internal'">
- <translate>Ziel des Links</translate>
+ <label v-if="shape.link_type === 'internal'" class="col-2">
+ {{ $gettext('Ziel des Links') }}
<select v-model="shape.target_internal" @change="drawScreen">
<option v-for="(el, index) in courseware" :key="index" :value="el.id">
{{ el.attributes.title }}
</option>
</select>
</label>
- <label v-if="shape.link_type === 'external'">
- <translate>Ziel des Links</translate>
+ <label v-if="shape.link_type === 'external'" class="col-2">
+ {{ $gettext('Ziel des Links') }}
<input
type="text"
placeholder="https://www.studip.de"
@@ -199,7 +229,7 @@
</label>
<label>
<a class="button cancel" @click="removeShape(index)"
- ><translate>Form entfernen</translate></a
+ >{{ $gettext('Form entfernen') }}</a
>
</label>
</courseware-tab>
@@ -207,7 +237,7 @@
</form>
</template>
<template #info>
- <p><translate>Informationen zum Verweissensitive-Grafik-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Verweissensitive-Grafik-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareKeyPointBlock.vue b/resources/vue/components/courseware/CoursewareKeyPointBlock.vue
index b495431d6c95c2cfb267a86855f029cd2c8b1708..687ea0b589e28cabbda4c1db99f3d2be867b3032 100644
--- a/resources/vue/components/courseware/CoursewareKeyPointBlock.vue
+++ b/resources/vue/components/courseware/CoursewareKeyPointBlock.vue
@@ -17,8 +17,8 @@
</template>
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
- <label for="cw-keypoint-content">
- <translate>Merksatz</translate>
+ <label class="col-4">
+ {{ $gettext('Merksatz') }}
<input
type="text"
name="cw-keypoint-content"
@@ -27,9 +27,9 @@
spellcheck="true"
/>
</label>
-
- <label for="cw-keypoint-color">
- <translate>Farbe</translate>
+ <br>
+ <label class="col-2">
+ {{ $gettext('Farbe') }}
<studip-select
:options="colors"
label="icon"
@@ -41,7 +41,7 @@
<span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
</template>
<template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
</template>
<template #selected-option="{name, hex}">
<span class="vs__option-color" :style="{'background-color': hex}"></span><span>{{name}}</span>
@@ -51,15 +51,14 @@
</template>
</studip-select>
</label>
-
- <label for="cw-keypoint-icons">
- <translate>Icon</translate>
+ <label class="col-2">
+ {{ $gettext('Icon') }}
<studip-select :options="icons" :clearable="false" v-model="currentIcon">
<template #open-indicator="selectAttributes">
<span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
</template>
<template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
</template>
<template #selected-option="option">
<studip-icon :shape="option.label"/> <span class="vs__option-with-icon">{{option.label}}</span>
@@ -72,7 +71,7 @@
</form>
</template>
<template #info>
- <p><translate>Informationen zum Merksatz-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Merksatz-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareLinkBlock.vue b/resources/vue/components/courseware/CoursewareLinkBlock.vue
index 9d65163c55edb662c9e5e880400fa14778696a5e..f2c8cf931497d6cb750fa01fee18dfb688dc76d2 100644
--- a/resources/vue/components/courseware/CoursewareLinkBlock.vue
+++ b/resources/vue/components/courseware/CoursewareLinkBlock.vue
@@ -30,22 +30,22 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Titel</translate>
+ {{ $gettext('Titel') }}
<input type="text" v-model="currentTitle" />
</label>
<label>
- <translate>Art des Links</translate>
+ {{ $gettext('Art des Links') }}
<select v-model="currentType">
- <option value="external"><translate>Extern</translate></option>
- <option value="internal"><translate>Intern</translate></option>
+ <option value="external">{{ $gettext('Extern') }}</option>
+ <option value="internal">{{ $gettext('Intern') }}</option>
</select>
</label>
<label v-show="currentType === 'external'">
- <translate>URL</translate>
+ {{ $gettext('URL') }}
<input type="text" v-model="currentUrl" @change="fixUrl" />
</label>
<label v-show="currentType === 'internal'">
- <translate>Seite</translate>
+ {{ $gettext('Seite') }}
<select v-model="currentTarget">
<option v-for="(el, index) in courseware" :key="index" :value="el.id">
{{ el.attributes.title }}
@@ -55,7 +55,7 @@
</form>
</template>
<template #info>
- <p><translate>Informationen zum Link-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Link-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareTableOfContentsBlock.vue b/resources/vue/components/courseware/CoursewareTableOfContentsBlock.vue
index c55399b71a71db65a4453ed8b596d0c8e5992695..e495323787acdc8fd245593c415ad30e96169306 100644
--- a/resources/vue/components/courseware/CoursewareTableOfContentsBlock.vue
+++ b/resources/vue/components/courseware/CoursewareTableOfContentsBlock.vue
@@ -77,20 +77,20 @@
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
<label>
- <translate>Ãœberschrift</translate>
+ {{ $gettext('Ãœberschrift') }}
<input type="text" v-model="currentTitle" />
</label>
<label>
- <translate>Layout</translate>
+ {{ $gettext('Layout') }}
<select v-model="currentStyle">
- <option value="list"><translate>Liste</translate></option>
- <option value="list-details"><translate>Liste mit Beschreibung</translate></option>
- <option value="tiles"><translate>Kacheln</translate></option>
+ <option value="list">{{ $gettext('Liste') }}</option>
+ <option value="list-details">{{ $gettext('Liste mit Beschreibung') }}</option>
+ <option value="tiles">{{ $gettext('Kacheln') }}</option>
</select>
</label>
</form>
</template>
- <template #info><translate>Informationen zum Inhaltsverzeichnis-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Inhaltsverzeichnis-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareTextBlock.vue b/resources/vue/components/courseware/CoursewareTextBlock.vue
index 5a6f87111da57fb21f51eb66bc145a432665a570..7367cf82c680018515e746ff2d43c0ac9f37b25d 100644
--- a/resources/vue/components/courseware/CoursewareTextBlock.vue
+++ b/resources/vue/components/courseware/CoursewareTextBlock.vue
@@ -16,7 +16,7 @@
<template v-if="canEdit" #edit>
<ckeditor :editor="editor" v-model="currentText" :config="editorConfig" @ready="onReady"></ckeditor>
</template>
- <template #info><translate>Informationen zum Text-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Text-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareTimelineBlock.vue b/resources/vue/components/courseware/CoursewareTimelineBlock.vue
index 31a678c76e7830fc5b4c020d145077145d8fee91..1cc5d4d9204f522545bab1dd42528eb5c0f948f4 100644
--- a/resources/vue/components/courseware/CoursewareTimelineBlock.vue
+++ b/resources/vue/components/courseware/CoursewareTimelineBlock.vue
@@ -35,27 +35,26 @@
</template>
<template v-if="canEdit" #edit>
<form class="default" @submit.prevent="">
- <label>
- <translate>Zeitliche Sortierung</translate>
+ <label class="col-2">
+ {{ $gettext('Zeitliche Sortierung') }}
<select v-model="currentSort">
- <option value="none"><translate>Keine</translate></option>
- <option value="asc"><translate>Aufsteigend</translate></option>
- <option value="desc"><translate>Absteigend</translate></option>
+ <option value="none">{{ $gettext('Keine') }}</option>
+ <option value="asc">{{ $gettext('Aufsteigend') }}</option>
+ <option value="desc">{{ $gettext('Absteigend') }}</option>
</select>
</label>
-
- <label>
- <translate>Zeitangabe</translate>
+ <label class="col-2">
+ {{ $gettext('Zeitangabe') }}
<select v-model="currentDateFormat">
- <option value="year"><translate>Jahr</translate></option>
- <option value="date"><translate>Datum</translate></option>
- <option value="time"><translate>Zeit</translate></option>
- <option value="datetime"><translate>Datum und Zeit</translate></option>
- <option value="none"><translate>Keine</translate></option>
+ <option value="year">{{ $gettext('Jahr') }}</option>
+ <option value="date">{{ $gettext('Datum') }}</option>
+ <option value="time">{{ $gettext('Zeit') }}</option>
+ <option value="datetime">{{ $gettext('Datum und Zeit') }}</option>
+ <option value="none">{{ $gettext('Keine') }}</option>
</select>
</label>
</form>
- <button class="button add" @click="addItem"><translate>Ereignis hinzufügen</translate></button>
+ <button class="button add" @click="addItem">{{ $gettext('Ereignis hinzufügen') }}</button>
<courseware-tabs
v-if="currentItems.length > 0"
:setSelected="setItemTab"
@@ -70,16 +69,18 @@
canBeEmpty
>
<form class="default" @submit.prevent="">
- <label>
- <translate>Titel</translate>
+ <label class="col-4">
+ {{ $gettext('Titel') }}
<input type="text" v-model="item.title" />
</label>
- <label>
- <translate>Beschreibung</translate>
+ <label class="col-4">
+
+ {{ $gettext('Beschreibung') }}
<textarea v-model="item.description" />
</label>
- <label>
- <translate>Farbe</translate>
+ <br>
+ <label class="col-2">
+ {{ $gettext('Farbe') }}
<studip-select
:options="colors"
label="icon"
@@ -91,7 +92,7 @@
<span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
</template>
<template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
</template>
<template #selected-option="{name, hex}">
<span class="vs__option-color" :style="{'background-color': hex}"></span><span>{{name}}</span>
@@ -101,14 +102,14 @@
</template>
</studip-select>
</label>
- <label>
- <translate>Icon</translate>
+ <label class="col-2">
+ {{ $gettext('Icon') }}
<studip-select :options="icons" :clearable="false" v-model="item.icon">
<template #open-indicator="selectAttributes">
<span v-bind="selectAttributes"><studip-icon shape="arr_1down" size="10"/></span>
</template>
<template #no-options>
- <translate>Es steht keine Auswahl zur Verfügung.</translate>
+ {{ $gettext('Es steht keine Auswahl zur Verfügung.') }}
</template>
<template #selected-option="option">
<studip-icon :shape="option.label"/> <span class="vs__option-with-icon">{{option.label}}</span>
@@ -118,24 +119,25 @@
</template>
</studip-select>
</label>
- <label>
- <translate>Datum</translate>
+ <br>
+ <label class="col-1">
+ {{ $gettext('Datum') }}
<input type="date" v-model="item.date" required/>
</label>
- <label>
- <translate>Zeit</translate>
+ <label class="col-1">
+ {{ $gettext('Zeit') }}
<input type="time" v-model="item.time" />
</label>
<label v-if="currentItems.length > 1">
<button class="button trash" @click="removeItem(index)">
- <translate>Ereignis entfernen</translate>
+ {{ $gettext('Ereignis entfernen') }}
</button>
</label>
</form>
</courseware-tab>
</courseware-tabs>
</template>
- <template #info><translate>Informationen zum Zeitstrahl-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Zeitstrahl-Block') }}</template>
</courseware-default-block>
</div>
</template>
diff --git a/resources/vue/components/courseware/CoursewareTypewriterBlock.vue b/resources/vue/components/courseware/CoursewareTypewriterBlock.vue
index 14c7072034478e232663690a45bcfae748337ac4..234f2aa5907cb96abe5189156f67f85b15c5be52 100644
--- a/resources/vue/components/courseware/CoursewareTypewriterBlock.vue
+++ b/resources/vue/components/courseware/CoursewareTypewriterBlock.vue
@@ -22,45 +22,45 @@
</div>
</template>
<template v-if="canEdit" #edit>
- <label class="cw-typewriter-content-label">
- <translate>Text</translate>
- <textarea v-model="currentText" name="cw-typewriter-content" class="cw-typewriter-content"></textarea>
- </label>
-
- <label class="cw-typewriter-speed-label">
- <translate>Geschwindigkeit</translate>
- <select v-model="currentSpeed" class="cw-typewriter-speed" name="cw-typewriter-speed" @change="restartTyping">
- <option value="0"><translate>Langsam</translate></option>
- <option value="1"><translate>Normal</translate></option>
- <option value="2"><translate>Schnell</translate></option>
- <option value="3"><translate>Sehr schnell</translate></option>
- </select>
- </label>
-
- <label class="cw-typewriter-font-label">
- <translate>Schriftart</translate>
- <select v-model="currentFont" class="cw-typewriter-font" name="cw-typewriter-font">
- <option value="font-default"><translate>Standard</translate></option>
- <option value="font-typewriter">Lucida Sans Typewriter</option>
- <option value="font-trebuchet">Trebuchet MS</option>
- <option value="font-tahoma">Tahoma</option>
- <option value="font-georgia">Georgia</option>
- <option value="font-narrow">Arial Narrow</option>
- </select>
- </label>
-
- <label class="cw-typewriter-size-label">
- <translate>Schriftgröße</translate>
- <select v-model="currentSize" class="cw-typewriter-size" name="cw-typewriter-size">
- <option value="size-default">100%</option>
- <option value="size-tall">125%</option>
- <option value="size-grande">150%</option>
- <option value="size-huge">200%</option>
- </select>
- </label>
+ <form class="default" @submit.prevent="">
+ <label class="col-4">
+ {{ $gettext('Text') }}
+ <textarea v-model="currentText" />
+ </label>
+ <br>
+ <label class="col-1">
+ {{ $gettext('Geschwindigkeit') }}
+ <select v-model="currentSpeed" @change="restartTyping">
+ <option value="0">{{ $gettext('Langsam') }}</option>
+ <option value="1">{{ $gettext('Normal') }}</option>
+ <option value="2">{{ $gettext('Schnell') }}</option>
+ <option value="3">{{ $gettext('Sehr schnell') }}</option>
+ </select>
+ </label>
+ <label class="col-1">
+ {{ $gettext('Schriftart') }}
+ <select v-model="currentFont">
+ <option value="font-default">{{ $gettext('Standard') }}</option>
+ <option value="font-typewriter">Lucida Sans Typewriter</option>
+ <option value="font-trebuchet">Trebuchet MS</option>
+ <option value="font-tahoma">Tahoma</option>
+ <option value="font-georgia">Georgia</option>
+ <option value="font-narrow">Arial Narrow</option>
+ </select>
+ </label>
+ <label class="col-1">
+ {{ $gettext('Schriftgröße') }}
+ <select v-model="currentSize">
+ <option value="size-default">100%</option>
+ <option value="size-tall">125%</option>
+ <option value="size-grande">150%</option>
+ <option value="size-huge">200%</option>
+ </select>
+ </label>
+ </form>
</template>
<template #info>
- <p><translate>Informationen zum Schreibmaschinen-Block</translate></p>
+ <p>{{ $gettext('Informationen zum Schreibmaschinen-Block') }}</p>
</template>
</courseware-default-block>
</div>
diff --git a/resources/vue/components/courseware/CoursewareVideoBlock.vue b/resources/vue/components/courseware/CoursewareVideoBlock.vue
index 40f7e9679dcd202622716b551495e00ef777e79d..66c3cf289a1bd42ff60908cfcc9b993bb514ea96 100644
--- a/resources/vue/components/courseware/CoursewareVideoBlock.vue
+++ b/resources/vue/components/courseware/CoursewareVideoBlock.vue
@@ -21,54 +21,70 @@
/>
</template>
<template v-if="canEdit" #edit>
- <form class="default" @submit.prevent="">
- <label>
- <translate>Ãœberschrift</translate>
- <input type="text" v-model="currentTitle" />
- </label>
- <label>
- <translate>Quelle</translate>
- <select v-model="currentSource">
- <option value="studip"><translate>Dateibereich</translate></option>
- <option value="web"><translate>Web-Adresse</translate></option>
- </select>
- </label>
- <label v-show="currentSource === 'web'">
- <translate>URL</translate>
- <input type="text" v-model="currentWebUrl" />
- </label>
- <label v-show="currentSource === 'studip'">
- <translate>Datei</translate>
- <courseware-file-chooser
- v-model="currentFileId"
- :isVideo="true"
- @selectFile="updateCurrentFile"
- />
- </label>
- <label>
- <translate>Seitenverhältnis</translate>
- <select v-model="currentAspect">
- <option value="169">16:9</option>
- <option value="43">4:3</option>
- </select>
- </label>
- <label>
- <translate>Video startet automatisch</translate>
- <select v-model="currentAutoplay">
- <option value="disabled"><translate>Nein</translate></option>
- <option value="enabled"><translate>Ja</translate></option>
- </select>
- </label>
- <label>
- <translate>Contextmenü</translate>
- <select v-model="currentContextMenu">
- <option value="enabled"><translate>Erlauben</translate></option>
- <option value="disabled"><translate>Verhindern</translate></option>
- </select>
- </label>
- </form>
+ <courseware-tabs>
+ <courseware-tab
+ :index="0"
+ :name="$gettext('Grunddaten')"
+ :selected="true"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Ãœberschrift') }}
+ <input type="text" v-model="currentTitle" />
+ </label>
+ <label>
+ {{ $gettext('Quelle') }}
+ <select v-model="currentSource">
+ <option value="studip">{{ $gettext('Dateibereich') }}</option>
+ <option value="web">{{ $gettext('Web-Adresse') }}</option>
+ </select>
+ </label>
+ <label v-show="currentSource === 'web'">
+ {{ $gettext('URL') }}
+ <input type="text" v-model="currentWebUrl" />
+ </label>
+ <label v-show="currentSource === 'studip'">
+ {{ $gettext('Datei') }}
+ <courseware-file-chooser
+ v-model="currentFileId"
+ :isVideo="true"
+ @selectFile="updateCurrentFile"
+ />
+ </label>
+
+ </form>
+ </courseware-tab>
+ <courseware-tab
+ :index="1"
+ :name="$gettext('Video Einstellungen')"
+ >
+ <form class="default" @submit.prevent="">
+ <label>
+ {{ $gettext('Seitenverhältnis') }}
+ <select v-model="currentAspect">
+ <option value="169">16:9</option>
+ <option value="43">4:3</option>
+ </select>
+ </label>
+ <label>
+ {{ $gettext('Video startet automatisch') }}
+ <select v-model="currentAutoplay">
+ <option value="disabled">{{ $gettext('Nein') }}</option>
+ <option value="enabled">{{ $gettext('Ja') }}</option>
+ </select>
+ </label>
+ <label>
+ {{ $gettext('Contextmenü') }}
+ <select v-model="currentContextMenu">
+ <option value="enabled">{{ $gettext('Erlauben') }}</option>
+ <option value="disabled">{{ $gettext('Verhindern') }}</option>
+ </select>
+ </label>
+ </form>
+ </courseware-tab>
+ </courseware-tabs>
</template>
- <template #info><translate>Informationen zum Video-Block</translate></template>
+ <template #info>{{ $gettext('Informationen zum Video-Block') }}</template>
</courseware-default-block>
</div>
</template>
@@ -76,6 +92,8 @@
<script>
import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
import CoursewareFileChooser from './CoursewareFileChooser.vue';
+import CoursewareTabs from './CoursewareTabs.vue';
+import CoursewareTab from './CoursewareTab.vue';
import { blockMixin } from './block-mixin.js';
import { mapActions, mapGetters } from 'vuex';
@@ -85,6 +103,8 @@ export default {
components: {
CoursewareDefaultBlock,
CoursewareFileChooser,
+ CoursewareTabs,
+ CoursewareTab,
},
props: {
block: Object,