j1-template 2024.3.14 → 2024.3.16

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b5be7836bc33acb8bf5f1b59fec31b90911672b3ef04b852c17cd24b67ae3bad
-  data.tar.gz: dca09ed5424070053b2c02d61e8693dab770e985d766a2d39f88eaf749611794
+  metadata.gz: 251fb8bf58d0e8b429cc9977024e2cdb33ed2fdbe3c4fd40bee91071a4cfbde7
+  data.tar.gz: 4a29a03ae20e9929dcf8750b57199d1307d2061657414ee1f1bca619f7cb1ea7
 SHA512:
-  metadata.gz: 0e48f1e2eb39763739bcbcaa8c691c0aa86007fb8d6d6642bf03262b431e2c07434e19eb8f81a73a10e5df1aa29ee2d844777a2b4fe0eff9ed7fc192de37ce3c
-  data.tar.gz: 38cc045d0abf8a18225ae76917e8be24a3460150922a6c26f67d05dd66371eb679a0d1f86d986b3dcc26490369b3fb79c828f5c96c34501217c397c46d0bf485
+  metadata.gz: 0a4be674066ffc6b70b91cc8a6c8db8b3e6cf50dbe3810a363049bd6e69fd0523c353900271a3c4fb32a9accd359885f9d8d66da4b4c18a720af9f481ed01f56
+  data.tar.gz: 0b89aeade5c213100a07267077fdff3391443ac3b13c7a9580c0fe8563a8395f1dd69eed1ffd7d64e9a0b80aaedf3d314825d9c1dee1eb958bd759c5a8d5050d

data/assets/data/amplitude.html

@@ -87,6 +87,7 @@ amplitude_defaults: {{amplitude_defaults | debug}}
     ---------------------------------------------------------------------------- {% endcomment %}
     {% assign source_media                  = amplitude_defaults.player.source %}
     {% assign song_progress_bar             = amplitude_defaults.player.song_progress_bar %}
+    {% assign audio_rating                  = amplitude_defaults.player.audio_rating %}
     {% assign display_hours                 = amplitude_defaults.player.display_hours %}
     {% assign volume_slider                 = amplitude_defaults.player.volume_slider.enabled %}
     {% assign volume_slider_min             = amplitude_defaults.player.volume_slider.min_value %}
@@ -149,6 +150,13 @@ amplitude_defaults: {{amplitude_defaults | debug}}
       {% assign player_audio_info = player.playlist.audio_info %}
     {% endif %}
 
+    {% if player.audio_rating %}
+      {% assign player_audio_rating = player.audio_rating %}
+    {% else %}
+      {% assign player_audio_rating = audio_rating %}
+    {% endif %}
+
+
     {% comment %} unused
     ----------------------------------------------------------------------------
     {% unless player.playlist.scrollbar %}
@@ -319,11 +327,10 @@ amplitude_defaults: {{amplitude_defaults | debug}}
           <div id="playlist_screen_{{player_id}}" class="compact-player-playlist slide-in-top">
 
             <div id="hide_playlist_{{player_id}}" class="compact-player-header hide-playlist">
-              <img class="compact-player-header-arrows" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/up.svg" alt="Up Arrow">
-              Hide Playlist
+              <img class="compact-player-header-arrows" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/playlist-hide.svg" alt="Hide Playlist">
+              Playlist
             </div> <!-- END playlist-screen header (toggle playlist) -->
 
-            <!-- jadams, 2024-07-06: controls configurable in player -->
             {% if playlist_controls %}
             <div class="playlist-screen-controls">
               <div class="playlist-screen-meta-container">
@@ -333,9 +340,16 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                   data-amplitude-song-info="name"></span>
                 <div class="song-artist-album">
                   <span
