Revision: 3645 Author: hans URL: http://bknr.net/trac/changeset/3645
Snapshot, product overlays finished.
A trunk/projects/quickhoney/upgrade-stuff/buy-top.gif U trunk/projects/quickhoney/upgrade-stuff/buy.gif U trunk/projects/quickhoney/upgrade-stuff/import.lisp A trunk/projects/quickhoney/upgrade-stuff/t-shirt-sample-background.gif U trunk/projects/quickhoney/website/static/javascript.js U trunk/projects/quickhoney/website/static/styles.css U trunk/projects/quickhoney/website/templates/index.xml
Added: trunk/projects/quickhoney/upgrade-stuff/buy-top.gif =================================================================== (Binary files differ)
Property changes on: trunk/projects/quickhoney/upgrade-stuff/buy-top.gif ___________________________________________________________________ Name: svn:mime-type + application/octet-stream
Modified: trunk/projects/quickhoney/upgrade-stuff/buy.gif =================================================================== (Binary files differ)
Modified: trunk/projects/quickhoney/upgrade-stuff/import.lisp =================================================================== --- trunk/projects/quickhoney/upgrade-stuff/import.lisp 2008-07-25 16:46:19 UTC (rev 3644) +++ trunk/projects/quickhoney/upgrade-stuff/import.lisp 2008-07-26 09:09:11 UTC (rev 3645) @@ -5,10 +5,12 @@
(dolist (name '(#P"overlay-close.gif" #P"hey.gif" - #P"buy.gif" #P"buy-print.gif" #P"buy-file.gif" #P"buy-t-shirt.gif" + #P"buy.gif" #P"buy-top.gif" #P"buy-print.gif" #P"buy-file.gif" #P"buy-t-shirt.gif" #P"buy-right-line.gif" + #P"t-shirt-sample-background.gif" #P"print-sample.jpg" - #P"button-bottom.gif" #P"add-to-cart.gif" #P"checkout.gif")) + #P"button-bottom.gif" + #P"add-to-cart.gif" #P"checkout.gif")) (handler-case (import-image name) (error (e)
Added: trunk/projects/quickhoney/upgrade-stuff/t-shirt-sample-background.gif =================================================================== (Binary files differ)
Property changes on: trunk/projects/quickhoney/upgrade-stuff/t-shirt-sample-background.gif ___________________________________________________________________ Name: svn:mime-type + application/octet-stream
Modified: trunk/projects/quickhoney/website/static/javascript.js =================================================================== --- trunk/projects/quickhoney/website/static/javascript.js 2008-07-25 16:46:19 UTC (rev 3644) +++ trunk/projects/quickhoney/website/static/javascript.js 2008-07-26 09:09:11 UTC (rev 3645) @@ -1211,10 +1211,10 @@ $('hey_send').onclick = hey_send; }
-NOTICE = partial(SPAN, { class: 'notice' }); -PRICE = partial(SPAN, { class: 'price' }); -SPACER = partial(DIV, { class: 'spacer' }); -ARTWORK_NAME = partial(SPAN, { class: 'artwork-name' }); +NOTICE = partial(SPAN, { 'class': 'notice' }); +PRICE = partial(SPAN, { 'class': 'price' }); +SPACER = partial(DIV, { 'class': 'spacer' }); +ARTWORK_NAME = partial(SPAN, { 'class': 'artwork-name' });
var make_buy_forms = { 'buy-file' : function () { @@ -1230,6 +1230,7 @@ BR(), BR(), PRICE('45 €'), NOTICE(' (inside EU, incl. tax)*'), BR(), PRICE('37.82 €'), NOTICE(' (outside EU, tax free)*'), BR(), + BR(), BUTTON(null, IMG({ src: '/image/add-to-cart', width: 102, height: 40 })), BR(), BR(), NOTICE("Please note: Our shop is operating from Germany, that's why there is a sales tax within Europe and none outside")))); @@ -1237,7 +1238,7 @@ 'buy-print' : function () { make_overlay('buy-print', 'Buy Art Floating Gallery Plexiglas', 426, FORM({ method: 'POST', action: '#' }, - SPACER("Fineart print mounted behind plexiglas on aluminium board with a 3/4'' wood brace.", + SPACER("Fineart print mounted behind plexiglas on aluminium board with a 3/4'' wood brace. ", NOTICE('Please allow 4-6 days for production in addition to the shipping time')), IMG({ src: '/image/print-sample', width: 426, height: 428 }), SPACER(ARTWORK_NAME(current_image.name), @@ -1255,6 +1256,7 @@ "Small 33cm x 50cm (13'' x 19.7'')", BR(), PRICE('190 €'), NOTICE('(inside EU, incl. tax)*'), BR(), PRICE('159.66 €'), NOTICE('(outside EU, tax free)*'), BR())))), + BR(), BUTTON(null, IMG({ src: '/image/add-to-cart', width: 102, height: 40 })), BR(), BR(), NOTICE("Please note: We are shipping from Germany, that's why there is a sales tax within Europe and none outside")))); @@ -1263,17 +1265,37 @@ make_overlay('buy-t-shirt', 'Buy Art on T-Shirt', 426, FORM({ method: 'POST', action: '#' }, SPACER("Artwork ", ARTWORK_NAME(current_image.name), " in colored flocked foil ", - "hot pressed on an American Apparel T-Shirt." + "hot pressed on an American Apparel T-Shirt. ", NOTICE('These Tees are custom made, so please allow 4-6 days for production in addition to the shipping time')), SPACER(TABLE(null, TBODY(null, TR(null, - TD({ id: 't-shirt-sample' }, INPUT({ type: "radio", name: "size", value: "small"})), + TD({ 'class': 't-shirt-sample', valign: 'top' }, + IMG({ id: 't-shirt-sample', src: '/image/' + current_image.name + '/cell,ffffff,100,100,10'})), TD(null, - "Small 20cm x 30cm (7.8'' x 11.8'')", BR(), - PRICE('150 €'), NOTICE(' (inside EU, incl. tax)*'), BR(), - PRICE('128.32 €'), NOTICE(' (outside EU, tax free)*'), BR())),)), - BUTTON(null, IMG({ src: '/image/add-to-cart', width: 102, height: 40 })), + "Color:", BR(), + "Tee - white", BR(), + "Art - as in original", BR(), + BR(), + "Price:", BR(), + PRICE('35.00 €'), NOTICE(' (inside EU, incl. tax)*'), BR(), + PRICE('29.41 €'), NOTICE(' (outside EU, tax free)*'), BR(), + BR(), + "Size:", BR(), + SELECT({ name: 'size' }, + OPTION({ value: "" }, "Choose Size"), + OPTION({ value: "XS" }, "XS"), + OPTION({ value: "S" }, "S"), + OPTION({ value: "M" }, "M"), + OPTION({ value: "L" }, "L"), + OPTION({ value: "XL" }, "XL")), + BR(), + BR(), + "Quantity:", BR(), + INPUT({ name: 'quantity', size: 1, maxlength: 1 }), + BR(), + BR(), + BUTTON(null, IMG({ src: '/image/add-to-cart', width: 102, height: 40 })))))), BR(), BR(), NOTICE("Please note: We are shipping from Germany, that's why there is a sales tax within Europe and none outside")))) } @@ -1317,7 +1339,8 @@ buttons.push(make_image_action_button('hey', make_hey_form, 23)); replaceChildNodes('image_action_buttons', buttons); if (buyable) { - appendChildNodes('image_action_buttons', IMG({ id: 'buy', src: recolored_image_path('buy'), width: 127, height: 22})); + appendChildNodes('image_action_buttons', IMG({ id: 'buy', src: recolored_image_path('buy'), width: 37, height: 22})); + appendChildNodes('image_action_buttons', IMG({ id: 'buy-top', src: recolored_image_path('buy-top'), width: 90, height: 1})); } appendChildNodes('image_action_buttons', IMG({ id: 'buy-right-line', src: recolored_image_path('buy-right-line'), width: 1, height: height})); var animator = new YAHOO.util.Anim('image_action_buttons', {}, .3,
Modified: trunk/projects/quickhoney/website/static/styles.css =================================================================== --- trunk/projects/quickhoney/website/static/styles.css 2008-07-25 16:46:19 UTC (rev 3644) +++ trunk/projects/quickhoney/website/static/styles.css 2008-07-26 09:09:11 UTC (rev 3645) @@ -81,11 +81,11 @@ /* menu */
img.menu { - position: absolute; - padding: 0px; - top: 36px; - border-width: 0px; - background-color: white; + position: absolute; + padding: 0px; + top: 36px; + border-width: 0px; + background-color: white; }
img#m_quickhoney { @@ -388,25 +388,25 @@ }
.newsentry { - width: 428px; - height: 108px; - position: relative; - } + width: 428px; + height: 108px; + position: relative; + }
.newsentry img { - position: absolute; - top: 5px; left: 5px; - } + position: absolute; + top: 5px; left: 5px; + } .newsentry div { - position: absolute; - top: 5px; left: 118px; - } + position: absolute; + top: 5px; left: 118px; + } .newsentry h1 { - margin: 0px 0px 2px 0px; - font-size: 120%; - color: white; - font-weight: normal; - } + margin: 0px 0px 2px 0px; + font-size: 120%; + color: white; + font-weight: normal; + }
.news_vector { background-color: #00ccff; } .news_pixel { background-color: #ff00ff; } @@ -471,92 +471,117 @@ }
.error { - margin: 2em; - padding: 1em; - border: 1pt solid #aa0000; + margin: 2em; + padding: 1em; + border: 1pt solid #aa0000; color:#f00; font-size: 110%; }
#frontpage p { - margin: 1em; + margin: 1em; } #frontpage div p { - margin: 2em; + margin: 2em; }
#overlay { - z-index: 100; - top: 144px; - left: 36px; - position: absolute; - background: white; - border: 1px solid #000000; - margin: 0px; - padding: 0px; + z-index: 100; + top: 144px; + left: 36px; + position: absolute; + background: white; + border: 1px solid #000000; + margin: 0px; + padding: 0px; }
#overlay #close { - position: absolute; - top: 12px; + position: absolute; + top: 12px; }
#overlay h1 { - margin-left: 10px; + margin-left: 10px; }
-#overlay.pixel h1, #overlay.pixel h2 { - color: #ff00ff; +#overlay.pixel h1, #overlay.pixel h2, #overlay.pixel .artwork-name { + color: #ff00ff; }
-#overlay.vector h1, #overlay.vector h2 { - color: #00ccff; +#overlay.vector h1, #overlay.vector h2, #overlay.vector .artwork-name { + color: #00ccff; }
#image_action_buttons { position: absolute; - left: 584px; - top: 28px; - width: 60px; - overflow: hidden; - z-index: 100; + left: 584px; + top: 28px; + width: 60px; + overflow: hidden; + z-index: 100; }
#image_action_buttons #buy { - z-index: 110; - position: absolute; - left: 0px; - top: 0px; + z-index: 110; + position: absolute; + left: 0px; + top: 0px; }
+#image_action_buttons #buy-top { + z-index: 110; + position: absolute; + left: 37px; + top: 0px; +} + #image_action_buttons #buy-right-line { - z-index: 100; - position: absolute; - right: 0px; - top: 0px; + z-index: 100; + position: absolute; + right: 0px; + top: 0px; }
#overlay #hey { - padding: 10px 15px 10px 10px; + padding: 10px 15px 10px 10px; }
#overlay #hey #hey_from, #overlay #hey textarea { - width: 100%; + width: 100%; }
#overlay #hey #hey_send { - margin-top: 5px; + margin-top: 5px; }
#overlay span.notice { - color: #999999; + color: #999999; }
#overlay span.price { - color: #33cc00; + color: #33cc00; }
#overlay div.spacer { - padding: 12px; + padding: 12px; +} + +#overlay td.t-shirt-sample { + width: 188px; + height: 132px; + background-image: url(/image/t-shirt-sample-background); + background-repeat: no-repeat; +} + +#overlay img#t-shirt-sample { + padding-left: 43px; + padding-top: 16px; +} + +img#checkout { + position: absolute; + top: 0px; + left: 585px; } \ No newline at end of file
Modified: trunk/projects/quickhoney/website/templates/index.xml =================================================================== --- trunk/projects/quickhoney/website/templates/index.xml 2008-07-25 16:46:19 UTC (rev 3644) +++ trunk/projects/quickhoney/website/templates/index.xml 2008-07-26 09:09:11 UTC (rev 3645) @@ -23,6 +23,8 @@ <div id="overlay"> </div>
+ <img id="checkout" src="/image/checkout" width="112" height="24"/> + <div id="menu"> <a onclick="show_page('home')" href="#home"> <img alt="home" class="menu" id="m_home" src="/image/quickhoney" />