Now multiple tags supported

This commit is contained in:
Gonzalo Bellver 2011-10-11 15:15:30 -03:00
parent 83d2dd4603
commit 6c175168eb
4 changed files with 44 additions and 32 deletions

View File

@ -60,13 +60,19 @@ body {
margin-top: 0px;
}
button {
display: block;
div.tag {
margin-bottom: @base-margin;
.ui-icon {
float:left;
margin-right: @base-margin / 2;
position: relative;
top: -2px;
}
}
#tags-actions {
margin-top: @base-margin * 2;
margin-top: @base-margin;
}
}
@ -86,7 +92,7 @@ body {
#toolbar {
border: @tags-border-size solid @base-color * 11;
padding: @base-padding;
margin-bottom: @base-margin * 2;
margin-bottom: @base-margin;
}

View File

@ -8,6 +8,8 @@
@base-border-size: 1px;
@base-color: #111;
@th-background-color: #FFFFFF;
.rounded-corners (@radius: 5px) {
border-radius: @radius;
-webkit-border-radius: @radius;
@ -97,7 +99,7 @@ table.display {
border-bottom: 1px solid black;
font-weight: bold;
cursor: pointer;
background: white;
}
tfoot th {
@ -123,23 +125,27 @@ table.display {
/* ---------------------------- Sorting --------------------------------- */
.sorting_asc {
background: url('../images/sort_asc.png') no-repeat center right;
background: @th-background-color url('../images/sort_asc.png') no-repeat center right;
}
.sorting_desc {
background: url('../images/sort_desc.png') no-repeat center right;
background: @th-background-color url('../images/sort_desc.png') no-repeat center right;
}
.sorting {
background: url('../images/sort_both.png') no-repeat center right;
background: @th-background-color url('../images/sort_both.png') no-repeat center right;
}
.sorting_disabled {
background: @th-background-color;
}
.sorting_asc_disabled {
background: url('../images/sort_asc_disabled.png') no-repeat center right;
background: @th-background-color url('../images/sort_asc_disabled.png') no-repeat center right;
}
.sorting_desc_disabled {
background: url('../images/sort_desc_disabled.png') no-repeat center right;
background: @th-background-color url('../images/sort_desc_disabled.png') no-repeat center right;
}

View File

@ -1,15 +1,15 @@
{ "aaData": [
["1", "Fonctionnel plateforme", "ThinkMapping", "moi", "14/06/2011", "moi"],
["2", "Comportement topic", "", "moi, Olivier, Nicolas", "14/06/2011", "Olivier"],
["3", "TM Blog", "ThinkMapping", "moi", "14/06/2011", "moi"],
["4", "Bloom", "", "moi", "13/06/2011", "moi"],
["5", "Morning Mr. Magpie", "", "moi, Martin", "10/06/2011", "Martin"],
["6", "Little By Little", "", "moi, Sophie", "10/06/2011", "Sophie"],
["7", "Feral", "", "moi", "14/05/2011", "moi"],
["8", "Lotus Flower", "", "moi, Sophie, Olivier", "13/05/2011", "Olivier"],
["9", "Codex", "", "moi", "30/04/2011", "moi"],
["10", "Give Up The Ghost", "", "moi, Olivier", "30/04/2011", "moi"],
["11", "Separator", "", "moi, Olivier, Nicolas, Sophie", "02/04/2011", "Olivier"],
["12", "Supercollider", "", "moi, Olivier", "02/04/2011", "Olivier"],
["13", "The Butcher", "", "moi", "01/04/2011", "moi"]
["1", "Fonctionnel plateforme", ["ThinkMapping"], "moi", "14/06/2011", "moi"],
["2", "Comportement topic", [""], "moi, Olivier, Nicolas", "14/06/2011", "Olivier"],
["3", "TM Blog", ["ThinkMapping"], "moi", "14/06/2011", "moi"],
["4", "Bloom", ["Clients,Favoris"], "moi", "13/06/2011", "moi"],
["5", "Morning Mr. Magpie", [""], "moi, Martin", "10/06/2011", "Martin"],
["6", "Little By Little", [""], "moi, Sophie", "10/06/2011", "Sophie"],
["7", "Feral", [""], "moi", "14/05/2011", "moi"],
["8", "Lotus Flower", [""], "moi, Sophie, Olivier", "13/05/2011", "Olivier"],
["9", "Codex", [""], "moi", "30/04/2011", "moi"],
["10", "Give Up The Ghost", [""], "moi, Olivier", "30/04/2011", "moi"],
["11", "Separator", [""], "moi, Olivier, Nicolas, Sophie", "02/04/2011", "Olivier"],
["12", "Supercollider", [""], "moi, Olivier", "02/04/2011", "Olivier"],
["13", "The Butcher", [""], "moi", "01/04/2011", "moi"]
]}

View File

@ -36,7 +36,12 @@
{
"sTitle" : "Titre",
"fnRender" : function(obj) {
return obj.aData[1] + " <span class='tag'>"+obj.aData[2]+"</span>";
var tagsList = obj.aData[2].toString().split(",");
var tagsHtml = ""
for (var i in tagsList) {
tagsHtml += " <span class='tag'>"+tagsList[i]+"</span>";
}
return obj.aData[1] + tagsHtml;
}
},
{ "sTitle" : "Tags", "bVisible" : false },
@ -62,7 +67,7 @@
"sWidth" : "15px",
"bSortable" : false, "bSearchable" : false,
"fnRender" : function(obj) {
return '<span class="ui-icon ui-icon-triangle-1-e" style="margin: 0 auto;"></span>';
return '<span class="ui-icon ui-icon-circle-triangle-e" style="margin: 0 auto;"></span>';
}
}
@ -93,16 +98,11 @@
$(function() {
for (i in tags) {
html += "<button>"+ tags[i] +"</button>";
html += '<div class="tag"><span class="ui-icon ui-icon-folder-collapsed" ></span>' + tags[i] + '</div>';
}
$("#tags-list").html(html);
$("#tags-list button" ).button({
icons: { primary: "ui-icon-folder-collapsed" }
});
$("#tags-actions button" ).button({
icons: { primary: "ui-icon-plus" }
icons: { primary: "ui-icon-plusthick" }
});
});
</script>