2011-10-10 18:59:20 -03:00
|
|
|
<!DOCTYPE html>
|
|
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<title>WiseMApping Workspace</title>
|
|
|
|
|
|
|
|
<!--Table Styles-->
|
|
|
|
|
|
|
|
<!--Less CSS Framework-->
|
|
|
|
<link rel="stylesheet/less" type="text/css" href="css/styles.less">
|
2011-10-10 20:25:49 -03:00
|
|
|
<link rel="stylesheet/less" type="text/css" href="css/table.less">
|
2011-10-10 18:59:20 -03:00
|
|
|
<script src="js/less-1.1.3.min.js" type="text/javascript"></script>
|
|
|
|
|
|
|
|
|
|
|
|
<!--jQuery DataTables-->
|
|
|
|
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
|
|
|
|
<script type="text/javascript" language="javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
|
|
|
|
<link href="css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet">
|
|
|
|
<script type="text/javascript" language="javascript" src="js/jquery.dataTables.js"></script>
|
2011-10-11 13:16:15 -03:00
|
|
|
<script type="text/javascript" language="javascript" src="js/jquery.dataTables.plugins.js"></script>
|
2011-10-10 18:59:20 -03:00
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
|
|
$(function() {
|
|
|
|
$('#map-table').html( '<table cellpadding="0" cellspacing="0" border="0" class="display" id="maps"></table>' );
|
2011-10-11 13:16:15 -03:00
|
|
|
var table = $('#maps').dataTable( {
|
2011-10-11 11:20:12 -03:00
|
|
|
"bProcessing" : true,
|
|
|
|
"sAjaxSource" : "json_source.txt",
|
2011-10-10 18:59:20 -03:00
|
|
|
"aoColumns": [
|
2011-10-11 11:20:12 -03:00
|
|
|
{
|
2011-10-11 13:16:15 -03:00
|
|
|
"sTitle" : '<input type="checkbox" id="selectAll"/>',
|
|
|
|
"sClass" : "center select", "sWidth" : "15px",
|
2011-10-11 11:56:27 -03:00
|
|
|
"bSortable" : false, "bSearchable" : false,
|
2011-10-11 11:20:12 -03:00
|
|
|
"fnRender" : function(obj) {
|
2011-10-11 13:16:15 -03:00
|
|
|
var id = obj.aData[0];
|
|
|
|
return '<input type="checkbox" id="'+id+'"/>';
|
2011-10-11 11:20:12 -03:00
|
|
|
}
|
|
|
|
},
|
2011-10-11 11:56:27 -03:00
|
|
|
{
|
|
|
|
"sTitle" : "Titre",
|
|
|
|
"fnRender" : function(obj) {
|
|
|
|
return obj.aData[1] + " <span class='tag'>"+obj.aData[2]+"</span>";
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{ "sTitle" : "Tags", "bVisible" : false },
|
2011-10-10 18:59:20 -03:00
|
|
|
{ "sTitle": "Utillisateurs" },
|
2011-10-11 11:56:27 -03:00
|
|
|
{
|
|
|
|
"sTitle" : "date",
|
|
|
|
"sType" : "es_date",
|
2011-10-11 13:16:15 -03:00
|
|
|
"bVisible" : false, "bSearchable" : false,
|
2011-10-11 11:56:27 -03:00
|
|
|
"fnRender" :function(obj) {
|
|
|
|
return obj.aData[4];
|
|
|
|
}
|
|
|
|
},
|
2011-10-11 11:20:12 -03:00
|
|
|
{
|
|
|
|
"sTitle": "Derniere modification",
|
|
|
|
"fnRender" : function(obj) {
|
2011-10-11 11:56:27 -03:00
|
|
|
return obj.aData[4] + " " + obj.aData[5];
|
|
|
|
},
|
|
|
|
"iDataSort" : 4
|
2011-10-11 11:20:12 -03:00
|
|
|
},
|
|
|
|
{
|
|
|
|
"sTitle": "Details",
|
|
|
|
"sClass": "center",
|
|
|
|
"sWidth" : "15px",
|
2011-10-11 11:56:27 -03:00
|
|
|
"bSortable" : false, "bSearchable" : false,
|
2011-10-11 11:20:12 -03:00
|
|
|
"fnRender" : function(obj) {
|
2011-10-11 13:16:15 -03:00
|
|
|
return '<span class="ui-icon ui-icon-triangle-1-e" style="margin: 0 auto;"></span>';
|
2011-10-11 11:20:12 -03:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2011-10-10 20:25:49 -03:00
|
|
|
],
|
|
|
|
"bAutoWidth" : false,
|
|
|
|
"bLengthChange": false,
|
2011-10-11 11:20:12 -03:00
|
|
|
"bInfo": false,
|
|
|
|
"bPaginate": false
|
2011-10-10 20:25:49 -03:00
|
|
|
});
|
2011-10-11 11:20:12 -03:00
|
|
|
|
|
|
|
$('#maps_filter').appendTo("#toolbar");
|
2011-10-11 13:16:15 -03:00
|
|
|
|
|
|
|
$('input:checkbox[id="selectAll"]').click(function() {
|
|
|
|
$("#maps").dataTableExt.selectAllMaps();
|
|
|
|
});
|
2011-10-10 20:25:49 -03:00
|
|
|
});
|
2011-10-11 11:20:12 -03:00
|
|
|
|
|
|
|
|
2011-10-11 11:56:27 -03:00
|
|
|
|
|
|
|
|
2011-10-10 18:59:20 -03:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<!--Tags-->
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
|
|
|
|
|
|
var tags = ['ThinkMapping', 'Akostic', 'Clients', 'Favoris'];
|
|
|
|
var html = "";
|
|
|
|
|
|
|
|
$(function() {
|
|
|
|
for (i in tags) {
|
|
|
|
html += "<button>"+ tags[i] +"</button>";
|
|
|
|
}
|
|
|
|
|
|
|
|
$("#tags-list").html(html);
|
|
|
|
$("#tags-list button" ).button({
|
2011-10-11 13:16:15 -03:00
|
|
|
icons: { primary: "ui-icon-folder-collapsed" }
|
2011-10-10 18:59:20 -03:00
|
|
|
});
|
|
|
|
|
|
|
|
$("#tags-actions button" ).button({
|
2011-10-11 13:16:15 -03:00
|
|
|
icons: { primary: "ui-icon-plus" }
|
2011-10-10 18:59:20 -03:00
|
|
|
});
|
|
|
|
});
|
|
|
|
</script>
|
2011-10-11 11:20:12 -03:00
|
|
|
|
|
|
|
<!--Toolbar-->
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
|
|
$(function() {
|
|
|
|
$("#show-tags").click(function() {
|
|
|
|
|
|
|
|
})
|
|
|
|
});
|
|
|
|
</script>
|
2011-10-11 13:16:15 -03:00
|
|
|
|
|
|
|
<!--Buttons-->
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
|
|
$(function() {
|
|
|
|
$("#buttons .show-tags").button({
|
|
|
|
icons: { primary: "ui-icon-folder-open" }
|
|
|
|
});
|
|
|
|
$("#buttons .share").button({
|
|
|
|
icons: { primary: "ui-icon-transferthick-e-w" }
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#buttons .delete").button({
|
|
|
|
icons: { primary: "ui-icon-trash" }
|
|
|
|
}).click(function() {
|
|
|
|
var selectedMaps = $('#maps').dataTableExt.getSelectedMaps();
|
|
|
|
console.log("Delete maps: " +selectedMaps);
|
|
|
|
var html2 = $('#delete-dialog-modal p span').html(selectedMaps.toString());
|
|
|
|
console.log(html2);
|
|
|
|
|
|
|
|
$( "#delete-dialog-modal" ).dialog({
|
|
|
|
height: 140,
|
|
|
|
modal: true,
|
|
|
|
buttons: {
|
|
|
|
"Delete": function() {
|
|
|
|
$( this ).dialog( "close" );
|
|
|
|
},
|
|
|
|
Cancel: function() {
|
|
|
|
$( this ).dialog( "close" );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
})
|
|
|
|
</script>
|
2011-10-10 18:59:20 -03:00
|
|
|
</head>
|
|
|
|
|
|
|
|
<body>
|
|
|
|
<div id="wrapper">
|
2011-10-11 11:20:12 -03:00
|
|
|
<div id="toolbar" class="toolbar">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
2011-10-11 13:16:15 -03:00
|
|
|
<div id="buttons">
|
|
|
|
<div id="delete-dialog-modal" title="Delete maps" style="display: none">
|
|
|
|
<p>Are you sure you want to delete maps <span></span> ?</p>
|
|
|
|
</div>
|
|
|
|
<button class="show-tags">Organiser</button>
|
|
|
|
<button class="share">Partager</button>
|
|
|
|
<button class="delete">Supprimer</button>
|
2011-10-11 11:20:12 -03:00
|
|
|
</div>
|
2011-10-10 20:25:49 -03:00
|
|
|
|
|
|
|
<div>
|
|
|
|
<div id="tags">
|
|
|
|
<h2>Mes dossiers:</h2>
|
|
|
|
<div id="tags-list"></div>
|
|
|
|
<div id="tags-actions">
|
|
|
|
<button>Nouveau Dossier</button>
|
|
|
|
</div>
|
2011-10-10 18:59:20 -03:00
|
|
|
</div>
|
2011-10-10 20:25:49 -03:00
|
|
|
<div id="map-table"></div>
|
2011-10-10 18:59:20 -03:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html>
|