Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@pshtony1
pshtony1 authored Feb 9, 2021
1 parent 6ce5fd4 commit 1b64e8a
Show file tree
Hide file tree
Showing 9 changed files with 774 additions and 78 deletions.
163 changes: 133 additions & 30 deletions src/components/Card.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
import { CardStorage, TagStorage } from "../utils/CustomStorage.js";
import {
CardStorage,
TagStorage,
LangStorage,
} from "../utils/CustomStorage.js";
import { Hash } from "../utils/Hash.js";

export default class Card {
Expand Down Expand Up @@ -38,8 +42,9 @@ export default class Card {
let { hour, min, sec } = this.getLeftTime();

if (hour + min + sec === 0) {
$countdown.innerHTML =
"<span class='countdown__time end'>Time Over</span>";
$countdown.innerHTML = LangStorage.isEnglish()
? "<span class='countdown__time end'>Time Over</span>"
: "<span class='countdown__time end'>์‹œ๊ฐ„ ์ข…๋ฃŒ</span>";

clearInterval(this.counter);

Expand All @@ -48,22 +53,28 @@ export default class Card {

if (hour + min === 0) {
if (sec < 10) sec = `0${sec}`;
$countdown.innerHTML = `<span class='countdown__time end-soon'>${sec}</span> sec`;
$countdown.innerHTML = LangStorage.isEnglish()
? `<span class='countdown__time end-soon'>${sec}</span> sec`
: `<span class='countdown__time end-soon'>${sec}</span> ์ดˆ`;
return;
}

if (hour === 0) {
if (min < 10) min = `0${min}`;
if (sec < 10) sec = `0${sec}`;
$countdown.innerHTML = `<span class='countdown__time'>${min}</span> min <span class='countdown__time'>${sec}</span> sec`;
$countdown.innerHTML = LangStorage.isEnglish()
? `<span class='countdown__time'>${min}</span> min <span class='countdown__time'>${sec}</span> sec`
: `<span class='countdown__time'>${min}</span> ๋ถ„ <span class='countdown__time'>${sec}</span> ์ดˆ`;
return;
}

if (hour < 10) hour = `0${hour}`;
if (min < 10) min = `0${min}`;
if (sec < 10) sec = `0${sec}`;

$countdown.innerHTML = `<span class='countdown__time'>${hour}</span> hour <span class='countdown__time'>${min}</span> min <span class='countdown__time'>${sec}</span> sec`;
$countdown.innerHTML = LangStorage.isEnglish()
? `<span class='countdown__time'>${hour}</span> hour <span class='countdown__time'>${min}</span> min <span class='countdown__time'>${sec}</span> sec`
: `<span class='countdown__time'>${hour}</span> ์‹œ๊ฐ„ <span class='countdown__time'>${min}</span> ๋ถ„ <span class='countdown__time'>${sec}</span> ์ดˆ`;
}, 1000);
}

Expand Down Expand Up @@ -120,12 +131,13 @@ export default class Card {
r,
g,
b,
a,
inThumb = false,
$tagInnerContainer = null
) {
const $tag = document.createElement("div");
$tag.className = "tag";
$tag.style.backgroundColor = `rgba(${r}, ${g}, ${b}, 0.2)`;
$tag.style.backgroundColor = `rgba(${r}, ${g}, ${b}, ${a})`;

const $tagSpan = document.createElement("span");
$tagSpan.className = "tag__span";
Expand Down Expand Up @@ -216,8 +228,8 @@ export default class Card {
".tag-inner-container"
);
this.tag.forEach((tag) => {
const { r, g, b } = TagStorage.getTagObj(tag);
const $tag = createTag(tag, r, g, b, false, $tagInnerContainer);
const { r, g, b, a } = TagStorage.getTagObj(tag);
const $tag = createTag(tag, r, g, b, a, false, $tagInnerContainer);

$tagInnerContainer.insertBefore(
$tag,
Expand All @@ -227,6 +239,9 @@ export default class Card {

const $todoInputContainer = this.cardComponent.createToDoContainer();
$todoInputContainer.querySelector(".todo__input").value = this.text;
$todoInputContainer
.querySelector(".todo__input-container")
.classList.remove("nope");

const $todoLengthContainer = $todoInputContainer.querySelector(
".todo__length-container"
Expand Down Expand Up @@ -259,12 +274,33 @@ export default class Card {
);
$cardTagContainer.innerHTML = "";
this.tag.forEach((tag) => {
const { r, g, b } = TagStorage.getTagObj(tag);
const $tag = createTag(tag, r, g, b, true);
const { r, g, b, a } = TagStorage.getTagObj(tag);
const $tag = createTag(tag, r, g, b, a, true);
$cardTagContainer.appendChild($tag);
});

if (this.tag.length === 0) {
if (LangStorage.isEnglish()) {
$cardTagContainer.textContent = "No Tags";
} else {
$cardTagContainer.textContent = "ํƒœ๊ทธ ์—†์Œ";
}
}

const text = $todoInputContainer.querySelector(".todo__input").value;
if (text.length < 1 || text.length > 80) {
$todoInputContainer.classList.add("nope");
$todoInputContainer.querySelector(
".todo__length-container"
).style.color = "rgb(255, 129, 107)";
$todoInputContainer.querySelector(
".todo__input"
).style.borderColor = "rgb(255, 129, 107)";
return;
} else {
$todoInputContainer.classList.remove("nope");
}

this.text = text;
this.element.querySelector(".card__text").textContent = text;

Expand Down Expand Up @@ -300,7 +336,12 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";

if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand All @@ -311,6 +352,7 @@ export default class Card {
}
},
htmlMinHeight: 140,
hideContinue: false,
});
}

Expand Down Expand Up @@ -397,7 +439,11 @@ export default class Card {
} else if (this.cardComponent.cards.todo.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
} else {
Expand Down Expand Up @@ -431,7 +477,11 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand Down Expand Up @@ -480,7 +530,11 @@ export default class Card {
) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
} else if (
Expand All @@ -505,7 +559,11 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand Down Expand Up @@ -591,7 +649,11 @@ export default class Card {
} else if (this.cardComponent.cards.complete.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
} else {
Expand Down Expand Up @@ -625,7 +687,11 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand All @@ -650,8 +716,9 @@ export default class Card {
);

const $countdown = card.element.querySelector(".card__countdown");
$countdown.innerHTML = "Complete";
$countdown.innerHTML = LangStorage.isEnglish() ? "Complete" : "์™„๋ฃŒ";
$countdown.classList.add("complete");

if (card.counter) {
clearInterval(card.counter);
card.counter = null;
Expand All @@ -671,7 +738,11 @@ export default class Card {
) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
} else if (
Expand All @@ -696,7 +767,11 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand All @@ -717,13 +792,17 @@ export default class Card {
$cardTagContainer.className = "card__tag-container";

if (this.tag.length === 0) {
$cardTagContainer.textContent = "No Tags";
if (LangStorage.isEnglish()) {
$cardTagContainer.textContent = "No Tags";
} else {
$cardTagContainer.textContent = "ํƒœ๊ทธ ์—†์Œ";
}
} else {
this.tag.forEach((tag) => {
const tagObj = TagStorage.getTagObj(tag);
const { r, g, b } = tagObj;
const { r, g, b, a } = tagObj;

const $tag = createTag(tag, r, g, b, true);
const $tag = createTag(tag, r, g, b, a, true);

$cardTagContainer.appendChild($tag);
});
Expand All @@ -732,9 +811,17 @@ export default class Card {
const $cardCountdown = document.createElement("div");
$cardCountdown.className = "card__countdown";
if (this.countdown) {
$cardCountdown.textContent = "Loading";
if (LangStorage.isEnglish()) {
$cardCountdown.textContent = "Loading";
} else {
$cardCountdown.textContent = "์ž ์‹œ๋งŒ ๊ธฐ๋‹ค๋ ค์ฃผ์„ธ์š”";
}
} else {
$cardCountdown.textContent = "Whenever";
if (LangStorage.isEnglish()) {
$cardCountdown.textContent = "Whenever";
} else {
$cardCountdown.textContent = "์‹œ๊ฐ„์ œํ•œ ์—†์Œ";
}
}

const $cardMenuContainer = document.createElement("div");
Expand Down Expand Up @@ -805,7 +892,11 @@ export default class Card {
} else if (this.cardComponent.cards.todo.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
} else {
Expand Down Expand Up @@ -839,7 +930,11 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand Down Expand Up @@ -909,7 +1004,11 @@ export default class Card {
} else if (this.cardComponent.cards.complete.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
} else {
Expand Down Expand Up @@ -943,7 +1042,11 @@ export default class Card {
if (copyCards.length === 0) {
const $emptySignSpan = document.createElement("span");
$emptySignSpan.className = "empty-sign";
$emptySignSpan.textContent = "No Cards";
if (LangStorage.isEnglish()) {
$emptySignSpan.textContent = "No Cards";
} else {
$emptySignSpan.textContent = "์นด๋“œ ์—†์Œ";
}

$allCardContainer.appendChild($emptySignSpan);
}
Expand Down
Loading

0 comments on commit 1b64e8a

Please sign in to comment.