Lapis/FrontTemplate.html at main · 5byuri/Lapis · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!---------- Header ------------->
<header style="visibility: hidden"></header>

<main>
  <!--------- front-vocab card ---------->
  {{^IsSentenceCard}} {{^IsHintCard}}  {{^IsClickCard}}
    <div lang="ja" class="front-vocab">{{Expression}}</div>
  {{/IsClickCard}}  {{/IsHintCard}} {{/IsSentenceCard}}

  <!------- Sentence card --------->
  {{#IsSentenceCard}}
    <div lang="ja" class="front-sentence">
      {{#SentenceFurigana}} {{kanji:SentenceFurigana}} {{/SentenceFurigana}}
      {{^SentenceFurigana}} {{kanji:Sentence}} {{/SentenceFurigana}}
    </div>
  {{/IsSentenceCard}}

  <!--------- Hint card ----------->
  {{#IsHintCard}}
    <div lang="ja" class="front-vocab">{{Expression}}</div>
    <div id="hint">
      {{#SentenceFurigana}} {{kanji:SentenceFurigana}} {{/SentenceFurigana}}
      {{^SentenceFurigana}} {{kanji:Sentence}} {{/SentenceFurigana}}
    </div>
  {{/IsHintCard}}

  <!-------- Click card ----------->
  {{#IsClickCard}}
    <div id="click">
      <div lang="ja" class="front-vocab">{{Expression}}</div>
    </div>
  {{/IsClickCard}}

  <!-- Hint -->
  {{#Hint}}
    <div id="hint">{{Hint}}</div>
  {{/Hint}}
</main>

<script>
  function ClickCard() {
    const clickElement = document.getElementById('click');

    // Store original content so that we can click back to it
    const originalContent = clickElement.innerHTML;

    // This is what it is going to click to
    const clickedContent = `
      <div lang="ja" class="front-sentence">
        {{#SentenceFurigana}} {{kanji:SentenceFurigana}} {{/SentenceFurigana}}
        {{^SentenceFurigana}} {{kanji:Sentence}} {{/SentenceFurigana}}
      </div>
    `;

    // Implement the clicking mechanism
    clickElement.addEventListener('click', function() {
      if (clickElement.innerHTML === originalContent) {
        clickElement.innerHTML = clickedContent;
      } else {
        clickElement.innerHTML = originalContent;
      }
    });
  }

  function initialize() {
    // Check what card type it is
    if (`{{IsClickCard}}`) ClickCard();
  }

  initialize();

	userJs1=()=>{
		document.getElementById("click").click();
	}


</script>