aboutsummaryrefslogtreecommitdiff
path: root/templates/partials/_right_sidebar.html
blob: 1c9375cdd9115a380963b08339014292349eb9b2 (plain)
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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
{% load static %}

{% block head %}
<link rel="stylesheet" href="{% static 'css/shared/kawaiibeats.css' %}">
{% endblock head %}

<div class="right-sidebar">
  <div class="kawaiibeats">
      <p id="song-title">Loading...</p>
      <p id="song-artist-album">Loading...</p>
      <img onerror="this.src=getRandomArtwork()" id="song-cover" alt="Song Cover">
      <canvas id="song-visualizer" width="140" height="30"></canvas>
      <div id="song-time">
        <span id="song-time-elapsed">0:00</span>
        <span id="song-time-total">0:00</span>
      </div>
      <div id="song-controls">
          <button id="song-prev">&lt;</button>
          <button id="song-play">&#9658;</button>
          <button id="song-next">&gt;</button>
      </div>
  </div>

  <div class="navigation-links">
    <div class="navigation-title-container">
      <h1 class="navigation-title">{% if request.LANGUAGE_CODE == 'ja' %}シリアルエクスペリメンツ:シフー{% else %}Serial Experiments: Shifoo{% endif %}</h1>
    </div>
    <div class="navigation-items-container">
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/socialify.png' %}" alt="Socialify Icon" />
        <a href="#socialify">{% if request.LANGUAGE_CODE == 'ja' %}ソーシャリファイ{% else %}Socialify{% endif %}</a>
      </div>
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/repositories.png' %}" alt="My Repositories Icon" />
        <a href="#repositories">{% if request.LANGUAGE_CODE == 'ja' %}マイリポジトリ{% else %}My Repositories{% endif %}</a>
      </div>
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/myanimelist.png' %}" alt="My Anime List Icon" />
        <a href="#myanimelist">{% if request.LANGUAGE_CODE == 'ja' %}マイアニメリスト{% else %}My Anime List{% endif %}</a>
      </div>
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/games.png' %}" alt="My Games Icon" />
        <a href="#mygames">{% if request.LANGUAGE_CODE == 'ja' %}マイゲーム{% else %}My Games{% endif %}</a>
      </div>
    </div>
  </div>
  <div class="pamphlet pamphlet-big"></div>

  {% if user.is_authenticated %}
  <div class="user-stats-area">
    <img src="{% static 'images/avatars/' %}{{ user.profile.avatar_url }}.gif" class="stats-profile-image" alt="{{ user.first_name }}'s Avatar">
    <h2 class="stats-username"><a href="#">{{ user.first_name }} {{ user.last_name }}</a></h2>
    <p class="stats-bio">{{ user.profile.bio|linebreaksbr }}</p>
    <div class="user-stats">
      <p class="stat-name">{% if request.LANGUAGE_CODE == 'ja' %}経験値{% else %}XP{% endif %}</p>
      <p class="stat-value">{{ user.profile.experience }} / 1000</p>
    </div>
    <div class="user-stats">
      <p class="stat-name">{% if request.LANGUAGE_CODE == 'ja' %}レベル{% else %}Level{% endif %}</p>
      <p class="stat-value">{{ user.profile.level }}</p>
    </div>
    <div class="user-stats">
      <p class="stat-name">{% if request.LANGUAGE_CODE == 'ja' %}残高{% else %}Balance{% endif %}</p>
      <p class="stat-value">
        <span>{{ user.profile.balance }}</span>
        <img src="{% static 'images/core/icons/coin.png' %}" alt="Coin Icon" />
      </p>
    </div>
    <div class="user-stats">
      <p class="stat-name">{% if request.LANGUAGE_CODE == 'ja' %}ジャーナルエントリー{% else %}Journal Entries{% endif %}</p>
      <p class="stat-value">{{ user.profile.journal_entries }}</p>
    </div>
    <div class="user-stats">
      <p class="stat-name">{% if request.LANGUAGE_CODE == 'ja' %}ジャーナル連続記録{% else %}Journal Streak{% endif %}</p>
      <p class="stat-value">{{ user.profile.journal_streak }} days</p>
    </div>
    <div class="user-stats">
      <p class="stat-name">{% if request.LANGUAGE_CODE == 'ja' %}ウェブログ投稿{% else %}Weblog Posts{% endif %}</p>
      <p class="stat-value">{{ user.profile.weblogs_created }}</p>
    </div>
    <div class="stat-links">
      <a href="#">{% if request.LANGUAGE_CODE == 'ja' %}ドレッシングルーム{% else %}Dressing Room{% endif %}</a>
      <a href="#">{% if request.LANGUAGE_CODE == 'ja' %}実績{% else %}Achievements{% endif %}</a>
      <a href="#">{% if request.LANGUAGE_CODE == 'ja' %}ウェブログ{% else %}Weblog{% endif %}</a>
    </div>
  </div>

  {% endif %}

  <div class="navigation-links">
    <div class="navigation-title-container">
      <h1 class="navigation-title">{% if request.LANGUAGE_CODE == 'ja' %}ザ・マトリックス{% else %}The Matrix{% endif %}
    </div>
    <div class="navigation-items-container">
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/pamphlet.png' %}" alt="Pamphlet Icon" />
        <a href="#pamphlet">{% if request.LANGUAGE_CODE == 'ja' %}パンフレット{% else %}Pamphlet{% endif %}</a>
      </div>
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/webring.png' %}" alt="Caravan Icon" />
        <a href="#webring">{% if request.LANGUAGE_CODE == 'ja' %}キャラバン{% else %}Caravan{% endif %}</a>
      </div>
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/guestbook.png' %}" alt="Ledger Icon" />
        <a href="#guestbookservice">{% if request.LANGUAGE_CODE == 'ja' %}レジャー{% else %}Ledger{% endif %}</a>
      </div>
      <div class="navigation-item">
        <img src="{% static 'images/core/icons/census.png' %}" alt="Census Icon" />
        <a href="#census">{% if request.LANGUAGE_CODE == 'ja' %}センサス{% else %}Census{% endif %}</a>
      </div>
    </div>
  </div>
  <div class="sidebar-credits" id="censusContainer">
      <div class="visitor-text">You are Visitor #</div>
      <div class="visitor-count">
        <span class="visitor-count-item">0</span>
        <span class="visitor-count-item">0</span>
        <span class="visitor-count-item">6</span>
        <span class="visitor-count-item">9</span>
        <span class="visitor-count-item">4</span>
        <span class="visitor-count-item">2</span>
        <span class="visitor-count-item">0</span>
      </div>
    </div>
</div>

{% block scripts %}
<script src="{% static 'js/shared/kawaiiBeatsPlayer.js' %}"></script>
{% endblock scripts %}