-                    data-amplitude-playlist="{{player_playlist}}"
-                    data-amplitude-source="{{source_media_attribute}}"
-                    data-amplitude-song-info="artist" data-amplitude-song-index="0"></span>
+                  data-amplitude-source="{{source_media_attribute}}"
+                  data-amplitude-playlist="{{player_playlist}}"
+                  data-amplitude-song-info="artist">
+                </span>
+                <!-- span class="song-artist-album-delimiter">·</span>
+                <span
+                  data-amplitude-source="audio"
+                  data-amplitude-playlist="{{player_playlist}}"
+                  data-amplitude-song-info="album">
+                </span -->  
                 </div>
               </div>
               <div class="list-controls">
@@ -358,10 +372,10 @@ amplitude_defaults: {{amplitude_defaults | debug}}
             </div> <!-- END playlist controls -->
             {% endif %}
 
-            <!-- START playlist items -->
+            <!-- START playlist items (COMPACT player )-->
             <div
               id="compact_player_title_list_{{player_playlist}}"
-              class="compact-player-title-list">
+              class="amplitude-scroller-gradient compact-player-title-list">
               {% for item in playlist_items %} {% if item.enabled %}
               <!-- START list item -->
               <div
@@ -385,24 +399,37 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                   data-amplitude-source="{{source_media_attribute}}"
                   data-amplitude-playlist="{{player_playlist}}">
                   <span class="song-name">{{item.title}}</span>
-                  <span class="song-artist-album">
+
+                  {% if player_audio_rating %}
+                  <span class="audio-rating">
+                    {{item.rating}}
+                    <i class="mdib mdib-star md-gray-400 mdib-18px"></i>
+                  </span>
+                  {% endif %}
+
+                  <!-- span class="song-artist-album">
                     <span>{{item.name}}</span>
                     <span class="song-artist-album-delimiter">·</span>
                     <span>{{item.artist}}</span>
+                  </span -->
+
+                  <span class="song-artist-album">
+                    <span>{{item.artist}}</span>
                   </span>
-                </div>
 
-                <a href="{{item.audio_info}}" class="audio-info-link" target="_blank">
                   {% if player_audio_info %}
-                  <img class="audio-info-blue" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-blue.svg"   alt="audio-info" style="display: block">
-                  <img class="audio-info-white" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-white.svg" alt="audio-info" style="display: none">
-                  {% else %}
-                  <img class="audio-info-blue" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-blue.svg"   alt="audio-info" style="display: none">
-                  <img class="audio-info-white" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-white.svg" alt="audio-info" style="display: none">
+                  <span class="audio-info">
+                    <a href="{{item.audio_info}}" class="audio-info-link" target="_blank">
+                      <i class="mdib mdib-information md-gray-400 mdib-24px"></i>
+                    </a>
+                  </span>
                   {% endif %}
-                </a>
 
-                <span class="audio-duration">{{item.duration}}</span>
+                  <span class="audio-duration">{{item.duration}}</span>
+
+                </div> <!-- END song-meta-container -->
+
+
               </div>
               <!-- END list item -->
               {% endif %} {% endfor %}
@@ -431,18 +458,21 @@ amplitude_defaults: {{amplitude_defaults | debug}}
             </span>
               <img
                 class="compact-player-header-arrows"
-                src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/down.svg"
-                alt="Down Arrow">
+                src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/playlist-show.svg"
+                alt="Show Playlist">
             </div> <!-- END compact player header (toggle playlist) -->
 
             <div class="player-top">
-              <!-- jadams, DEFAULT album cover image replaced by AmplidudeJS (based on playlist) -->
-              <img
-                src="/assets/audio/cover/default/placeholder-blue.jpg"
-                data-amplitude-source="{{source_media_attribute}}"
-                data-amplitude-playlist="{{player_playlist}}"
-                data-amplitude-song-info="cover_art_url"
-                alt="album cover">
+              <!-- NOTE: album cover image (replaced by AJS API based on playlist) -->
+              <div class="album-cover-image">
+                <img
+                  src="/assets/audio/cover/default/placeholder-blue.jpg"
+                  data-amplitude-playlist="{{player_playlist}}"
+                  data-amplitude-source="{{source_media_attribute}}"
+                  data-amplitude-song-info="cover_art_url"
+                  alt="album cover image"
+                >
+              </div>
             </div>
 
             <!-- START progress bar -->
