# HG changeset patch # User cavaliet # Date 1371651541 -7200 # Node ID b844bdfb8bc228217195b79078691c13195cc45e # Parent 211680696ab750425167fbd0002cd9f29d19879e add integration modifs diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/css/slideshow.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/egonomy/static/egonomy/css/slideshow.css Wed Jun 19 16:19:01 2013 +0200 @@ -0,0 +1,59 @@ +.slideshow-wrap, .imagezone { + position: absolute; left: 0; top: 0; width: 100%; height: 100%; +} + +.caption-wrap { + position: absolute; left: 50px; right: 50px; bottom: 50px; +} + +.caption { + font-family: "Lato"; width: 480px; max-width: 100%; + background: #ffffff; + padding: 16px 0; margin: 0; +} + +.caption h2 { + font-size: 18px; font-weight: bold; margin: 0; padding: 0 20px 5px; +} + +.caption h3 { + font-size: 18px; font-style: italic; margin: 0; border-bottom: 1px solid #cccccc; padding: 0 20px 5px; +} + +.caption p { + margin: 10px 20px 0; padding: 0; font-size: 16px; font-style: italic; +} + +.arrow-wrap { + box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75); width: 78px; height: 78px; + position: absolute; top: 50%; margin-top: -39px; + background: #fff; cursor: pointer; border-radius: 39px; display: none; +} + +.left-arrow { + left: 20px; +} + +.right-arrow { + right: 20px; +} + +.arrow-wrap:hover { + background: #e0e0e0; +} + +.arrow-wrap:active { + background: #666666; +} + +.arrow { + width: 78px; height: 78px; display: block; background: url(../img/home-arrow.png) center 30px no-repeat; +} + +.left-arrow .arrow { + transform: rotate(90deg); -webkit-transform: rotate(90deg); +} + +.right-arrow .arrow { + transform: rotate(-90deg); -webkit-transform: rotate(-90deg); +} \ No newline at end of file diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/css/style.css --- a/src/egonomy/static/egonomy/css/style.css Wed Jun 19 15:15:05 2013 +0200 +++ b/src/egonomy/static/egonomy/css/style.css Wed Jun 19 16:19:01 2013 +0200 @@ -13,7 +13,7 @@ h1{text-transform: uppercase; display:inline-block;padding: 64px 0 0 16px; font-family : 'josefin_sans'; font-weight : 600; font-size:34px;} .head-login{padding-top: 10px; margin-bottom: 40px; display: inline-block;} .head-login, .head-login a{font-size: 12px; font-family: 'Lato'; color: #626364;} -.head-login input{width:140px;background: url(../img/icon-search.png) 150px center no-repeat;font-family: 'Lato'; font-weight : bold; font-style : italic; font-size: 12px; border: 1px solid #D0D0D0; height: 25px; line-height: 25px; padding: 0 26px 0 4px;} +.head-login input, .search-form{ vertical-align: middle; width:140px;background: url(../img/icon-search.png) 150px center no-repeat;font-family: 'Lato'; font-weight : bold; font-style : italic; font-size: 12px; border: 1px solid #D0D0D0; height: 25px; line-height: 25px; padding: 0 26px 0 4px;} .hello-user{margin-left: 12px;} .head-login select{ vertical-align: middle;} .head-login li{float: left; line-height: 27px;} @@ -21,11 +21,11 @@ .dot-10{ vertical-align:middle; width: 10px; height: 10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;background-color: #A1A1A1; display: inline-block; margin: 0 12px;} nav{height: 70px;} nav li{height:100%; float:left; } -.nav{margin-bottom: 14px; height: 18px; display: block;} -.sub-nav{float: right; display: block;} +.nav{margin-bottom: 14px; height: 18px; display: block;float: right;} +.sub-nav{float: right; display: block;clear: both; } .sub-nav a{font-size: 14px; font-family: 'Lato'; font-weight: 300; display:inline-block;} .sub-nav a:first-letter {text-transform: uppercase;} -.sub-nav a.active, .sub-nav a:hover{font-family: 'Lato';} +.sub-nav a.active, .sub-nav a:hover{font-family: 'Lato'; font-weight: bold;} .nav a{font-family: 'josefin_sans'; font-size: 18px; text-transform : uppercase;} .title-page{margin: 30px 0; position: relative; min-height: 30px;} @@ -34,18 +34,29 @@ .title-menu{ position: absolute; bottom: 0; right: 0;} .title-menu li{float: left;} -.bar-tools{margin-bottom: 26px; line-height: 26px; font-family: 'Lato'; font-weight: 300; display:block;padding: 10px 0; background-image: url(../img/border-dot-bar.png), url(../img/border-dot-bar.png); background-position: top center, bottom center; background-repeat: no-repeat, no-repeat;} +.bar-tools{margin-bottom: 12px; line-height: 35px; padding-bottom: 1px; font-family: 'Lato'; font-weight: 300; display:block;background-image: url(../img/border-bar-tools.png), url(../img/border-bar-tools.png); background-position: top center, bottom center; background-repeat: repeat-x;} .bar-tools h3{ font-size: 18px; display: inline-block; text-transform: uppercase;} .bar-tools ul{float: right;} +.bar-tools ul.left{float: left;} +.bar-tools ul.left li{margin-left: 0; margin-right: 10px;} +.bar-tools ul.left a{width: 40px; padding: 0; vertical-align: middle;} +.go-to{background-repeat: no-repeat;background-position: 4px center, 20px center;} +.go-to.mosaic{background-image: url(../img/icon-mosaic.png), url(../img/icon-arrow-enter.png);} +.go-to.search{background-image: url(../img/icon-search.png), url(../img/icon-arrow-enter.png);} .bar-tools li{float: left; margin-left: 10px;} -.bar-tools li a{display: inline-block; font-size: 12px; height: 24px; line-height: 24px; padding: 0 7px; background-color: #DDD;} +.bar-tools li a{display: inline-block; font-size: 12px; height: 25px; line-height: 25px; padding: 0 7px; background-color: #DDD;} +.bar-tools li a:hover{background-color: #eee;} .bar-tools li a:first-letter {text-transform: uppercase;} -.bar-tools a.save{padding-left: 30px;background-image: url(../img/icon-save-15.png); background-repeat: no-repeat; background-position: 9px center;} +.bar-tools a.icon{padding-left: 30px;background-repeat: no-repeat; background-position: 8px center;} +a.icon.save{background-image: url(../img/icon-save-15.png);} +a.icon.cut{background-image: url(../img/icon-cut-15.png) ;} +a.icon.plus{background-image: url(../img/icon-plus-15.png);} + /* Home */ .w650{width: 650px;} .our-images{margin-bottom: 38px; text-align: center; font-size: 12px; font-family: 'Lato'; font-weight : bold; font-style : italic; color: #58595A;} .home-images{position: relative; margin-bottom: 24px;} -a.home-arrow{ -webkit-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75);-moz-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75);box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75);background: url(../img/home-arrow.png) no-repeat center center #fff;cursor: pointer;display: block;height: 78px;left: 436px;position: absolute;top: -25px;width: 78px;z-index: 10;-webkit-border-radius: 39px;-moz-border-radius: 39px;border-radius: 39px;} +.arrow-wrap.home-arrow{display: block; top:0; margin-top: -26px; left: 50%; margin-left: -39px;} .home-images .col-left{float: left;} .home-images .col-left img{width: 667px;} .home-images .col-right{float: right;} @@ -80,7 +91,7 @@ li .toggle{display: none;} li:hover .toggle{ display:block; } -.tools{ text-align:right; width:100%; position:absolute; bottom:0; left:0; background: rgba(255, 255, 255, .8);} +.tools{ text-align:right; width:100%; position:absolute; bottom:0; left:0; background: rgba(255, 255, 255, .9);} .tools ul{ display: inline-block;padding: 6px 10px 6px 0;} .tools a{display: inline-block; width: 25px; height: 25px; line-height: 25px; text-align: center;} .tools li{float: left; margin-left: 6px;} @@ -112,15 +123,22 @@ .tools-2 a img{vertical-align: middle;} .tools-2 li{ float: left; margin-right: 6px;} -.tools-sprite{display:inline-block; width:25px; height: 25px; background-image: url(../img/tools-sprite.png); background-repeat: no-repeat;} -.tools-sprite.twitter:hover{background-position: 0 0;} -.tools-sprite.twitter{background-position: 0 -25px;} -.tools-sprite.facebook{background-position: -30px -25px;} -.tools-sprite.facebook:hover{background-position: -30px 0;} -.tools-sprite.plus{background-position: -60px -25px;} -.tools-sprite.plus:hover{background-position: -60px 0;} -.tools-sprite.cut{background-position: -90px -25px;} -.tools-sprite.cut:hover{background-position: -90px 0;} +.pagination{ margin-bottom: 12px;} +.pagination li{float: left; font-size: 14px;font-family: 'Lato'; margin-right: 14px;} +.pagination li.curent, .pagination li:hover{font-weight: bold;} +.tool{display:inline-block; width:25px; height: 25px; background-image: url(../img/tools-sprite.png); background-repeat: no-repeat; vertical-align: middle;} +.tool.twitter:hover{background-position: 0 0;} +.tool.twitter{background-position: 0 -25px;} +.tool.facebook{background-position: -30px -25px;} +.tool.facebook:hover{background-position: -30px 0;} +.tool.plus{background-position: -60px -25px;} +.tool.plus:hover{background-position: -60px 0;} +.tool.cut{background-position: -90px -25px;} +.tool.cut:hover{background-position: -90px 0;} +.tool.save{background-position: -115px -25px;} +.tool.save:hover{background-position: -115px 0;} +.tool.trash{background-position: -140px -25px;} +.tool.trash:hover{background-position: -140px 0;} .box-shadow{ -webkit-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75);-moz-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75);box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.75);} .popin-wrap{width: 100%; height: 100%; position: fixed; z-index: 100; background-color:rgba(255,255,255,.7);} @@ -139,6 +157,22 @@ .block{display: block;} .popin-wrap, .popin{display: none;} +.edition{background-color: #eee; padding: 0 28px; margin-bottom: 64px;} +.edition .slideshow{ min-height: 80px; position:relative; padding: 24px 0; text-align: center;} +.slideshow .arrow-wrap{display: block;} +.slideshow .left-arrow{left: 0;} +.slideshow .right-arrow{right: 0;} +.slideshow .share{position: absolute; bottom: 24px; right: 0;} +.slideshow .share li{float: left; margin-left: 8px;} +.image-wrap{display: inline-block;} +.info{font-family: 'Lato'; font-size: 14px; text-align: left;} +.info th{color: #777; min-width: 140px; } +.info td{color: #000; line-height: 16px;} +.info table{border-collapse:separate;border-spacing:0 5px;} +.box-edition{padding: 16px 0; border-bottom: 1px solid #CCC;} +.box-edition h3{color: #777;font-family: 'Lato'; font-size: 14px; margin-bottom: 6px;} +.list-key-search a{display: inline-block;} + /* imported */ .center-image { text-align: center; diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/img/border-bar-tools.png Binary file src/egonomy/static/egonomy/img/border-bar-tools.png has changed diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/img/icon-arrow-enter.png Binary file src/egonomy/static/egonomy/img/icon-arrow-enter.png has changed diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/img/icon-cut-15.png Binary file src/egonomy/static/egonomy/img/icon-cut-15.png has changed diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/img/icon-mosaic.png Binary file src/egonomy/static/egonomy/img/icon-mosaic.png has changed diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/img/icon-plus-15.png Binary file src/egonomy/static/egonomy/img/icon-plus-15.png has changed diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/img/tools-sprite.png Binary file src/egonomy/static/egonomy/img/tools-sprite.png has changed diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/static/egonomy/js/slideshow.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/egonomy/static/egonomy/js/slideshow.js Wed Jun 19 16:19:01 2013 +0200 @@ -0,0 +1,102 @@ +$(function() { + + var currentSlide = 0, jqwin = $(window), jqcanvas = $(".imagezone"), jqcaption = $(".caption"), margin = 50; + + function showSlide() { + var slide = slides[currentSlide]; + + jqcaption.find("h2").text(slide.title); + jqcaption.find("h3").text(slide.author); + jqcaption.find("p").text(slide.description); + + if (slide.image && slide.image.width) { + var ww = jqwin.width(), + wh = jqwin.height(), + cw = jqcaption.outerWidth(), + ch = jqcaption.outerHeight(), + wi = slide.image.width, + hi = slide.image.height, + w1 = ww - 2 * margin, w2 = w1 - cw + h1 = wh - 2 * margin, h2 = h1 - ch, + ra = Math.max( + Math.min((h1 / hi), (w2 / wi)), + Math.min((h2 / hi), (w1 / wi)) + ), + wa = wi * ra, ha = hi * ra, + xa = ww - margin - wa, + rb = Math.max(ww / wi, wh / hi), + wb = wi * rb, hb = hi * rb, + xb = (ww - wb) / 2, yb = (wh - hb) / 2; + jqcanvas.attr({ + width: ww, + height: wh + }); + + var ctx = jqcanvas[0].getContext('2d'); + + ctx.drawImage(slide.image, xb, yb, wb, hb); + + ctx.fillStyle = 'rgba(255,255,255,.65)'; + ctx.fillRect(0,0,ww,wh); + + ctx.fillStyle = 'rgba(0,0,0,.3)'; + ctx.fillRect(margin + 4, wh - margin - ch + 4, cw, ch); + ctx.fillRect(xa + 4, margin + 4, wa, ha); + + ctx.drawImage(slide.image, xa, margin, wa, ha); + + } + } + + function nextSlide() { + currentSlide = (currentSlide + 1) % slides.length; + showSlide(); + return false; + } + + function prevSlide() { + currentSlide = (currentSlide > 0 ? currentSlide - 1 : slides.length - 1); + showSlide(); + return false; + } + + var hideTO, isInArrow = false, jqArrows = $(".arrow-wrap"); + function resetTO() { + clearTimeout(hideTO); + if (!isInArrow) { + hideTO = setTimeout(function() { + jqArrows.hide(); + }, 1000); + } + } + $("body").mousemove(function() { + jqArrows.show(); + resetTO(); + return false; + }); + jqArrows.hover(function() { + isInArrow = true; + resetTO(); + }, function() { + isInArrow = false; + resetTO(); + }); + + $(".left-arrow").click(prevSlide); + $(".right-arrow").click(nextSlide); + + slides.forEach(function(slide, k) { + slide.image = new Image(); + slide.image.onload = function() { + if (k === currentSlide) { + showSlide(); + } + }; + slide.image.src = imgurlbase + slide.url; + }); + + showSlide(); + + jqwin.resize(showSlide); + +}); \ No newline at end of file diff -r 211680696ab7 -r b844bdfb8bc2 src/egonomy/templates/egonomy_all_fragments.html --- a/src/egonomy/templates/egonomy_all_fragments.html Wed Jun 19 15:15:05 2013 +0200 +++ b/src/egonomy/templates/egonomy_all_fragments.html Wed Jun 19 16:19:01 2013 +0200 @@ -27,7 +27,7 @@ {% endif %} - {% if nb_pages > 1 %}

{% build_pagination nb_pages cur_page_nb url_pagination "clickable" %}

{% endif %} + {% if nb_pages > 1 %}{% build_pagination nb_pages cur_page_nb url_pagination "" %}{% endif %} {% endif %} - {% if nb_pages > 1 %}

{% build_pagination nb_pages cur_page_nb url_pagination "clickable" %}

{% endif %} + {% if nb_pages > 1 %}{% build_pagination nb_pages cur_page_nb url_pagination "clickable" %}{% endif %}