Skip to content
Browse files

a very basic theme, based on the excellent Zukunft http://bowcase.me/…

  • Loading branch information...
0 parents commit 6db85cef9ee59428f92e0f1703458a85fa4b41d9 Todd Matthews committed Aug 9, 2010
Showing with 4,485 additions and 0 deletions.
  1. +3 −0 css/load.css
  2. +19 −0 css/reset.css
  3. +24 −0 css/screen.css
  4. BIN img/preview.png
  5. BIN img/progress_back.png
  6. +35 −0 index.html
  7. +38 −0 info.plist
  8. +176 −0 js/dai.js
  9. +4,190 −0 js/jquery.js
3 css/load.css
@@ -0,0 +1,3 @@
+@charset UTF-8;
+@import url(reset.css);
+@import url(screen.css);
19 css/reset.css
@@ -0,0 +1,19 @@
+@charset "UTF-8";
+@media all {
+ * html body * {overflow: visible;}
+ * html iframe, * html frame {overflow: auto;}
+ * html frameset {overflow: hidden;}
+ html {height: 100%; margin-bottom: 1px;}
+ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
+
+ :focus { outline: 0;}
+ body {line-height: 1; color: black; background: white; font-size: 100.01%; text-align: left; height: 100%}
+ ol, ul {list-style: none;}
+ table {border-collapse: separate; border-spacing: 0;}
+ caption, th, td {text-align: left; font-weight: normal;}
+ blockquote:before, blockquote:after, q:before, q:after {content: "";}
+ blockquote, q {quotes: "" "";}
+ fieldset, img {border: 0 solid;}
+ .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
+ .clearfix {display: block;}
+}
24 css/screen.css
@@ -0,0 +1,24 @@
+@charset "UTF-8";
+@media screen {
+ body {background: transparent; color: #fff; cursor: default; overflow: visible;}
+ body, div, img {font-size: 72px;}
+ body, div, input, textarea, select, option, label, p, h1, h2, h3, h4, h5, h6 {font-family: 'HelveticaNeue-Light', 'MyriadPro-Light', 'HelveticaNeue', 'MyriadPro', helvetica, arial, sans-serif;}
+ body#bowlet {position:relative}
+ body#bowlet div#title {min-height: 1.5em; opacity:0.5;}
+ body#bowlet div#title p {opacity: 0.5; font-size: 1.5em; white-space: pre;}
+ body#bowlet div#title, body#bowlet div#progress { -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)))}
+
+ body#bowlet div#progress {opacity: 0.5; width: 100%; height: 0.2em; margin: 0.4em 0em; background: transparent url(../img/progress_back.png) top left repeat;}
+ body#bowlet div#progress div#bar {width: 0; height: 0.2em; position: relative; display: block; background: #fff; opacity: 0.5;}
+
+ body#bowlet div#info {position:absolute; bottom:0, left:0; width: 600px; overflow: hidden; opacity:0.5;}
+ body#bowlet div#info p {opacity: 0.5; line-height:1.2em; font-size: 1.2em; padding: 0em; white-space: pre;}
+
+ body#bowlet div#rating {font-size: 1em; line-height: 1.9em; position: absolute; right: 0; bottom: 0; -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.5)), to(rgba(0,0,0,.1)))}
+ body#bowlet div#rating a {padding: 0em; }
+
+ body#bowlet div#debug {display: none; background: #fff; padding: 1em 0.5em; margin: 1em 0em 0em 0em;}
+ body#bowlet div#debug ul li {font-size: 1.4em;}
+ body#bowlet div#debug ul li.error {color: red;}
+ body#bowlet div#debug ul li.success {color: green;}
+}
BIN img/preview.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN img/progress_back.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
35 index.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
+ <meta http-equiv="content-language" content="en-en" />
+ <title>Zukunft</title>
+ <link charset="utf-8" type="text/css" rel="stylesheet" media="all" href="css/load.css" />
+ <script charset="utf-8" type="text/javascript" src="js/jquery.js"></script>
+ <script charset="utf-8" type="text/javascript" src="js/dai.js"></script>
+ </head>
+ <body id="bowlet">
+ <div id="area">
+ </div>
+ <div id="title">
+ <p></p>
+ </div>
+ <div id="progress">
+ <div id="bar">
+ </div>
+ </div>
+ <div id="info">
+ <p></p>
+ </div>
+ <div id="rating">
+ <a id="star0" class="20">☆</a>
+ <a id="star1" class="40">☆</a>
+ <a id="star2" class="60">☆</a>
+ <a id="star3" class="80">☆</a>
+ <a id="star4" class="100">☆</a>
+ </div>
+ <div id="debug">
+ <ul></ul>
+ </div>
+ </body>
+</html>
38 info.plist
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+ <key>BTThemeName</key>
+ <string>Chō ōgata</string>
+ <key>BTThemeIdentifier</key>
+ <string>com.seaofclouds.choogata-white</string>
+ <key>BTThemVersion</key>
+ <string>0.6a</string>
+ <key>BTThemePreviewImage</key>
+ <string>img/preview.png</string>
+ <key>BTThemeArtist</key>
+ <string>seaofclouds</string>
+ <key>BTThemeArtistUrl</key>
+ <string>http://seaofclouds.com</string>
+ <key>BTMainFile</key>
+ <string>index.html</string>
+ <key>BTWindowWidth</key>
+ <integer>1300</integer>
+ <key>BTWindowHeight</key>
+ <integer>300</integer>
+ <key>BTWindowMode</key>
+ <string>desktop</string>
+ <key>BTSpacesBehavior</key>
+ <string>all</string>
+ <key>BTArtworkWidth</key>
+ <integer>45</integer>
+ <key>BTArtworkHeight</key>
+ <integer>45</integer>
+ <key>BTStatusFunction</key>
+ <string>playerUpdate</string>
+ <key>BTTrackFunction</key>
+ <string>trackUpdate</string>
+ <key>BTArtworkFunction</key>
+ <string>artworkUpdate</string>
+</dict>
+</plist>
176 js/dai.js
@@ -0,0 +1,176 @@
+$(function (){
+ $('body#bowlet div#progress').bind('click', function(event) {
+ var length = currentTrack.property('length');
+ var inp = event.screenX - Bowtie.currentFrame()[0];
+ var result = inp / 200;
+ var pos = Math.round(length * result);
+
+ iTunes.setPlayerPosition(pos);
+ $('div#progress div#bar').animate({width: inp + 'px'}, 100, "swing");
+ });
+ $('div#rating a').bind('click', function(event) {
+ var rate = $(this).attr('class') * 1;
+
+ iTunes.setRating(rate);
+
+ updateRating(rate);
+
+ return false;
+ });
+});
+
+var currentTrack;
+var currentRating = 0;
+var currentState = {
+ volume: 100,
+};
+var toogleTimer = 0;
+
+// player update functions
+function playerUpdate() {
+ var original = iTunes.playerPosition() / currentTrack.property('length');
+ var progress = Math.round(200 * original);
+ $('div#progress div#bar').stop().animate({width: progress + 'px'}, 50);
+
+ var volume = iTunes.volume();
+
+ if (volume != currentState.volume) {
+ $('body#bowlet').stop().fadeTo(1000, volume / 100);
+ };
+
+ currentState.volume = volume;
+
+ updateRating(iTunes.rating());
+}
+
+
+function trackUpdate(track) {
+ clearTimeout(toogleTimer);
+ var title = track.property('title').replace(/^\s+|\s+$/g, '');
+ var artist = track.property('artist').replace(/^\s+|\s+$/g, '');
+ var album = track.property('album').replace(/^\s+|\s+$/g, '');
+ var tlength = track.property('length');
+
+ if (title != undefined) {
+ if (title.length >= 26) {
+ title = title.substring(0,25).replace(/^\s+|\s+$/g, '') + '...'
+ };
+ $('div#title p').fadeTo(500,0, function() {
+ $(this).text(title).fadeTo(500,1);
+ });
+ } else {
+ $('div#title p').fadeTo(500,0,function() {
+ $(this).text('No Track selected').fadeTo(500,1);
+ });
+ };
+
+ if (tlength != undefined) {
+ $('div#progress').fadeTo(500,1);
+ $('div#rating').fadeTo(500,1);
+ } else {
+ $('div#progress').fadeTo(500,0);
+ $('div#rating').fadeTo(500,0);
+ };
+
+ if (artist != undefined) {
+ if (artist.length >= 23) {
+ artist = artist.substring(0,22).replace(/^\s+|\s+$/g, '') + '...'
+ };
+ $('div#info p')
+ .attr('class','')
+ .fadeTo(500,0, function() {
+ $(this)
+ .text(artist)
+ .addClass('artist')
+ .fadeTo(500,1, function() {
+ toogleTimer = setTimeout(toggleInfo, 30000);
+ });
+ });
+ } else {
+ $('div#info p')
+ .attr('class','')
+ .fadeOut(500, function() {
+ $(this).text('').fadeIn(500);
+ });
+ };
+
+ currentTrack = track;
+
+ updateRating(iTunes.rating());
+}
+
+function toggleInfo() {
+ clearTimeout(toogleTimer);
+ var p = $('div#info p');
+ var artist = currentTrack.property('artist');
+ var album = currentTrack.property('album');
+ if ($(p).hasClass('artist')) {
+ if (album.length >= 23) {
+ album = album.substring(0,22).replace(/^\s+|\s+$/g, '') + '...'
+ };
+ $(p).fadeTo(1000,0, function() {
+ $(this)
+ .attr('class','')
+ .text(album)
+ .addClass('album')
+ .fadeTo(1000,1, function() {
+ toogleTimer = setTimeout(toggleInfo, 30000);
+ });
+ });
+ } else if ($(p).hasClass('album')) {
+ if (artist.length >= 23) {
+ artist = artist.substring(0,22).replace(/^\s+|\s+$/g, '') + '...'
+ };
+ $(p).fadeTo(1000,0, function() {
+ $(this)
+ .attr('class','')
+ .text(artist)
+ .addClass('artist')
+ .fadeTo(1000,1, function() {
+ toogleTimer = setTimeout(toggleInfo, 30000);
+ });
+ });
+ };
+}
+
+function updateRating(rating) {
+ if (rating != currentRating) {
+ if (rating > 0) {
+ $('div#rating a#star0').text('');
+ } else {
+ $('div#rating a#star0').text('');
+ }
+
+ if (rating > 20) {
+ $('div#rating a#star1').text('');
+ } else {
+ $('div#rating a#star1').text('');
+ }
+
+ if (rating > 40) {
+ $('div#rating a#star2').text('');
+ } else {
+ $('div#rating a#star2').text('');
+ }
+
+ if (rating > 60) {
+ $('div#rating a#star3').text('');
+ } else {
+ $('div#rating a#star3').text('');
+ }
+
+ if (rating > 80) {
+ $('div#rating a#star4').text('');
+ } else {
+ $('div#rating a#star4').text('');
+ }
+ };
+
+ currentRating = rating;
+}
+
+// simple logger for debugging
+function log(message,status) {
+ $('div#debug').css('display','block');
+ $('div#debug ul').append('<li class="' + status + '">' + message + '</li>');
+}
4,190 js/jquery.js
4,190 additions, 0 deletions not shown because the diff is too large. Please use a local Git client to view these changes.

0 comments on commit 6db85ce

Please sign in to comment.
Something went wrong with that request. Please try again.