@@ -639,7 +669,7 @@ amplitude_defaults: {{amplitude_defaults | debug}}
       <!-- START create player instance on ID: {{player_id}} of type: {{player_type}} -->
       {% capture large_player_left_side %}
         <!-- START LARGE player left TOP -->
-        <div div class="player-left-top">
+        <div class="player-left-top">
 
           <div class="large-player-playlist-header">
             <span class="audio-artist">
@@ -657,15 +687,17 @@ amplitude_defaults: {{amplitude_defaults | debug}}
             </span>
           </div>
 
-          <!-- NOTE: DEFAULT album cover image (replaced by AJS API based on playlist) -->
-          <img
-            src="/assets/audio/cover/default/placeholder-blue.jpg"
-            width="500" height="500"
-            data-amplitude-playlist="{{player_playlist}}"
-            data-amplitude-source="{{source_media_attribute}}"
-            data-amplitude-song-info="cover_art_url"
-            alt="album cover"
-          >
+          <!-- NOTE: album cover image (replaced by AJS API based on playlist) -->
+          <div class="album-cover-image">
+            <img
+              src="/assets/audio/cover/default/placeholder-blue.jpg"
+              data-amplitude-playlist="{{player_playlist}}"
+              data-amplitude-source="{{source_media_attribute}}"
+              data-amplitude-song-info="cover_art_url"
+              alt="album cover image"
+            >
+          </div>
+
           <!-- START progress bar -->
           {% if song_progress_bar %}
           <progress
@@ -793,7 +825,7 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                 data-amplitude-source="{{source_media_attribute}}"
                 data-amplitude-playlist="{{player_playlist}}">
               </span>
-              :
+              :             
               {% endif %}
               <span
                 class="amplitude-duration-minutes"
@@ -856,7 +888,6 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                 class="large-player-playlist-header">Playlist
               </div>
 
-              <!-- jadams, 2024-07-06: controls configurable in player -->
               {% if playlist_controls %}
               <div class="playlist-screen-controls large-player">
                 <div class="playlist-screen-meta-container">
@@ -870,9 +901,14 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                     <span
                       data-amplitude-source="{{source_media_attribute}}"
                       data-amplitude-playlist="{{player_playlist}}"
-                      data-amplitude-song-info="artist"
-                      data-amplitude-song-index="0">
+                      data-amplitude-song-info="artist">
                     </span>
+                    <!-- span class="song-artist-album-delimiter">·</span>
+                    <span
+                      data-amplitude-source="audio"
+                      data-amplitude-playlist="{{player_playlist}}"
+                      data-amplitude-song-info="album">
+                    </span -->                    
                   </div>
                 </div>
                 <div class="list-controls">
@@ -894,10 +930,10 @@ amplitude_defaults: {{amplitude_defaults | debug}}
               </div> <!-- END playlist controls -->
               {% endif %}
 
-              <!-- START playlist items -->
+              <!-- START playlist items (Large Player) -->
               <div
                 id="large_player_title_list_{{player_playlist}}"
-                class="large-player-title-list">
+                class="amplitude-scroller-gradient large-player-title-list">
                 {% for item in playlist_items %}{% if item.enabled %}
                 <!-- START list item -->
                 <div
@@ -907,11 +943,14 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                   data-amplitude-playlist="{{player_playlist}}">
 
                   <div
-                    class="song-now-playing-icon-container"
+                    class="song-number-now-playing"
                     data-amplitude-source="{{source_media_attribute}}"
                     data-amplitude-playlist="{{player_playlist}}">
                     <span class="title-number">{{forloop.index}}
-                      <img class="now-playing" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/now-playing.svg" alt="now-playing">
+                      <img
+                        class="now-playing"
+                        src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/now-playing.svg"
+                        alt="now-playing">
                     </span>
                   </div>
 
