Commit d54b9641 authored by Curtis Adam's avatar Curtis Adam

Add basic support for card types with 6 sides

parent 4046d680
......@@ -5,8 +5,9 @@
@import '../imports/ui/cardset/cardset.scss';
@import '../imports/ui/cardsetCourseIterations/results.scss';
@import '../imports/ui/card/card.scss';
@import '../imports/ui/markdeepEditor/content.scss';
@import '../imports/ui/markdeepEditor/navigation.scss';
@import '../imports/ui/card/navigation/navigation.scss';
@import '../imports/ui/markdeepEditor/content/content';
@import '../imports/ui/markdeepEditor/navigation/navigation';
@import '../imports/ui/courseIterations/coursesIterations.scss';
@import '../imports/ui/filter/filter.scss';
@import '../imports/ui/forms/cardsetCourseIterationForm.scss';
......
......@@ -809,16 +809,16 @@
"name": "Entwurfsmuster",
"longName": "Entwurfsmuster (Problem | Kontext | Kräfte | Lösung | Verwendung | Verweise)",
"front": "Problem",
"left": "Kontext",
"right": "Kräfte",
"hint": "Kontext",
"lecture": "Kräfte",
"back": "Lösung",
"top": "Verwendung",
"bottom": "Verweise",
"placeholders": {
"subject": "Wie heißt das Muster ?",
"front": "Welches Problem löst das Muster?",
"left": "Wo tritt das Problem auf?",
"right": "Was sind die Vor- und Nachteile der Lösung?",
"hint": "Wo tritt das Problem auf?",
"lecture": "Was sind die Vor- und Nachteile der Lösung?",
"back": "Beschreib die Lösung anhand eines Diagramms!",
"top": "Nenne konkrete Implementierungen des Entwurfsmusters!",
"bottom": "Liste hier Links und Literatur zur Vertiefung des Entwurfsmusters auf!"
......
......@@ -842,14 +842,18 @@
"longName": "Design Patterns",
"front": "Problem",
"back": "Solution",
"hint": "Literature",
"hint": "Context",
"lecture": "Description",
"top": "Example",
"bottom": "Literature",
"placeholders": {
"subject": "Enter the Design Pattern !",
"front": "State the problem !",
"back": "Give the solution !",
"hint": "List here links and literature to deepen the design pattern! \n\nsearch your university library too! Most of the books are available online.",
"lecture": "Describe the Design Pattern!"
"hint": "Context",
"lecture": "Describe the Design Pattern!",
"top": "Example",
"bottom": "List here links and literature to deepen the design pattern! \n\nsearch your university library too! Most of the books are available online."
},
"editorLabels": {
"subject": "Enter the design pattern !"
......
This diff is collapsed.
......@@ -238,6 +238,8 @@ export let CardIndex = class CardIndex {
"cardGroup": 0,
"cardType": Session.get('cardType'),
"lecture": Session.get('lectureText'),
"top": Session.get('topText'),
"bottom": Session.get('bottomText'),
"centerTextElement": Session.get('centerTextElement'),
"date": Session.get('cardDate'),
"learningUnit": Session.get('learningUnit')
......
......@@ -25,6 +25,8 @@ let cardTypesWithLearningUnit = [];
let cardTypesWhichDisplaySideInformation = [0];
let cardTypesWhichDisplayLearningGoalInformation = [0, 5];
let cardTypesWithLecture = [0, 12];
let cardTypesWithTop = [12];
let cardTypesWithBottom = [12];
let cardTypesWithPresentationMode = [0, 1, 2, 3, 4, 5, 6, 7, 11, 12];
let cardTypesWithSwappedSides = [6];
let cardTypesWithNotesForDifficultyLevel = [2];
......@@ -61,6 +63,14 @@ export let CardType = class CardType {
return cardTypesWithLecture.includes(cardType);
}
static gotTop (cardType) {
return cardTypesWithTop.includes(cardType);
}
static gotBottom (cardType) {
return cardTypesWithBottom.includes(cardType);
}
static displaysSideInformation (cardType) {
return cardTypesWhichDisplaySideInformation.includes(cardType);
}
......@@ -80,17 +90,15 @@ export let CardType = class CardType {
if (this.gotLecture(cardType)) {
i++;
}
if (this.gotTop(cardType)) {
i++;
}
if (this.gotBottom(cardType)) {
i++;
}
return i;
}
static gotFourColumns (cardType) {
return this.getColumnCount(cardType) === 4;
}
static gotThreeColumns (cardType) {
return this.getColumnCount(cardType) === 3;
}
static gotOneColumn (cardType) {
return this.getColumnCount(cardType) === 1;
}
......@@ -148,6 +156,22 @@ export let CardType = class CardType {
return TAPi18n.__('card.cardType' + activeCardType + '.hint');
}
static getTopTitle (cardType = -1) {
let activeCardType = cardType;
if (activeCardType === -1) {
activeCardType = Session.get('cardType');
}
return TAPi18n.__('card.cardType' + activeCardType + '.top');
}
static getBottomTitle (cardType = -1) {
let activeCardType = cardType;
if (activeCardType === -1) {
activeCardType = Session.get('cardType');
}
return TAPi18n.__('card.cardType' + activeCardType + '.bottom');
}
static getFrontTitle (cardType = -1) {
let activeCardType = cardType;
if (activeCardType === -1) {
......@@ -200,6 +224,12 @@ export let CardType = class CardType {
case 3:
side = 'lecture';
break;
case 4:
side = 'top';
break;
case 5:
side = 'bottom';
break;
}
return TAPi18n.__('card.cardType' + cardType + '.placeholders.' + side);
}
......
......@@ -5,13 +5,9 @@ import {Cardsets} from "./cardsets.js";
import {Leitner, Wozniak} from "./learned.js";
import {Paid} from "./paid.js";
import {check} from "meteor/check";
import {CardEditor} from "./cardEditor";
export const Cards = new Mongo.Collection("cards");
export const frontMaxLength = 100000;
export const backMaxLength = 100000;
export const hintMaxLength = 100000;
export const lectureMaxLength = 300000;
export const subjectMaxLength = 255;
if (Meteor.isServer) {
Meteor.publish("cards", function () {
......@@ -133,22 +129,32 @@ var CardsSchema = new SimpleSchema({
subject: {
type: String,
optional: true,
max: subjectMaxLength
max: CardEditor.getMaxTextLength(5)
},
hint: {
type: String,
optional: true,
max: hintMaxLength
max: CardEditor.getMaxTextLength(2)
},
front: {
type: String,
optional: true,
max: frontMaxLength
max: CardEditor.getMaxTextLength(0)
},
back: {
type: String,
optional: true,
max: backMaxLength
max: CardEditor.getMaxTextLength(1)
},
top: {
type: String,
optional: true,
max: CardEditor.getMaxTextLength(4)
},
bottom: {
type: String,
optional: true,
max: CardEditor.getMaxTextLength(5)
},
cardset_id: {
type: String
......@@ -159,7 +165,7 @@ var CardsSchema = new SimpleSchema({
lecture: {
type: String,
optional: true,
max: lectureMaxLength
max: CardEditor.getMaxTextLength(3)
},
centerText: {
type: Boolean,
......@@ -202,13 +208,15 @@ var CardsSchema = new SimpleSchema({
Cards.attachSchema(CardsSchema);
Meteor.methods({
addCard: function (cardset_id, subject, hint, front, back, lecture, centerTextElement, date, learningGoalLevel, backgroundStyle, learningIndex, learningUnit) {
addCard: function (cardset_id, subject, hint, front, back, lecture, top, bottom, centerTextElement, date, learningGoalLevel, backgroundStyle, learningIndex, learningUnit) {
check(cardset_id, String);
check(subject, String);
check(hint, String);
check(front, String);
check(back, String);
check(lecture, String);
check(top, String);
check(bottom, String);
check(centerTextElement, [Boolean]);
check(date, Date);
check(learningGoalLevel, Number);
......@@ -243,6 +251,8 @@ Meteor.methods({
cardset_id: cardset_id,
difficulty: cardset.difficulty,
lecture: lecture,
top: top,
bottom: bottom,
centerTextElement: centerTextElement,
date: date,
learningGoalLevel: learningGoalLevel,
......@@ -273,6 +283,9 @@ Meteor.methods({
let lecture = "";
let back = "";
let learningUnit = "";
let learningIndex = -1;
let top = "";
let bottom = "";
if (card.back !== undefined) {
back = card.back;
}
......@@ -282,10 +295,16 @@ Meteor.methods({
if (card.lecture !== undefined) {
lecture = card.lecture;
}
if (card.top !== undefined) {
top = card.top;
}
if (card.bottom !== undefined) {
bottom = card.bottom;
}
if (card.learningUnit !== undefined) {
learningUnit = card.learningUnit;
}
Meteor.call("addCard", targetCardset_id, card.subject, hint, card.front, back, Number(card.difficulty), "0", card.cardType, lecture, card.centerTextElement, card.date, card.learningGoalLevel, card.backgroundStyle, learningUnit);
Meteor.call("addCard", targetCardset_id, card.subject, hint, card.front, back, lecture, top, bottom, "0", card.centerTextElement, card.date, card.learningGoalLevel, card.backgroundStyle, learningIndex, learningUnit);
return true;
}
} else {
......@@ -359,13 +378,15 @@ Meteor.methods({
});
}
},
updateCard: function (card_id, subject, hint, front, back, lecture, centerTextElement, learningGoalLevel, backgroundStyle, learningIndex, learningUnit) {
updateCard: function (card_id, subject, hint, front, back, lecture, top, bottom, centerTextElement, learningGoalLevel, backgroundStyle, learningIndex, learningUnit) {
check(card_id, String);
check(subject, String);
check(hint, String);
check(front, String);
check(back, String);
check(lecture, String);
check(top, String);
check(bottom, String);
check(centerTextElement, [Boolean]);
check(learningGoalLevel, Number);
check(backgroundStyle, Number);
......@@ -399,6 +420,8 @@ Meteor.methods({
front: front,
back: back,
lecture: lecture,
top: top,
bottom: bottom,
centerTextElement: centerTextElement,
learningGoalLevel: learningGoalLevel,
backgroundStyle: backgroundStyle,
......
......@@ -24,6 +24,12 @@ function importCards(data, cardset, importType) {
if (item.lecture === undefined) {
item.lecture = "";
}
if (item.top === undefined) {
item.top = "";
}
if (item.bottom === undefined) {
item.bottom = "";
}
if (item.learningGoalLevel === undefined) {
item.learningGoalLevel = 0;
}
......@@ -32,9 +38,9 @@ function importCards(data, cardset, importType) {
}
if (item.centerTextElement === undefined) {
if (cardset.cardType === 1) {
item.centerTextElement = [true, true, false, false];
item.centerTextElement = [true, true, false, false, false, false];
} else {
item.centerTextElement = [false, false, false, false];
item.centerTextElement = [false, false, false, false, false, false];
}
}
......@@ -45,7 +51,7 @@ function importCards(data, cardset, importType) {
for (let i = 0; i < data.length; i++) {
let item = data[i];
let subject, front, back, hint, lecture;
let subject, front, back, hint, lecture, top, bottom;
try {
// If the string is UTF-8, this will work and not throw an error.
subject = decodeURIComponent(encodeURIComponent(item.subject));
......@@ -53,6 +59,8 @@ function importCards(data, cardset, importType) {
back = decodeURIComponent(encodeURIComponent(item.back));
hint = decodeURIComponent(encodeURIComponent(item.hint));
lecture = decodeURIComponent(encodeURIComponent(item.lecture));
top = decodeURIComponent(encodeURIComponent(item.top));
bottom = decodeURIComponent(encodeURIComponent(item.bottom));
} catch (e) {
// If it isn't, an error will be thrown, and we can assume that we have an ISO string.
subject = item.subject;
......@@ -60,6 +68,8 @@ function importCards(data, cardset, importType) {
back = item.back;
hint = item.hint;
lecture = item.lecture;
top = item.top;
bottom = item.bottom;
}
let hlcodeReplacement = "\n```\n";
......@@ -77,6 +87,8 @@ function importCards(data, cardset, importType) {
cardGroup: -1,
cardType: cardset.cardType,
lecture: lecture,
top: top,
bottom: bottom,
centerTextElement: item.centerTextElement,
learningGoalLevel: item.learningGoalLevel,
backgroundStyle: item.backgroundStyle,
......@@ -98,6 +110,8 @@ function importCards(data, cardset, importType) {
cardGroup: -1,
cardType: cardset.cardType,
lecture: item.lecture,
top: item.top,
bottom: item.bottom,
centerTextElement: item.centerTextElement,
learningGoalLevel: item.learningGoalLevel,
backgroundStyle: item.backgroundStyle,
......
......@@ -19,8 +19,8 @@ export let MarkdeepEditor = class MarkdeepEditor {
}
static cardSideNavigation (forward = true) {
let navigationLength = $(".editorNavigation > button").length;
let index = ($(".btn-primary").index(".editorNavigation > button"));
let navigationLength = $(".editorNavigation a").length;
let index = ($(".btn-primary").index(".editorNavigation a"));
++index;
if (forward) {
if (index >= navigationLength) {
......@@ -35,7 +35,7 @@ export let MarkdeepEditor = class MarkdeepEditor {
--index;
}
}
$(".editorNavigation > button:nth-child(" + index + ")").click();
$(".editorNavigation > li:nth-child(" + index + ") a").click();
}
static changeBackgroundStyle () {
......
......@@ -9,6 +9,7 @@ import "./card.html";
import '/client/hammer.js';
import './header/header.js';
import './content/content.js';
import './navigation/navigation.js';
import {skipAnswer} from "../learn/learn.js";
import {CardVisuals} from "../../api/cardVisuals.js";
import ResizeSensor from "../../../client/resize_sensor/ResizeSensor.js";
......
......@@ -271,18 +271,6 @@ img.cardside {
padding: 50px;
}
.editorNavigation {
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
padding-right: 0;
}
.editorNavigation > .btn-primary {
cursor: default;
box-shadow: none !important;
}
#editFront, #editBack, #editHint, #editLecture {
@media(max-width: 767px) {
padding: 20px 0 20px 0 !important;
......
......@@ -12,7 +12,7 @@
{{#if gotFront}}
{{#mathjax}}{{front}}{{/mathjax}}
{{else}}
{{#mathjax}}{{getPlaceholder 0}}{{/mathjax}}
{{#mathjax}}{{getPlaceholder}}{{/mathjax}}
{{/if}}
</span>
</template>
......@@ -23,7 +23,7 @@
{{#if gotBack}}
{{#mathjax}}{{back}}{{/mathjax}}
{{else}}
{{#mathjax}}{{getPlaceholder 1}}{{/mathjax}}
{{#mathjax}}{{getPlaceholder}}{{/mathjax}}
{{/if}}
</span>
</template>
......@@ -34,7 +34,29 @@
{{#if gotLecture}}
{{#mathjax}}{{lecture}}{{/mathjax}}
{{else}}
{{#mathjax}}{{getPlaceholder 3}}{{/mathjax}}
{{#mathjax}}{{getPlaceholder}}{{/mathjax}}
{{/if}}
</span>
</template>
<template name="cardTopContent">
<span class="{{#if gotTop}}{{#if
isCentered}}center-align{{/if}}{{else}}placeholder{{/if}}">
{{#if gotTop}}
{{#mathjax}}{{top}}{{/mathjax}}
{{else}}
{{#mathjax}}{{getPlaceholder}}{{/mathjax}}
{{/if}}
</span>
</template>
<template name="cardBottomContent">
<span class="{{#if gotBottom}}{{#if
isCentered}}center-align{{/if}}{{else}}placeholder{{/if}}">
{{#if gotBottom}}
{{#mathjax}}{{bottom}}{{/mathjax}}
{{else}}
{{#mathjax}}{{getPlaceholder}}{{/mathjax}}
{{/if}}
</span>
</template>
......@@ -129,6 +151,12 @@
{{> cardBackContent this}}
{{/if}}
{{/if}}
{{#if isTop}}
{{> cardTopContent this}}
{{/if}}
{{#if isBottom}}
{{> cardBottomContent this}}
{{/if}}
{{/if}}
</div>
</template>
......
......@@ -157,8 +157,8 @@ Template.cardFrontContent.helpers({
return this.front !== '' && this.front !== undefined;
}
},
getPlaceholder: function (mode) {
return CardType.getPlaceholderText(mode, this.cardType, this.learningGoalLevel);
getPlaceholder: function () {
return CardType.getPlaceholderText(0, this.cardType, this.learningGoalLevel);
}
});
......@@ -182,8 +182,8 @@ Template.cardBackContent.helpers({
return this.back !== '' && this.back !== undefined;
}
},
getPlaceholder: function (mode) {
return CardType.getPlaceholderText(mode, this.cardType);
getPlaceholder: function () {
return CardType.getPlaceholderText(1, this.cardType);
}
});
......@@ -203,8 +203,50 @@ Template.cardLectureContent.helpers({
return this.lecture !== '' && this.lecture !== undefined;
}
},
getPlaceholder: function (mode) {
return CardType.getPlaceholderText(mode, this.cardType);
getPlaceholder: function () {
return CardType.getPlaceholderText(3, this.cardType);
}
});
/*
* ############################################################################
* cardTopContent
* ############################################################################
*/
Template.cardTopContent.helpers({
isCentered: function () {
return CardVisuals.isCentered(4, this.centerTextElement, this.cardType);
},
gotTop: function () {
if (Route.isEditMode()) {
return true;
} else {
return this.top !== '' && this.top !== undefined;
}
},
getPlaceholder: function () {
return CardType.getPlaceholderText(4, this.cardType);
}
});
/*
* ############################################################################
* cardBottomContent
* ############################################################################
*/
Template.cardBottomContent.helpers({
isCentered: function () {
return CardVisuals.isCentered(5, this.centerTextElement, this.cardType);
},
gotBottom: function () {
if (Route.isEditMode()) {
return true;
} else {
return this.bottom !== '' && this.bottom !== undefined;
}
},
getPlaceholder: function () {
return CardType.getPlaceholderText(5, this.cardType);
}
});
......@@ -215,9 +257,9 @@ Template.cardLectureContent.helpers({
*/
Template.cardHintContentPreview.helpers({
getPlaceholder: function (mode) {
getPlaceholder: function () {
if (Route.isPresentation()) {
return CardType.getPlaceholderText(mode, this.cardType);
return CardType.getPlaceholderText(2, this.cardType);
}
},
gotHint: function () {
......@@ -292,9 +334,6 @@ Template.flashcardContentPresentation.helpers({
isEditMode: function () {
return (Route.isEditMode() && !Session.get('fullscreen'));
},
isEditModeOrPresentation: function () {
return Route.isEditModeOrPresentation();
},
box: function () {
return Session.get("selectedBox");
},
......@@ -307,41 +346,32 @@ Template.flashcardContentPresentation.helpers({
gotSidesSwapped: function () {
return CardType.gotSidesSwapped(this.cardType);
},
gotDictionary: function () {
return CardType.gotDictionary(this.cardType);
},
gotLecture: function () {
return CardType.gotLecture(this.cardType);
},
gotNotesForDifficultyLevel: function () {
return CardType.gotNotesForDifficultyLevel(this.cardType);
isDictionary: function () {
if (CardType.gotDictionary(this.cardType)) {
return Session.get('dictionaryPreview');
}
},
reversedViewOrder: function () {
return Session.get('reverseViewOrder');
getPlaceholder: function (mode) {
CardEditor.getPlaceholder(mode);
},
isFront: function () {
return (Session.get('activeEditMode') === 0 && !Session.get('dictionaryPreview'));
},
isLecture: function () {
if (CardType.gotLecture(this.cardType)) {
return Session.get('activeEditMode') === 3;
}
},
isDictionary: function () {
if (CardType.gotDictionary(this.cardType)) {
return Session.get('dictionaryPreview');
}
isBack: function () {
return Session.get('activeEditMode') === 1;
},
isHint: function () {
return Session.get('activeEditMode') === 2;
},
gotOneColumn: function () {
return CardType.gotOneColumn(this.cardType);
isLecture: function () {
if (CardType.gotLecture(this.cardType)) {
return Session.get('activeEditMode') === 3;
}
},
getPlaceholder: function (mode) {
CardEditor.getPlaceholder(mode);
isTop: function () {
return Session.get('activeEditMode') === 4;
},
isBack: function () {
return Session.get('activeEditMode') === 1;
isBottom: function () {
return Session.get('activeEditMode') === 5;
}
});
<template name="cardNavigation">
<nav class="col-xs-12 editorNavigation cardtext editorToolbar nav nav-justified">
{{> cardNavigationFront tabindex=5}}
{{#if gotLecture}}
{{> cardNavigationLecture tabindex=7}}
{{/if}}
{{#if gotBack}}
{{> cardNavigationBack tabindex=9}}
{{/if}}
{{#if gotHint}}
{{> cardNavigationHint tabindex=11}}
{{/if}}
{{#if gotTop}}
{{> cardNavigationTop tabindex=13}}
{{/if}}
{{#if gotBottom}}
{{> cardNavigationBottom tabindex=15}}
{{/if}}
</nav>
</template>
<template name="cardNavigationFront">
<li>
<a id="editFront"
class="btn btn-default btn-raised" type="button" tabindex="{{this.tabindex}}">{{getFrontTitle}}</a>
</li>
</template>
<template name="cardNavigationLecture">
<li>
<a id="editLecture" class="btn btn-default btn-raised" type="button" tabindex="{{this.tabindex}}">{{_
"card.cardType0.lecture"}}</a>
</li>
</template>
<template name="cardNavigationBack">
<li>
<a id="editBack"
class="btn btn-default btn-raised" type="button" tabindex="{{this.tabindex}}">{{getBackTitle}}</a>
</li>
</template>
<template name="cardNavigationHint">
<li>
<a id="editHint"
class="btn btn-default btn-raised" type="button" tabindex="{{this.tabindex}}">{{getHintTitle}}</a>
</li>
</template>
<template name="cardNavigationTop">
<li>
<a id="editTop"
class="btn btn-default btn-raised" type="button" tabindex="{{this.tabindex}}">{{getTopTitle}}</a>
</li>
</template>
<template name="cardNavigationBottom">
<li>
<a id="editBottom"
class="btn btn-default btn-raised" type="button" tabindex="{{this.tabindex}}">{{getBottomTitle}}</a>
</li>
</template>
import {Session} from "meteor/session";
import {CardVisuals} from "../../../api/cardVisuals";
import {Route} from "../../../api/route";
import {CardType} from "../../../api/cardTypes";
import {CardEditor} from "../../../api/cardEditor";
import "./navigation.html";
/*
* ############################################################################
* cardNavigation
* ############################################################################
*/
Template.cardNavigation.events({
'click #editFront': function () {
CardEditor.editFront();
},
'click #editBack': function () {
CardEditor.editBack();
},
'click #editLecture': function () {
CardEditor.editLecture();
},
'click #editHint': function () {
CardEditor.editHint();
},
'click #editTop': function () {
CardEditor.editTop();
},
'click #editBottom': function () {
CardEditor.editBottom();
},
'focus #editFront': function () {
CardEditor.editFront();
},