diff --git a/index.html b/index.html index ad60fc52..c82b7089 100755 --- a/index.html +++ b/index.html @@ -30,7 +30,13 @@
-
+
+
+
+
+
+
+
diff --git a/winamp.css b/winamp.css index a182f088..ea766317 100755 --- a/winamp.css +++ b/winamp.css @@ -40,6 +40,11 @@ body { cursor:url('cursors/MAINMENU.PNG'), auto; } +#winamp.doubled { + zoom: 2; + -moz-transform: scale(2); +} + #winamp.loading { background-color: #FFFFFF; background-image: url('images/loading.gif'); @@ -134,6 +139,35 @@ body { background-position: -312px 0; } +.doubled .status #clutter-bar { + background-position: -328px -44px; +} + +#clutter-bar div { + position: absolute; + height: 7px; + width: 8px; + left: 0px; +} + +#clutter-bar #button-o { + top: 3px; + height: 8px; +} +#clutter-bar #button-a { + top: 11px; + } +#clutter-bar #button-i { + top: 18px; +} +#clutter-bar #button-d { + top: 25px; + } +#clutter-bar #button-v { + top: 32px; + height: 8px; +} + .status #play-pause { position: absolute; top: 28px; diff --git a/winamp.js b/winamp.js index e65f1b8c..b716d3bf 100755 --- a/winamp.js +++ b/winamp.js @@ -10,6 +10,7 @@ function Winamp () { 'option': document.getElementById('option'), 'close': document.getElementById('close'), 'shade': document.getElementById('shade'), + 'buttonD': document.getElementById('button-d'), 'position': document.getElementById('position'), 'fileInput': document.getElementById('file-input'), 'volumeMessage': document.getElementById('volume-message'), @@ -102,6 +103,10 @@ function Winamp () { self.nodes.winamp.classList.add('closed'); } + this.nodes.buttonD.onclick = function() { + self.nodes.winamp.classList.toggle('doubled'); + } + this.media.addEventListener('timeupdate', function() { if(!self.nodes.winamp.classList.contains('setting-position')) { self.nodes.position.value = self.media.percentComplete();