@@ -919,29 +958,43 @@ amplitude_defaults: {{amplitude_defaults | debug}}
                     class="audio-meta-data"
                     data-amplitude-playlist="{{player_playlist}}">
                     <span class="audio-title">{{item.title}}</span>
+
+                    {% if player_audio_rating %}
+                    <span class="audio-rating">
+                      {{item.rating}}
+                      <i class="mdib mdib-star md-gray-400 mdib-18px"></i>
+                    </span>
+                    {% endif %}
+
                     <span class="audio-artist">
-                      <span>{{item.name}}</span>
-                      <span class="song-artist-album-delimiter">·</span>
                       <span>{{item.artist}}</span>
+                      <!-- span class="song-artist-album-delimiter">·</span>
+                      <span>{{item.name}}</span -->
+
+                      {% if player_audio_info %}
+                      <span class="audio-info">
+                        <a href="{{item.audio_info}}" class="audio-info-link" target="_blank">
+                          <i class="mdib mdib-information md-gray-400 mdib-24px"></i>
+                        </a>
+                      </span>
+                      {% endif %}                      
                     </span>
                   </div>
 
-                  <a href="{{item.audio_info}}" class="audio-info-link" target="_blank">
-                    {% if player_audio_info %}
-                    <img class="audio-info-blue" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-blue.svg"   alt="audio-info" style="display: block">
-                    <img class="audio-info-white" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-white.svg" alt="audio-info" style="display: none">
-                    {% else %}
-                    <img class="audio-info-blue" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-blue.svg"   alt="audio-info" style="display: none">
-                    <img class="audio-info-white" src="/assets/theme/j1/modules/amplitudejs/icons/player/dark/audio-info-white.svg" alt="audio-info" style="display: none">
-                    {% endif %}
-                  </a>
-
+                  <!-- jadams, 2024-11-05: workaround -->
+                  {% if player.display_hours %}
                   <span class="audio-duration">{{item.duration}}</span>
+                  {% else %}
+                  <span class="audio-duration" style="margin-left: 50px;">{{item.duration}}</span>
+                  <!-- span class="audio-duration">{{item.duration}}</span -->
+                  {% endif %}
+                  
+
                 </div>
                 <!-- END list item -->
                 {% endif %}{% endfor %}
               </div>
-              <!-- EBD playlist items -->
+              <!-- END playlist items (Large Player) -->
 
             </div> <!-- END Large Player|Right Side -->
 

data/assets/data/cookieconsent.html

@@ -147,16 +147,16 @@ exclude_from_search:                    true
           </div>
 
           <div class="modal-footer">
-            <button id="bccs-buttonDoNotAgree" type="button" class="btn btn-outline-secondary mb-1 mr-2" style="min-width: 20rem">
+            <button id="bccs-buttonDoNotAgree" type="button" class="btn btn-danger mb-1 mr-2" style="min-width: 20rem">
             I Do not Agree
             </button>
-            <button id="bccs-buttonAgree" type="button" class="btn btn-primary mb-1 mr-2" style="min-width: 20rem">
+            <button id="bccs-buttonAgree" type="button" class="btn btn-success mb-1 mr-2" style="min-width: 20rem">
             I Agree
             </button>
-            <button id="bccs-buttonSave" type="button" class="btn btn-outline-secondary mb-1 mr-2" style="display: none; min-width: 20rem">
+            <button id="bccs-buttonSave" type="button" class="btn btn-warning  mb-1 mr-2" style="display: none; min-width: 20rem">
             Save selection
             </button>
-            <button id="bccs-buttonAgreeAll" type="button" class="btn btn-primary mb-1 mr-2" style="display: none; min-width: 20rem">
+            <button id="bccs-buttonAgreeAll" type="button" class="btn btn-success mb-1 mr-2" style="display: none; min-width: 20rem">
             Agree on all
             </button>
           </div>
@@ -242,16 +242,16 @@ exclude_from_search:                    true
           </div>
 
           <div class="modal-footer">
