<!DOCTYPE html> <html class="no-js"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>{{ entry.title }}</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width"> <meta name="apple-mobile-web-app-capable" content="yes"> <script src="{{ url_for('static', filename='js/libs/jquery.min.js') }}"></script> <script src="{{ url_for('static', filename='js/libs/soundmanager2.js') }}"></script> <script src="{{ url_for('static', filename='js/libs/bar-ui.js') }}"></script> <link rel="apple-touch-icon" sizes="140x140" href="{{ url_for('static', filename='favicon.ico') }}"> <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}"> <link href="{{ url_for('static', filename='css/libs/bootstrap.min.css') }}" rel="stylesheet" media="screen"> <link rel="stylesheet" href="{{ url_for('static', filename='css/libs/bar-ui.css') }}" /> <script> "use strict"; </script> </head> <body> <div class="sm2-bar-ui full-width fixed"> <div class="bd sm2-main-controls"> <div class="sm2-inline-texture"></div> <div class="sm2-inline-gradient"></div> <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-playlist"> <div class="sm2-playlist-target"> <noscript><p>JavaScript Required.</p></noscript> </div> </div> <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> <div class="sm2-inline-element sm2-button-element"> <div class="sm2-button-bd"> <a href="#prev" title="Previous" class="sm2-inline-button sm2-icon-previous">< Previous</a> </div> </div> <div class="sm2-inline-element sm2-button-element"> <div class="sm2-button-bd"> <a href="#next" title="Next" class="sm2-inline-button sm2-icon-next">> Next</a> </div> </div> <div class="sm2-inline-element sm2-button-element"> <div class="sm2-button-bd"> <a href="#repeat" title="Repeat playlist" class="sm2-inline-button sm2-icon-repeat">∞ Repeat</a> </div> </div> <div class="sm2-inline-element sm2-button-element sm2-menu"> <div class="sm2-button-bd"> <a href="#menu" class="sm2-inline-button sm2-icon-menu">Menu</a> </div> </div> </div> <div class="bd sm2-playlist-drawer sm2-element"> <div class="sm2-inline-texture"> <div class="sm2-box-shadow"></div> </div> <!-- playlist content is mirrored here --> <div class="sm2-playlist-wrapper"> <ul class="sm2-playlist-bd"> <li><a href="{{ url_for('web.serve_book', book_id=mp3file,book_format=audioformat)}}"><b>{% for author in entry.authors %}{{author.name.replace('|',',')}} {% if not loop.last %} & {% endif %} {% endfor %}</b> - {{entry.title}}</a></li> </ul> </div> </div> </div> <script> soundManager.setup({ useHTML5Audio: true, preferFlash: false, url: '/path/to/swf-files/', onready: function() { var mySound = soundManager.createSound({ // id: 'aSound', // url: "{{ url_for('web.serve_book', book_id=mp3file,book_format=audioformat)}}" }); mySound.play(); }, ontimeout: function() { // Hrmm, SM2 could not start. Missing SWF? Flash blocked? Show an error, etc.? } }); window.calibre = { filePath: "{{ url_for('static', filename='js/libs/') }}", cssPath: "{{ url_for('static', filename='css/') }}", bookUrl: "{{ url_for('static', filename=mp3file) }}/", bookmarkUrl: "{{ url_for('web.bookmark', book_id=mp3file, book_format=audioformat.upper()) }}", bookmark: "{{ bookmark.bookmark_key if bookmark != None }}", useBookmarks: "{{ g.user.is_authenticated | tojson }}" }; </script> </body> </html>