--- a/integration/v2/18-19-20-21-collection_vue_mosaique.html Thu Jun 27 17:31:15 2013 +0200
+++ b/integration/v2/18-19-20-21-collection_vue_mosaique.html Thu Jun 27 17:38:53 2013 +0200
@@ -163,7 +163,9 @@
<ul class="list-projets-5 mosaic float-left clearfix masonry-177">
- <li class="item-masonry" data-keywords="héroïne gréco-romaine, über ällës, Beaux Arts, éè">
+
+ <li class="item-masonry" data-keywords="Musée Grévin, über ällës, Beaux Arts, courant stylistique (thématique ga bu zo meu)">
+
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
--- a/integration/v2/css/style.css Thu Jun 27 17:31:15 2013 +0200
+++ b/integration/v2/css/style.css Thu Jun 27 17:38:53 2013 +0200
@@ -234,19 +234,24 @@
.item-masonry{margin-bottom: 20px;}
.filters{padding: 10px 0; text-align: center;}
.filters li{ margin-bottom: 10px; position: relative; text-align: left; font-size: 12px; font-family: 'Lato'; display:inline-block; width: 200px; height: 28px; line-height: 28px; background-color: #fff;}
+
.filters a.display-keyword:first-child{ overflow: hidden; color: #7F7F7F; padding-left: 6px; display: block; }
+.filters a.display-keyword{padding-left: 6px;}
.filters li:hover{-webkit-box-shadow : none; -moz-box-shadow : none; box-shadow : none;}
+
.filters .icon-action{position: absolute; top: 10px; right: 6px;width: 10px; height: 10px; display: inline-block;}
.filters li.disabled .icon-action{width: 10px; height: 10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; background-color: #7F7F7F;}
.filters li.disabled a{opacity: 0.5;}
+
.filters li .icon-action{background: url(../img/icon-cross-10.png) 0 0 no-repeat;}
.float-left{float: left;}
.filters-wrap{width: 225px; background-color: #EEE; margin-right: 17px;}
.list-projets-5{width: 708px;}
.curtain{display:none;z-index:10;position: absolute; width: 100%; height: 100%; background-color:rgba(0,0,0,.7);}
+.disabled .curtain{display: block;}
.list-projets-5 .item-masonry{margin-bottom: 0;}
.mosaic .content-project{display: none;}
.mosaic .visuel-project .title-project{display: block;}
--- a/integration/v2/js/keyword-mosaic.js Thu Jun 27 17:31:15 2013 +0200
+++ b/integration/v2/js/keyword-mosaic.js Thu Jun 27 17:38:53 2013 +0200
@@ -6,7 +6,7 @@
});
function updateMasonry() {
- $('.masonry-177').data('masonry').layout();
+ $('.masonry-177').masonry('layout');
}
var keywordsobj = {};
@@ -63,27 +63,30 @@
keywordslist.slice(0,100).forEach(function(kw) {
var li = $('<li class="box-shadow-2">'),
- outera = $('<a class="display-keyword" href="#">'),
- innera = $('<a class="icon-action" href="#">');
- outera.text(kw.keyword + ' ');
- outera.append(innera);
- li.append(outera);
+ texta = $('<a class="display-keyword" href="#">'),
+ actiona = $('<a class="icon-action" href="#">');
+ texta.text(kw.keyword + ' ');
+ li.append(actiona);
+ li.append(texta);
kw.li = li;
li.click(function() {
- if (kw.enabled) {
+ var allothersdisabled = keywordslist.reduce(function(mem, k) {
+ return mem && (k === kw || !k.enabled);
+ }, true);
+ if (allothersdisabled) {
+ keywordslist.forEach(function(k) {
+ k.enabled = true;
+ });
+ } else {
keywordslist.forEach(function(k) {
k.enabled = false;
});
kw.enabled = true;
- } else {
- keywordslist.forEach(function(k) {
- k.enabled = true;
- });
}
updateKeywords();
return false;
});
- innera.click(function() {
+ actiona.click(function() {
kw.enabled = !kw.enabled;
updateKeywords();
return false;
@@ -104,6 +107,14 @@
updateMasonry();
});
+ //filters
+ $('.filters a').each(function(){
+ var text = $.trim($(this).text());
+ if(text.length > 26){
+ $(this).text(text.substr(0, 26) + '...')
+ }
+ });
+
//##################
/*
$(document).on('click','.display-keyword', function(e){
--- a/integration/v2/js/main.js Thu Jun 27 17:31:15 2013 +0200
+++ b/integration/v2/js/main.js Thu Jun 27 17:38:53 2013 +0200
@@ -1,11 +1,5 @@
$(function(){
-//filters
- $('.filters a').each(function(){
- var text = $.trim($(this).text());
- if(text.length > 26){
- $(this).text(text.substr(0, 26) + '...')
- }
- });
+
//masonry
var masonry465 = $('.masonry-465');
masonry465.masonry({
@@ -53,27 +47,39 @@
});
}
-//map
+
+
+ // add item to collection behaviour
+ $('.additemtocollection').bind('click', function(e){
+ // When an item meant to be added to a collection is clicked,
+ // we fill the form in the add-to-collection div
+ console.log(this + ", " + $(this) + ", " + $(this).attr('data-type') + ", " + $(this).attr('data-id'));
+ $('#add-to-collection .item-type').val($(this).attr('data-type'));
+ $('#add-to-collection .item-id').val($(this).attr('data-id'));
+ });
+
+
+
if($('#map').length){
initmap()
}
-function initmap() {
- // set up the map
- map = new L.Map('map');
+ function initmap() {
+ // set up the map
+ map = new L.Map('map');
- // create the tile layer with correct attribution
- var osmUrl='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
- var osm = new L.TileLayer(osmUrl, {minZoom: 3, maxZoom: 20});
+ // create the tile layer with correct attribution
+ var osmUrl='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
+ var osm = new L.TileLayer(osmUrl, {minZoom: 3, maxZoom: 20});
- // start the map in South-East England
- map.setView(new L.LatLng(48.833, 2.333),4);
- map.addLayer(osm);
+ // start the map in South-East England
+ map.setView(new L.LatLng(48.833, 2.333),4);
+ map.addLayer(osm);
- // markers
- var marker1 = L.marker([48.833, 2.333]).addTo(map);
- marker1.bindPopup("Beaux-Arts de Paris");
- var marker2 = L.marker([47.233,-1.583]).addTo(map);
- marker2.bindPopup("Beaux-Arts de Nantes");
-}
+ // markers
+ var marker1 = L.marker([48.833, 2.333]).addTo(map);
+ marker1.bindPopup("Beaux-Arts de Paris");
+ var marker2 = L.marker([47.233,-1.583]).addTo(map);
+ marker2.bindPopup("Beaux-Arts de Nantes");
+ }
-});//ready
+});//ready
\ No newline at end of file
--- a/src/egonomy/static/egonomy/css/style.css Thu Jun 27 17:31:15 2013 +0200
+++ b/src/egonomy/static/egonomy/css/style.css Thu Jun 27 17:38:53 2013 +0200
@@ -234,17 +234,17 @@
.item-masonry{margin-bottom: 20px;}
.filters{padding: 10px 0; text-align: center;}
.filters li{ margin-bottom: 10px; position: relative; text-align: left; font-size: 12px; font-family: 'Lato'; display:inline-block; width: 200px; height: 28px; line-height: 28px; background-color: #fff;}
-.filters a:first-child{ overflow: hidden; color: #7F7F7F; padding-left: 6px; display: block; }
+.filters a.display-keyword{ overflow: hidden; color: #7F7F7F; display: block; height: 28px; overflow: hidden; margin: 0 16px 0 6px; }
.filters li:hover{-webkit-box-shadow : none; -moz-box-shadow : none; box-shadow : none;}
-.filters .icon-action{position: absolute; top: 10px; right: 6px;width: 10px; height: 10px; display: inline-block;}
-.filters .cross{ background: url(../img/icon-cross-10.png) 0 0 no-repeat; }
-.filters .circle{width: 10px; height: 10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; background-color: #7F7F7F;}
-.filters li.disabled a{opacity: 0.5;}
+.filters a.icon-action{float: right; margin: 10px 6px 0 0;width: 10px; height: 10px; display: inline-block; background: url(../img/icon-cross-10.png) 0 0 no-repeat; }
+.filters .disabled .icon-action{width: 10px; height: 10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; background: #7F7F7F;}
+.filters .disabled a.display-keyword{opacity: 0.5;}
.float-left{float: left;}
.filters-wrap{width: 225px; background-color: #EEE; margin-right: 17px;}
.list-projets-5{width: 708px;}
.curtain{display:none;z-index:10;position: absolute; width: 100%; height: 100%; background-color:rgba(0,0,0,.7);}
+.disabled .curtain{display: block;}
.list-projets-5 .item-masonry{margin-bottom: 0;}
.mosaic .content-project{display: none;}
.mosaic .visuel-project .title-project{display: block;}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/egonomy/static/egonomy/js/keyword-mosaic.js Thu Jun 27 17:38:53 2013 +0200
@@ -0,0 +1,110 @@
+$(function() {
+
+ $('.masonry-177').masonry({
+ columnWidth: 177,
+ itemSelector: '.item-masonry'
+ });
+
+ function updateMasonry() {
+ $('.masonry-177').masonry('layout');
+ }
+
+ var keywordsobj = {};
+
+ $(".item-masonry").each(function(i, element) {
+ $(element)
+ .attr("data-keywords")
+ .split(",")
+ .forEach(function(kw) {
+ var keyword = kw.replace(/(^\s+|\s+$)/g,''),
+ basekw = keyword.toLowerCase();
+ if (!keywordsobj.hasOwnProperty(basekw)) {
+ keywordsobj[basekw] = {
+ keyword: keyword,
+ basekeyword: basekw,
+ count: 0,
+ items: $(),
+ enabled: true
+ };
+ }
+ kwobj = keywordsobj[basekw];
+ kwobj.count++;
+ kwobj.items.push(element);
+ });
+ });
+
+ var keywordslist = [];
+
+ for (var k in keywordsobj) {
+ if (keywordsobj.hasOwnProperty(k)) {
+ keywordslist.push(keywordsobj[k]);
+ }
+ }
+
+ keywordslist.sort(function(a, b) {
+ return b.count - a.count;
+ });
+
+ var filterlist = $(".filters");
+
+ function updateKeywords() {
+ var enabledItems = $();
+ keywordslist.forEach(function(kw) {
+ if (kw.enabled) {
+ enabledItems = enabledItems.add(kw.items);
+ kw.li.removeClass("disabled");
+ } else {
+ kw.li.addClass("disabled");
+ }
+ });
+ $(".item-masonry").addClass("disabled");
+ enabledItems.removeClass("disabled");
+ }
+
+ keywordslist.slice(0,100).forEach(function(kw) {
+ var li = $('<li class="box-shadow-2">'),
+ texta = $('<a class="display-keyword" href="#">'),
+ actiona = $('<a class="icon-action" href="#">');
+ texta.text(kw.keyword + ' ');
+ li.append(actiona);
+ li.append(texta);
+ kw.li = li;
+ li.click(function() {
+ var allothersdisabled = keywordslist.reduce(function(mem, k) {
+ return mem && (k === kw || !k.enabled);
+ }, true);
+ if (allothersdisabled) {
+ keywordslist.forEach(function(k) {
+ k.enabled = true;
+ });
+ } else {
+ keywordslist.forEach(function(k) {
+ k.enabled = false;
+ });
+ kw.enabled = true;
+ }
+ updateKeywords();
+ return false;
+ });
+ actiona.click(function() {
+ kw.enabled = !kw.enabled;
+ updateKeywords();
+ return false;
+ });
+ filterlist.append(li);
+ })
+
+ $('.toggle-comment').click(function(e){
+ e.preventDefault();
+ $('.show-comment, .hide-comment').hide();
+ if($('.mosaic').length){
+ $('.mosaic').removeClass('mosaic').addClass('mosaic-comment');
+ $('.hide-comment').show();
+ }else{
+ $('.mosaic-comment').removeClass('mosaic-comment').addClass('mosaic');
+ $('.show-comment').show();
+ }
+ updateMasonry();
+ });
+
+});
--- a/src/egonomy/static/egonomy/js/main.js Thu Jun 27 17:31:15 2013 +0200
+++ b/src/egonomy/static/egonomy/js/main.js Thu Jun 27 17:38:53 2013 +0200
@@ -21,14 +21,6 @@
gutter : 16
});
- function masonry177(){
- var masonry177 = $('.masonry-177');
- masonry177.masonry({
- columnWidth: 177,
- itemSelector: '.item-masonry'
- });
- }
- masonry177();
//popin
$('.open-popin').bind('click', function(e){
e.preventDefault();
@@ -60,112 +52,6 @@
keywordsTagIt.tagit("createTag", tag);
});
}
-//mosaic
- $('.toggle-comment').bind('click', function(e){
- e.preventDefault();
- $('.show-comment, .hide-comment').hide();
- if($('.mosaic').length){
- $('.mosaic').removeClass('mosaic').addClass('mosaic-comment');
- $('.hide-comment').show();
- }else{
- $('.mosaic-comment').removeClass('mosaic-comment').addClass('mosaic');
- $('.show-comment').show();
- }
- masonry177();
- });
-
- $('.display-keyword').bind('click', function(e){
- e.preventDefault();
- var ul = $(this).parents('ul'),
- li = $(this).parents('li'),
- iconAction = li.find('.icon-action'),
- index = li.index(),
- keyword = $(this).attr('data-keyword');
-
-
- ul.find('li').each(function(k, v){
- if(index != k){
- var displayKeyword = $(v).find('.display-keyword'),
- iconAction = $(v).find('.icon-action'),
- keyword = displayKeyword.attr('data-keyword');
- disabledDisplayKeyword($(v), keyword, iconAction);
- }
- });
-
- enabledDisplayKeyword(li, keyword, iconAction);
- });
- $('.icon-action').bind('click', function(e){
- e.preventDefault();
- var li = $(this).parents('li');
- toggleDisplayKeyword(li);
- });
-/*
- function toggleDisplayKeyword(li){
- var displayKeyword = li.find('.display-keyword'),
- iconAction = li.find('.icon-action'),
- keyword = displayKeyword.attr('data-keyword');
- if(li.hasClass('disabled')){
- enabledDisplayKeyword(li, keyword, iconAction);
- }else{
- disabledDisplayKeyword(li, keyword, iconAction);
- }
- }
- function enabledDisplayKeyword(li, keyword, iconAction){
- iconAction.removeClass('cross').removeClass('circle');
- li.removeClass('disabled');
- $('li.keyword-'+keyword).find('.curtain').hide();
- iconAction.addClass('cross');
- }
- function disabledDisplayKeyword(li, keyword, iconAction){
- iconAction.removeClass('cross').removeClass('circle');
- li.addClass('disabled');
- $('li.keyword-'+keyword).find('.curtain').show();
- iconAction.addClass('circle');
- }
-*/
- function toggleDisplayKeyword(li){
- var displayKeyword = li.find('.display-keyword'),
- iconAction = li.find('.icon-action'),
- keyword = displayKeyword.attr('data-keyword');
- if(li.hasClass('disabled')){
- enabledDisplayKeyword(li, keyword, iconAction);
- }else{
- disabledDisplayKeyword(li, keyword, iconAction);
- }
- }
- function enabledDisplayKeyword(li, keyword, iconAction){
- iconAction.removeClass('cross').removeClass('circle');
- li.removeClass('disabled');
- $('ul.mosaic > li').each(function(k, v){
-
- var keywords = $(v).attr('data-keywords'),
- item = $(v);
- keywords = keywords.split(',');
- for(var i=0; i<= keywords.length; i++){
- if($.trim(keywords[i]) == keyword){
- item.find('.curtain').hide();
- }
- }
- });
- $('li.keyword-'+keyword).find('.curtain').hide();
- iconAction.addClass('cross');
- }
- function disabledDisplayKeyword(li, keyword, iconAction){
- iconAction.removeClass('cross').removeClass('circle');
- li.addClass('disabled');
- $('ul.mosaic > li').each(function(k, v){
-
- var keywords = $(v).attr('data-keywords'),
- item = $(v);
- keywords = keywords.split(',');
- for(var i=0; i<= keywords.length; i++){
- if($.trim(keywords[i]) == keyword){
- item.find('.curtain').show();
- }
- }
- });
- iconAction.addClass('circle');
- }
// add item to collection behaviour
--- a/src/egonomy/templates/egonomy_view_collection.html Thu Jun 27 17:31:15 2013 +0200
+++ b/src/egonomy/templates/egonomy_view_collection.html Thu Jun 27 17:38:53 2013 +0200
@@ -117,15 +117,15 @@
<div class="clearfix">
<div class="filters-wrap float-left">
<ul class="filters">
+ {% comment %}
{% for item in items %}
{% for t in item.content_object.tag_list %}
{% if t != "" %}
- <li class="box-shadow-2"><a class="display-keyword" data-keyword="{{ t }}" href="#">
- {{ t }} <a class="icon-action cross" href="#"></a>
- </a></li>
+ <li class="box-shadow-2"><a class="display-keyword" data-keyword="{{ t }}" href="#">{{ t }} </a><a class="icon-action cross" href="#"></a></li>
{% endif %}
{% endfor %}
{% endfor %}
+ {% endcomment %}
</ul>
</div>
<ul class="list-projets-5 mosaic float-left clearfix masonry-177">
@@ -154,6 +154,7 @@
{% endblock %}
{% block js_page %}
+<script type="text/javascript" src="{% static 'egonomy/js/keyword-mosaic.js' %}"></script>
<script type="text/javascript">
$(function() {
$("#search-type-big").change(function() {
--- a/src/egonomy/templates/partial/item_in_collection_list.html Thu Jun 27 17:31:15 2013 +0200
+++ b/src/egonomy/templates/partial/item_in_collection_list.html Thu Jun 27 17:38:53 2013 +0200
@@ -34,7 +34,7 @@
<h3>{{ fragment.title }}</h3>
<h4>{{ fragment.author }}</h4>
</div>
- <p>desc : {{ item.description }}<br/>contenttype : {{ item.content_type.model }}<br/>object_id : {{ item.object_id }}<br/>content_object : {{ item.content_object }}</p>
+ <p>desc : {{ item.description }}</p>
</div>
{% endwith %}
</li>
@@ -90,7 +90,7 @@
<h3>{{ img.metadata.titre }}</h3>
<h4>{{ img.metadata.auteur }}</h4>
</div>
- <p>desc : {{ item.description }}<br/>contenttype : {{ item.content_type.model }}<br/>object_id : {{ item.object_id }}<br/>content_object : {{ item.content_object }}</p>
+ <p>desc : {{ item.description }}</p>
</div>
</li>
{% endwith %}