Merge branch 'kevin_local'

kevinmcdonagh · Sep 5, 2010 · 2da94a2 · 2da94a2
2 parents 9c59fcc + 4a4c6bc
commit 2da94a2
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 9 deletions.
diff --git a/code/css/mashbox1.css b/code/css/mashbox1.css
@@ -4,6 +4,7 @@
     ADDTRACK
     TABLE
 	FILELIST
+	TRACK MASH LOADING DIALOG
 */
 
 /* =RESET
@@ -443,7 +444,46 @@ table tr:nth-child(2n) {
     cursor:pointer;
 }
 
+
 
+/* =TRACK MASH LOADING DIALOG
+--------------------------------------------------------------------------- */
+ol{
+	list-style: none;
+}
+.cover {
+	float:left;
+}
+ol.txt_mash	 li{
+	clear:both;	
+}
+
+.details{
+	display:block;
+	margin:0 0 0 108px;	
+}
+
+.details h3 {
+	font-size:2em;
+}
+
+.details p {
+	font-size:1.7em;
+}
+
+.plus {
+	text-align:center;
+	font-size:3em;
+	font-style:bold;
+}
+
+.equals {
+	text-align:center;
+	font-size:3em;
+	font-style:bold;
+}
+
+.loading {}
 
 
 

diff --git a/code/img/cover_1.jpg b/code/img/cover_1.jpg
diff --git a/code/img/cover_2.jpg b/code/img/cover_2.jpg
diff --git a/code/mashbox1.php b/code/mashbox1.php
@@ -90,15 +90,24 @@
             </table>
         </div>
     </div>
-	<div id="dialog" title="Making the Mash!">
-		<ol>
-			<li>Cover - Title - artist</li>
-			<li>+</li>			
-			<li>Cover - Title - artist!</li>
-			<li>=</li>
-			<li>Title - artist!</li>
+	<div id="dialog" title="Making a Mash!">
+		<ol class="txt_mash">
+			<li>
+				<div class="trackItem">
+					<img class="cover" src="img/cover_1.jpg" width="100px" height="100px"/>
+					<span class="details"><h3>Title</h3><p>artist</p></span>
+				</div>
+			</li>
+			<li class="plus">+</li>			
+			<li>
+				<div class="trackItem">
+					<img class="cover" src="img/cover_2.jpg" width="100px" height="100px"/>
+					<span class="details"><h3>Title</h3><p>artist</p></span>
+				</div>
+			</li>
+			<li><span class="equals">=</span><span class="result">Title - artist!</span></li>
 		</ol>
-		<p>Loading...</p>
+		<p class="loading">Loading...</p>
 	</div>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
     <script type="text/javascript" src="js/soundcloud.player.api.js"></script>
@@ -108,7 +117,8 @@
 	$(function() {
 		$("#dialog").dialog({ 
 			autoOpen: false,
-			height: 240,
+			height: 340,
+			width: 440,
 			modal: true });
 
 		$(".chosen").click(function(){