Permalink
Browse files

Use the splash image as background behind the cover photo in the deta…

…il view.
  • Loading branch information...
1 parent fbdc307 commit 79c222a211aa12c8ab08d9ba656fe28f3ef2c474 @cpojer cpojer committed Nov 18, 2012
Showing with 22 additions and 7 deletions.
  1. +6 −0 JavaScript/App.js
  2. +3 −3 JavaScript/Templates.js
  3. +3 −0 STYL/App/App.styl
  4. +7 −3 STYL/UI/App/Details.styl
  5. +2 −1 Templates/detail.handlebars
  6. +1 −0 Templates/team.handlebars
View
@@ -519,3 +519,9 @@ window.onerror = function(msg, url, line) {
return false;
};
+
+// TODO(cpojer): remove this after the next deploy to the App Store.
+var css = new Element('style');
+css.type = 'text/css';
+css.innerHTML = 'div.detail div.dark-background { background-image: url(./Splash.jpg); }';
+css.inject(document.head);
View
@@ -90,7 +90,7 @@ function program1(depth0,data) {
function program3(depth0,data) {
var buffer = "", stack1, foundHelper;
- buffer += "\n <div class=\"cover-photo\" style=\"background-image: url(";
+ buffer += "\n <div class=\"dark-background\"></div>\n <div class=\"cover-photo\" style=\"background-image: url(";
stack1 = depth0.thumbnail;
foundHelper = helpers.image;
stack1 = foundHelper ? foundHelper.call(depth0, stack1, {hash:{}}) : helperMissing.call(depth0, "image", stack1, {hash:{}});
@@ -106,7 +106,7 @@ function program3(depth0,data) {
function program5(depth0,data) {
- return "\n <div class=\"white-background\"></div>\n ";}
+ return "\n <div class=\"light-background\"></div>\n ";}
function program7(depth0,data) {
@@ -1867,7 +1867,7 @@ templates['team'] = template(function (Handlebars,depth0,helpers,partials,data)
var buffer = "", stack1, functionType="function", escapeExpression=this.escapeExpression;
- buffer += "<div class=\"detailView\">\n <div class=\"detail expand with-image\">\n <div class=\"cover-photo\" style=\"background-image: url(";
+ buffer += "<div class=\"detailView\">\n <div class=\"detail expand with-image\">\n <div class=\"dark-background\"></div>\n <div class=\"cover-photo\" style=\"background-image: url(";
stack1 = depth0.image;
stack1 = typeof stack1 === functionType ? stack1() : stack1;
buffer += escapeExpression(stack1) + ");\"></div>\n <div class=\"gradient\"></div>\n <div class=\"detail-inner\">\n <span class=\"year\">2012</span>\n <span class=\"genre\">Graz</span>\n <h1>Auphonic Team</h1>\n <span class=\"artist small wrap\">\n André Rattinger, Ferdinand Fuhrmann, Christoph Pojer, Georg Holzmann and Florian Hollerweger\n </span>\n </div>\n <div class=\"clear\"></div>\n </div>\n <div class=\"clear\"></div>\n\n <div class=\"content\">\n Our service is being developed in the lovely City of Graz, Austria.\n <br/><br/>\n We develop new algorithms in the area of music information retrieval and audio signal processing to create an automatic audio post production web service for broadcasters, podcasts, radio shows, audio books, lecture recordings, screencasts and more.\n </div>\n</div>\n\n<ul>\n <li><a href=\"";
View
@@ -14,3 +14,6 @@ support-for-ie = false
@import '../UI/App/Spinner'
@import '../UI/App/Sprites'
+
+div.detail div.dark-background
+ background-image: url(./Splash.jpg)
View
@@ -66,14 +66,18 @@ div.detail
span.wrap
white-space normal
- div.white-background
+ div.light-background, div.dark-background
position absolute
left 0
right 0
- top -250px
- height 250px
+ top -450px
+ height 450px
background #fff
+ div.dark-background
+ background #111
+ background-position center bottom
+
&.with-image
height 270px
padding 0
@@ -1,11 +1,12 @@
<div class="detailView">
<div class="detail expand{{#if thumbnail}} with-image{{/if}}">
{{#if thumbnail}}
+ <div class="dark-background"></div>
<div class="cover-photo" style="background-image: url({{{image thumbnail}}});"></div>
<div class="cover-photo" style="background-image: url({{{image image}}});"></div>
<div class="gradient"></div>
{{else}}
- <div class="white-background"></div>
+ <div class="light-background"></div>
{{/if}}
<div class="detail-inner">
{{#metadata}}
@@ -1,5 +1,6 @@
<div class="detailView">
<div class="detail expand with-image">
+ <div class="dark-background"></div>
<div class="cover-photo" style="background-image: url({{image}});"></div>
<div class="gradient"></div>
<div class="detail-inner">

0 comments on commit 79c222a

Please sign in to comment.