step 3/4: Move linuxport to trunk. How'd I get roped into this?

git-svn-id: https://xbmc.svn.sourceforge.net/svnroot/xbmc/trunk@23097 568bbfeb-2a22-0410-94d2-cc84cf5bfa90
author: AlTheKiller <AlTheKiller@svn> 2009-09-23 01:49:50 +0000
committer: AlTheKiller <AlTheKiller@svn> 2009-09-23 01:49:50 +0000
commit: 45285e8a9300cd754a760560640b75b09f98035e (patch)
tree: ad9f093885ad5c98e9dd4156674e7691c22ed0a2 /web
156 files changed, 4424 insertions, 0 deletions
diff --git a/web/Project_Mayhem/Changelog_WebServer.txt b/web/Project_Mayhem/Changelog_WebServer.txt
new file mode 100644
index 0000000000..9ecb40b9fc
--- /dev/null
+++ b/web/Project_Mayhem/Changelog_WebServer.txt
@@ -0,0 +1,62 @@
+Project Mayhem WebServer V1.1
+
+
+= Info ===========================
+
+ The Project Mayhem skin now got it's own webserver 
+ skin / script.
+ 
+ by now only the original asp code is copied, but some very nice
+ features will be added soon ;)
+
+
+= Autors =========================
+
+    Mathias "chokemaniac" Mahling (Design, Idea and the rest ;) )
+        chokemaniac@users.sourceforge.net
+
+    Pascal "pyRAnHa" Reddig (XHTML + CSS) 
+        pyranha@users.sourceforge.net
+
+
+= Todo ==========================
+
+ - arrange settings-screen
+ - finish the PocketPC-CSS (currently in development)
+ - remember the last accesed folder like xbmc does
+ - show info of the current playing item
+ - add some hidden features ;)
+ 
+= Changelog =====================
+
+ 2005/01/15: bobbin007
+    - fixed: [ 1096896 ] Can't remove files from the playlists
+ 
+ 2004/12/10: jmarshall
+    - fixed: [ 1080520 ] web interface: unqueing doesn't work - thanks to re.solve + BombrMan
+
+ 2004/12/09: jmarshall
+    - fixed Saving of XBoxMediaCenter.xml when XBMC is used as dash (thanks to BombrMan)
+
+ 2004/10/24: pyRAnHa
+    - added "Clear Playlist" option
+
+ 2004/10/14: pyRAnHa (version 1.1.1, xbmc relase 1.1.0)
+    - new queue and unqueue Icons added
+    - first handheld / PocketPC version (dev only)
+    - fixed: info layer was not cropped clean
+
+ 2004/10/11: pyRAnHa
+    - made it XHTML 1.0 Transitional valid
+      sorry, no XHTML 1.1 cause of iframe and traget=""
+
+ 2004/09/19: pyRAnHa (version 1a)
+    - first public release
+    - add: banners images for each section
+    - add: background images for each section 
+    - add: file icons for each section
+ 
+ 2004/09/19: pyRAnHa (initial release)
+    - first working version
+
+    
+\ No newline at end of file
diff --git a/web/Project_Mayhem/default.asp b/web/Project_Mayhem/default.asp
new file mode 100644
index 0000000000..3ac56a0aff
--- /dev/null
+++ b/web/Project_Mayhem/default.asp
@@ -0,0 +1,549 @@
+<%
+    if (isset("Action")) {
+        if (Action == "UnqueMusicplaylist") {
+            var ItemCount;
+            var z;
+            ItemCount = xbmcCommand("catalog","items");
+            for (z = 0;  z < ItemCount;  z = z + 1) {
+                // dirty workaround, cause unque, + z won't work
+                xbmcCommand("navigate", Action);
+                xbmcCommand("catalog","unque");
+            }
+            Action = "musicplaylist";          
+        }
+        xbmcCommand("navigate", Action);
+    }
+    
+    if (isset("command")) {
+        // execute a few commands before listing the contents
+        if (command == "select") {
+            xbmcCommand("catalog", "select," + item);
+        } else if (command == "unque") {
+            xbmcCommand("catalog", "unque," + item);
+        }
+    }
+
+    var navigatorstate;
+    var BannerClass;
+    var InfoClass;
+    var BackgroundClass;
+    var ItemFileClass;
+    navigatorstate = xbmcCommand("navigatorstate");
+
+    if (isset("DisplayConfiguration")) {
+        BannerClass = "SiteBannerConfiguration";
+        InfoClass = "SiteInfoConfiguration";
+        BackgroundClass = "SiteBackgroundConfiguration";
+    } else if (navigatorstate == "pictures") {
+        BannerClass = "SiteBannerMyPictures";
+        InfoClass = "SiteInfoMyPictures";
+        BackgroundClass = "SiteBackgroundMyPictures";
+        ItemFileClass = "ItemFileMyPictures";
+    } else if (navigatorstate == "music") {
+        BannerClass = "SiteBannerMyMusic";
+        InfoClass = "SiteInfoMyMusic";
+        BackgroundClass = "SiteBackgroundMyMusic";
+        ItemFileClass = "ItemFileMyMusic";
+    } else if (navigatorstate == "videos") {
+        BannerClass = "SiteBannerMyVideos";
+        InfoClass = "SiteInfoMyVideos";
+        BackgroundClass = "SiteBackgroundMyVideos";
+        ItemFileClass = "ItemFileMyVideos";
+    } else if (navigatorstate == "musicplaylist") {
+        BannerClass = "SiteBannerMusicPlaylist";
+        InfoClass = "SiteInfoMusicPlaylist";
+        BackgroundClass = "SiteBackgroundMusicPlaylist";
+        ItemFileClass = "ItemFileMusicPlaylist";
+    } else if (navigatorstate == "videoplaylist") {
+        BannerClass = "SiteBannerVideoPlaylist";
+        InfoClass = "SiteInfoVideoPlaylist";
+        BackgroundClass = "SiteBackgroundVideoPlaylist";
+        ItemFileClass = "ItemFileVideoPlaylist";
+    } else {
+        BannerClass = "SiteBannerNone";
+        InfoClass = "SiteInfoLogo";
+        BackgroundClass = "SiteBackgroundHome";
+    }
+
+%><?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+    <head>
+        <title> Xbox Media Center - Remote Control </title>
+        <link href="styles/Project%20Mayhem/screen.css" rel="stylesheet" type="text/css" />
+        <link rel="shortcut icon" href="/styles/Project%20Mayhem/images/ShortcutIcon.ico" type="image/x-icon" />        
+
+        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+    </head>
+  
+    <body>
+    
+        <div id="SiteContainer" class="<% write(BackgroundClass); %>">
+
+            <div id="SiteLeftContainer">
+                <div id="SiteInfoContainer">
+                    <div id="<% write(InfoClass); %>"></div>
+                </div>
+    
+                <div id="SiteMenuContainer">
+                    <ul>
+                        <li class="MyPictures"><a href="default.asp?Action=pictures"><span>My Pictures</span></a></li>
+                        <li class="MyMusic"><a href="default.asp?Action=music"><span>My Music</span></a></li>
+                        <li class="MyVideos"><a href="default.asp?Action=videos"><span>My Videos</span></a></li>
+                        <li class="MusicPlaylist"><a href="default.asp?Action=musicplaylist"><span>Music Playlist</span></a></li>
+                        <li class="VideoPlaylist"><a href="default.asp?Action=videoplaylist"><span>Video Playlist</span></a></li>
+                    </ul>
+                </div>
+      
+                <div id="SiteControlContainer">
+                    <ul>
+                        <li class="Stop"><a href="/xbmcCmds/xbmcForm?command=stop" target="CommandFrame"><span>Stop</span></a></li>
+                        <li class="Play"><a href="/xbmcCmds/xbmcForm?command=play" target="CommandFrame"><span>Play</span></a></li>
+                        <li class="Pause"><a href="/xbmcCmds/xbmcForm?command=pause" target="CommandFrame"><span>Pause</span></a></li>
+                        <li class="Previous"><a href="/xbmcCmds/xbmcForm?command=previous" target="CommandFrame"><span>Previous</span></a></li>
+                        <li class="Next"><a href="/xbmcCmds/xbmcForm?command=next" target="CommandFrame"><span>Next</span></a></li>
+                    </ul>
+                </div>
+            
+                <div id="SiteSubMenuContainer">
+                    <ul>
+                        <li class="Subpanel"><a href=""><span>Subpanel</span></a>
+                            <ul>
+                                <li><a href="SubRemote"><span>Remote</span></a></li>
+                                <li><a href="SubConfiguration"><span>Configuration</span></a></li>
+                                <li><a href="/xbmcCmds/xbmcForm?command=exit" target="CommandFrame"><span>Dashboard</span></a></li>
+                                <li><a href="/xbmcCmds/xbmcForm?command=reboot" target="CommandFrame"><span>Reboot</span></a></li>
+                            </ul>
+                        </li>
+                        
+                        <li class="Configuration"><a href="default.asp?DisplayConfiguration=true"><span>Configuration</span></a></li>
+                        <li class="Dash"><a href="/xbmcCmds/xbmcForm?command=exit" target="CommandFrame"><span>Dash</span></a></li>
+                        <li class="Shutdown"><a href="/xbmcCmds/xbmcForm?command=shutdown" target="CommandFrame"><span>Shutdown</span></a></li>
+                    </ul>
+                </div>
+    
+            </div>
+            
+    
+    
+            <div id="SiteRightContainer">
+            
+                <div id="SiteBannerContainer">
+                    <div id="<% write(BannerClass); %>"></div>
+                </div>
+                
+                <div id="SiteContentContainer">
+<%
+
+  if (isset("DisplayConfiguration") ) {
+
+
+    /*
+     * xbmc configuration options
+    
+      xbmcCfgBookmarkSize(type)
+      xbmcCfgGetBookmark(type, parameter, id)
+      xbmcCfgAddBookmark(type, name, path [, position])
+      xbmcCfgSaveBookmark(type, name, path, position)
+      xbmcCfgRemoveBookmark(type, position)
+      xbmcCfgSaveConfiguration(filename)
+      xbmcCfgGetOption(name)
+      xbmcCfgSetOption(name, value)
+    
+     */
+    
+    write("<a href='default.asp?DisplayConfiguration=true&amp;page=bookmarks'>bookmarks</a> \n");
+    write("<a href='default.asp?DisplayConfiguration=true&amp;page=options'>xbmc options</a> \n");
+    write("<a href='default.asp?DisplayConfiguration=true&amp;page=load_save'>load / save</a> \n");
+
+    write("<br />\n");
+    write("<br />\n");
+    
+    
+    /* if action isset we want to save / edit or remove something */
+    if (isset("action"))
+    {
+      if (action == "savebookmark")
+      {
+        if (isset("name") == "1" && isset("path") == "1" && isset("type") == "1" && isset("position") == "1")
+        {
+          xbmcCfgSaveBookmark(type, name, path, position);
+        }
+        else
+          write("Error");
+      }
+      if (action == "addbookmark")
+      {
+        if (isset("name") == "1" && isset("path") == "1" && isset("type") == "1")
+        {
+          xbmcCfgAddBookmark(type, name, path);
+        }
+        else
+          write("Error");
+      }
+      if (action == "remove")
+      {
+        if (isset("page"))
+        {
+          // return to bookmark page and not to editbookmarks
+          page = "bookmarks";
+          xbmcCfgRemoveBookmark(type, position);
+        }
+      }
+      if (action == "saveoptions")
+      {
+        xbmcCfgSetOption("home", home);
+        xbmcCfgSetOption("CDDBIpAdres", CDDBIpAdres);
+    
+        var usef = "no";
+        if (isset("useFDrive")) usef = "yes";
+        xbmcCfgSetOption("useFDrive", usef);
+    
+        var useg = "no";
+        if (isset("useGDrive")) useg = "yes";
+        xbmcCfgSetOption("useGDrive", useg);
+    
+        xbmcCfgSetOption("dashboard", dashboard);
+        xbmcCfgSetOption("dvdplayer", dvdplayer);
+        xbmcCfgSetOption("subtitles", subtitles);
+        xbmcCfgSetOption("startwindow", startwindow);
+        xbmcCfgSetOption("pictureextensions", pictureextensions);
+        xbmcCfgSetOption("musicextensions", musicextensions);
+        xbmcCfgSetOption("videoextensions", videoextensions);
+        xbmcCfgSetOption("thumbnails", thumbnails);
+        xbmcCfgSetOption("shortcuts", shortcuts);
+        xbmcCfgSetOption("albums", albums);
+        xbmcCfgSetOption("recordings", recordings);
+        xbmcCfgSetOption("screenshots", screenshots);
+    
+        var remcodes = "no";
+        if (isset("displayremotecodes")) remcodes = "yes";
+        xbmcCfgSetOption("displayremotecodes", remcodes);
+      }
+      if (action == "save")
+      {
+        xbmcCfgSaveConfiguration("XBoxMediaCenter.xml");
+      }
+    }
+    
+    if (isset("page"))
+    {
+      var i;
+      var name;
+      var value;
+      var options;
+    
+      if (page == "bookmarks")
+      {
+        var musicbookmarks = xbmcCfgBookmarkSize("music");
+        var picturebookmarks = xbmcCfgBookmarkSize("pictures");
+        var videobookmarks = xbmcCfgBookmarkSize("video");
+        var filebookmarks = xbmcCfgBookmarkSize("files");
+        var programbookmarks = xbmcCfgBookmarkSize("myprograms");
+        
+    
+        /* Add new Bookmark button */
+        write("<form name='new_bookmark' method='post' action='default.asp?DisplayConfiguration=true&amp;page=addbookmark'>\n");
+        write("  <input type='submit' name='addnewbookmark' value='Add new bookmark'><br>\n");
+        write("</form>\n");
+    
+        /* Display Music Bookmarks */
+        write("<form name='music_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=music'>\n");
+        write("  Music Bookmarks:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=musicbookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("music", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+        /* Display Picture Bookmarks */
+        write("<form name='picture_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=pictures'>\n");
+        write("Picture Bookmarks:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=picturebookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("pictures", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+        /* Display Video Bookmarks */
+        write("<form name='video_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=video'>\n");
+        write("Video Bookmarks:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=videobookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("video", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+        /* Display File Bookmarks */
+        write("<form name='file_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=files'>\n");
+        write("File Bookmarks:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=filebookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("files", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+        /* Display Program Bookmarks */
+        write("<form name='program_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=myprograms'>\n");
+        write("Program Bookmarks:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=programbookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("myprograms", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+      }
+      else if (page == "options")
+      {
+        write("	<form action='default.asp?DisplayConfiguration=true' method='post' name='cfgform' id='cfgform'>" + \
+              "		<input name='action' type='hidden' value='saveoptions'>" + \
+              "		<input name='page' type='hidden' value='options'>" + \
+              "		<table width='500'>");
+        write("			<tr>" + \
+              "				<td width='200'><label>Home</label></td>" + \
+              "				<td><input name='home' type='text' value='"); write(xbmcCfgGetOption("home")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>CDDB IP Address</label></td><td>" + \
+              "				<input name='CDDBIpAdres' type='text' value='"); write(xbmcCfgGetOption("CDDBIpAdres")); write("' size='25'><br></td>" + \
+              "			</tr>");
+    
+        // Use F Drive
+        write("			<tr>" + \
+              "					<td><label>Use F Drive</label></td><td>" + \
+              "           <input name='useFDrive' type='checkbox' value='true' ");
+              if (xbmcCfgGetOption("useFDrive") == "yes")	write("checked>");
+              else write(">");
+        write("         <br></td>" + \
+              "			</tr>");
+    
+        // Use G Drive
+        write("			<tr>" + \
+              "					<td><label>Use G Drive</label></td><td>" + \
+              "           <input name='useGDrive' type='checkbox' value='true' ");
+              if (xbmcCfgGetOption("useGDrive") == "yes")	write("checked>");
+              else write(">");
+        write("         <br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Dashboard</label></td>" + \
+              "				<td><input name='dashboard' type='text' value='"); write(xbmcCfgGetOption("dashboard")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Dvdplayer</label></td>" + \
+              "				<td><input name='dvdplayer' type='text' value='"); write(xbmcCfgGetOption("dvdplayer")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Subtitles</label></td>" + \
+              "				<td><input name='subtitles' type='text' value='"); write(xbmcCfgGetOption("subtitles")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Startwindow</label></td>" + \
+              "				<td><input name='startwindow' type='text' value='"); write(xbmcCfgGetOption("startwindow")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Picture Extensions</label></td>" + \
+              "				<td><input name='pictureextensions' type='text' value='"); write(xbmcCfgGetOption("pictureextensions")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Music Extensions</label></td>" + \
+              "				<td><input name='musicextensions' type='text' value='"); write(xbmcCfgGetOption("musicextensions")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Video Extensions</label></td>" + \
+              "				<td><input name='videoextensions' type='text' value='"); write(xbmcCfgGetOption("videoextensions")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Thumbnails</label></td>" + \
+              "				<td><input name='thumbnails' type='text' value='"); write(xbmcCfgGetOption("thumbnails")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Shortcuts</label></td>" + \
+              "				<td><input name='shortcuts' type='text' value='"); write(xbmcCfgGetOption("shortcuts")); write("' size='25'><br></td>" + \
+              "			</tr>" );
+        write("			<tr>" + \
+              "				<td><label>Albums</label></td>" + \
+              "				<td><input name='albums' type='text' value='"); write(xbmcCfgGetOption("albums")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Recordings</label></td>" + \
+              "				<td><input name='recordings' type='text' value='"); write(xbmcCfgGetOption("recordings")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Screenshots</label></td>" + \
+              "				<td><input name='screenshots' type='text' value='"); write(xbmcCfgGetOption("screenshots")); write("' size='25'><br></td>" + \
+              "			</tr>");
+    
+        // Display remote codes
+        write("			<tr>" + \
+              "					<td><label>Display remote codes</label></td><td>" + \
+              "           <input name='displayremotecodes' type='checkbox' value='true' ");
+              if (xbmcCfgGetOption("displayremotecodes") == "yes")	write("checked>");
+              else write(">");
+        write("         <br></td>" + \
+              "			</tr>");
+    
+        write("		</table><br>" + \
+              "		<input type='submit' name='save' value='save'>" + \
+              "	</form><br>");
+      }
+      else if (page == "editbookmark")
+      {
+        if (isset("type") == "1" && isset("position") == "1")
+        {
+          write("<form name='savebookmark' method='post' action='default.asp?DisplayConfiguration=true&amp;page=bookmarks&amp;action=savebookmark'>\n");
+          write("<input name='position' type='hidden' value='" + position + "'>\n");
+          write("<input name='type' type='hidden' value='" + type + "'>\n");
+          write("  <table width='500' border='0'>\n");
+          write("    <tr> \n");
+          write("      <td><label>name</label></td>\n");
+          write("      <td><input type='text' name='name' value='" + xbmcCfgGetBookmark(type, "name", position) + "'></td>\n");
+          write("    </tr>\n");
+          write("    <tr> \n");
+          write("      <td><label>path</label></td>\n");
+          write("      <td><input type='text' name='path' value='" + xbmcCfgGetBookmark(type, "path", position) + "'></td>\n");
+          write("    </tr>\n");
+          write("  </table><br>\n");
+          write("  <input type='submit' name='save' value='save'>\n");
+          write("</form>\n");
+        }
+      }
+      else if (page == "addbookmark")
+      {
+        var data = "<form name='addbookmark' method='post' action='default.asp?DisplayConfiguration=true&amp;page=bookmarks&amp;action=addbookmark'>\n";
+        data = data + "  <table width='500' border='0'>\n";
+        data = data + "    <tr> \n";
+        data = data + "      <td><label>Type</label></td>\n";
+        data = data + "      <td>";
+        data = data + "        <select name='type'>\n";
+        data = data + "          <option value=files>File</option>\n";
+        data = data + "          <option value=music>Music</option>\n";
+        data = data + "          <option value=myprograms>Program</option>\n";
+        data = data + "          <option value=pictures>Picture</option>\n";
+        data = data + "          <option value=video>Video</option>\n";
+        data = data + "        </select>\n";
+        data = data + "      </td>\n";
+        data = data + "    </tr>\n";
+        data = data + "    <tr> \n";
+        data = data + "      <td><label>Name</label></td>\n";
+        data = data + "      <td><input type='text' name='name' value=''></td>\n";
+        data = data + "    </tr>\n";
+        data = data + "    <tr> \n";
+        data = data + "      <td><label>Path</label></td>\n";
+        data = data + "      <td><input type='text' name='path' value=''></td>\n";
+        data = data + "    </tr>\n";
+        data = data + "  </table><br>\n";
+        data = data + "  <input type='submit' name='save' value='save'>\n";
+        data = data + "</form>\n";
+    
+        write(data);
+      }
+      if (page == "load_save")
+      {
+        write("<br><br><a href='default.asp?DisplayConfiguration=true&amp;action=save'>Save</a>\n");
+      }
+    }
+
+
+  } else {
+ 
+  
+    var z;
+    var n;
+    var i;
+    var data;
+  
+  
+    n = xbmcCommand("catalog","items"); // number of items to list
+    file = xbmcCommand("catalog","first");
+    
+    if ( n > 0) {
+        write("                    <ul id=\"ItemList\">\n");
+    }
+    
+    for (z=0; z<n; z=z+1)
+    {
+      var type = xbmcCommand("catalog","type," + z);
+  
+  
+      data = "                        <li>";
+  
+      if (type != "directory") {
+        // we have a file to play, send command to server when clicked and do not refresh the current page
+        data = data + "<div class=\"" + ItemFileClass + "\"></div>";
+      } else { 
+        data = data + "<div class=\"ItemFolder\"></div>"; 
+      }
+  
+  
+      if (file != ".." && navigatorstate != "musicplaylist" && navigatorstate != "videoplaylist" && navigatorstate != "pictures") {
+        data = data + "<div class=\"AddQueue\"><a href=\"/xbmcCmds/xbmcForm?command=catalog&amp;parameter=que," + z + "\" target=\"CommandFrame\" title=\"add to queue\"><span>Q</span></a></div>";
+      } else if (navigatorstate == "musicplaylist" || navigatorstate == "videoplaylist")	{
+        data = data + "<div class=\"RemoveQueue\"><a href=\"default.asp?command=unque&amp;item=" + z + "\" title=\"remove from queue\"><span>R</span></a></div>";
+      }
+  
+  
+      if (type != "directory") {
+        // we have a file to play, send command to server when clicked and do not refresh the current page
+        data = data + "<div class=\"FileName\"><a href=\"/xbmcCmds/xbmcForm?command=catalog&amp;parameter=select," + z + "\" target=\"CommandFrame\">";
+      } else { 
+        data = data + "<div class=\"FileName\"><a href=\"default.asp?command=select&amp;item=" + z + "\">"; 
+      }
+      
+      data = data + file + "</a></div>";
+      
+      data = data + "</li>\n";
+      write(data);
+      
+        
+      file = xbmcCommand("catalog","next");
+    }
+
+    if ( n > 0) {
+        write("                    </ul>\n");
+    }
+    
+    if (navigatorstate == "musicplaylist") {
+        write ("<a href=\"default.asp?Action=UnqueMusicplaylist\" id=\"UnqueMusciplaylist\"><span>Clear Playlist</span></a>\n");
+    }
+
+
+}
+%>
+                </div>
+    
+            </div>
+            
+        </div>
+        
+        <div id="SiteCommandContainer">
+            <iframe src="about:blank" width="1" height="1" name="CommandFrame"></iframe>
+        </div>
+  
+    </body>
+</html>
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundConfiguration.png b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundConfiguration.png
new file mode 100644
index 0000000000..5f86a772de
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundConfiguration.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundHome.png b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundHome.png
new file mode 100644
index 0000000000..a42062c99b
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundHome.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyMusic.png b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyMusic.png
new file mode 100644
index 0000000000..07636a672f
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyMusic.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyPictures.png b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyPictures.png
new file mode 100644
index 0000000000..e0feba61e8
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyPictures.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyVideos.png b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyVideos.png
new file mode 100644
index 0000000000..5565f3f12e
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BackgroundMyVideos.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BannerConfiguration.png b/web/Project_Mayhem/styles/Project Mayhem/images/BannerConfiguration.png
new file mode 100644
index 0000000000..db6281b0c6
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BannerConfiguration.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BannerMusicPlaylist.png b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMusicPlaylist.png
new file mode 100644
index 0000000000..4174ac9702
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMusicPlaylist.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyMusic.png b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyMusic.png
new file mode 100644
index 0000000000..97aee3c3d9
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyMusic.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyPictures.png b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyPictures.png
new file mode 100644
index 0000000000..da2f74d2ed
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyPictures.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyVideos.png b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyVideos.png
new file mode 100644
index 0000000000..2b75a94086
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BannerMyVideos.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/BannerVideoPlaylist.png b/web/Project_Mayhem/styles/Project Mayhem/images/BannerVideoPlaylist.png
new file mode 100644
index 0000000000..8aa486a516
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/BannerVideoPlaylist.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlBackground.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlBackground.png
new file mode 100644
index 0000000000..e4cc5aa27b
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlBackground.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlNextOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlNextOff.png
new file mode 100644
index 0000000000..f714fa4806
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlNextOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlNextOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlNextOver.png
new file mode 100644
index 0000000000..cd38a1e5e3
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlNextOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlPauseOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPauseOff.png
new file mode 100644
index 0000000000..a7ed3071c7
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPauseOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlPauseOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPauseOver.png
new file mode 100644
index 0000000000..4720853888
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPauseOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlPlayOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPlayOff.png
new file mode 100644
index 0000000000..395d1e9115
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPlayOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlPlayOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPlayOver.png
new file mode 100644
index 0000000000..8096484905
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPlayOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlPreviousOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPreviousOff.png
new file mode 100644
index 0000000000..f465eb18e1
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPreviousOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlPreviousOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPreviousOver.png
new file mode 100644
index 0000000000..a615c75739
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlPreviousOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlStopOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlStopOff.png
new file mode 100644
index 0000000000..7a8c8c1d19
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlStopOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ControlStopOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ControlStopOver.png
new file mode 100644
index 0000000000..cca312815f
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ControlStopOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/InfoConfiguration.png b/web/Project_Mayhem/styles/Project Mayhem/images/InfoConfiguration.png
new file mode 100644
index 0000000000..c67495d5e2
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/InfoConfiguration.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/InfoLogo.png b/web/Project_Mayhem/styles/Project Mayhem/images/InfoLogo.png
new file mode 100644
index 0000000000..9315d5329a
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/InfoLogo.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyMusic.png b/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyMusic.png
new file mode 100644
index 0000000000..716001ada5
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyMusic.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyPictures.png b/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyPictures.png
new file mode 100644
index 0000000000..41b53e236c
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyPictures.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyVideos.png b/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyVideos.png
new file mode 100644
index 0000000000..eecb15d25c
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/InfoMyVideos.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemAddQueueOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemAddQueueOff.png
new file mode 100644
index 0000000000..0f863b10fe
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemAddQueueOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemAddQueueOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemAddQueueOver.png
new file mode 100644
index 0000000000..9c715d33e9
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemAddQueueOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemBackground.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemBackground.png
new file mode 100644
index 0000000000..eff491c5ec
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemBackground.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyMusic.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyMusic.png
new file mode 100644
index 0000000000..79e6b25432
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyMusic.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyPictures.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyPictures.png
new file mode 100644
index 0000000000..cf1cc3a5af
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyPictures.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyVideos.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyVideos.png
new file mode 100644
index 0000000000..26cb132ac1
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFileMyVideos.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemFolder.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFolder.png
new file mode 100644
index 0000000000..0090ad6b1f
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemFolder.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOff.png
new file mode 100644
index 0000000000..36af47f5a7
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOver.png
new file mode 100644
index 0000000000..ca08c2d0b4
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOver_2.png b/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOver_2.png
new file mode 100644
index 0000000000..ca08c2d0b4
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ItemRemoveQueueOver_2.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMusicPlaylistOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMusicPlaylistOff.png
new file mode 100644
index 0000000000..2466452157
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMusicPlaylistOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMusicPlaylistOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMusicPlaylistOver.png
new file mode 100644
index 0000000000..a17b70f4d3
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMusicPlaylistOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyMusicOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyMusicOff.png
new file mode 100644
index 0000000000..1f31fd4fdc
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyMusicOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyMusicOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyMusicOver.png
new file mode 100644
index 0000000000..20d85ba46e
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyMusicOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyPicturesOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyPicturesOff.png
new file mode 100644
index 0000000000..e453833de1
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyPicturesOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyPicturesOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyPicturesOver.png
new file mode 100644
index 0000000000..ce0de66079
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyPicturesOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyVideosOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyVideosOff.png
new file mode 100644
index 0000000000..e62ac75add
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyVideosOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyVideosOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyVideosOver.png
new file mode 100644
index 0000000000..422e94bfad
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuMyVideosOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuVideoPlaylistOff.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuVideoPlaylistOff.png
new file mode 100644
index 0000000000..a221201db5
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuVideoPlaylistOff.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/MenuVideoPlaylistOver.png b/web/Project_Mayhem/styles/Project Mayhem/images/MenuVideoPlaylistOver.png
new file mode 100644
index 0000000000..e9e9cb1f73
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/MenuVideoPlaylistOver.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/ShortcutIcon.ico b/web/Project_Mayhem/styles/Project Mayhem/images/ShortcutIcon.ico
new file mode 100644
index 0000000000..c683c6b288
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/ShortcutIcon.ico
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuConfiguration.png b/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuConfiguration.png
new file mode 100644
index 0000000000..119a0d6083
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuConfiguration.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuDash.png b/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuDash.png
new file mode 100644
index 0000000000..37788d4fac
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuDash.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuShutdown.png b/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuShutdown.png
new file mode 100644
index 0000000000..91cd3c912a
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/SubMenuShutdown.png
diff --git a/web/Project_Mayhem/styles/Project Mayhem/images/Thumbs.db b/web/Project_Mayhem/styles/Project Mayhem/images/Thumbs.db
new file mode 100644
index 0000000000..e0889ceb55
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/images/Thumbs.db
diff --git a/web/Project_Mayhem/styles/Project Mayhem/screen.css b/web/Project_Mayhem/styles/Project Mayhem/screen.css
new file mode 100644
index 0000000000..ebb917f022
--- /dev/null
+++ b/web/Project_Mayhem/styles/Project Mayhem/screen.css
@@ -0,0 +1,622 @@
+body
+{
+    font-family : Arial, Helvetica, Verdana;
+    font-size : 12px;
+    background-color : #000000;
+    margin : 0;
+    padding : 0;
+    overflow : hidden;
+
+    text-align : center;
+    
+    border : 0;
+}	
+
+#SiteContainer
+{ 
+    margin : auto;
+    
+    width : 1000px;
+    height : 580px;
+    
+    text-align : left;
+}
+
+div.SiteBackgroundHome
+{ 
+    background-image : url('images/BackgroundHome.png');
+}
+
+div.SiteBackgroundMyPictures
+{ 
+    background-image : url('images/BackgroundMyPictures.png');
+}
+
+div.SiteBackgroundMyMusic, div.SiteBackgroundMusicPlaylist
+{ 
+    background-image : url('images/BackgroundMyMusic.png');
+}
+
+div.SiteBackgroundMyVideos, div.SiteBackgroundVideoPlaylist
+{ 
+    background-image : url('images/BackgroundMyVideos.png');
+}
+
+div.SiteBackgroundConfiguration
+{ 
+    background-image : url('images/BackgroundConfiguration.png');
+}
+
+
+
+    #SiteContainer #SiteLeftContainer
+    { 
+        position : relative;
+        float : left;
+    
+    }
+    
+    
+        #SiteContainer #SiteLeftContainer #SiteInfoContainer div
+        { 
+            position : absolute;
+            
+            width : 183px;
+            height : 195px;
+            
+            top : 38px;
+            left : 64px;
+            
+        }
+
+        #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoLogo
+        {
+            background-image : url('images/InfoLogo.png');
+        }
+
+        #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoConfiguration
+        {
+            background-image : url('images/InfoConfiguration.png');
+        }
+
+        #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoMyPictures
+        {
+            background-image : url('images/InfoMyPictures.png');
+        }
+
+        #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoMyMusic, #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoMusicPlaylist
+        {
+            background-image : url('images/InfoMyMusic.png');
+        }
+
+        #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoMyVideos, #SiteContainer #SiteLeftContainer #SiteInfoContainer #SiteInfoVideoPlaylist
+        {
+            background-image : url('images/InfoMyVideos.png');
+        }
+    
+    
+    
+        #SiteContainer #SiteLeftContainer #SiteMenuContainer
+        {
+            position : absolute;
+            width : 200px;
+            height : 330px;
+            top : 245px;
+            left : 70px;
+        
+        }
+    
+            #SiteContainer #SiteLeftContainer #SiteMenuContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+            }
+       
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li a
+                {
+                    display: block;
+                    margin : 0px 0px 13px 0px;
+                    width: 169px;
+                    height : 32px;
+                }
+    
+                    #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li a span
+                    {
+                        display : none;
+                    }
+    
+    
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyPictures a
+                {
+                    background-image : url('images/MenuMyPicturesOff.png');
+                }
+            
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyPictures a:hover
+                {
+                    background-image : url('images/MenuMyPicturesOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyMusic a
+                {
+                    background-image : url('images/MenuMyMusicOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyMusic a:hover
+                {
+                    background-image : url('images/MenuMyMusicOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyVideos a
+                {
+                    background-image : url('images/MenuMyVideosOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyVideos a:hover
+                {
+                    background-image : url('images/MenuMyVideosOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MusicPlaylist a
+                {
+                    background-image : url('images/MenuMusicPlaylistOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MusicPlaylist a:hover
+                {
+                    background-image : url('images/MenuMusicPlaylistOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.VideoPlaylist a
+                {
+                    background-image : url('images/MenuVideoPlaylistOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.VideoPlaylist a:hover
+                {
+                    background-image : url('images/MenuVideoPlaylistOver.png');
+                }
+    
+
+
+
+
+
+        #SiteContainer #SiteLeftContainer #SiteControlContainer
+        {
+            position : absolute;
+            width : 195px;
+            height : 49px;
+            left : 56px;
+            top : 480px;
+            background-image : url('images/ControlBackground.png');
+        }
+
+            #SiteContainer #SiteLeftContainer #SiteControlContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+                
+                /* Fix for buggy IE */
+                font-size : 1px;
+            }
+ 
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li a span
+                {
+                    display : none;
+                }
+
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Stop a
+                {
+                    position : absolute;
+                    width : 28px;
+                    height : 28px;
+                    left : 19px;
+                    top : 11px;
+                    
+                    background-image : url('images/ControlStopOff.png');
+                }
+
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Stop a:hover
+                {
+                    background-image : url('images/ControlStopOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Play a
+                {
+                    position : absolute;
+                    width : 38px;
+                    height : 37px;
+                    left : 55px;
+                    top : 6px;
+                    
+                    background-image : url('images/ControlPlayOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Play a:hover
+                {
+                    background-image : url('images/ControlPlayOver.png');
+                }
+                
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Pause a
+                {
+                    position : absolute;
+                    width : 28px;
+                    height : 28px;
+                    left : 101px;
+                    top : 11px;
+                    
+                    background-image : url('images/ControlPauseOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Pause a:hover
+                {
+                    background-image : url('images/ControlPauseOver.png');
+                }
+                
+                                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Previous a
+                {
+                    position : absolute;
+                    width : 21px;
+                    height : 21px;
+                    left : 139px;
+                    top : 14px;
+                    
+                    background-image : url('images/ControlPreviousOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Previous a:hover
+                {
+                    background-image : url('images/ControlPreviousOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Next a
+                {
+                    position : absolute;
+                    width : 21px;
+                    height : 21px;
+                    left : 163px;
+                    top : 14px;
+                    
+                    background-image : url('images/ControlNextOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Next a:hover
+                {
+                    background-image : url('images/ControlNextOver.png');
+                }
+                
+
+
+
+        #SiteContainer #SiteLeftContainer #SiteSubMenuContainer
+        {
+            position : absolute;
+            width : 138px;
+            height : 10px;
+            left : 82px;
+            top : 544px;
+        }
+        
+            #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+                
+                /* Fix for buggy IE */
+                font-size : 1px;
+            }
+        
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li#Subpanel
+                {
+                    display : none;
+                }
+                
+                    #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li a span
+                    {
+                        display : none;
+                    }
+                
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Configuration a
+                {
+                    position : absolute;
+                    width : 59px;
+                    height : 10px;
+                    left : 0px;
+                    top : 0px;
+                    
+                    background-image : url('images/SubMenuConfiguration.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Dash a
+                {
+                    position : absolute;
+                    width : 33px;
+                    height : 10px;
+                    left : 59px;
+                    top : 0px;
+                    
+                    background-image : url('images/SubMenuDash.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Shutdown a
+                {
+                    position : absolute;
+                    width : 46px;
+                    height : 10px;
+                    left : 94px;
+                    top : 0px;
+                    
+                    background-image : url('images/SubMenuShutdown.png');
+                }
+                
+
+
+
+
+
+
+    #SiteContainer #SiteRightContainer
+    {
+        position : relative;
+        width : 696px;
+        height : 530px;
+        left : 280px;
+        top : 26px;
+        margin : 0;
+        padding : 0;
+    }
+
+        #SiteContainer #SiteRightContainer #SiteBannerContainer div
+        {
+            
+            position : absolute;
+            width : 342px;
+            height : 47px;
+            left : 0px;
+            top : 0px;
+        }
+        
+
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerMyPictures
+        {
+            background-image : url('images/BannerMyPictures.png');
+        }
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerMyMusic
+        {
+            background-image : url('images/BannerMyMusic.png');
+        }
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerMyVideos
+        {
+            background-image : url('images/BannerMyVideos.png');
+        }
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerMusicPlaylist
+        {
+            background-image : url('images/BannerMusicPlaylist.png');
+        }
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerVideoPlaylist
+        {
+            background-image : url('images/BannerVideoPlaylist.png');
+        }
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerConfiguration
+        {
+            background-image : url('images/BannerConfiguration.png');
+        }
+
+
+
+        #SiteContainer #SiteRightContainer #SiteContentContainer
+        {
+            position : absolute;
+            width : 685px;
+            height : 420px;
+            left : 8px;
+            top : 56px;
+            
+            float : left;
+            
+            color : #FFFFFF;
+            
+            overflow : auto;
+            scrollbar-base-color : #091C20;
+            scrollbar-3dlight-color : #000000;
+            scrollbar-arrow-color : #FFFFFF;
+            scrollbar-darkshadow-color : #000000;
+            scrollbar-face-color : #324A51;
+            scrollbar-highlight-color : #324A51;
+            scrollbar-shadow-color : #324A51;
+            scrollbar-track-color : #000000;  
+        }
+
+            #SiteContainer #SiteRightContainer #SiteContentContainer td
+            {
+                color : #FFFFFF;
+                font-family : Arial, Helvetica, Verdana;
+                font-size : 12px;
+            }
+
+
+            #SiteContainer #SiteRightContainer #SiteContentContainer a
+            {
+                border-bottom : 1px dotted #AAAAAA;
+                text-decoration : none;
+                color : #FFFFFF;
+            }
+
+
+
+            #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+            }
+
+                #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li
+                {
+                    display :block;
+                    padding: 0;
+                    margin-top : 2px;
+                    margin-bottom : 2px;
+                    height : 24px;
+                    
+                    background-repeat : no-repeat;
+                }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li a
+                    {
+                        border-bottom : none;
+                        text-decoration : none;
+                        color : #FFFFFF;
+                    }
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFolder
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFolder.png');
+                        
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project%20Mayhem/images/ItemFolder.png');
+                    }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMyPictures
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFileMyPictures.png');
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project%20Mayhem/images/ItemFileMyPictures.png');
+                    }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMyMusic, #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMusicPlaylist
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFileMyMusic.png');
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project%20Mayhem/images/ItemFileMyMusic.png');
+                    }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMyVideos, #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileVideoPlaylist
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFileMyVideos.png');
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project%20Mayhem/images/ItemFileMyVideos.png');
+                    }
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.FileName
+                    {
+                        float : left ;
+                    }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.FileName a
+                        {
+                            font-family : Trebuchet MS, Verdana, Arial, Helvetica;
+                            font-size : 16px;
+                            color : #ffffff;
+                            text-decoration : none;
+                        }
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue
+                    {
+                        float : left ;
+                    }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue a
+                        {
+                            display : block;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemAddQueueOff.png');
+                        }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue a:hover
+                        {
+                            display : block;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemAddQueueOver.png');
+                        }
+
+                            #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue a span
+                            {
+                                display : none;
+                            }
+
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue
+                    {
+                        float : left ;
+                    }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue a
+                        {
+                            display : block;
+                            margin-left : 5px;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemRemoveQueueOff.png');
+                        }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue a:hover
+                        {
+                            display : block;
+                            margin-left : 5px;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemRemoveQueueOver.png');
+                        }
+
+                            #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue a span
+                            {
+                                display : none;
+                            }
+
+
+
+
+#SiteCommandContainer
+{
+    display : none;
+}
+
diff --git a/web/Project_Mayhem_III/default.asp b/web/Project_Mayhem_III/default.asp
new file mode 100644
index 0000000000..ea4bd600b1
--- /dev/null
+++ b/web/Project_Mayhem_III/default.asp
@@ -0,0 +1,544 @@
+<%
+    if (isset("Action")) {
+        if (Action == "UnqueMusicplaylist") {
+            var ItemCount;
+            var z;
+            ItemCount = xbmcCommand("catalog","items");
+            for (z = 0;  z < ItemCount;  z = z + 1) {
+                // dirty workaround, cause unque, + z won't work
+                xbmcCommand("navigate", Action);
+                xbmcCommand("catalog","unque");
+            }
+            Action = "musicplaylist";          
+        }
+        xbmcCommand("navigate", Action);
+    }
+    
+    if (isset("command")) {
+        // execute a few commands before listing the contents
+        if (command == "select") {
+            xbmcCommand("catalog", "select," + item);
+        } else if (command == "unque") {
+            xbmcCommand("catalog", "unque," + item);
+        }
+    }
+
+    var navigatorstate;
+    var BannerClass;
+    var InfoClass;
+    var BackgroundClass;
+    var ItemFileClass;
+    navigatorstate = xbmcCommand("navigatorstate");
+
+    if (isset("DisplayConfiguration")) {
+        BannerClass = "SiteBannerConfiguration";
+        InfoClass = "SiteInfoConfiguration";
+        BackgroundClass = "SiteBackgroundConfiguration";
+	} else if (isset("DisplayInfo")) {
+        BannerClass = "SiteBannerConfiguration";
+        InfoClass = "SiteInfoConfiguration";
+        BackgroundClass = "SiteBackgroundConfiguration";
+    } else if (navigatorstate == "pictures") {
+        BannerClass = "SiteBannerMyPictures";
+        InfoClass = "SiteInfoMyPictures";
+        BackgroundClass = "SiteBackgroundMyPictures";
+        ItemFileClass = "ItemFileMyPictures";
+    } else if (navigatorstate == "music") {
+        BannerClass = "SiteBannerMyMusic";
+        InfoClass = "SiteInfoMyMusic";
+        BackgroundClass = "SiteBackgroundMyMusic";
+        ItemFileClass = "ItemFileMyMusic";
+    } else if (navigatorstate == "videos") {
+        BannerClass = "SiteBannerMyVideos";
+        InfoClass = "SiteInfoMyVideos";
+        BackgroundClass = "SiteBackgroundMyVideos";
+        ItemFileClass = "ItemFileMyVideos";
+    } else if (navigatorstate == "musicplaylist") {
+        BannerClass = "SiteBannerMusicPlaylist";
+        InfoClass = "SiteInfoMusicPlaylist";
+        BackgroundClass = "SiteBackgroundMusicPlaylist";
+        ItemFileClass = "ItemFileMusicPlaylist";
+    } else if (navigatorstate == "videoplaylist") {
+        BannerClass = "SiteBannerVideoPlaylist";
+        InfoClass = "SiteInfoVideoPlaylist";
+        BackgroundClass = "SiteBackgroundVideoPlaylist";
+        ItemFileClass = "ItemFileVideoPlaylist";
+    } else {
+        BannerClass = "SiteBannerNone";
+        InfoClass = "SiteInfoLogo";
+        BackgroundClass = "SiteBackgroundHome";
+    }
+
+%><?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+    <head>
+        <title> XBMC - Remote Control </title>
+        <link href="styles/Project_Mayhem/screen.css" rel="stylesheet" type="text/css" />
+        <link rel="shortcut icon" href="/styles/Project_Mayhem/images/ShortcutIcon.ico" type="image/x-icon" />        
+
+        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+    </head>
+  
+    <body>
+    
+        <div id="SiteContainer" class="<% write(BackgroundClass); %>">
+
+            <div id="SiteLeftContainer">
+                <div id="SiteInfoContainer">
+                    <div id="<% write(InfoClass); %>"></div>
+                </div>
+    
+                <div id="SiteMenuContainer">
+                    <ul>
+                        <li class="MyPictures"><a href="default.asp?Action=pictures"><span>My Pictures</span></a></li>
+                        <li class="MyMusic"><a href="default.asp?Action=music"><span>My Music</span></a></li>
+                        <li class="MyVideos"><a href="default.asp?Action=videos"><span>My Videos</span></a></li>
+                        <li class="MusicPlaylist"><a href="default.asp?Action=musicplaylist"><span>Music Playlist</span></a></li>
+                        <li class="VideoPlaylist"><a href="default.asp?Action=videoplaylist"><span>Video Playlist</span></a></li>
+                    </ul>
+                </div>
+      
+                <div id="SiteControlContainer">
+                    <ul>
+                        <li class="Stop"><a href="/xbmcCmds/xbmcForm?command=stop" target="CommandFrame"><span>Stop</span></a></li>
+                        <li class="Play"><a href="/xbmcCmds/xbmcForm?command=play" target="CommandFrame"><span>Play</span></a></li>
+                        <li class="Pause"><a href="/xbmcCmds/xbmcForm?command=pause" target="CommandFrame"><span>Pause</span></a></li>
+                        <li class="Previous"><a href="/xbmcCmds/xbmcForm?command=previous" target="CommandFrame"><span>Previous</span></a></li>
+                        <li class="Next"><a href="/xbmcCmds/xbmcForm?command=next" target="CommandFrame"><span>Next</span></a></li>
+                        <li class="SkipForward"><a href="/xbmcCmds/xbmcHttp?command=SeekPercentageRelative(5)" target="CommandFrame"><span>Skip Forward</span></a></li>
+                        <li class="SkipBackward"><a href="/xbmcCmds/xbmcHttp?command=SeekPercentageRelative(-5)" target="CommandFrame"><span>Skip Backward</span></a></li>
+                    </ul>
+                </div>
+            
+                <div id="SiteSubMenuContainer">
+                    <ul>
+                        <li class="Subpanel"><a href=""><span>Subpanel</span></a>
+                            <ul>
+                                <li><a href="SubRemote"><span>Remote</span></a></li>
+                                <li><a href="SubConfiguration"><span>Configuration</span></a></li>
+                                <li><a href="/xbmcCmds/xbmcForm?command=exit" target="CommandFrame"><span>Dashboard</span></a></li>
+                                <li><a href="/xbmcCmds/xbmcForm?command=reboot" target="CommandFrame"><span>Reboot</span></a></li>
+                            </ul>
+                        </li>
+<!--
+						<li class="Info"><a href="default.asp?DisplayInfo=true"><span>Info</span></a></li>                  
+-->
+						<li class="Configuration"><a href="default.asp?DisplayConfiguration=true&amp;page=bookmarks"><span>Sources</span></a></li>
+						<li class="Reboot"><a href="/xbmcCmds/xbmcForm?command=restart" target="CommandFrame"><span>Reboot</span></a></li>
+						<li class="Shutdown"><a href="/xbmcCmds/xbmcForm?command=shutdown" target="CommandFrame"><span>Shutdown</span></a></li>
+					</ul>
+				</div>
+
+  	<div id="SiteVolumeContainer">
+		<ul>
+		        <li class="vol0"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=0" target="CommandFrame"></a></li>
+		        <li class="vol10"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=10" target="CommandFrame"></a></li>
+		        <li class="vol20"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=20" target="CommandFrame"></a></li>
+  	        <li class="vol30"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=30" target="CommandFrame"></a></li>
+		        <li class="vol40"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=40" target="CommandFrame"></a></li>
+  	        <li class="vol50"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=50" target="CommandFrame"></a></li>
+		        <li class="vol60"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=60" target="CommandFrame"></a></li>
+  	        <li class="vol70"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=70" target="CommandFrame"></a></li>
+		        <li class="vol80"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=80" target="CommandFrame"></a></li>
+	 	        <li class="vol90"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=90" target="CommandFrame"></a></li>
+		        <li class="vol100"><a href="/xbmcCmds/xbmcHttp?command=setvolume&parameter=100" target="CommandFrame"></a></li>
+		</ul>
+	</div>    
+            </div>
+            
+    
+            <div id="SiteRightContainer">
+            
+                <div id="SiteBannerContainer">
+                    <div id="<% write(BannerClass); %>"></div>
+                </div>
+                
+                <div id="SiteContentContainer">
+<%
+
+  if (isset("DisplayInfo") ) 
+  {
+	write("<a href='/scripts/SystemInfo.spy' target='_blank'>SystemInfo</a> \n");
+	write("<a href='/scripts/MediaInfo.spy' target='_blank'>MediaInfo</a> \n");
+  }
+  else if (isset("DisplayConfiguration") ) {
+    /*
+     * xbmc configuration options
+    
+      xbmcCfgBookmarkSize(type)
+      xbmcCfgGetBookmark(type, parameter, id)
+      xbmcCfgAddBookmark(type, name, path [, position])
+      xbmcCfgSaveBookmark(type, name, path, position)
+      xbmcCfgRemoveBookmark(type, position)
+      xbmcCfgSaveConfiguration(filename)
+      xbmcCfgGetOption(name)
+      xbmcCfgSetOption(name, value)
+    
+     */
+    
+    write("<a href='default.asp?DisplayConfiguration=true&amp;page=bookmarks'>Sources</a> \n");
+
+    write("<br />\n");
+    write("<br />\n");
+    
+    
+    /* if action isset we want to save / edit or remove something */
+    if (isset("action"))
+    {
+      if (action == "savebookmark")
+      {
+        if (isset("name") == "1" && isset("path") == "1" && isset("type") == "1" && isset("position") == "1")
+        {
+          xbmcCfgSaveBookmark(type, name, path, position);
+        }
+        else
+          write("Error");
+      }
+      if (action == "addbookmark")
+      {
+        if (isset("name") == "1" && isset("path") == "1" && isset("type") == "1")
+        {
+          xbmcCfgAddBookmark(type, name, path);
+        }
+        else
+          write("Error");
+      }
+      if (action == "remove")
+      {
+        if (isset("page"))
+        {
+          // return to bookmark page and not to editbookmarks
+          page = "bookmarks";
+          xbmcCfgRemoveBookmark(type, position);
+        }
+      }
+      if (action == "saveoptions")
+      {
+        xbmcCfgSetOption("home", home);
+        xbmcCfgSetOption("CDDBIpAdres", CDDBIpAdres);
+    
+        var usef = "no";
+        if (isset("useFDrive")) usef = "yes";
+        xbmcCfgSetOption("useFDrive", usef);
+    
+        var useg = "no";
+        if (isset("useGDrive")) useg = "yes";
+        xbmcCfgSetOption("useGDrive", useg);
+    
+        xbmcCfgSetOption("dashboard", dashboard);
+        xbmcCfgSetOption("dvdplayer", dvdplayer);
+        xbmcCfgSetOption("subtitles", subtitles);
+        xbmcCfgSetOption("startwindow", startwindow);
+        xbmcCfgSetOption("pictureextensions", pictureextensions);
+        xbmcCfgSetOption("musicextensions", musicextensions);
+        xbmcCfgSetOption("videoextensions", videoextensions);
+        xbmcCfgSetOption("thumbnails", thumbnails);
+        xbmcCfgSetOption("shortcuts", shortcuts);
+        xbmcCfgSetOption("albums", albums);
+        xbmcCfgSetOption("recordings", recordings);
+        xbmcCfgSetOption("screenshots", screenshots);
+    
+        var remcodes = "no";
+        if (isset("displayremotecodes")) remcodes = "yes";
+        xbmcCfgSetOption("displayremotecodes", remcodes);
+      }
+      if (action == "save")
+      {
+        xbmcCfgSaveConfiguration("XBoxMediaCenter.xml");
+      }
+    }
+    
+    if (isset("page"))
+    {
+      var i;
+      var name;
+      var value;
+      var options;
+    
+      if (page == "bookmarks")
+      {
+        var musicbookmarks = xbmcCfgBookmarkSize("music");
+        var picturebookmarks = xbmcCfgBookmarkSize("pictures");
+        var videobookmarks = xbmcCfgBookmarkSize("video");
+        var filebookmarks = xbmcCfgBookmarkSize("files");
+        var programbookmarks = xbmcCfgBookmarkSize("myprograms");
+        
+    
+        /* Add new Bookmark button */
+        write("<form name='new_bookmark' method='post' action='default.asp?DisplayConfiguration=true&amp;page=addbookmark'>\n");
+        write("  <input type='submit' name='addnewbookmark' value='Add new source'><br>\n");
+        write("</form>\n");
+    
+        /* Display Music Bookmarks */
+        write("<form name='music_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=music'>\n");
+        write("<br/>Music Sources:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=musicbookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("music", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+        /* Display Picture Bookmarks */
+        write("<form name='picture_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=pictures'>\n");
+        write("<br/>Picture Sources:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=picturebookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("pictures", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+        /* Display Video Bookmarks */
+        write("<form name='video_bookmarks' method='post' action='default.asp?DisplayConfiguration=true&amp;page=editbookmark&amp;type=video'>\n");
+        write("<br/>Video Sources:<br>\n");
+        write("  <input type='submit' name='action' value='edit'>\n");
+        write("  <input type='submit' name='action' value='remove'>\n");
+        write("  <select name='position'>\n");
+        i = 0;
+        for (i=1; i<=videobookmarks; i=i+1)
+        {
+          write("    <option value=" + i + ">" + xbmcCfgGetBookmark("video", "name", i) + "</option>\n");
+        }
+        write("  </select>\n");
+        write("</form>\n");
+    
+      }
+      else if (page == "options")
+      {
+        write("	<form action='default.asp?DisplayConfiguration=true' method='post' name='cfgform' id='cfgform'>" + \
+              "		<input name='action' type='hidden' value='saveoptions'>" + \
+              "		<input name='page' type='hidden' value='options'>" + \
+              "		<table width='500'>");
+        write("			<tr>" + \
+              "				<td width='200'><label>Home</label></td>" + \
+              "				<td><input name='home' type='text' value='"); write(xbmcCfgGetOption("home")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>CDDB IP Address</label></td><td>" + \
+              "				<input name='CDDBIpAdres' type='text' value='"); write(xbmcCfgGetOption("CDDBIpAdres")); write("' size='25'><br></td>" + \
+              "			</tr>");
+    
+        // Use F Drive
+        write("			<tr>" + \
+              "					<td><label>Use F Drive</label></td><td>" + \
+              "           <input name='useFDrive' type='checkbox' value='true' ");
+              if (xbmcCfgGetOption("useFDrive") == "yes")	write("checked>");
+              else write(">");
+        write("         <br></td>" + \
+              "			</tr>");
+    
+        // Use G Drive
+        write("			<tr>" + \
+              "					<td><label>Use G Drive</label></td><td>" + \
+              "           <input name='useGDrive' type='checkbox' value='true' ");
+              if (xbmcCfgGetOption("useGDrive") == "yes")	write("checked>");
+              else write(">");
+        write("         <br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Dashboard</label></td>" + \
+              "				<td><input name='dashboard' type='text' value='"); write(xbmcCfgGetOption("dashboard")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Dvdplayer</label></td>" + \
+              "				<td><input name='dvdplayer' type='text' value='"); write(xbmcCfgGetOption("dvdplayer")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Subtitles</label></td>" + \
+              "				<td><input name='subtitles' type='text' value='"); write(xbmcCfgGetOption("subtitles")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Startwindow</label></td>" + \
+              "				<td><input name='startwindow' type='text' value='"); write(xbmcCfgGetOption("startwindow")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Picture Extensions</label></td>" + \
+              "				<td><input name='pictureextensions' type='text' value='"); write(xbmcCfgGetOption("pictureextensions")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Music Extensions</label></td>" + \
+              "				<td><input name='musicextensions' type='text' value='"); write(xbmcCfgGetOption("musicextensions")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Video Extensions</label></td>" + \
+              "				<td><input name='videoextensions' type='text' value='"); write(xbmcCfgGetOption("videoextensions")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Thumbnails</label></td>" + \
+              "				<td><input name='thumbnails' type='text' value='"); write(xbmcCfgGetOption("thumbnails")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Shortcuts</label></td>" + \
+              "				<td><input name='shortcuts' type='text' value='"); write(xbmcCfgGetOption("shortcuts")); write("' size='25'><br></td>" + \
+              "			</tr>" );
+        write("			<tr>" + \
+              "				<td><label>Albums</label></td>" + \
+              "				<td><input name='albums' type='text' value='"); write(xbmcCfgGetOption("albums")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Recordings</label></td>" + \
+              "				<td><input name='recordings' type='text' value='"); write(xbmcCfgGetOption("recordings")); write("' size='25'><br></td>" + \
+              "			</tr>");
+        write("			<tr>" + \
+              "				<td><label>Screenshots</label></td>" + \
+              "				<td><input name='screenshots' type='text' value='"); write(xbmcCfgGetOption("screenshots")); write("' size='25'><br></td>" + \
+              "			</tr>");
+    
+        // Display remote codes
+        write("			<tr>" + \
+              "					<td><label>Display remote codes</label></td><td>" + \
+              "           <input name='displayremotecodes' type='checkbox' value='true' ");
+              if (xbmcCfgGetOption("displayremotecodes") == "yes")	write("checked>");
+              else write(">");
+        write("         <br></td>" + \
+              "			</tr>");
+    
+        write("		</table><br>" + \
+              "		<input type='submit' name='save' value='save'>" + \
+              "	</form><br>");
+      }
+      else if (page == "editbookmark")
+      {
+        if (isset("type") == "1" && isset("position") == "1")
+        {
+          write("<form name='savebookmark' method='post' action='default.asp?DisplayConfiguration=true&amp;page=bookmarks&amp;action=savebookmark'>\n");
+          write("<input name='position' type='hidden' value='" + position + "'>\n");
+          write("<input name='type' type='hidden' value='" + type + "'>\n");
+          write("  <table width='500' border='0'>\n");
+          write("    <tr> \n");
+          write("      <td><label>name</label></td>\n");
+          write("      <td><input type='text' name='name' value='" + xbmcCfgGetBookmark(type, "name", position) + "'></td>\n");
+          write("    </tr>\n");
+          write("    <tr> \n");
+          write("      <td><label>path</label></td>\n");
+          write("      <td><input type='text' name='path' value='" + xbmcCfgGetBookmark(type, "path", position) + "'></td>\n");
+          write("    </tr>\n");
+          write("  </table><br>\n");
+          write("  <input type='submit' name='save' value='save'>\n");
+          write("</form>\n");
+        }
+      }
+      else if (page == "addbookmark")
+      {
+        var data = "<form name='addbookmark' method='post' action='default.asp?DisplayConfiguration=true&amp;page=bookmarks&amp;action=addbookmark'>\n";
+        data = data + "  <table width='500' border='0'>\n";
+        data = data + "    <tr> \n";
+        data = data + "      <td><label>Type</label></td>\n";
+        data = data + "      <td>";
+        data = data + "        <select name='type'>\n";
+        data = data + "          <option value=files>File</option>\n";
+        data = data + "          <option value=music>Music</option>\n";
+        data = data + "          <option value=myprograms>Program</option>\n";
+        data = data + "          <option value=pictures>Picture</option>\n";
+        data = data + "          <option value=video>Video</option>\n";
+        data = data + "        </select>\n";
+        data = data + "      </td>\n";
+        data = data + "    </tr>\n";
+        data = data + "    <tr> \n";
+        data = data + "      <td><label>Name</label></td>\n";
+        data = data + "      <td><input type='text' name='name' value=''></td>\n";
+        data = data + "    </tr>\n";
+        data = data + "    <tr> \n";
+        data = data + "      <td><label>Path</label></td>\n";
+        data = data + "      <td><input type='text' name='path' value=''></td>\n";
+        data = data + "    </tr>\n";
+        data = data + "  </table><br>\n";
+        data = data + "  <input type='submit' name='save' value='save'>\n";
+        data = data + "</form>\n";
+    
+        write(data);
+      }
+      if (page == "load_save")
+      {
+        write("<br><br><a href='default.asp?DisplayConfiguration=true&amp;action=save'>Save</a>\n");
+      }
+    }
+
+
+  } else {
+ 
+  
+    var z;
+    var n;
+    var i;
+    var data;
+  
+  
+    n = xbmcCommand("catalog","items"); // number of items to list
+    file = xbmcCommand("catalog","first");
+    
+    if ( n > 0) {
+        write("                    <ul id=\"ItemList\">\n");
+    }
+    
+    for (z=0; z<n; z=z+1)
+    {
+      var type = xbmcCommand("catalog","type," + z);
+  
+  
+      data = "                        <li>";
+  
+      if (type != "directory") {
+        // we have a file to play, send command to server when clicked and do not refresh the current page
+        data = data + "<div class=\"" + ItemFileClass + "\"></div>";
+      } else { 
+        data = data + "<div class=\"ItemFolder\"></div>"; 
+      }
+  
+  
+      if (file != ".." && navigatorstate != "musicplaylist" && navigatorstate != "videoplaylist" && navigatorstate != "pictures") {
+        data = data + "<div class=\"AddQueue\"><a href=\"/xbmcCmds/xbmcForm?command=catalog&amp;parameter=que," + z + "\" target=\"CommandFrame\" title=\"add to queue\"><span>Q</span></a></div>";
+      } else if (navigatorstate == "musicplaylist" || navigatorstate == "videoplaylist")	{
+        data = data + "<div class=\"RemoveQueue\"><a href=\"default.asp?command=unque&amp;item=" + z + "\" title=\"remove from queue\"><span>R</span></a></div>";
+      }
+  
+  
+      if (type != "directory") {
+        // we have a file to play, send command to server when clicked and do not refresh the current page
+        data = data + "<div class=\"FileName\"><a href=\"/xbmcCmds/xbmcForm?command=catalog&amp;parameter=select," + z + "\" target=\"CommandFrame\">";
+      } else { 
+        data = data + "<div class=\"FileName\"><a href=\"default.asp?command=select&amp;item=" + z + "\">"; 
+      }
+      
+      data = data + file + "</a></div>";
+      
+      data = data + "</li>\n";
+      write(data);
+      
+        
+      file = xbmcCommand("catalog","next");
+    }
+
+    if ( n > 0) {
+        write("                    </ul>\n");
+    }
+    
+    if (navigatorstate == "musicplaylist") {
+        write ("<a href=\"default.asp?Action=UnqueMusicplaylist\" id=\"UnqueMusciplaylist\"><span>Clear Playlist</span></a>\n");
+    }
+
+
+}
+%>
+                </div>
+    
+            </div>
+            
+        </div>
+        
+        <div id="SiteCommandContainer">
+            <iframe src="about:blank" width="1" height="1" name="CommandFrame"></iframe>
+        </div>
+  
+    </body>
+</html>
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/Background.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/Background.png
new file mode 100644
index 0000000000..38000d838b
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/Background.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundConfiguration.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundConfiguration.png
new file mode 100644
index 0000000000..adc432d881
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundConfiguration.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundHome.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundHome.png
new file mode 100644
index 0000000000..b208e2a66d
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundHome.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyMusic.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyMusic.png
new file mode 100644
index 0000000000..0e3b602ae6
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyMusic.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyPictures.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyPictures.png
new file mode 100644
index 0000000000..3f345282fd
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyPictures.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyVideos.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyVideos.png
new file mode 100644
index 0000000000..7ff3f85bd1
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BackgroundMyVideos.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BannerMusicPlaylist.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BannerMusicPlaylist.png
new file mode 100644
index 0000000000..4f29f4f439
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BannerMusicPlaylist.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/BannerVideoPlaylist.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BannerVideoPlaylist.png
new file mode 100644
index 0000000000..589c62b9b9
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/BannerVideoPlaylist.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlBackground.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlBackground.png
new file mode 100644
index 0000000000..b4f15a69b5
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlBackground.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlNextOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlNextOver.png
new file mode 100644
index 0000000000..f5f40e9046
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlNextOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPauseOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPauseOver.png
new file mode 100644
index 0000000000..c3d87911c9
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPauseOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPlayOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPlayOver.png
new file mode 100644
index 0000000000..9dd931b847
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPlayOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPreviousOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPreviousOver.png
new file mode 100644
index 0000000000..7813ce0082
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlPreviousOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlSkipBackwardOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlSkipBackwardOver.png
new file mode 100644
index 0000000000..1dd1cc11ea
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlSkipBackwardOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlSkipForwardOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlSkipForwardOver.png
new file mode 100644
index 0000000000..db80578fa4
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlSkipForwardOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlStopOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlStopOver.png
new file mode 100644
index 0000000000..a905addd4b
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ControlStopOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/InfoLogo.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/InfoLogo.png
new file mode 100644
index 0000000000..02f29b9061
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/InfoLogo.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueue.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueue.png
new file mode 100644
index 0000000000..26c700e078
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueue.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueueOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueueOff.png
new file mode 100644
index 0000000000..0f863b10fe
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueueOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueueOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueueOver.png
new file mode 100644
index 0000000000..9c715d33e9
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemAddQueueOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemBackground.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemBackground.png
new file mode 100644
index 0000000000..eff491c5ec
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemBackground.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyMusic.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyMusic.png
new file mode 100644
index 0000000000..0b12eb54bb
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyMusic.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyPictures.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyPictures.png
new file mode 100644
index 0000000000..c8e63372a1
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyPictures.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyVideos.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyVideos.png
new file mode 100644
index 0000000000..90bf922c75
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFileMyVideos.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFolder.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFolder.png
new file mode 100644
index 0000000000..30ebcf01e1
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemFolder.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueue.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueue.png
new file mode 100644
index 0000000000..5bc6a9e34a
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueue.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOff.png
new file mode 100644
index 0000000000..36af47f5a7
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOver.png
new file mode 100644
index 0000000000..ca08c2d0b4
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOver_2.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOver_2.png
new file mode 100644
index 0000000000..ca08c2d0b4
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ItemRemoveQueueOver_2.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMusicPlaylistOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMusicPlaylistOff.png
new file mode 100644
index 0000000000..0e489242eb
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMusicPlaylistOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMusicPlaylistOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMusicPlaylistOver.png
new file mode 100644
index 0000000000..482d9acad4
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMusicPlaylistOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyMusicOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyMusicOff.png
new file mode 100644
index 0000000000..b01f3f32ef
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyMusicOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyMusicOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyMusicOver.png
new file mode 100644
index 0000000000..c715ce34a1
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyMusicOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyPicturesOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyPicturesOff.png
new file mode 100644
index 0000000000..f58c0ae7e5
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyPicturesOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyPicturesOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyPicturesOver.png
new file mode 100644
index 0000000000..213b52fe5f
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyPicturesOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyVideosOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyVideosOff.png
new file mode 100644
index 0000000000..b333f00ba6
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyVideosOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyVideosOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyVideosOver.png
new file mode 100644
index 0000000000..ae0a22884a
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuMyVideosOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuVideoPlaylistOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuVideoPlaylistOff.png
new file mode 100644
index 0000000000..e86ca65d30
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuVideoPlaylistOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuVideoPlaylistOver.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuVideoPlaylistOver.png
new file mode 100644
index 0000000000..e20c1a9b25
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/MenuVideoPlaylistOver.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/ShortcutIcon.ico b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ShortcutIcon.ico
new file mode 100644
index 0000000000..28a518cc61
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/ShortcutIcon.ico
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuBackground.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuBackground.png
new file mode 100644
index 0000000000..4a63fad7ae
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuBackground.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuConfiguration.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuConfiguration.png
new file mode 100644
index 0000000000..9d11287efc
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuConfiguration.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuConfigurationOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuConfigurationOff.png
new file mode 100644
index 0000000000..73f2dff3c8
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuConfigurationOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuDash.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuDash.png
new file mode 100644
index 0000000000..9cd5208143
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuDash.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuDashOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuDashOff.png
new file mode 100644
index 0000000000..733df37d83
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuDashOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuInfo.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuInfo.png
new file mode 100644
index 0000000000..60c895219c
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuInfo.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuInfoOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuInfoOff.png
new file mode 100644
index 0000000000..9560622384
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuInfoOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuReboot.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuReboot.png
new file mode 100644
index 0000000000..144406d331
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuReboot.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuRebootOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuRebootOff.png
new file mode 100644
index 0000000000..b3e7d124e1
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuRebootOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuShutdown.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuShutdown.png
new file mode 100644
index 0000000000..2697db8f19
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuShutdown.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuShutdownOff.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuShutdownOff.png
new file mode 100644
index 0000000000..989ae8f890
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/SubMenuShutdownOff.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/VolumeSliderBackground.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/VolumeSliderBackground.png
new file mode 100644
index 0000000000..9a0528e57e
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/VolumeSliderBackground.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/images/volumeslider.png b/web/Project_Mayhem_III/styles/Project_Mayhem/images/volumeslider.png
new file mode 100644
index 0000000000..d3b1b3c4e0
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/images/volumeslider.png
diff --git a/web/Project_Mayhem_III/styles/Project_Mayhem/screen.css b/web/Project_Mayhem_III/styles/Project_Mayhem/screen.css
new file mode 100644
index 0000000000..77d0248165
--- /dev/null
+++ b/web/Project_Mayhem_III/styles/Project_Mayhem/screen.css
@@ -0,0 +1,838 @@
+body
+{
+    font-family : Arial, Helvetica, Verdana;
+    font-size : 12px;
+    background-image : url('images/Background.png');
+    margin : 0;
+    padding : 0;
+    overflow : hidden;
+
+    text-align : center;
+    
+    border : 0;
+}	
+
+a
+{
+    outline: none;
+}
+
+#SiteContainer
+{ 
+    margin : auto;
+    
+    width : 1000px;
+    height : 580px;
+    
+    text-align : left;
+}
+
+div.SiteBackgroundHome
+{ 
+    background-image : url('images/BackgroundHome.png');
+}
+
+div.SiteBackgroundMyPictures
+{ 
+    background-image : url('images/BackgroundMyPictures.png');
+}
+
+div.SiteBackgroundMyMusic, div.SiteBackgroundMusicPlaylist
+{ 
+    background-image : url('images/BackgroundMyMusic.png');
+}
+
+div.SiteBackgroundMyVideos, div.SiteBackgroundVideoPlaylist
+{ 
+    background-image : url('images/BackgroundMyVideos.png');
+}
+
+div.SiteBackgroundConfiguration
+{ 
+    background-image : url('images/BackgroundConfiguration.png');
+}
+
+
+
+    #SiteContainer #SiteLeftContainer
+    { 
+        position : relative;
+        float : left;
+    
+    }
+        
+    
+    
+        #SiteContainer #SiteLeftContainer #SiteMenuContainer
+        {
+            position : absolute;
+            width : 200px;
+            height : 330px;
+            top : 150px;
+            left : 40px;
+
+            /* Fix for buggy IE */
+            font-size : 1px;        
+        }
+    
+            #SiteContainer #SiteLeftContainer #SiteMenuContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+            }
+       
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li a
+                {
+                    display: block;
+                    margin : 0px 0px 2px 0px;
+                    width: 220px;
+                    height : 34px;
+                }
+    
+                    #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li a span
+                    {
+                        display : none;
+                    }
+    
+    
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyPictures a
+                {
+                    background-image : url('images/MenuMyPicturesOff.png');
+                }
+            
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyPictures a:hover
+                {
+                    background-image : url('images/MenuMyPicturesOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyMusic a
+                {
+                    background-image : url('images/MenuMyMusicOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyMusic a:hover
+                {
+                    background-image : url('images/MenuMyMusicOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyVideos a
+                {
+                    background-image : url('images/MenuMyVideosOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MyVideos a:hover
+                {
+                    background-image : url('images/MenuMyVideosOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MusicPlaylist a
+                {
+                    background-image : url('images/MenuMusicPlaylistOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.MusicPlaylist a:hover
+                {
+                    background-image : url('images/MenuMusicPlaylistOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.VideoPlaylist a
+                {
+                    background-image : url('images/MenuVideoPlaylistOff.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteMenuContainer ul li.VideoPlaylist a:hover
+                {
+                    background-image : url('images/MenuVideoPlaylistOver.png');
+                }
+    
+
+
+
+
+
+        #SiteContainer #SiteLeftContainer #SiteControlContainer
+        {
+            position : absolute;
+            width : 161px;
+            height : 84px;
+            left : 75px;
+            top : 360px;
+            background-image : url('images/ControlBackground.png');
+        }
+
+            #SiteContainer #SiteLeftContainer #SiteControlContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+                
+                /* Fix for buggy IE */
+                font-size : 1px;
+            }
+ 
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li a span
+                {
+                    display : none;
+                }
+
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Stop a
+                {
+                    position : absolute;
+                    width : 34px;
+                    height : 36px;
+                    left : 34px;
+                    top : 23px;
+                    
+                }
+
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Stop a:hover
+                {
+                    background-image : url('images/ControlStopOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Play a
+                {
+                    position : absolute;
+                    width : 52px;
+                    height : 48px;
+                    left : 58px;
+                    top : 9px;
+                    
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Play a:hover
+                {
+                    background-image : url('images/ControlPlayOver.png');
+                }
+                
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Pause a
+                {
+                    position : absolute;
+                    width : 32px;
+                    height : 36px;
+                    left : 101px;
+                    top : 10px;
+                    
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Pause a:hover
+                {
+                    background-image : url('images/ControlPauseOver.png');
+                }
+                
+                                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Previous a
+                {
+                    position : absolute;
+                    width : 38px;
+                    height : 38px;
+                    left : 2px;
+                    top : 26px;
+                    
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Previous a:hover
+                {
+                    background-image : url('images/ControlPreviousOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Next a
+                {
+                    position : absolute;
+                    width : 33px;
+                    height : 34px;
+                    left : 125px;
+                    top : 6px;
+                    
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.Next a:hover
+                {
+                    background-image : url('images/ControlNextOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.SkipBackward a
+                {
+                    position : absolute;
+                    width : 70px;
+                    height : 25px;
+                    left : 25px;
+                    top : 56px;
+                    
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.SkipBackward a:hover
+                {
+                    background-image : url('images/ControlSkipBackwardOver.png');
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.SkipForward a
+                {
+                    position : absolute;
+                    width : 57px;
+                    height : 35px;
+                    left : 93px;
+                    top : 38px;
+                    
+                }
+                
+                #SiteContainer #SiteLeftContainer #SiteControlContainer ul li.SkipForward a:hover
+                {
+                    background-image : url('images/ControlSkipForwardOver.png');
+                }
+
+
+
+        #SiteContainer #SiteLeftContainer #SiteSubMenuContainer
+        {
+            position : absolute;
+            width : 198px;
+            height : 50px;
+            left : 55px;
+            top : 480px;
+	    background-image : url('images/SubMenuBackground.png');
+        }
+        
+            #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+                
+                /* Fix for buggy IE */
+                font-size : 1px;
+		
+
+            }
+        
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li#Subpanel
+                {
+                    display : none;
+                }
+                
+                    #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li a span
+                    {
+                        display : none;
+                    }
+
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Dash a
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 35px;
+                    left : 11px;
+                    top : 5px;
+
+                    background-image : url('images/SubMenuDashOff.png');
+                }
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Dash a:hover
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 50px;
+                    left : 11px;
+                    top : 5px;
+
+                    background-image : url('images/SubMenuDash.png');
+                }
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Reboot a
+                {
+
+                    position : absolute;
+                    width : 35px;
+                    height : 35px;
+                    left : 25px;
+                    top : 5px;
+                    
+
+                    background-image : url('images/SubMenuRebootOff.png');
+                }
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Reboot a:hover
+                {
+
+                    position : absolute;
+                    width : 35px;
+                    height : 50px;
+                    left : 25px;
+                    top : 5px;
+                    
+
+                    background-image : url('images/SubMenuReboot.png');
+                }
+
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Shutdown a
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 35px;
+                    left : 85px;
+                    top : 5px;
+                    
+ 
+                    background-image : url('images/SubMenuShutdownOff.png');
+                }
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Shutdown a:hover
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 50px;
+                    left : 75px;
+                    top : 5px;
+                    
+ 
+                    background-image : url('images/SubMenuShutdown.png');
+                }
+
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Info a
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 35px;
+                    left : 122px;
+                    top : 5px;
+                   
+                    
+                    background-image : url('images/SubMenuInfoOff.png');
+                }
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Info a:hover
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 50px;
+                    left : 122px;
+                    top : 5px;
+                   
+                    
+                    background-image : url('images/SubMenuInfo.png');
+                }
+
+                
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Configuration a
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 35px;
+                    left : 146px;
+                    top : 5px;
+                   
+                    
+                    background-image : url('images/SubMenuConfigurationOff.png');
+                }
+                #SiteContainer #SiteLeftContainer #SiteSubMenuContainer ul li.Configuration a:hover
+                {
+                    position : absolute;
+                    width : 35px;
+                    height : 50px;
+                    left : 146px;
+                    top : 5px;
+                   
+                    
+                    background-image : url('images/SubMenuConfiguration.png');
+                }
+
+
+        #SiteContainer #SiteLeftContainer #SiteVolumeContainer
+        {
+            position : absolute;
+            width : 165px;
+            height : 25px;
+            left : 75px;
+            top : 450px;
+	    background-image : url('images/VolumeSliderBackground.png');
+        }
+
+            #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+                
+                /* Fix for buggy IE */
+                font-size : 1px;
+		
+
+            }
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol0 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 1px;
+                    top : 0px;
+                 }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol0 a:hover
+		{                   
+                    
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol10 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 16px;
+                    top : 0px;
+                    background: none;
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol10 a:hover
+		{                   
+                    
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol20 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 31px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol20 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol30 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 46px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol30 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol40 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 61px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol40 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+         	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol50 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 76px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol50 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol60 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 91px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol60 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+         	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol70 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 106px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol70 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+         	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol80 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 121px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol80 a:hover
+		{                     
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol90 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 136px;
+                    top : 0px;
+                   
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol90 a:hover
+		{                    
+                    background-image : url('images/volumeslider.png');
+          	}
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol100 a
+                {
+                    position : absolute;
+                    width : 13px;
+                    height : 25px;
+                    left : 151px;
+                    top : 0px;
+                }   
+                #SiteContainer #SiteLeftContainer #SiteVolumeContainer ul li.vol100 a:hover
+		{                   
+                    background-image : url('images/volumeslider.png');
+          	}
+
+    #SiteContainer #SiteRightContainer
+    {
+        position : relative;
+        width : 696px;
+        height : 530px;
+        left : 280px;
+        top : 26px;
+        margin : 0;
+        padding : 0;
+		white-space : nowrap;
+    }
+
+        #SiteContainer #SiteRightContainer #SiteBannerContainer div
+        {
+            
+            position : absolute;
+            width : 200px;
+            height : 40px;
+            left : 0px;
+            top : 4px;
+        }
+        
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerMusicPlaylist
+        {
+            background-image : url('images/BannerMusicPlaylist.png');
+        }
+        
+        #SiteContainer #SiteRightContainer div#SiteBannerContainer #SiteBannerVideoPlaylist
+        {
+            background-image : url('images/BannerVideoPlaylist.png');
+        }
+        
+
+
+        #SiteContainer #SiteRightContainer #SiteContentContainer
+        {
+            position : absolute;
+            width : 685px;
+            height : 430px;
+            left : 8px;
+            top : 60px;
+            
+            float : left;
+            
+            color : #FFFFFF;
+            
+            overflow : auto;
+            scrollbar-base-color : #c7c7c7;
+            scrollbar-3dlight-color : #000000;
+            scrollbar-arrow-color : #FF00000;
+            scrollbar-darkshadow-color : #000000;
+            scrollbar-face-color : #bdbdbd;
+            scrollbar-highlight-color : #bdbdbd;
+            scrollbar-shadow-color : #bdbdbd;
+            scrollbar-track-color : #8b8b8b;  
+
+
+        }
+
+            #SiteContainer #SiteRightContainer #SiteContentContainer td
+            {
+                color : #FFFFFF;
+                font-family : Arial, Helvetica, Verdana;
+                font-size : 12px;
+            }
+
+
+            #SiteContainer #SiteRightContainer #SiteContentContainer a
+            {
+                border-bottom : 1px dotted #AAAAAA;
+                text-decoration : none;
+                color : #FFFFFF;
+            }
+
+
+
+            #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList
+            {
+                margin: 0;
+                padding: 0;
+                list-style-type: none;
+            }
+
+                #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li
+                {
+                    display :block;
+                    padding: 0;
+                    margin-top : 2px;
+                    margin-bottom : 2px;
+                    height : 24px;
+                    
+                    background-repeat : no-repeat;
+                }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li a
+                    {
+                        border-bottom : none;
+                        text-decoration : none;
+                        color : #FFFFFF;
+                    }
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFolder
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFolder.png');
+                        
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project_Mayhem/images/ItemFolder.png');
+                    }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMyPictures
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFileMyPictures.png');
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project_Mayhem/images/ItemFileMyPictures.png');
+                    }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMyMusic, #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMusicPlaylist
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFileMyMusic.png');
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project_Mayhem/images/ItemFileMyMusic.png');
+                    }
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileMyVideos, #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.ItemFileVideoPlaylist
+                    {
+                        float : left ;
+                        width : 24px;
+                        height : 24px;
+                        margin-right : 5px;
+                        
+                        background-image : url('images/ItemFileMyVideos.png');
+                        /* Fix for buggy IE */
+                        _background-image : none;
+                        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='styles/Project_Mayhem/images/ItemFileMyVideos.png');
+                    }
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.FileName a
+                    {
+                        font-family : Trebuchet MS, Verdana, Arial, Helvetica;
+                        font-size : 16px;
+                        color : #ffffff;
+                        text-decoration : none;
+                    }
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue
+                    {
+                        float : left ;
+                    }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue a
+                        {
+                            display : block;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemAddQueueOff.png');
+                        }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue a:hover
+                        {
+                            display : block;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemAddQueueOver.png');
+                        }
+
+                            #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.AddQueue a span
+                            {
+                                display : none;
+                            }
+
+
+
+                    #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue
+                    {
+                        float : left ;
+                    }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue a
+                        {
+                            display : block;
+                            margin-left : 5px;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemRemoveQueueOff.png');
+                        }
+
+                        #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue a:hover
+                        {
+                            display : block;
+                            margin-left : 5px;
+                            margin-top : 4px;
+                            margin-right : 5px;
+                            width : 15px;
+                            height : 15px;
+                            background-image : url('images/ItemRemoveQueueOver.png');
+                        }
+
+                            #SiteContainer #SiteRightContainer #SiteContentContainer #ItemList li div.RemoveQueue a span
+                            {
+                                display : none;
+                            }
+
+
+
+
+#SiteCommandContainer
+{
+    display : none;
+}
+
diff --git a/web/xbmciphone/README b/web/xbmciphone/README
new file mode 100644
index 0000000000..9e4a06e275
--- /dev/null
+++ b/web/xbmciphone/README
@@ -0,0 +1,112 @@
+Xbox Media Center iPhone Remote
+===============================
+
+
+Introduction
+------------
+
+
+This project aims to provide an easy to use yet powerful remote control for Xbox Media Center using Apple's [iPhone](http://www.apple.com/iphone). [Xbox Media Center](http://www.xboxmediacenter.com/) is an open source application that can be run on a modified Xbox to play audio, video, DVDs, photo slideshows, and other media.
+
+iPhone's web browser (based on [WebKit](http://www.webkit.org)) can display full interactive webpages, and Xbox Media Center (XBMC) contains a simple web server that can store web page and react to various commands like pause, play, and many more. The remote is written entirely in JavaScript, HTML, and CSS, and makes use of [iUI](http://www.joehewitt.com/iui/), a framework for iPhone-like interfaces on web apps, written by Joe Hewitt.
+
+Using iUI allowed us to create an interface very similar to the iPhone's native interface, which is also very easy to use.
+
+
+Features
+--------
+
+XBMC iPhone Remote is still a work in progress. Listed below are the partially and fully implemented features, as well as some future features.
+
+### Current Features ###
+
+- Transport controls, including pause/play, next/previous track in playlist, and volume controls.
+- Automatic switching between file browsing mode and transport controls mode via iPhone's built in tilt sensor (file browsing in portrait, transport controls in landscape).
+- Viewing information on the currently playing media, including title, ID3 tags, album artwork, and much more.
+- Browsing of audio, video, photo, and file shares.
+- Playing audio, videos, and slideshows.
+- Managment of the audio, video, and slideshow playlists, including adding/removing media and playing of playlists.
+- Launching of scripts within the Scripts directory.
+- Restart, shutdown, eject, mute and various other controls, 
+
+### Future Features ###
+
+- More comprehensive transport controls.
+- Saving of playlists.
+- Settings.
+- Searching.
+
+
+Requirements
+------------
+
+Xbox Media Center is, of course, required. This has only been tested on recent (2007) versions of XBMC. The interface works best on an actual iPhone, but will also function on Safari 3.0 Beta for Mac OS X or Windows. It has not been tested on any other browsers, but should work on Firefox and others.
+
+
+Installation
+------------
+
+You can use the automated web installer (modified from [LiquidIce's](http://www.liquidicelabs.com/xbmc/installAJAX.php)) or follow the manual instal instructions.
+
+### Web Installer ###
+
+Please visit http://tlrobinson.net/projects/xbmciphone/ for the web installer.
+
+### Manual Install ###
+
+If you would prefer to manually install XBMC iPhone Remote, follow these instructions:
+
+1. [Download](http://tlrobinson.net/projects/xbmciphonexbmciphone-0.1.zip) the latest version
+2. Unzip it
+3. FTP into your Xbox and upload the "iphone" directory to the "web" directory on your Xbox (so it should be located at Q:\web\iphone\).
+
+To access the application, point your web browser to http://xbox/iphone/ where "xbox" is replaced with your Xbox's actual IP address.
+
+Instructions
+-------------
+
+Using the remote is simple and easy to figure out, but here's a few tips:
+
+- To use the transport controls rotate the iPhone to landscape orientation (please note the bug mentioned below). Rotate back to portrait orientation to use the file browser.
+- To view media shares, click one of the media categories (Audio, Video, Pictures, Files) on the main screen.
+- Tap folders to view the contents or play the file (if there's a play button to the right) and click the plus buttons on the left to add a file or entire folder to a playlist. In Files shares, items are added to the most recently used playlist, either Audio or Video. In all other shares files are added to their appropriate playlist (however no filtering is done, so it's possible to add videos to the audio playlist, etc).
+- Tap a playlist on the main screen to view it. Here you can view, edit, clear, and play the playlist.
+- To remove an item from a playlist, tap the red delete button to the left of an item in a playlist.
+- To immediately play an item in a playlist simply tap it (please note the bug mentioned below).
+- Tap the title at the top of each page to return directly to the main screen.
+
+
+Known Issues / Bugs / TODO
+---------------------------
+
+- After deleting an item in a playlist you must reload the playlist before trying to use.
+- Transport controls are partially or fully hidden by sub-pages (but not the main page).
+- There are several GUI bugs, especially when clicking items to add to or remove from playlists.
+- "Now Playing" doesn't automatically update.
+
+Please contact me at <script type="text/javascript">email_link();</script> if you find any other bugs not mentioned here, or if you have any other comments or suggestions.
+
+Download
+--------
+
+[Xbox Media Center iPhone Remote](http://tlrobinson.net/projects/xbmciphone/xbmciphone-0.1.zip) - version 0.1
+
+
+Screenshots
+-----------
+
+Please visit http://tlrobinson.net/projects/xbmciphone/ for screenshots.
+
+
+Version History
+---------------
+
+### Version 0.1 (7/27/2007) ###
+
+- Initial Release
+
+
+License
+-------
+
+Both XBMC iPhone Remote and the modified version of iUI included with it are released under the BSD license.
+\ No newline at end of file
diff --git a/web/xbmciphone/iphone/VERSION b/web/xbmciphone/iphone/VERSION
new file mode 100644
index 0000000000..51df45bcba
--- /dev/null
+++ b/web/xbmciphone/iphone/VERSION
@@ -0,0 +1 @@
+Version 0.1 (7/27/2007)
diff --git a/web/xbmciphone/iphone/css/iui-additions.css b/web/xbmciphone/iphone/css/iui-additions.css
new file mode 100644
index 0000000000..35c75f8bc4
--- /dev/null
+++ b/web/xbmciphone/iphone/css/iui-additions.css
@@ -0,0 +1,104 @@
+/*
+ * Copyright (c) 2007, Thomas Robinson
+ * 
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+ * Neither the name of the tlrobinson.net nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
+ * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+ * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ */
+
+body > ul > li.addSet > a {
+	padding-left: 40px;
+}
+
+body > ul > li.addSet > a:first-child {
+	padding-left: 0px;
+	position: absolute;
+	width: 23px;
+	height: 23px;
+	background-image: url(../images/addcontactpressed.png);
+	background-position: 6px center;
+    background-repeat: no-repeat;
+}
+
+body > ul > li.removeSet > a:first-child {
+	padding-left: 0px;
+	position: absolute;
+	width: 23px;
+	height: 23px;
+	background-image: url(../images/closebox1.png);
+	background-position: 6px 6px;
+    background-repeat: no-repeat;
+}
+body > ul > li.removeSet > a {
+	padding-left: 40px;
+}
+
+body > ul > li.playButton > a {
+	padding-right: 30px;
+}
+body > ul > li.playButton {
+	background: url(../images/QTPlayButton.png) no-repeat right center;
+}
+
+body > ul > li.playButton > a {
+    background: none;
+}
+
+body > ul > li.playButton > a[selected],
+body > ul > li.playButton > a:active {
+    background-color: #194fdb !important;
+    background-image: url(../iui/selection.png) !important;
+    background-repeat: repeat-x;
+    background-position: right center, left top;
+    color: #FFFFFF !important;
+}
+
+.panel {
+	text-align: center;
+}
+
+.panel > h3 {
+    margin: 0 0 8px 14px;
+    font-size: small;
+    font-weight: bold;
+    color: #4d4d70;
+    text-shadow: rgba(255, 255, 255, 0.75) 2px 2px 0;
+}
+
+.toolbar > h1.titleimg {
+    top: 6px;
+	overflow: visible;
+}
+
+.toolbar > h1 > a {
+	color: inherit;
+	text-decoration: inherit;
+}
+
+body > ul > li {
+    max-width: 320px;
+	text-overflow: ellipsis; 
+	overflow: hidden;
+}
+body[orient="landscape"] > ul > li {
+    max-width: 480px;
+}
+
+
+
diff --git a/web/xbmciphone/iphone/css/transport.css b/web/xbmciphone/iphone/css/transport.css
new file mode 100644
index 0000000000..072f3d6376
--- /dev/null
+++ b/web/xbmciphone/iphone/css/transport.css
@@ -0,0 +1,113 @@
+/*
+ * Copyright (c) 2007, Thomas Robinson
+ * 
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+ * Neither the name of the tlrobinson.net nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
+ * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+ * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ */
+
+* {
+	z-index: 1;
+}
+
+#bg {
+	position: absolute;
+	display: none;
+	top: 0px;
+	left: 0px;
+	width: 100%;
+	height: 268px;
+	z-index: 0;
+}
+#transport {
+	position: absolute;
+	top: 100px;
+	left: 83px;
+	width: 314px;
+	height: 93px;
+	background-image: url(../images/MovieTransportBackground.png);
+	z-index: -100;
+}
+#btn_play {
+	position: absolute;
+	top: 15px;
+	left: 142px;
+}
+#btn_next {
+	position: absolute;
+	top: 17px;
+	left: 230px;
+}
+#btn_prev {
+	position: absolute;
+	top: 17px;
+	left: 52px;
+}
+#volume_slider {
+	position: absolute;
+	top: 60px;
+	left: 15px;
+	
+	width: 284px;
+	height: 24px;
+}
+#blue_cap {
+	position: absolute;
+	top: 5px;
+	left: 5px;
+	
+	width: 5px;
+	height: 9px;
+	background-image: url(../images/VolumeBlueCap.png);
+}
+#white_cap {
+	position: absolute;
+	top: 5px;
+	right: 5px;
+	
+	width: 5px;
+	height: 9px;
+	background-image: url(../images/VolumeWhiteMusicCap.png);
+}
+#blue_fill {
+	position: absolute;
+	top: 5px;
+	left: 10px;
+	width: 50%;
+	height: 9px;
+	background-image: url(../images/VolumeBlueFill.png);
+}
+#white_fill {
+	position: absolute;
+	top: 5px;
+	right: 10px;
+	
+	width: 50%;
+	height: 9px;
+	background-image: url(../images/VolumeWhiteMusicFill.png);
+}
+#volume_knob {
+	position: absolute;
+	top: 0px;
+	left: 100px;
+	
+	width: 22px;
+	height: 24px;
+	background-image: url(../images/MusicVolumeKnob.png);
+}
+\ No newline at end of file
diff --git a/web/xbmciphone/iphone/images/MovieTransportBackground-long.png b/web/xbmciphone/iphone/images/MovieTransportBackground-long.png
new file mode 100644
index 0000000000..9ecb020201
--- /dev/null
+++ b/web/xbmciphone/iphone/images/MovieTransportBackground-long.png
diff --git a/web/xbmciphone/iphone/images/MovieTransportBackground.png b/web/xbmciphone/iphone/images/MovieTransportBackground.png
new file mode 100644
index 0000000000..53ccc91b37
--- /dev/null
+++ b/web/xbmciphone/iphone/images/MovieTransportBackground.png
diff --git a/web/xbmciphone/iphone/images/MusicVolumeKnob.png b/web/xbmciphone/iphone/images/MusicVolumeKnob.png
new file mode 100644
index 0000000000..c1da4dcab6
--- /dev/null
+++ b/web/xbmciphone/iphone/images/MusicVolumeKnob.png
diff --git a/web/xbmciphone/iphone/images/QTPlayButton.png b/web/xbmciphone/iphone/images/QTPlayButton.png
new file mode 100644
index 0000000000..59be7f992e
--- /dev/null
+++ b/web/xbmciphone/iphone/images/QTPlayButton.png
diff --git a/web/xbmciphone/iphone/images/VolumeBlueCap.png b/web/xbmciphone/iphone/images/VolumeBlueCap.png
new file mode 100644
index 0000000000..87e9daf6b2
--- /dev/null
+++ b/web/xbmciphone/iphone/images/VolumeBlueCap.png
diff --git a/web/xbmciphone/iphone/images/VolumeBlueFill.png b/web/xbmciphone/iphone/images/VolumeBlueFill.png
new file mode 100644
index 0000000000..5dfd9ff5fe
--- /dev/null
+++ b/web/xbmciphone/iphone/images/VolumeBlueFill.png
diff --git a/web/xbmciphone/iphone/images/VolumeWhiteMusicCap.png b/web/xbmciphone/iphone/images/VolumeWhiteMusicCap.png
new file mode 100644
index 0000000000..7dc5aa54aa
--- /dev/null
+++ b/web/xbmciphone/iphone/images/VolumeWhiteMusicCap.png
diff --git a/web/xbmciphone/iphone/images/VolumeWhiteMusicFill.png b/web/xbmciphone/iphone/images/VolumeWhiteMusicFill.png
new file mode 100644
index 0000000000..6bb224750e
--- /dev/null
+++ b/web/xbmciphone/iphone/images/VolumeWhiteMusicFill.png
diff --git a/web/xbmciphone/iphone/images/addcontact.png b/web/xbmciphone/iphone/images/addcontact.png
new file mode 100644
index 0000000000..e46d2acdc0
--- /dev/null
+++ b/web/xbmciphone/iphone/images/addcontact.png
diff --git a/web/xbmciphone/iphone/images/addcontactpressed.png b/web/xbmciphone/iphone/images/addcontactpressed.png
new file mode 100644
index 0000000000..8b98cbc9b1
--- /dev/null
+++ b/web/xbmciphone/iphone/images/addcontactpressed.png
diff --git a/web/xbmciphone/iphone/images/alternate_1_logo.png b/web/xbmciphone/iphone/images/alternate_1_logo.png
new file mode 100644
index 0000000000..0609121780
--- /dev/null
+++ b/web/xbmciphone/iphone/images/alternate_1_logo.png
diff --git a/web/xbmciphone/iphone/images/bg.png b/web/xbmciphone/iphone/images/bg.png
new file mode 100644
index 0000000000..bbd492c270
--- /dev/null
+++ b/web/xbmciphone/iphone/images/bg.png
diff --git a/web/xbmciphone/iphone/images/closebox1.png b/web/xbmciphone/iphone/images/closebox1.png
new file mode 100644
index 0000000000..13936e2563
--- /dev/null
+++ b/web/xbmciphone/iphone/images/closebox1.png
diff --git a/web/xbmciphone/iphone/images/nexttrack.png b/web/xbmciphone/iphone/images/nexttrack.png
new file mode 100644
index 0000000000..be2436a329
--- /dev/null
+++ b/web/xbmciphone/iphone/images/nexttrack.png
diff --git a/web/xbmciphone/iphone/images/noartplaceholder-videos.png b/web/xbmciphone/iphone/images/noartplaceholder-videos.png
new file mode 100644
index 0000000000..276a4ab98d
--- /dev/null
+++ b/web/xbmciphone/iphone/images/noartplaceholder-videos.png
diff --git a/web/xbmciphone/iphone/images/noartplaceholder.png b/web/xbmciphone/iphone/images/noartplaceholder.png
new file mode 100644
index 0000000000..1c5ccd915b
--- /dev/null
+++ b/web/xbmciphone/iphone/images/noartplaceholder.png
diff --git a/web/xbmciphone/iphone/images/pause.png b/web/xbmciphone/iphone/images/pause.png
new file mode 100644
index 0000000000..00ffe73f1f
--- /dev/null
+++ b/web/xbmciphone/iphone/images/pause.png
diff --git a/web/xbmciphone/iphone/images/play.png b/web/xbmciphone/iphone/images/play.png
new file mode 100644
index 0000000000..3395a62308
--- /dev/null
+++ b/web/xbmciphone/iphone/images/play.png
diff --git a/web/xbmciphone/iphone/images/prevtrack.png b/web/xbmciphone/iphone/images/prevtrack.png
new file mode 100644
index 0000000000..077e78fa15
--- /dev/null
+++ b/web/xbmciphone/iphone/images/prevtrack.png
diff --git a/web/xbmciphone/iphone/images/xbmc.png b/web/xbmciphone/iphone/images/xbmc.png
new file mode 100644
index 0000000000..e3bff49818
--- /dev/null
+++ b/web/xbmciphone/iphone/images/xbmc.png
diff --git a/web/xbmciphone/iphone/index.html b/web/xbmciphone/iphone/index.html
new file mode 100644
index 0000000000..1d212df27f
--- /dev/null
+++ b/web/xbmciphone/iphone/index.html
@@ -0,0 +1,97 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+	<title>Xbox Media Center</title>
+	<meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
+	
+	<style type="text/css" media="screen">@import "iui/iui.css";</style>
+	<style type="text/css" media="screen">@import "css/iui-additions.css";</style>
+	<style type="text/css" media="screen">@import "css/transport.css";</style>
+	<script type="application/x-javascript" src="iui/iui.js"></script>
+	<script type="application/x-javascript" src="js/xbmc.js"></script>
+	<script type="application/x-javascript" src="js/xbmc-iui.js"></script>
+	<script type="application/x-javascript" src="js/transport.js"></script>
+	
+</head>
+<body>
+    <div class="toolbar">
+        <h1 id="pageTitle"></h1>
+        <a id="backButton" class="button" href="#"></a>
+        <a class="button" href="#xbmc-nowplaying">Now Playing</a>
+    </div>
+    
+    <ul id="home" title="XBMC" selected="true" hideBackButton="true">
+        <li class="group">Media</li>
+        <li><a href="#xbmc-list;Music">Music</a></li>
+        <li><a href="#xbmc-list;Video">Video</a></li>
+        <li><a href="#xbmc-list;Pictures">Pictures</a></li>
+        <li><a href="#xbmc-list;Files">Files</a></li>
+	    <li class="group">Playlists</li>
+        <li><a href="#xbmc-playlist;Music">Music Playlist</a></li>
+        <li><a href="#xbmc-playlist;Video">Video Playlist</a></li>
+        <li><a href="#xbmc-playlist;Slideshow">Slideshow Playlist</a></li>
+	    <li class="group">Misc</li>
+		<li><a href="#xbmc-scripts;">Scripts</a></li>
+        <li><a href="#settings">Settings</a></li>
+        <li><a href="#about">About</a></li>
+    </ul>
+
+    <ul id="about" title="About">
+	    <li><a href="http://tlrobinson.net/projects/xbmciphone/" target="_self">Project Page</a></li>
+		<li><a href="http://www.xboxmediacenter.com/" target="_self">Xbox Media Center Website</a></li>
+		<li><a href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Credits)')">View XBMC Credits on TV</a></li>
+		<img src="images/alternate_1_logo.png" style="padding-left: 50px; padding-top: 20px"/>
+	</ul>
+
+    <div id="settings" title="Settings" class="panel">
+        <!--<h2>Playback</h2>
+        <fieldset>
+            <div class="row">
+                <label>Repeat</label>
+                <div class="toggle" onclick=""><span class="thumb"></span><span class="toggleOn">ON</span><span class="toggleOff">OFF</span></div>
+            </div>
+            <div class="row">
+                <label>Shuffle</label>
+                <div class="toggle" onclick="" toggled="true"><span class="thumb"></span><span class="toggleOn">ON</span><span class="toggleOff">OFF</span></div>
+            </div>
+        </fieldset>-->
+
+		<h2>Commands</h2>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Mute)')">Mute</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.EjectTray)')">Eject</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Dashboard)')">Dashboard</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Restart)')">Restart</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.ShutDown)')">ShutDown</a>
+		<!--
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Reboot)')">Reboot</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Credits)')">Credits</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.Reset)')">Reset</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(XBMC.RestartApp)')">XBMC.RestartApp</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(System.LogOff)')">System.LogOff</a>
+		<a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('ExecBuiltIn(Notification(WARNING,SHUTTING%20DOWN%20SYSTEM!))')">Notify</a>
+        <a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('Exit'); return false;">Exit</a>
+        <a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('Reset'); return false;">Reset</a>
+        <a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('Restart'); return false;">Restart</a>
+        <a class="whiteButton" type="submit" href="#" onclick="xbmcHttpSimple('Shutdown'); return false;">Shutdown</a>-->
+		
+    </div>
+
+	<div id="transportbg">
+		<div id="transport">
+			<img id="btn_play" src="images/play.png">
+			<img id="btn_next" src="images/nexttrack.png">
+			<img id="btn_prev" src="images/prevtrack.png">
+			<div id="volume_slider">
+				<div id="blue_cap">&nbsp;</div>
+				<div id="white_cap">&nbsp;</div>
+				<div id="blue_fill">&nbsp;</div>
+				<div id="white_fill">&nbsp;</div>
+				<div id="volume_knob">&nbsp;</div>
+			</div>
+		</div>
+	</div>
+
+</body>
+</html>
diff --git a/web/xbmciphone/iphone/iui/backButton.png b/web/xbmciphone/iphone/iui/backButton.png
new file mode 100644
index 0000000000..e27ea8cdf9
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/backButton.png
diff --git a/web/xbmciphone/iphone/iui/blueButton.png b/web/xbmciphone/iphone/iui/blueButton.png
new file mode 100644
index 0000000000..0f92dfd945
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/blueButton.png
diff --git a/web/xbmciphone/iphone/iui/cancel.png b/web/xbmciphone/iphone/iui/cancel.png
new file mode 100644
index 0000000000..5f6dcc87d7
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/cancel.png
diff --git a/web/xbmciphone/iphone/iui/grayButton.png b/web/xbmciphone/iphone/iui/grayButton.png
new file mode 100644
index 0000000000..0ce6a30d4b
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/grayButton.png
diff --git a/web/xbmciphone/iphone/iui/iui.css b/web/xbmciphone/iphone/iui/iui.css
new file mode 100644
index 0000000000..e7420d396c
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/iui.css
@@ -0,0 +1,366 @@
+
+body {
+    margin: 0;
+    font-family: Helvetica;
+    background: #FFFFFF;
+    color: #000000;
+    overflow-x: hidden;
+    -webkit-user-select: none;
+    -webkit-text-size-adjust: none;
+}
+
+body > *:not(.toolbar) {
+    display: none;
+    position: absolute;
+    margin: 0;
+    padding: 0;
+    left: 0;
+    top: 45px;
+    width: 100%;
+    min-height: 372px;
+}
+
+body[orient="landscape"] > *:not(.toolbar) {
+    min-height: 268px;
+}
+
+body > *[selected="true"] {
+    display: block;
+}
+
+a[selected], a:active {
+    background-color: #194fdb !important;
+    background-image: url(listArrowSel.png), url(selection.png) !important;
+    background-repeat: no-repeat, repeat-x;
+    background-position: right center, left top;
+    color: #FFFFFF !important;
+}
+
+a[selected="progress"] {
+    background-image: url(loading.gif), url(selection.png) !important;
+}
+
+/************************************************************************************************/
+
+body > .toolbar {
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    border-bottom: 1px solid #2d3642;
+    border-top: 1px solid #6d84a2;
+    padding: 10px;
+    height: 45px;
+    background: url(toolbar.png) #6d84a2 repeat-x;
+}
+
+.toolbar > h1 {
+    position: absolute;
+    overflow: hidden;
+    left: 50%;
+    margin: 1px 0 0 -75px;
+    height: 45px;
+    font-size: 20px;
+    width: 150px;
+    font-weight: bold;
+    text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0;
+    text-align: center;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    color: #FFFFFF;
+}
+
+body[orient="landscape"] > .toolbar > h1 {
+    margin-left: -125px;
+    width: 250px;
+}
+
+.button {
+    position: absolute;
+    overflow: hidden;
+    top: 8px;
+    right: 6px;
+    margin: 0;
+    border-width: 0 5px;
+    padding: 0 3px;
+    width: auto;
+    height: 30px;
+    line-height: 30px;
+    font-family: inherit;
+    font-size: 12px;
+    font-weight: bold;
+    color: #FFFFFF;
+    text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
+    text-overflow: ellipsis;
+    text-decoration: none;
+    white-space: nowrap;
+    background: none;
+    -webkit-border-image: url(toolButton.png) 0 5 0 5;
+}
+
+.blueButton {
+    -webkit-border-image: url(blueButton.png) 0 5 0 5;
+    border-width: 0 5px;
+}
+
+.leftButton {
+    left: 6px;
+    right: auto;
+}
+
+#backButton {
+    display: none;
+    left: 6px;
+    right: auto;
+    padding: 0;
+    max-width: 55px;
+    border-width: 0 8px 0 14px;
+    -webkit-border-image: url(backButton.png) 0 8 0 14;
+}
+
+.whiteButton,
+.grayButton {
+    display: block;
+    border-width: 0 12px;
+    padding: 10px;
+    text-align: center;
+    font-size: 20px;
+    font-weight: bold;
+    text-decoration: inherit;
+    color: inherit;
+}
+
+.whiteButton {
+    -webkit-border-image: url(whiteButton.png) 0 12 0 12;
+    text-shadow: rgba(255, 255, 255, 0.7) 0 1px 0;
+}
+
+.grayButton {
+    -webkit-border-image: url(grayButton.png) 0 12 0 12;
+    color: #FFFFFF;
+}
+
+/************************************************************************************************/
+
+body > ul > li {
+    position: relative;
+    margin: 0;
+    border-bottom: 1px solid #E0E0E0;
+    padding: 8px 0 8px 10px;
+    font-size: 20px;
+    font-weight: bold;
+    list-style: none;
+}
+
+body > ul > li.group {
+    position: relative;
+    top: -1px;
+    margin-bottom: -2px;
+    border-top: 1px solid #7d7d7d;
+    border-bottom: 1px solid #999999;
+    padding: 1px 10px;
+    background: url(listGroup.png) repeat-x;
+    font-size: 17px;
+    font-weight: bold;
+    text-shadow: rgba(0, 0, 0, 0.4) 0 1px 0;
+    color: #FFFFFF;
+}
+
+body > ul > li.group:first-child {
+    top: 0;
+    border-top: none;
+}
+
+body > ul > li > a {
+    display: block;
+    margin: -8px 0 -8px -10px;
+    padding: 8px 32px 8px 10px;
+    text-decoration: none;
+    color: inherit;
+    background: url(listArrow.png) no-repeat right center;
+}
+
+a[target="_replace"] {
+    box-sizing: border-box;
+    padding-top: 25px;
+    padding-bottom: 25px;
+    font-size: 18px;
+    color: cornflowerblue;
+    background-color: #FFFFFF;
+    background-image: none;
+}
+
+/************************************************************************************************/
+    
+body > .dialog {
+    top: 0;
+    width: 100%;
+    min-height: 417px;
+    z-index: 2;
+    background: rgba(0, 0, 0, 0.8);
+    padding: 0;
+    text-align: right;
+}
+
+.dialog > fieldset {
+    box-sizing: border-box;
+    width: 100%;
+    margin: 0;
+    border: none;
+    border-top: 1px solid #6d84a2;
+    padding: 10px 6px;
+    background: url(toolbar.png) #7388a5 repeat-x;
+}
+
+.dialog > fieldset > h1 {
+    margin: 0 10px 0 10px;
+    padding: 0;
+    font-size: 20px;
+    font-weight: bold;
+    color: #FFFFFF;
+    text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0;
+    text-align: center;
+}
+
+.dialog > fieldset > label {
+    position: absolute;
+    margin: 16px 0 0 6px;
+    font-size: 14px;
+    color: #999999;
+}
+
+input {
+    box-sizing: border-box;
+    width: 100%;
+    margin: 8px 0 0 0;
+    padding: 6px 6px 6px 44px;
+    font-size: 16px;
+    font-weight: normal;
+}
+
+/************************************************************************************************/
+
+body > .panel {
+    box-sizing: border-box;
+    padding: 10px;
+    background: #c8c8c8 url(pinstripes.png);
+}
+
+.panel > fieldset {
+    position: relative;
+    margin: 0 0 20px 0;
+    padding: 0;
+    background: #FFFFFF;
+    -webkit-border-radius: 10px;
+    border: 1px solid #999999;
+    text-align: right;
+    font-size: 16px;
+}
+
+.row  {
+    position: relative;
+    min-height: 42px;
+    border-bottom: 1px solid #999999;
+    -webkit-border-radius: 0;
+    text-align: right;
+}
+
+fieldset > .row:last-child {
+    border-bottom: none !important;
+}
+
+.row > input {
+    box-sizing: border-box;
+    margin: 0;
+    border: none;
+    padding: 12px 10px 0 110px;
+    height: 42px;
+    background: none;
+}
+
+.row > label {
+    position: absolute;
+    margin: 0 0 0 14px;
+    line-height: 42px;
+    font-weight: bold;
+}
+
+.row > .toggle {
+    position: absolute;
+    top: 6px;
+    right: 6px;
+    width: 100px;
+    height: 28px;
+}
+
+.toggle {
+    border: 1px solid #888888;
+    -webkit-border-radius: 6px;
+    background: #FFFFFF url(toggle.png) repeat-x;
+    font-size: 19px;
+    font-weight: bold;
+    line-height: 30px;
+}
+
+.toggle[toggled="true"] {
+    border: 1px solid #143fae;
+    background: #194fdb url(toggleOn.png) repeat-x;
+}
+
+.toggleOn {
+    display: none;
+    position: absolute;
+    width: 60px;
+    text-align: center;
+    left: 0;
+    top: 0;
+    color: #FFFFFF;
+    text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0;
+}
+
+.toggleOff {
+    position: absolute;
+    width: 60px;
+    text-align: center;
+    right: 0;
+    top: 0;
+    color: #666666;
+}
+
+.toggle[toggled="true"] > .toggleOn {
+    display: block;
+}
+
+.toggle[toggled="true"] > .toggleOff {
+    display: none;
+}
+
+.thumb {
+    position: absolute;
+    top: -1px;
+    left: -1px;
+    width: 40px;
+    height: 28px;    
+    border: 1px solid #888888;
+    -webkit-border-radius: 6px;
+    background: #ffffff url(thumb.png) repeat-x;
+}
+
+.toggle[toggled="true"] > .thumb {
+    left: auto;
+    right: -1px;
+}
+
+.panel > h2 {
+    margin: 0 0 8px 14px;
+    font-size: inherit;
+    font-weight: bold;
+    color: #4d4d70;
+    text-shadow: rgba(255, 255, 255, 0.75) 2px 2px 0;
+}
+
+/************************************************************************************************/
+
+#preloader {
+    display: none;
+    background-image: url(loading.gif), url(selection.png),
+        url(blueButton.png), url(listArrowSel.png), url(listGroup.png);
+}
diff --git a/web/xbmciphone/iphone/iui/iui.js b/web/xbmciphone/iphone/iui/iui.js
new file mode 100644
index 0000000000..d0c7629cd9
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/iui.js
@@ -0,0 +1,408 @@
+
+(function() {
+
+var slideSpeed = 20;
+var slideInterval = 0;
+
+var currentPage = null;
+var currentDialog = null;
+var currentWidth = 0;
+var currentHash = location.hash;
+var hashPrefix = "#_";
+var pageHistory = [];
+var newPageCount = 0;
+var checkTimer;
+
+// *************************************************************************************************
+
+window.iui =
+{
+    showPage: function(page, backwards)
+    {
+        if (page)
+        {
+            if (currentDialog)
+            {
+                currentDialog.removeAttribute("selected");
+                currentDialog = null;
+            }
+
+            if (hasClass(page, "dialog"))
+                showDialog(page);
+            else if (currentPage != page) // TLROBINSON: don't redisplay an already shown page
+            {
+                var fromPage = currentPage;
+                currentPage = page;
+
+                if (fromPage)
+                    setTimeout(slidePages, 0, fromPage, page, backwards);
+                else
+                    updatePage(page, fromPage);
+            }
+        }
+    },
+
+    showPageById: function(pageId)
+    {
+        var page = $(pageId);
+        if (page)
+        {
+            var index = pageHistory.indexOf(pageId);
+            var backwards = index != -1;
+            if (backwards)
+                pageHistory.splice(index, pageHistory.length);
+
+            iui.showPage(page, backwards);
+        }
+    },
+
+    showPageByHref: function(href, args, method, replace, cb)
+    {
+        var req = new XMLHttpRequest();
+        req.onerror = function()
+        {
+            if (cb)
+                cb(false);
+        };
+        
+        req.onreadystatechange = function()
+        {
+            if (req.readyState == 4)
+            {
+                if (replace)
+                    replaceElementWithSource(replace, req.responseText);
+                else
+                {
+                    var frag = document.createElement("div");
+                    frag.innerHTML = req.responseText;
+                    iui.insertPages(frag.childNodes);
+                }
+                if (cb)
+                    setTimeout(cb, 1000, true);
+            }
+        };
+
+        if (args)
+        {
+            req.open(method || "GET", href, true);
+            req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+            req.setRequestHeader("Content-Length", args.length);
+            req.send(args.join("&"));
+        }
+        else
+        {
+            req.open(method || "GET", href, true);
+            req.send(null);
+        }
+    },
+    
+    insertPages: function(nodes)
+    {
+        var targetPage;
+        for (var i = 0; i < nodes.length; ++i)
+        {
+            var child = nodes[i];
+            if (child.nodeType == 1)
+            {
+                if (!child.id)
+                    child.id = "__" + (++newPageCount) + "__";
+
+                var clone = $(child.id);
+                if (clone)
+                    clone.parentNode.replaceChild(child, clone);
+                else
+                    document.body.appendChild(child);
+
+                if (child.getAttribute("selected") == "true" || !targetPage)
+                    targetPage = child;
+                
+                --i;
+            }
+        }
+
+        if (targetPage)
+            iui.showPage(targetPage);    
+    },
+
+	// TLROBINSON: For inserting a single page.
+	insertPage: function(node)
+	{
+		if (!node.id)
+		    node.id = "__" + (++newPageCount) + "__";
+		
+		var clone = $(node.id);
+		if (clone)
+		    clone.parentNode.replaceChild(node, clone);
+		else
+		    document.body.appendChild(node);
+		
+		iui.showPage(node);
+	},
+
+    getSelectedPage: function()
+    {
+        for (var child = document.body.firstChild; child; child = child.nextSibling)
+        {
+            if (child.nodeType == 1 && child.getAttribute("selected") == "true")
+                return child;
+        }    
+    }    
+};
+
+// *************************************************************************************************
+
+addEventListener("load", function(event)
+{
+    var page = iui.getSelectedPage();
+    if (page)
+        iui.showPage(page);
+
+    setTimeout(preloadImages, 0);
+    setTimeout(checkOrientAndLocation, 0);
+    checkTimer = setInterval(checkOrientAndLocation, 300);
+}, false);
+    
+addEventListener("click", function(event)
+{
+    var link = findParent(event.target, "a");
+    if (link)
+    {
+        function unselect() { link.removeAttribute("selected"); }
+        
+        if (link.href && link.hash && link.hash != "#")
+        {
+            link.setAttribute("selected", "true");
+			// TLROBINSON:
+			var page = $(link.hash.substr(1));
+			if (link.hash.substring(0,5) == "#xbmc") // special XBMC links
+				executeXbmcCommand(link.hash);
+			else if (page)
+				iui.showPage(page, (page.id=="home"?true:false)); // always slide back if we're going to the home page
+			else
+				alert("***DEBUG*** Page doesn't exist");
+            setTimeout(unselect, 500);
+        }
+        else if (link == $("backButton"))
+            history.back();
+        else if (link.getAttribute("type") == "submit")
+            submitForm(findParent(link, "form"));
+        else if (link.getAttribute("type") == "cancel")
+            cancelDialog(findParent(link, "form"));
+        else if (link.target == "_replace")
+        {
+            link.setAttribute("selected", "progress");
+            iui.showPageByHref(link.href, null, null, link, unselect);
+        }
+        else if (!link.target)
+        {
+            link.setAttribute("selected", "progress");
+            iui.showPageByHref(link.href, null, null, null, unselect);
+        }
+        else
+            return;
+        
+        event.preventDefault();        
+    }
+}, true);
+
+addEventListener("click", function(event)
+{
+    var div = findParent(event.target, "div");
+    if (div && hasClass(div, "toggle"))
+    {
+        div.setAttribute("toggled", div.getAttribute("toggled") != "true");
+        event.preventDefault();        
+    }
+}, true);
+
+function checkOrientAndLocation()
+{
+    if (window.innerWidth != currentWidth)
+    {   
+        currentWidth = window.innerWidth;
+        var orient = currentWidth != 480 ? "profile" : "landscape"; // TLROBINSON: 
+		$("transportbg").style.display = (orient=="landscape")?"block":"none"; // TLROBINSON: show/hide transport
+        document.body.setAttribute("orient", orient);
+        setTimeout(scrollTo, 100, 0, 1);
+    }
+
+    if (location.hash != currentHash)
+    {
+        var pageId = location.hash.substr(hashPrefix.length)
+        iui.showPageById(pageId);
+    }
+}
+
+function showDialog(page)
+{
+    currentDialog = page;
+    page.setAttribute("selected", "true");
+    
+    if (hasClass(page, "dialog") && !page.target)
+        showForm(page);
+}
+
+function showForm(form)
+{
+    form.onsubmit = function(event)
+    {
+        event.preventDefault();
+        submitForm(form);
+    };
+    
+    form.onclick = function(event)
+    {
+        if (event.target == form && hasClass(form, "dialog"))
+            cancelDialog(form);
+    };
+}
+
+function cancelDialog(form)
+{
+    form.removeAttribute("selected");
+}
+
+function updatePage(page, fromPage)
+{
+    if (!page.id)
+        page.id = "__" + (++newPageCount) + "__";
+
+    location.href = currentHash = hashPrefix + page.id;
+    pageHistory.push(page.id);
+
+    var pageTitle = $("pageTitle");
+    if (page.title) {
+		if (page.title == "XBMC") { // TLROBINSON: special case for logo
+			pageTitle.innerHTML = "<img src=\"images/xbmc.png\" />";
+			pageTitle.className = "titleimg";
+		} else {
+	        pageTitle.innerHTML =  "<a href=\"#home\">"+page.title+"</a>";
+			pageTitle.className = "";
+		}
+	}
+	
+    if (page.localName.toLowerCase() == "form" && !page.target)
+        showForm(page);
+        
+    var backButton = $("backButton");
+    if (backButton)
+    {
+        var prevPage = $(pageHistory[pageHistory.length-2]);
+        if (prevPage && !page.getAttribute("hideBackButton"))
+        {
+            backButton.style.display = "inline";
+            backButton.innerHTML = prevPage.title ? prevPage.title : "Back";
+        }
+        else
+            backButton.style.display = "none";
+    }    
+}
+
+function slidePages(fromPage, toPage, backwards)
+{        
+    var axis = (backwards ? fromPage : toPage).getAttribute("axis");
+    if (axis == "y")
+        (backwards ? fromPage : toPage).style.top = "100%";
+    else
+        toPage.style.left = "100%";
+
+    toPage.setAttribute("selected", "true");
+    scrollTo(0, 1);
+    clearInterval(checkTimer);
+    
+    var percent = 100;
+    slide();
+    var timer = setInterval(slide, slideInterval);
+
+    function slide()
+    {
+        percent -= slideSpeed;
+        if (percent <= 0)
+        {
+            percent = 0;
+            if (!hasClass(toPage, "dialog"))
+                fromPage.removeAttribute("selected");
+            clearInterval(timer);
+            checkTimer = setInterval(checkOrientAndLocation, 300);
+            setTimeout(updatePage, 0, toPage, fromPage);
+        }
+    
+        if (axis == "y")
+        {
+            backwards
+                ? fromPage.style.top = (100-percent) + "%"
+                : toPage.style.top = percent + "%";
+        }
+        else
+        {
+            fromPage.style.left = (backwards ? (100-percent) : (percent-100)) + "%"; 
+            toPage.style.left = (backwards ? -percent : percent) + "%"; 
+        }
+    }
+}
+
+function preloadImages()
+{
+    var preloader = document.createElement("div");
+    preloader.id = "preloader";
+    document.body.appendChild(preloader);
+}
+
+function submitForm(form)
+{
+    iui.showPageByHref(form.action || "POST", encodeForm(form), form.method);
+}
+
+function encodeForm(form)
+{
+    function encode(inputs)
+    {
+        for (var i = 0; i < inputs.length; ++i)
+        {
+            if (inputs[i].name)
+                args.push(inputs[i].name + "=" + escape(inputs[i].value));
+        }
+    }
+
+    var args = [];
+    encode(form.getElementsByTagName("input"));
+    encode(form.getElementsByTagName("select"));
+    return args;    
+}
+
+function findParent(node, localName)
+{
+    while (node && (node.nodeType != 1 || node.localName.toLowerCase() != localName))
+        node = node.parentNode;
+    return node;
+}
+
+function hasClass(self, name)
+{
+    var re = new RegExp("(^|\\s)"+name+"($|\\s)");
+    return re.exec(self.getAttribute("class")) != null;
+}
+
+function replaceElementWithSource(replace, source)
+{
+    var page = replace.parentNode;
+    var parent = replace;
+    while (page.parentNode != document.body)
+    {
+        page = page.parentNode;
+        parent = parent.parentNode;
+    }
+
+    var frag = document.createElement(parent.localName);
+    frag.innerHTML = source;
+
+    page.removeChild(parent);
+
+    while (frag.firstChild)
+        page.appendChild(frag.firstChild);
+}
+
+function $(id) { return document.getElementById(id); }
+function ddd() { console.log.apply(console, arguments); }
+
+})();
diff --git a/web/xbmciphone/iphone/iui/listArrow.png b/web/xbmciphone/iphone/iui/listArrow.png
new file mode 100644
index 0000000000..6421a16762
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/listArrow.png
diff --git a/web/xbmciphone/iphone/iui/listArrowSel.png b/web/xbmciphone/iphone/iui/listArrowSel.png
new file mode 100644
index 0000000000..86832ebc7b
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/listArrowSel.png
diff --git a/web/xbmciphone/iphone/iui/listGroup.png b/web/xbmciphone/iphone/iui/listGroup.png
new file mode 100644
index 0000000000..221553ae9a
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/listGroup.png
diff --git a/web/xbmciphone/iphone/iui/loading.gif b/web/xbmciphone/iphone/iui/loading.gif
new file mode 100644
index 0000000000..8522ddf1a6
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/loading.gif
diff --git a/web/xbmciphone/iphone/iui/pinstripes.png b/web/xbmciphone/iphone/iui/pinstripes.png
new file mode 100644
index 0000000000..c99777512f
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/pinstripes.png
diff --git a/web/xbmciphone/iphone/iui/selection.png b/web/xbmciphone/iphone/iui/selection.png
new file mode 100644
index 0000000000..537e3f0b13
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/selection.png
diff --git a/web/xbmciphone/iphone/iui/thumb.png b/web/xbmciphone/iphone/iui/thumb.png
new file mode 100644
index 0000000000..cefa8fc5e9
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/thumb.png
diff --git a/web/xbmciphone/iphone/iui/toggle.png b/web/xbmciphone/iphone/iui/toggle.png
new file mode 100644
index 0000000000..3b62ebf26e
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/toggle.png
diff --git a/web/xbmciphone/iphone/iui/toggleOn.png b/web/xbmciphone/iphone/iui/toggleOn.png
new file mode 100644
index 0000000000..b016814dee
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/toggleOn.png
diff --git a/web/xbmciphone/iphone/iui/toolButton.png b/web/xbmciphone/iphone/iui/toolButton.png
new file mode 100644
index 0000000000..afe4d7a3ee
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/toolButton.png
diff --git a/web/xbmciphone/iphone/iui/toolbar.png b/web/xbmciphone/iphone/iui/toolbar.png
new file mode 100644
index 0000000000..3dde94c07e
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/toolbar.png
diff --git a/web/xbmciphone/iphone/iui/whiteButton.png b/web/xbmciphone/iphone/iui/whiteButton.png
new file mode 100644
index 0000000000..5514b27005
--- /dev/null
+++ b/web/xbmciphone/iphone/iui/whiteButton.png
diff --git a/web/xbmciphone/iphone/js/transport.js b/web/xbmciphone/iphone/js/transport.js
new file mode 100644
index 0000000000..a8b45e5047
--- /dev/null
+++ b/web/xbmciphone/iphone/js/transport.js
@@ -0,0 +1,101 @@
+/*
+ * Copyright (c) 2007, Thomas Robinson
+ * 
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+ * Neither the name of the tlrobinson.net nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
+ * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+ * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ */
+addEventListener("load", initTransport, false);
+
+function $(id) { return document.getElementById(id); }
+
+var current_pct = 0.0;
+
+var transportbg, volume_slider, volume_knob, blue_fill, white_fill;
+
+function initTransport() {
+	volume_slider	= $("volume_slider");
+	volume_knob		= $("volume_knob");
+	white_fill		= $("white_fill");
+	blue_fill		= $("blue_fill");
+	transportbg		= $("transportbg");
+	
+	$("volume_slider").addEventListener("click", function(e) {
+		xbmcHttpSimple("SetVolume("+Math.round(clientXToPct(e.clientX)*100)+")", updateTransportControls);
+	}, false);
+	$("btn_play").addEventListener("click", function(e) {
+		xbmcForm("pause", updateTransportControls);
+	}, false);
+	$("btn_next").addEventListener("click", function(e) {
+		xbmcForm("next", updateTransportControls);
+	}, false);
+	$("btn_prev").addEventListener("click", function(e) {
+		xbmcForm("previous", updateTransportControls);
+	}, false);
+	
+	setTimeout(updateTransportControls, 0);
+	setInterval(updateTransportControls, 2000);
+}
+
+function updateTransportControls() {
+	xbmcHttpSimple("GetVolume", function(req) {
+		updateSlider(parseFloat(req.responseText)/100.0);
+	});
+	xbmcHttpSimple("GetCurrentlyPlaying", function(req) {
+		var playing = false;
+		if (req.responseText.substring(0, 26) == "Filename:[Nothing Playing]") {
+			//alert("stopped");
+		} else if (req.responseText.indexOf("PlayStatus:Playing") > 0) {
+			//alert("playing");
+			playing = true;
+		} else if (req.responseText.indexOf("PlayStatus:Paused") > 0) {
+			//alert("paused");
+		} else {
+			//alert("unknown");
+		}
+		updatePlayButton(playing);
+	});
+}
+
+function updatePlayButton(playing) {
+	$("btn_play").src = (playing)?"images/pause.png":"images/play.png";
+}
+
+function clientXToPct(x) {
+	var transport = document.getElementById("transport");
+	
+	var bg_left = document.defaultView.getComputedStyle(transportbg, null).getPropertyValue("left");
+	var transport_left = document.defaultView.getComputedStyle(transport, null).getPropertyValue("left");
+	var volume_slider_left = document.defaultView.getComputedStyle(volume_slider, null).getPropertyValue("left");
+	var volume_slider_width = document.defaultView.getComputedStyle(volume_slider, null).getPropertyValue("width");
+	
+	var pix = x - parseInt(volume_slider_left) - parseInt(transport_left) - parseInt(bg_left);
+	if (pix < 0) pix = 0;
+	return pix/parseFloat(volume_slider_width);
+}
+
+function updateSlider(pct) {
+	var left = Math.round(264.0*pct);
+	var right = 264 - left;
+	
+	white_fill.style.width = right + "px";
+	blue_fill.style.width = left + "px";
+	
+	volume_knob.style.left = (10+left-11) + "px";
+}
diff --git a/web/xbmciphone/iphone/js/xbmc-iui.js b/web/xbmciphone/iphone/js/xbmc-iui.js
new file mode 100644
index 0000000000..a858e77522
--- /dev/null
+++ b/web/xbmciphone/iphone/js/xbmc-iui.js
@@ -0,0 +1,393 @@
+/*
+ * Copyright (c) 2007, Thomas Robinson
+ * 
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+ * Neither the name of the tlrobinson.net nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
+ * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+ * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ */
+
+function executeXbmcCommand(pageId)
+{
+	var pageName = decodeURIComponent(pageId.substr(6));
+	
+	var args = pageName.split(";");
+	switch(args[0]) {
+		case "list": 			xbmcListing(args, pageName); break;
+		case "playlist": 		xbmcPlaylist(args); break;
+		case "play": 			xbmcPlay(args); break;
+		case "playlistplay":	xbmcPlaylistPlay(args); break;
+		case "add": 			xbmcAddToPlaylist(args); break;
+		case "remove": 			xbmcRemoveFromPlaylist(args); break;break;
+		case "clear": 			xbmcClearPlaylist(args); break;
+		case "nowplaying": 		xbmcNowPlaying(); break;
+		case "scripts": 		xbmcScripts(); break;
+		case "runscript": 		xbmcRunScript(args); break;
+		default: alert("***DEBUG***: unknown command");
+	}
+}
+
+function xbmcScripts() {
+	xbmcHttpSimple("GetMediaLocation(files;q:\\Scripts)", function(req) {
+		var newPage = document.createElement("ul");
+		newPage.setAttribute("id", "xbmc-nowplaying");
+		newPage.setAttribute("title", "Scripts");
+		
+		var lines = req.responseText.split("\n");
+		for (var i = 0; i < lines.length; i++) {
+			var fields = lines[i].split(";");
+			if (lines[i] != "" && fields.length == 3) {
+				var listItem = document.createElement("li");
+				var pageLink = document.createElement("a");
+				var scriptPath = (fields[2] == "1") ? fields[1]+"default.py" : fields[1];
+				pageLink.setAttribute("href", "#xbmc-runscript;" + scriptPath);
+				pageLink.appendChild(document.createTextNode(fields[0]));
+				listItem.appendChild(pageLink);
+				newPage.appendChild(listItem);
+			}
+		}
+		iui.insertPage(newPage);
+	});
+}
+
+function xbmcRunScript(args) { xbmcHttpSimple("ExecBuiltIn(RunScript("+args[1]+"))", null); }
+
+function xbmcClearPlaylist(args) {
+	switch(args[1]) {
+		case "Music": 		command = "ClearPlayList(0)"; break;
+		case "Video":		command = "ClearPlayList(1)"; break;
+		case "Slideshow":  	command = "ClearSlideshow"; break;
+		default: alert("***DEBUG***: unknown playlist: " + args[1]); return;
+	}
+	xbmcHttpSimple(command, function(req) {
+		if (req.responseText.substring(0, 2) == "OK")
+			xbmcPlaylist(args);
+		else
+			alert("***DEBUG***: " + req.responseText);
+	});
+}
+
+function xbmcPlay(args) {
+	xbmcHttpSimple("PlayFile("+args[1]+")", function(req) {
+		if (req.responseText.substring(0, 2) == "OK")
+			xbmcNowPlaying();
+		else
+			alert("***DEBUG***: " + req.responseText);
+	});
+}
+
+function xbmcPlaylistPlay(args) {
+	var command1, command2;
+	switch (args[1]) {
+		case "Music":
+			command1 = "SetCurrentPlaylist(0)";
+			command2 = "SetPlaylistSong("+((args.length>2)?args[2]:0)+")";
+			break;
+		case "Video":
+			command1 = "SetCurrentPlaylist(1)";
+			command2 = "SetPlaylistSong("+((args.length>2)?args[2]:0)+")";
+			break;
+		case "Slideshow":
+			command1 = "SlideshowSelect("+args[2]+")";
+			command2 = "PlaySlideshow";
+			break;
+		default:
+			alert("***DEBUG***: unknown playlist: " + args[1]);
+	}
+	
+	xbmcHttpSimple(command1, function(req1) {
+		if (req1.responseText.substring(0, 2) != "OK")
+			alert("***DEBUG***: " + req1.responseText);
+		else {
+			if (command2 != "") {
+				xbmcHttpSimple(command2, function(req2) {
+					if (req2.responseText.substring(0, 2) != "OK")
+						alert("***DEBUG***: " + req2.responseText);
+					else
+						xbmcNowPlaying();
+				});
+			} else
+				xbmcNowPlaying();
+		}
+	});
+}
+
+function xbmcAddToPlaylist(args) {
+	var command;
+	switch (args[1]) {
+		case "Music":    command = "AddToPlayList(" +args[2]+";0)"; break;
+		case "Video":    command = "AddToPlayList(" +args[2]+";1)"; break;
+		case "Pictures": command = "AddToSlideshow("+args[2]+")"; break;
+		default:         command = "AddToPlayList(" +args[2]+")"; break;
+	}
+	xbmcHttpSimple(command, function(req) {
+		if (req.responseText.substring(0, 2) != "OK")
+			alert("***DEBUG***: " + req.responseText); //debug
+		else {
+		}
+	});
+}
+
+function xbmcRemoveFromPlaylist(args) {
+	var command;
+	switch (args[2]) {
+		case "Music":    command = "RemoveFromPlaylist("+args[1]+";0)"; break;
+		case "Video":    command = "RemoveFromPlaylist("+args[1]+";1)"; break;
+		default: alert("***DEBUG*** [can't do that]"); return;
+	}
+	xbmcHttpSimple(command, function(req) {
+		if (req.responseText.substring(0, 2) != "OK")
+			alert("***DEBUG***: " + req.responseText);
+		else {
+			var liId = args[1]+";"+args[2];
+			var elem = $(liId);
+			if (elem) {
+				elem.parentNode.removeChild(elem);
+			}
+		}
+	});
+}
+
+function xbmcListing(args, pageName) {
+	var command = (args.length==3)?"GetMediaLocation("+args[1]+";"+args[2]+";)":"GetShares("+args[1]+";appendone)"
+	
+	xbmcHttpSimple(command, function(req) {
+		var newPage = document.createElement("ul");
+		newPage.setAttribute("id", pageName);
+		newPage.setAttribute("title", pageName.split(";").pop().match(/[^\\/]+(?=[\\/]?$)/)[0]); // get just the last part of the path
+		
+		var lines = req.responseText.split("\n");
+		for (var i = 0; i < lines.length; i++) {
+			var fields = lines[i].split(";");
+			if (lines[i] != "" && fields.length == 3) {
+				
+				var listItem = document.createElement("li");
+				var pageLink = document.createElement("a");
+				
+				var classes = "";
+				
+				//if (fields[1].search(/multipath:\/\//i) < 0 && fields[1].search(/shout:\/\//i) < 0) {
+					classes += "addSet ";
+					
+					var addLink = document.createElement("a");
+					addLink.setAttribute("href", "#xbmc-add;" + args[1] + ";" + fields[1]); // AddToPlayList(media;[playlist];[mask])
+					addLink.appendChild(document.createTextNode(""));
+					listItem.appendChild(addLink);
+				//}
+				
+				if (fields[2] == "1") {
+					pageLink.setAttribute("href", "#xbmc-list;" + args[1] + ";" + fields[1]);
+				} else {
+					pageLink.setAttribute("href", "#xbmc-play;" + fields[1]);
+					classes += " playButton";
+				}	
+				listItem.setAttribute("class", classes);
+
+				pageLink.appendChild(document.createTextNode(fields[0]));
+				
+				listItem.appendChild(pageLink);
+				
+				newPage.appendChild(listItem);
+			}
+		}
+		iui.insertPage(newPage);
+	});
+}
+
+function xbmcPlaylist(args) {
+	var command;
+	switch (args[1]) {
+		case "Music":     command = "GetPlaylistContents(0)"; break;
+		case "Video":     command = "GetPlaylistContents(1)"; break;
+		case "Slideshow": command = "GetSlideshowContents"; break;
+		default: alert("***DEBUG***: unknown playlist: " + args[1]); return;
+	}
+	xbmcHttpSimple(command, function(req) {
+		var is_new = false;
+		var id = args[1] + "_Playlist";
+		var playlist = $(id);
+		if (!playlist) {
+			is_new = true;
+			playlist = document.createElement("ul");
+			playlist.setAttribute("id", id);
+			playlist.setAttribute("title", args[1] + " Playlist");
+		} else {
+			while (playlist.hasChildNodes())
+				playlist.removeChild(playlist.firstChild);
+		}
+		
+		var listItem, link;
+		
+		listItem = document.createElement("li");
+		listItem.setAttribute("class", "group");
+		listItem.appendChild(document.createTextNode("Options"));
+		playlist.appendChild(listItem);
+		
+		listItem = document.createElement("li");
+		link = document.createElement("a");
+		link.setAttribute("href", "#xbmc-playlistplay;"+args[1]);
+		link.appendChild(document.createTextNode("Play Playlist"));
+		listItem.appendChild(link);
+		playlist.appendChild(listItem);
+		
+		listItem = document.createElement("li");
+		link = document.createElement("a");
+		link.setAttribute("href", "#xbmc-clear;"+args[1]);
+		link.appendChild(document.createTextNode("Clear All"));
+		listItem.appendChild(link);
+		playlist.appendChild(listItem);
+		
+		listItem = document.createElement("li");
+		listItem.setAttribute("class", "group");
+		listItem.appendChild(document.createTextNode("Playlist Items"))
+		playlist.appendChild(listItem);
+		
+		var lines = req.responseText.split("\n");
+		if (lines[0] != "[Empty]") {
+			for (var i = 1; i < lines.length; i++) {
+				listItem = document.createElement("li");
+				listItem.setAttribute("class", "removeSet playButton");
+				listItem.setAttribute("id", lines[i]+";"+args[1]);
+				
+				var addLink = document.createElement("a");
+				addLink.setAttribute("href", "#xbmc-remove;"+lines[i]+";"+args[1]); // RemoveFromPlaylist(filename;[playlist])
+				addLink.appendChild(document.createTextNode(""));
+				
+				var pageLink = document.createElement("a");
+				var playId = (args[1]=="Slideshow")?lines[i]:(i-1);
+				pageLink.setAttribute("href", "#xbmc-playlistplay;"+args[1]+";"+playId);
+				pageLink.appendChild(document.createTextNode(lines[i]));
+				
+				listItem.appendChild(addLink);
+				listItem.appendChild(pageLink);
+				
+				playlist.appendChild(listItem);
+			}
+		} else {
+			//alert("Empty playlist! " + args[1])
+		}
+		
+		if (is_new)
+			iui.insertPage(playlist);
+		else 
+			iui.showPage(playlist);
+	});
+}
+
+function xbmcNowPlaying() {
+	xbmcHttpSimple("GetCurrentlyPlaying", function(req) {
+		var is_new = false;
+		
+		var nowplaying = $("xbmc-nowplaying");
+		if (!nowplaying) {
+			is_new = true;
+			nowplaying  = document.createElement("div");
+			nowplaying.setAttribute("id", "xbmc-nowplaying");
+			nowplaying.setAttribute("title", "Now Playing");
+			nowplaying.setAttribute("class", "panel");
+		} else {
+			while (nowplaying.hasChildNodes())
+				nowplaying.removeChild(nowplaying.firstChild);
+		}
+		
+		var np_title, np_artist, np_artwork;
+		var np_fieldset = document.createElement("fieldset");
+		
+		var lines = req.responseText.split("\n");
+		for (var i = 0; i < lines.length; i++) {
+			var fields = new Array(2);//lines[i].split(":", 2);
+			fields[0] = lines[i].substring(0, lines[i].indexOf(":"));
+			fields[1] = lines[i].substring(lines[i].indexOf(":")+1);
+			if (lines[i] != "") {
+				if (fields[0] != "Thumb" && fields[0] != "SongNo" && fields[0] != "Percentage") {
+					var tmpDiv = document.createElement("div");
+					tmpDiv.setAttribute("class", "row");
+					np_fieldset.appendChild(tmpDiv);
+					
+					var label = fields[0];
+					var content = fields[1];
+					
+					switch (fields[0]) {
+					case "Bitrate":
+						label = "Bit rate"
+						content = fields[1] + " Kbps";
+						break;
+					case "Samplerate":
+						label = "Sample rate"
+						content = fields[1] + " KHz";
+						break;
+					case "PlayStatus":
+						label = "Status";
+						break;
+					case "File size":
+						content = formatSize(fields[1]);
+						break;
+					}
+
+					var tmpLabel = document.createElement("label");
+					tmpLabel.appendChild(document.createTextNode(label));
+					tmpDiv.appendChild(tmpLabel);
+					
+					var tmpInput = document.createElement("input");
+					tmpInput.setAttribute("type", "text");
+					tmpInput.setAttribute("name", fields[0]);
+					tmpInput.setAttribute("value", content);
+					tmpInput.setAttribute("readonly", "readonly");
+					tmpDiv.appendChild(tmpInput);
+				}
+				
+				if (fields[0] == "Title") {
+					np_title = document.createElement("h2");
+					np_title.appendChild(document.createTextNode(fields[1]))
+				}
+				else if (fields[0] == "Artist") {
+					np_artist = document.createElement("h3");
+					np_artist.appendChild(document.createTextNode(fields[1]))
+				}
+				else if (fields[0] == "Thumb") {
+					np_artwork = document.createElement("img");
+					if (fields[1] == "defaultAlbumCover.png") {
+						np_artwork.setAttribute("src", "images/noartplaceholder.png");
+					} else if (fields[1] == "defaultVideoCover.png") {
+						np_artwork.setAttribute("src", "images/noartplaceholder-videos.png");
+					} else {
+						var src = fields[1];
+						var filename = src.split("\\").pop();
+						var dst = "Q:\\web\\iphone\\thumbs\\"+filename;
+						xbmcHttpSimple("FileCopy("+src+";"+dst+")", function(req) {
+							np_artwork.setAttribute("src", "thumbs/"+filename);
+						});
+					}
+				}
+			}
+		}
+		
+		if (np_title)
+			nowplaying.appendChild(np_title);
+		if (np_artist)
+			nowplaying.appendChild(np_artist);
+		if (np_artwork)
+			nowplaying.appendChild(np_artwork);
+		nowplaying.appendChild(np_fieldset);
+		
+		if (is_new)
+			iui.insertPage(nowplaying);
+		else 
+			iui.showPage(nowplaying);
+	});
+}
+\ No newline at end of file
diff --git a/web/xbmciphone/iphone/js/xbmc.js b/web/xbmciphone/iphone/js/xbmc.js
new file mode 100644
index 0000000000..a2c9ebb7d0
--- /dev/null
+++ b/web/xbmciphone/iphone/js/xbmc.js
@@ -0,0 +1,114 @@
+/*
+ * Copyright (c) 2007, Thomas Robinson
+ * 
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+ * Neither the name of the tlrobinson.net nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
+ * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+ * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ */
+
+addEventListener("load", initXbmcHttp, false);
+
+function initXbmcHttp() {
+	// reset then set the response format
+	xbmcHttpSimple("SetResponseFormat", function() {
+		xbmcHttpSimple("SetResponseFormat(webheader;false;webfooter;false;opentag;)", function() {
+			//alert("Response Format Set");
+		});
+	});
+}
+
+function xbmcForm() {
+	xbmcCmds("xbmcForm", arguments);
+}
+
+function xbmcHttp() {
+	xbmcCmds("xbmcHttp", arguments);
+}
+
+function xbmcHttpSimple(command, handler) {
+	xbmcHttp(command, function(req) {
+		if (req.readyState == 4) {
+	        if (req.status == 200) {
+				if (req.responseText.substring(0, 5) == "Error")
+					alert(req.responseText);
+				else
+					if (handler) handler(req);
+	        } else {
+	            //alert("Error: " + req.statusText);
+	        }
+	    }
+	});
+}
+
+function xbmcCmds(type, args) {
+	// build the command string:
+	var functionCall = args[0];
+	for (var i = 1; i < args.length-1; i++)
+		functionCall += ((i==1)?"(":";") + args[i] + ((i==args.length-2)?")":"");
+		
+	// build the url:
+	var url = "http://"+window.location.host+"/xbmcCmds/"+type+"?command="+functionCall;
+	
+	loadUrl(url, args[args.length-1]);
+}
+
+function loadUrl(url, statechangehandler) {
+	var req = xhrFactory();
+	if (req) {
+		req.onreadystatechange = function() { if (statechangehandler != null) statechangehandler(req); };
+		req.open("GET", url, true);
+		req.send("");
+	}
+}
+
+
+function xhrFactory() {
+	var req = false;
+    // branch for native XMLHttpRequest object
+    if(window.XMLHttpRequest && !(window.ActiveXObject)) {
+    	try {
+			req = new XMLHttpRequest();
+        } catch(e) {
+			req = false;
+        }
+    // branch for IE/Windows ActiveX version
+    } else if(window.ActiveXObject) {
+       	try {
+        	req = new ActiveXObject("Msxml2.XMLHTTP");
+      	} catch(e) {
+        	try {
+          		req = new ActiveXObject("Microsoft.XMLHTTP");
+        	} catch(e) {
+          		req = false;
+        	}
+		}
+    }
+	return req;
+}
+
+function formatSize(original) {
+	var size = parseInt(original);
+	var units = ["B", "KB", "MB", "GB", "TB"];
+	var unitNum = 0;
+	while (size > 1024) {
+		size /= 1024;
+		unitNum++;
+	}
+	return (Math.round(size*100)/100) + " " + units[unitNum];
+}
author	AlTheKiller <AlTheKiller@svn>	2009-09-23 01:49:50 +0000
committer	AlTheKiller <AlTheKiller@svn>	2009-09-23 01:49:50 +0000
commit	45285e8a9300cd754a760560640b75b09f98035e (patch)
tree	ad9f093885ad5c98e9dd4156674e7691c22ed0a2 /web