-            <button id="bccs-buttonDoNotAgree" type="button" class="btn btn-outline-secondary mb-1 mr-2" style="min-width: 20rem">
+            <button id="bccs-buttonDoNotAgree" type="button" class="btn btn-warning  mb-1 mr-2" style="min-width: 20rem">
             Ich stimme nicht zu
             </button>
-            <button id="bccs-buttonAgree" type="button" class="btn btn-primary mb-1 mr-2" style="min-width: 20rem">
+            <button id="bccs-buttonAgree" type="button" class="btn btn-success mb-1 mr-2" style="min-width: 20rem">
             Ich stimme zu
             </button>
-            <button id="bccs-buttonSave" type="button" class="btn btn-outline-secondary mb-1 mr-2" style="display: none; min-width: 20rem">
+            <button id="bccs-buttonSave" type="button" class="btn btn-warning  mb-1 mr-2" style="display: none; min-width: 20rem">
             Auswahl speichern
             </button>
-            <button id="bccs-buttonAgreeAll" type="button" class="btn btn-primary mb-1 mr-2" style="display: none; min-width: 20rem">
+            <button id="bccs-buttonAgreeAll" type="button" class="btn btn-success mb-1 mr-2" style="display: none; min-width: 20rem">
             Stimme allen zu
             </button>
           </div>

data/assets/data/panel.html

@@ -21,7 +21,7 @@ exclude_from_search:                    true
  # NOTE: All panel id's are prefixed by 'panel_'
  #
  # -----------------------------------------------------------------------------
- # Test data:
+ # Test data:More articles can be found 
  #    {{ variable | debug }}
  # -----------------------------------------------------------------------------
 {% endcomment %}
@@ -853,12 +853,13 @@ exclude_from_search:                    true
 
                   <div id="previewer" class="previewer-headline">
                     <div class="post-headline">
-                  	<h2 id="post-headline" class="notoc notranslate mt-3">Vorschau</h2>
+                  	<h2 id="post-headline" class="notoc notranslate mt-3">Preview</h2>
                     </div>
                   </div>
 
                   <!-- [INFO   ] [~/assets/data/panel.html              ] [ blocktype detected as: {{card_block}} ] -->
                   {% if card_block == 'card-list' %}
+                  <!-- Recent posts (card-list) -->
                   <div id="{{panel_settings.id}}" class="preview_content">
                     <ul id="{{panel_settings.id}}-scroll-group" class="scroll-group scroll-group-horizontal align-items-stretch flex-wrap">
                       <!-- [INFO   ] [~/assets/data/panel.html              ] [ write post items (card_block == 'card-list')] -->
@@ -929,7 +930,7 @@ exclude_from_search:                    true
                   {% endif %}
 
                   {% if card_block == 'card-deck' %}
-                  <!-- Recent posts -->
+                  <!-- Recent posts (card-deck) -->
                   <div id="{{panel_settings.id}}" class="row card-deck">
                     <!-- [INFO   ] [~/assets/data/panel.html              ] [ write post items (card_block == 'card-deck')] -->
                   {% for post in site.posts %} {% for category in post.categories %}

data/assets/data/speak2me.html

@@ -144,17 +144,6 @@ exclude_from_search:                    true
               <!-- start control buttons -->
               <div class="ml-2">
 
-                <!-- speak button -->
-                <button type="button"
-                  id="speak_button"
-                  class="btn btn-{{speak2me_options.modal.settings.speak_button_style}} btn-sm"
-                  style="min-width: 180px;"
-                  onclick="j1.adapter.speak2me.speak('{{speak2me_options.speechSelector}}')"
-                  data-bs-dismiss="modal">
-                  <i class="mdib mdib-speaker mdib-sm mr-2"></i>
-                  {{speak2me_options.modal.settings.speak_button_text}}
-                </button>
-
                 <!-- stop button -->
                 <button type="button"
                   id="stop_button"
@@ -166,6 +155,17 @@ exclude_from_search:                    true
                   {{speak2me_options.modal.settings.stop_button_text}}
                 </button>
 
