Convivial works and projects in the graphic design field
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
assets
content
kirby
panel
site
.htaccess
index.php
license.mdown
readme.mdown

readme.mdown

Tools for Conviviality

This website is a part of our final year project at ENSAD. We decide to share the source code, and documentate it.

FEATURES

  • Projects organization by country
  • Projects are draggable in the country containment
  • Projects are filtrables with checkbox filters

DEPENDANCIES

CODE

Projects organization by country

Create a wrapper-div by country and append each project with the country class to this

var div = document.createElement('div');
div.className = "france-wrapper"; 
$('.projets').append(div);
$('.france').each(function() {
    $(div).append($(this));
});
$(".france-wrapper").append('<p class="pays">France</p>');

Each project take a random position in his wrapper-div

$(".france-wrapper li").each(
    function(intIndex) {

        var l = Math.floor(Math.random() * $(".france-wrapper").width());
        var t = Math.floor(Math.random() * $(".france-wrapper").height());

    $(this).css("left", l);
    $(this).css("top", t);

});

Each project is draggable in his wrapper-div and z-index increment when project is dragged

var a = 3;
$(".france-wrapper li").draggable({
    containment: ".france-wrapper",
    start: function(event, ui) { $(this).css("z-index", a++); }        
});

Use of firstImpression

if ( firstImpression() ) {
      $('.intro-text').css('display','block');
    } 
    else {
      $('.intro-text').css('display','none'); 
    } 

});	

Filters with multiple checkbox

$('div.tags').delegate('input[type=checkbox]', 'change', function()
{
    var $lis = $('.projets > div > li'),
        $checked = $('input:checked');

    if ($checked.length) {
        var selector = $checked.map(function(){
            return '.' + $(this).attr('rel');
        }).get().join('');
        $lis.hide().filter(selector).show();     
    }
    else {
        $lis.show();
    }
});