aboutsummaryrefslogtreecommitdiff
path: root/views/index.view.php
diff options
context:
space:
mode:
Diffstat (limited to 'views/index.view.php')
-rw-r--r--views/index.view.php225
1 files changed, 19 insertions, 206 deletions
diff --git a/views/index.view.php b/views/index.view.php
index 3ac2d0b..130247f 100644
--- a/views/index.view.php
+++ b/views/index.view.php
@@ -19,63 +19,16 @@
</audio>
</noscript>
- <div class="sm2-bar-ui bg-white compact shadow-md mb-4 border">
-
- <div class="bd sm2-main-controls">
-
- <div class="sm2-inline-element sm2-button-element">
- <div class="sm2-button-bd">
- <a href="#play" class="sm2-inline-button sm2-icon-play-pause">Play / Pause</a>
- </div>
- </div>
-
- <div class="sm2-inline-element sm2-inline-status">
-
- <div class="sm2-progress">
- <div class="sm2-row">
- <div class="sm2-inline-time">0:00</div>
- <div class="sm2-progress-bd">
- <div class="sm2-progress-track">
- <div class="sm2-progress-bar"></div>
- <div class="sm2-progress-ball"><div class="icon-overlay"></div></div>
- </div>
- </div>
- <div class="sm2-inline-duration">0:00</div>
- </div>
- </div>
-
- </div>
-
- <div class="sm2-inline-element sm2-button-element sm2-volume">
- <div class="sm2-button-bd">
- <span class="sm2-inline-button sm2-volume-control volume-shade"></span>
- <a href="#volume" class="sm2-inline-button sm2-volume-control">volume</a>
- </div>
- </div>
-
- <a href="audio/prologue.mp3" class="sm2-inline-element sm2-button-element" download>
- <?php echo file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/..' . '/public/icons/feathericons/download.svg') ?>
- </a>
-
- </div>
-
- <div class="bd sm2-playlist-drawer sm2-element">
-
- <div class="sm2-playlist-wrapper">
- <ul class="sm2-playlist-bd">
- <li class="selected"><a href="/audio/prologue.mp3">Prologue</a></li>
- </ul>
- </div>
-
- </div>
-
- </div>
+<?php
+$audio = 'prologue';
+require __DIR__ . '/components/AudioPlayer.php';
+?>
<h1 class="text-xl text-gray-800 mb-2 font-bold">Narrative</h1>
- <p class="text-gray-800 mb-3 leading-normal">
+ <p class="text-gray-darkest mb-3 leading-normal">
Spoken or written accounts of connected events.
</p>
@@ -86,63 +39,16 @@
</audio>
</noscript>
- <div class="sm2-bar-ui bg-white compact shadow-md mb-4 border">
-
- <div class="bd sm2-main-controls">
-
- <div class="sm2-inline-element sm2-button-element">
- <div class="sm2-button-bd">
- <a href="#play" class="sm2-inline-button sm2-icon-play-pause">Play / Pause</a>
- </div>
- </div>
-
- <div class="sm2-inline-element sm2-inline-status">
-
- <div class="sm2-progress">
- <div class="sm2-row">
- <div class="sm2-inline-time">0:00</div>
- <div class="sm2-progress-bd">
- <div class="sm2-progress-track">
- <div class="sm2-progress-bar"></div>
- <div class="sm2-progress-ball"><div class="icon-overlay"></div></div>
- </div>
- </div>
- <div class="sm2-inline-duration">0:00</div>
- </div>
- </div>
-
- </div>
-
- <div class="sm2-inline-element sm2-button-element sm2-volume">
- <div class="sm2-button-bd">
- <span class="sm2-inline-button sm2-volume-control volume-shade"></span>
- <a href="#volume" class="sm2-inline-button sm2-volume-control">volume</a>
- </div>
- </div>
-
- <a href="audio/narrative.mp3" class="sm2-inline-element sm2-button-element" download>
- <?php echo file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/..' . '/public/icons/feathericons/download.svg') ?>
- </a>
-
- </div>
-
- <div class="bd sm2-playlist-drawer sm2-element">
-
- <div class="sm2-playlist-wrapper">
- <ul class="sm2-playlist-bd">
- <li class="selected"><a href="/audio/narrative.mp3">Narrative</a></li>
- </ul>
- </div>
-
- </div>
-
- </div>
+<?php
+$audio = 'narrative';
+require __DIR__ . '/components/AudioPlayer.php';
+?>
<h1 class="text-xl text-gray-800 mb-2 font-bold">Dramatic</h1>
- <p class="text-gray-800 mb-3 leading-normal">
+ <p class="text-gray-darkest mb-3 leading-normal">
Sudden and striking narrative elements.
</p>
@@ -153,64 +59,16 @@
</audio>
</noscript>
- <div class="sm2-bar-ui bg-white compact shadow-md mb-4 border">
-
- <div class="bd sm2-main-controls">
-
- <div class="sm2-inline-element sm2-button-element">
- <div class="sm2-button-bd">
- <a href="#play" class="sm2-inline-button sm2-icon-play-pause">Play / Pause</a>
- </div>
- </div>
-
- <div class="sm2-inline-element sm2-inline-status">
-
- <div class="sm2-progress">
- <div class="sm2-row">
- <div class="sm2-inline-time">0:00</div>
- <div class="sm2-progress-bd">
- <div class="sm2-progress-track">
- <div class="sm2-progress-bar"></div>
- <div class="sm2-progress-ball"><div class="icon-overlay"></div></div>
- </div>
- </div>
- <div class="sm2-inline-duration">0:00</div>
- </div>
- </div>
-
- </div>
-
- <div class="sm2-inline-element sm2-button-element sm2-volume">
- <div class="sm2-button-bd">
- <span class="sm2-inline-button sm2-volume-control volume-shade"></span>
- <a href="#volume" class="sm2-inline-button sm2-volume-control">volume</a>
- </div>
- </div>
-
- <a href="audio/dramatic.mp3" class="sm2-inline-element sm2-button-element" download>
- <?php echo file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/..' . '/public/icons/feathericons/download.svg') ?>
- </a>
-
- </div>
-
- <div class="bd sm2-playlist-drawer sm2-element">
-
- <div class="sm2-playlist-wrapper">
- <ul class="sm2-playlist-bd">
- <li class="selected"><a href="/audio/dramatic.mp3">Dramatic</a></li>
- </ul>
- </div>
-
- </div>
-
- </div>
-
+<?php
+$audio = 'dramatic';
+require __DIR__ . '/components/AudioPlayer.php';
+?>
<h1 class="text-xl text-gray-800 mb-2 font-bold">Commercial</h1>
- <p class="text-gray-800 mb-3 leading-normal">
+ <p class="text-gray-darkest mb-3 leading-normal">
Old school narrative commercial style.
</p>
@@ -221,56 +79,11 @@
</audio>
</noscript>
- <div class="sm2-bar-ui bg-white compact shadow-md border">
-
- <div class="bd sm2-main-controls">
-
- <div class="sm2-inline-element sm2-button-element">
- <div class="sm2-button-bd">
- <a href="#play" class="sm2-inline-button sm2-icon-play-pause">Play / Pause</a>
- </div>
- </div>
-
- <div class="sm2-inline-element sm2-inline-status">
-
- <div class="sm2-progress">
- <div class="sm2-row">
- <div class="sm2-inline-time">0:00</div>
- <div class="sm2-progress-bd">
- <div class="sm2-progress-track">
- <div class="sm2-progress-bar"></div>
- <div class="sm2-progress-ball"><div class="icon-overlay"></div></div>
- </div>
- </div>
- <div class="sm2-inline-duration">0:00</div>
- </div>
- </div>
-
- </div>
-
- <div class="sm2-inline-element sm2-button-element sm2-volume">
- <div class="sm2-button-bd">
- <span class="sm2-inline-button sm2-volume-control volume-shade"></span>
- <a href="#volume" class="sm2-inline-button sm2-volume-control">volume</a>
- </div>
- </div>
-
- <a href="audio/commercial.mp3" class="sm2-inline-element sm2-button-element" download>
- <?php echo file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/..' . '/public/icons/feathericons/download.svg') ?>
- </a>
-
- </div>
-
- <div class="bd sm2-playlist-drawer sm2-element">
-
- <div class="sm2-playlist-wrapper">
- <ul class="sm2-playlist-bd">
- <li class="selected"><a href="/audio/commercial.mp3">Commercial</a></li>
- </ul>
- </div>
- </div>
+<?php
+$audio = 'commercial';
+require __DIR__ . '/components/AudioPlayer.php';
+?>
- </div>
<?php require __DIR__ . '/partials/footer.php'; ?>