+                <!-- speak button -->
+                <button type="button"
+                  id="speak_button"
+                  class="btn btn-{{speak2me_options.modal.settings.speak_button_style}} btn-sm"
+                  style="min-width: 180px;"
+                  onclick="j1.adapter.speak2me.speak('{{speak2me_options.speechSelector}}')"
+                  data-bs-dismiss="modal">
+                  <i class="mdib mdib-speaker mdib-sm mr-2"></i>
+                  {{speak2me_options.modal.settings.speak_button_text}}
+                </button>
+
                 <!-- pause button -->
                 <button type="button"
                   id="pause_button"

data/assets/data/translator.html

@@ -149,40 +149,40 @@ exclude_from_search:                    true
             <button
               id="translator-buttonDoNotAgree"
               type="button"
-              class="btn btn-outline-secondary mb-1 mr-2"
+              class="btn btn-danger mb-1 mr-2"
               style="min-width: 20rem">
-            No, disable translation
+              No, disable translation
             </button>
 
             <button
-              id="translator-buttonAgree"
+              id="translator-buttonExit"
               type="button"
-              class="btn btn-primary mb-1 mr-2"
-              style="min-width: 20rem">
-            Yes, please translate
+              class="btn btn-info mb-1 mr-2"
+              style="min-width: 20rem"
+              data-bs-dismiss="modal">
+              Do nothing
             </button>
 
             <button
-              id="translator-buttonExit"
+              id="translator-buttonAgree"
               type="button"
-              class="btn btn-warning mb-1 mr-2"
-              style="min-width: 20rem"
-              data-bs-dismiss="modal">
-            Do nothing
+              class="btn btn-success mb-1 mr-2"
+              style="min-width: 20rem">
+              Yes, please translate
             </button>
 
             <button
               id="translator-buttonSave"
               type="button"
-              class="btn btn-outline-secondary mb-1 mr-2"
+              class="btn btn-warning mb-1 mr-2"
               style="display:none; min-width: 20rem">
-            Save selection
+              Save selection
             </button>
 
             <button
               id="translator-buttonAgreeAll"
               type="button"
-              class="btn btn-primary mb-1 mr-2"
+              class="btn btn-success mb-1 mr-2"
               style="display:none; min-width: 20rem">
             I Agree on all
             </button>
@@ -272,42 +272,42 @@ exclude_from_search:                    true
             <button
               id="translator-buttonDoNotAgree"
               type="button"
-              class="btn btn-outline-secondary mb-1 mr-2"
+              class="btn btn-danger mb-1 mr-2"
               style="min-width: 20rem">
-                Nein, Übersetzung deaktivieren
+              Nein, Übersetzung deaktivieren
             </button>
 
             <button
-              id="translator-buttonAgree"
+              id="translator-buttonExit"
               type="button"
-              class="btn btn-primary mb-1 mr-2"
-              style="min-width: 20rem">
-                Ja, bitte übersetzen Sie
+              class="btn btn-info mb-1 mr-2"
+              style="min-width: 20rem"
+              data-bs-dismiss="modal">
+              Nichts tun
             </button>
 
             <button
-              id="translator-buttonExit"
+              id="translator-buttonAgree"
               type="button"
-              class="btn btn-warning mb-1 mr-2"
-              style="min-width: 20rem"
-              data-bs-dismiss="modal">
-                Nichts tun
+              class="btn btn-success mb-1 mr-2"
+              style="min-width: 20rem">
+              Ja, bitte übersetzen Sie
             </button>
 
             <button
               id="translator-buttonSave"
               type="button"
-              class="btn btn-outline-secondary mb-1 mr-2"
+              class="btn btn-warning mb-1 mr-2"
               style="display:none; min-width: 20rem">
-                Auswahl speichern
+              Auswahl speichern
             </button>
 
             <button
               id="translator-buttonAgreeAll"
               type="button"
-              class="btn btn-primary mb-1 mr-2"
+              class="btn btn-success mb-1 mr-2"
               style="display:none; min-width: 20rem">
-                Stimme allen zu
+              Stimme allen zu
             </button>
           </div>