Commit 667500c1 authored by Curtis Adam's avatar Curtis Adam

Vocabulary card editor: Open the deepl translation if the card side got changed with the tab-key

parent ca85c070
......@@ -7,6 +7,7 @@
@import '../imports/ui/cardset/cardset.scss';
@import '../imports/ui/filter/index/item/cardset.scss';
@import '../imports/ui/card/card.scss';
@import '../imports/ui/card/editor/editor.scss';
@import '../imports/ui/card/sidebar/sidebar.scss';
@import '../imports/ui/card/sidebar/item/zoomText.scss';
@import '../imports/ui/card/navigation/navigation.scss';
......
......@@ -750,7 +750,7 @@ $themes: (
}
}
.hintContent .close {
.modal-content .close {
color: $thm_orange;
}
......
......@@ -5,6 +5,7 @@ import {Route} from "./route.js";
import {CardNavigation} from "./cardNavigation";
import {Cardsets} from "./cardsets";
import {BertAlertVisuals} from "./bertAlertVisuals";
import {CardVisuals} from "./cardVisuals";
const subjectMaxLength = 255;
const contentMaxLength = 300000;
......@@ -42,6 +43,10 @@ export let CardEditor = class CardEditor {
return cardNavigationName;
}
static getCardNavigationNameIndex () {
return editorButtons.indexOf(this.getCardNavigationName());
}
static getLearningGoalLevelGroupName () {
return learningGoalLevelGroupName;
}
......@@ -72,13 +77,25 @@ export let CardEditor = class CardEditor {
}
static setEditorButtonFocus () {
if (CardVisuals.isFullscreen() && editorButtons[editorButtonIndex] !== cardNavigationName) {
editorButtonIndex = this.getCardNavigationNameIndex();
firstCardNavigationCall = true;
}
if (editorButtons[editorButtonIndex] === cardNavigationName) {
if (firstCardNavigationCall) {
CardNavigation.setActiveNavigationButton(0);
firstCardNavigationCall = false;
CardNavigation.cardSideNavigation();
} else {
if (CardType.gotDictionary(Session.get('cardType')) && (!CardVisuals.isFullscreen() || (CardVisuals.isFullscreen() && CardVisuals.isEditorFullscreen()))) {
$('#cardEditorModalDeepLTranslation').modal('show').one('hidden.bs.modal', function () {
CardNavigation.cardSideNavigation();
});
} else {
CardNavigation.cardSideNavigation();
}
}
CardNavigation.cardSideNavigation();
} else {
} else if (!CardVisuals.isFullscreen()) {
$(editorButtons[editorButtonIndex]).focus();
if (editorButtonIndex < (editorButtons.length - 1)) {
editorButtonIndex++;
......
......@@ -5,11 +5,34 @@ import {Cards} from "./cards";
import {Cardsets} from "./cardsets";
import {Route} from "./route";
import {CardType} from "./cardTypes";
import {CardNavigation} from "./cardNavigation";
import {CardVisuals} from "./cardVisuals";
let cardIndex = [];
export let CardIndex = class CardIndex {
static getCards () {
let result;
if (Route.isBox()) {
result = this.getLeitnerCards();
}
if (Route.isCardset() || Route.isPresentation() || Route.isDemo() || Route.isMakingOf()) {
result = this.getCardsetCards();
}
if (Route.isMemo()) {
result = this.getMemoCards();
}
if (Route.isEditMode()) {
result = this.getEditModeCard();
Session.set('activeCard', -1);
}
if (Session.get('activeCard') === undefined && result[0] !== undefined) {
CardNavigation.setActiveCardData(result[0]._id);
}
return CardVisuals.setTypeAndDifficulty(result);
}
static getCardIndex () {
return cardIndex;
}
......
......@@ -330,8 +330,12 @@ export let CardNavigation = class CardNavigation {
if (keyCodes.indexOf(event.keyCode) > -1) {
switch (event.keyCode) {
case 9:
if (Route.isEditMode() && !CardVisuals.isFullscreen()) {
CardEditor.setEditorButtonFocus();
if (Route.isEditMode()) {
if (Session.get('isDeepLModalVisible')) {
$('#cardEditorModalDeepLTranslation').modal('hide');
} else {
CardEditor.setEditorButtonFocus();
}
} else {
CardNavigation.cardSideNavigation();
}
......
......@@ -109,24 +109,7 @@ Template.flashcards.helpers({
return Route.isCardset();
},
getCards: function () {
let result;
if (Route.isBox()) {
result = CardIndex.getLeitnerCards();
}
if (Route.isCardset() || Route.isPresentation() || Route.isDemo() || Route.isMakingOf()) {
result = CardIndex.getCardsetCards();
}
if (Route.isMemo()) {
result = CardIndex.getMemoCards();
}
if (Route.isEditMode()) {
result = CardIndex.getEditModeCard();
Session.set('activeCard', -1);
}
if (Session.get('activeCard') === undefined && result[0] !== undefined) {
CardNavigation.setActiveCardData(result[0]._id);
}
return CardVisuals.setTypeAndDifficulty(result);
return CardIndex.getCards();
},
cardsIndex: function (card_id) {
let cardIndex = CardIndex.getCardIndex();
......@@ -134,12 +117,12 @@ Template.flashcards.helpers({
},
isBeolingusDictionary: function () {
if (CardType.gotDictionary(this.cardType)) {
return Session.get('dictionaryMode') === 1;
return Session.get('dictionaryMode') === 1 && !Route.isEditMode();
}
},
isDeepLDictionary: function () {
if (CardType.gotDictionary(this.cardType)) {
return Session.get('dictionaryMode') === 2;
return Session.get('dictionaryMode') === 2 && !Route.isEditMode();
}
},
getCardSideColorActive: function () {
......
<template name="editor">
{{> cancelEditForm}}
{{>cardEditorModalDeepLTranslation}}
<div class="row firstEditorRow editorElement">
<div id="subject" class="col-md-6 cardtext editorElement">
<h5>{{getSubjectLabel}}</h5>
......
......@@ -7,6 +7,7 @@ import {CardVisuals} from "../../../api/cardVisuals";
import ResizeSensor from "../../../../client/thirdParty/resizeSensor/ResizeSensor";
import {Cards} from "../../../api/cards";
import "../card.js";
import "./modal/deeplTranslation.js";
import "./modal/learningUnit.js";
import "./item/buttons.js";
import "./item/learningGoalLevel.js";
......
#cardEditorModalDeepLTranslation .modal-dialog {
width: 80%;
height: 90%;
.modal-content{
height: 100%;
}
.modal-header {
height: 5%;
}
.modal-body {
height: 87%;
}
}
<template name="cardEditorModalDeepLTranslation">
<div class="modal fade" id="cardEditorModalDeepLTranslation" role="dialog">
<div class="modal-dialog" aria-labelledby="cardEditorModalDeepLTranslationTitle">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
</div>
<div class="modal-body">
{{#if isModalVisible}}
{{#each getCards}}
{{> cardDictionaryContentDeepL}}
{{/each}}
{{/if}}
</div>
</div>
</div>
</div>
</template>
import {Template} from "meteor/templating";
import {Session} from "meteor/session";
import {CardIndex} from "../../../../api/cardIndex";
import "./deeplTranslation.html";
import {Dictionary} from "../../../../api/dictionary";
Session.setDefault('isDeepLModalVisible', false);
/*
* ############################################################################
* cardEditorModalDeepLTranslation
* ############################################################################
*/
Template.cardEditorModalDeepLTranslation.helpers({
isModalVisible: function () {
return Session.get('isDeepLModalVisible');
},
getCards: function () {
return CardIndex.getCards();
}
});
Template.cardEditorModalDeepLTranslation.onRendered(function () {
$('#cardEditorModalDeepLTranslation').on('shown.bs.modal', function () {
Session.set('isDeepLModalVisible', true);
});
$('#cardEditorModalDeepLTranslation').on('hidden.bs.modal', function () {
Session.set('isDeepLModalVisible', false);
});
});
Template.cardEditorModalDeepLTranslation.onDestroyed(function () {
Session.set('isDeepLModalVisible', false);
Dictionary.setMode(-1);
});
......@@ -732,7 +732,7 @@ th {
}
}
.hintContent .close {
.modal-content .close {
opacity: 1;
font-size: 30pt;
}
......
......@@ -35,6 +35,7 @@ Template.markdeepNavigation.events({
},
'click .markdeep-translate': function () {
Dictionary.setMode(2);
$('#cardEditorModalDeepLTranslation').modal('show');
}
});
......@@ -58,7 +59,7 @@ Template.markdeepNavigation.helpers({
return Session.get('fullscreen');
},
isTranslationActive: function () {
return Dictionary.checkMode(2);
return Session.get('isDeepLModalVisible');
},
gotDictionary: function () {
return CardType.gotDictionary(Session.get('cardType'));
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment