Hawkin
/
arangodb
mirror of https://gitee.com/bigwinds/arangodb
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

new interface

This commit is contained in:
Heiko Kernbach 2012-02-03 11:32:47 +01:00
parent 943a90fa29
commit 618c58b2b2
4 changed files with 302 additions and 165 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
html/admin/css/images/.directory
View File

@ -1,4 +0,0 @@
[Dolphin]
ShowPreview=true
Timestamp=2011,12,9,11,16,33
Version=2

53
html/admin/css/layout.css
View File

@ -24,3 +24,56 @@
.ui-layout-resizer-north { .ui-layout-resizer-north {
background-color: #61FE59 !important; background-color: #61FE59 !important;
} }
.ui-tooltip-dialogue{
max-width: 420px;
min-width: 210px;
-moz-box-shadow: 0 0 10px 1px rgba(0,0,0,.5);
-webkit-box-shadow: 0 0 10px 1px rgba(0,0,0,.5);
box-shadow: 0 0 10px 1px rgba(0,0,0,.5);
}
.ui-tooltip-dialogue .ui-tooltip-content{
padding: 10px;
}
.ui-tooltip-dialogue button{
float: left;
width: 47%;
margin-right: 10px;
padding: 3px 0;
text-align: center;
font-size: 10.5px;
}
.ui-tooltip-dialogue button + button{
float: right;
margin-right: 0;
}
.ui-tooltip-dialogue input{
width: 95%;
padding: 3px 0 3px 5px;
margin-bottom: 7px;
font-size: 10.5px;
}
.ui-tooltip-dialogue button.full{
float: none;
width: 100%;
}
#navigation {
text-align: center;
text-decoration: none;
font-size: 20px;
font-family: "Arial","Helvetica","Verdana","sans-serif";
}
body {
font-family: "Arial","Helvetica","Verdana","sans-serif";
}

406
html/admin/index.html
View File

@ -15,116 +15,135 @@
<script type="text/javascript" language="javascript" src="script/jquery.qtip.js"></script> <script type="text/javascript" language="javascript" src="script/jquery.qtip.js"></script>
<script type="text/javascript" language="javascript" src="script/jquery.jeditable.js"></script> <script type="text/javascript" language="javascript" src="script/jquery.jeditable.js"></script>
</head> </head>
<body> <body>
<script> <script>
function dialogue(content, title) {
$(this).qtip(
{
content: {
text: content,
title: title
},
position: {
my: 'center', at: 'center',
target: $(window)
},
show: {
ready: true,
modal: {
on: true,
blur: false
}
},
hide: false,
style: 'ui-tooltip-green ui-tooltip-rounded ui-tooltip-dialogue',
events: {
render: function(event, api) {
$('button', api.elements.content).click(api.hide);
},
hide: function(event, api) { api.destroy(); }
}
});
}
function Confirm(question, callback) {
var message = $('<p />', { text: question }),
ok = $('<button />', {
text: 'Ok',
click: function() { callback(true); }
}),
cancel = $('<button />', {
text: 'Cancel',
click: function() { callback(false); }
});
dialogue( message.add(ok).add(cancel), 'Do you agree?' );
}
//Formatierung fehlt...
var oCache = { var oCache = {
iCacheLower: -1 iCacheLower: -1
}; };
function fnSetKey( aoData, sKey, mValue ) function fnSetKey( aoData, sKey, mValue ) {
{ for ( var i=0, iLen=aoData.length ; i<iLen ; i++ ) {
for ( var i=0, iLen=aoData.length ; i<iLen ; i++ ) if ( aoData[i].name == sKey ) {
{ aoData[i].value = mValue;
if ( aoData[i].name == sKey )
{
aoData[i].value = mValue;
} }
}
} }
}
function fnGetKey( aoData, sKey ) function fnGetKey( aoData, sKey ) {
{ for ( var i=0, iLen=aoData.length ; i<iLen ; i++ ) {
for ( var i=0, iLen=aoData.length ; i<iLen ; i++ ) if ( aoData[i].name == sKey ) {
{ return aoData[i].value;
if ( aoData[i].name == sKey )
{
return aoData[i].value;
} }
}
return null;
} }
return null;
}
function fnDataTablesPipeline ( sSource, aoData, fnCallback ) { function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
var iPipe = 5; /* Ajust the pipe size */ var iPipe = 5; /* Ajust the pipe size */
var bNeedServer = false;
var sEcho = fnGetKey(aoData, "sEcho");
var iRequestStart = fnGetKey(aoData, "iDisplayStart");
var iRequestLength = fnGetKey(aoData, "iDisplayLength");
var iRequestEnd = iRequestStart + iRequestLength;
oCache.iDisplayStart = iRequestStart;
var bNeedServer = false; if ( oCache.iCacheLower < 0 || iRequestStart < oCache.iCacheLower || iRequestEnd > oCache.iCacheUpper ) {
var sEcho = fnGetKey(aoData, "sEcho"); bNeedServer = true;
var iRequestStart = fnGetKey(aoData, "iDisplayStart"); }
var iRequestLength = fnGetKey(aoData, "iDisplayLength");
var iRequestEnd = iRequestStart + iRequestLength;
oCache.iDisplayStart = iRequestStart;
/* outside pipeline? */ if ( oCache.lastRequest && !bNeedServer ) {
if ( oCache.iCacheLower < 0 || iRequestStart < oCache.iCacheLower || iRequestEnd > oCache.iCacheUpper ) for( var i=0, iLen=aoData.length ; i<iLen ; i++ ) {
{ if ( aoData[i].name != "iDisplayStart" && aoData[i].name != "iDisplayLength" && aoData[i].name != "sEcho" ) {
bNeedServer = true; if ( aoData[i].value != oCache.lastRequest[i].value ) {
} bNeedServer = true;
break;
/* sorting etc changed? */ }
if ( oCache.lastRequest && !bNeedServer )
{
for( var i=0, iLen=aoData.length ; i<iLen ; i++ )
{
if ( aoData[i].name != "iDisplayStart" && aoData[i].name != "iDisplayLength" && aoData[i].name != "sEcho" )
{
if ( aoData[i].value != oCache.lastRequest[i].value )
{
bNeedServer = true;
break;
}
} }
}
} }
}
/* Store the request for checking next time around */ oCache.lastRequest = aoData.slice();
oCache.lastRequest = aoData.slice(); if ( bNeedServer ) {
if ( iRequestStart < oCache.iCacheLower ) {
if ( bNeedServer )
{
if ( iRequestStart < oCache.iCacheLower )
{
iRequestStart = iRequestStart - (iRequestLength*(iPipe-1)); iRequestStart = iRequestStart - (iRequestLength*(iPipe-1));
if ( iRequestStart < 0 ) if ( iRequestStart < 0 ) {
{ iRequestStart = 0;
iRequestStart = 0;
} }
} }
oCache.iCacheLower = iRequestStart; oCache.iCacheLower = iRequestStart;
oCache.iCacheUpper = iRequestStart + (iRequestLength * iPipe); oCache.iCacheUpper = iRequestStart + (iRequestLength * iPipe);
oCache.iDisplayLength = fnGetKey( aoData, "iDisplayLength" ); oCache.iDisplayLength = fnGetKey( aoData, "iDisplayLength" );
fnSetKey( aoData, "iDisplayStart", iRequestStart ); fnSetKey( aoData, "iDisplayStart", iRequestStart );
fnSetKey( aoData, "iDisplayLength", iRequestLength*iPipe ); fnSetKey( aoData, "iDisplayLength", iRequestLength*iPipe );
$.getJSON( sSource, aoData, function (json) { $.getJSON( sSource, aoData, function (json) {
/* Callback processing */
oCache.lastJson = jQuery.extend(true, {}, json); oCache.lastJson = jQuery.extend(true, {}, json);
if ( oCache.iCacheLower != oCache.iDisplayStart ) if ( oCache.iCacheLower != oCache.iDisplayStart ) {
{ json.aaData.splice( 0, oCache.iDisplayStart-oCache.iCacheLower );
json.aaData.splice( 0, oCache.iDisplayStart-oCache.iCacheLower );
} }
json.aaData.splice( oCache.iDisplayLength, json.aaData.length ); json.aaData.splice( oCache.iDisplayLength, json.aaData.length );
fnCallback(json) fnCallback(json)
} ); });
}
else {
json = jQuery.extend(true, {}, oCache.lastJson);
json.sEcho = sEcho; /* Update the echo for each response */
json.aaData.splice( 0, iRequestStart-oCache.iCacheLower );
json.aaData.splice( iRequestLength, json.aaData.length );
fnCallback(json);
return;
}
} }
else
{
json = jQuery.extend(true, {}, oCache.lastJson);
json.sEcho = sEcho; /* Update the echo for each response */
json.aaData.splice( 0, iRequestStart-oCache.iCacheLower );
json.aaData.splice( iRequestLength, json.aaData.length );
fnCallback(json);
return;
}
}
$(document).ready(function() { $(document).ready(function() {
document.getElementById("save_doc").disabled=true;
//alert(document.location.href); //alert(document.location.href);
//jQuery Layout init //jQuery Layout init
@ -137,7 +156,7 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
east__spacing_open: 0, east__spacing_open: 0,
east__spacing_closed: 0, east__spacing_closed: 0,
}); });
var xTable; var xTable;
var lastClickedID; var lastClickedID;
var nCloneTh = document.createElement( 'th' ); var nCloneTh = document.createElement( 'th' );
@ -274,7 +293,7 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
var sub_items=[]; var sub_items=[];
var i = 0; var i = 0;
$.each(data.references, function(val) { $.each(data.references, function(val) {
sub_items.push(["<img src=images/edit.gif id=" + data.references[i] + "></img><img src=images/delete.png></img>", sub_items.push(["<img src=images/edit.gif id=" + data.references[i] + "></img><img src=images/delete.png id=" + data.references[i] + "></img>",
data.references[i]]); data.references[i]]);
i = i + 1; i = i + 1;
}); });
@ -297,8 +316,21 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
}); });
$('#subTable tbody td img ').live('click', function () { $('#subTable tbody td img ').live('click', function () {
if (this.src.match('delete')) {
var getJSON_sub = "../_document/" + this.id;
Confirm('Really delete this document?', function(yes) {
$.ajax({
type: 'DELETE',
contentType: "application/json",
url: getJSON_sub,
});
});
Confirm('Really delete this document?', function(no) {
});
}
if (this.src.match('edit')) { if (this.src.match('edit')) {
//WICHTIG document.getElementById('database_header3').innerHTML=" > " + this.id
var doc_items = []; var doc_items = [];
lastClickedID = this.id; lastClickedID = this.id;
var getJSON_sub = "/_document/" + this.id; var getJSON_sub = "/_document/" + this.id;
@ -308,8 +340,10 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
contentType: "application/json", contentType: "application/json",
success: function(data) { success: function(data) {
$.each(data, function(key, val) { $.each(data, function(key, val) {
doc_items.push([key, val]); doc_items.push([key, val]);
$('#edit_detail_view').show(); $('#edit_view').show();
$('#new_document_view').hide();
$('#detail_view').hide();
}); });
yTable = $('#docTable').dataTable( { yTable = $('#docTable').dataTable( {
"bDestroy": true, "bDestroy": true,
@ -319,72 +353,151 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
"aaData": doc_items, "aaData": doc_items,
"sEmptyTable": "No matching data available", "sEmptyTable": "No matching data available",
}); });
var temp_url; $('td', yTable.fnGetNodes()).editable(function(value, settings) {
temp_url = "/admin/save.php"; var aPos = yTable.fnGetPosition(this);
$('td', yTable.fnGetNodes()).editable(temp_url, { yTable.fnUpdate(value, aPos[0], aPos[1]);
"submitdata": function ( value, settings ) { var obj = yTable.fnGetData();
alert(value);
}, var dummymann = { };
"height": "20px", for (var key in obj) {
var element = obj[key];
var namex = new String(obj[key][0]);
if (!namex.match(/^[a-zA-Z_][a-zA-Z0-9_]*$/)) {
alert("Musse fix "+namex);
return 0;
}
if (! isNaN(obj[key][1])) {
dummymann[namex] = Number(obj[key][1]);
$('#save_doc').removeClass('ui-state-disabled');
document.getElementById("save_doc").disabled=false;
return value;
}
else {
dummymann[namex] = obj[key][1];
$('#save_doc').removeClass('ui-state-disabled');
document.getElementById("save_doc").disabled=false;
return value;
}
}
},{
type: 'textarea',
submit: 'Ok',
cancel: 'Cancel',
indicator: 'img/indicator.gif'
}); });
}, },
error: function() { error: function() {
alert("Error"); alert("Error");
return 0;
} }
}); });
$('#edit_view').show();
$('#new_entry_view').hide();
} }
}); });
$("button").click(function() { $("button").click(function() {
var button_id = this.id; var button_id = this.id;
var getJSON_sub = lastClickedID;
if (button_id == "add_row") {
$('#docTable').dataTable().fnAddData( ["key", "val"] );
$('td', yTable.fnGetNodes()).editable(function(value, settings) {
var aPos = yTable.fnGetPosition(this);
yTable.fnUpdate(value, aPos[0], aPos[1]);
var obj = yTable.fnGetData();
var dummymann = { };
for (var key in obj) {
var element = obj[key];
var namex = new String(obj[key][0]);
if (!namex.match(/^[a-zA-Z_][a-zA-Z0-9_]*$/)) {
alert("Musse fix "+namex);
}
if (! isNaN(obj[key][1])) {
dummymann[namex] = Number(obj[key][1]);
document.getElementById("save_doc").disabled=false;
$('#save_doc').removeClass('ui-state-disabled');
return value;
}
else {
dummymann[namex] = obj[key][1];
document.getElementById("save_doc").disabled=false;
$('#save_doc').removeClass('ui-state-disabled');
return value;
}
}
},{
type: 'textarea',
submit: 'Ok',
cancel: 'Cancel',
indicator: 'img/indicator.gif'
});
return 0;
}
if (button_id == "back_entry") { if (button_id == "back_entry") {
xTable.fnClearTable(); xTable.fnClearTable();
$('#new_entry_view').hide(); $('#new_document_view').hide();
$('#edit_view').hide(); $('#edit_view').hide();
$('#detail_view').hide(); $('#detail_view').hide();
$('#edit_detail_view').hide();
$('#tableWindow').show(); $('#tableWindow').show();
document.getElementById('database_header2').innerHTML=""; document.getElementById('database_header2').innerHTML="";
return 0; return 0;
} }
if (button_id == "update_json") { if (button_id == "back_entry2") {
var json_string = document.getElementById('json_user_edit').value; $('#edit_view').hide();
$('#detail_view').show();
return 0;
}
if (button_id == "save_doc") {
var obj = yTable.fnGetData();
alert("obj: " + JSON.stringify(obj));
var dummymann = { };
for (var key in obj) {
var element = obj[key];
var namex = new String(obj[key][0]);
if (!namex.match(/^[a-zA-Z_][a-zA-Z0-9_]*$/)) {
alert("Musse fix "+namex);
}
if (! isNaN(obj[key][1])) {
dummymann[namex] = Number(obj[key][1]);
}
else {
dummymann[namex] = obj[key][1];
}
}
var getJSON_sub_url = "/_document/" + lastClickedID; var getJSON_sub_url = "/_document/" + lastClickedID;
$.ajax({ $.ajax({
type: "PUT", type: "PUT",
url: getJSON_sub_url, url: getJSON_sub_url,
contentType: "application/json", contentType: "application/json",
data: json_string, data: JSON.stringify(dummymann),
statusCode: { statusCode: {
204: function() { 204: function() {
alert("Done!"); alert("Done!");
$('#edit_detail_view').hide(); $('#save_doc').addClass('ui-state-disabled');
document.getElementById("save_doc").disabled=true;
}, },
400: function() { 400: function() {
alert("Error! - Wrong Syntax?!"); alert("Error! - Wrong Syntax?!");
} }
} }
}); });
return 0; return 0;
} }
if (button_id == "new_entry") {
if (button_id == "new_document") {
$('#edit_view').hide(); $('#edit_view').hide();
$('#new_entry_view').show(); $('#new_document_view').show();
return 0; return 0;
} }
if (button_id == "delete_json") {
alert("no function yet");
return 0;
}
if (button_id == "add_json") { if (button_id == "add_json") {
var json_input_data = document.getElementById('json_new_entry').value; var json_input_data = document.getElementById('json_new_document').value;
var json_input_url = "/_document/" + document.getElementById('database_header2').innerHTML; var json_input_url = "/_document/" + document.getElementById('database_header2').innerHTML;
$.ajax({ $.ajax({
type: "POST", type: "POST",
@ -412,7 +525,6 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
"aoColumns": [ {"bSortable":false, "sClass":"center"} , {"sClass":"center"}] "aoColumns": [ {"bSortable":false, "sClass":"center"} , {"sClass":"center"}]
}); });
}); });
$('#edit_detail_view').hide();
alert("Done!"); alert("Done!");
}, },
201: function() { 201: function() {
@ -426,7 +538,7 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
i = i + 1; i = i + 1;
}); });
xTable = $('#subTable').dataTable( { xTable = $('#subTable').dataTable({
"bDestroy": true, "bDestroy": true,
"bProcessing": true, "bProcessing": true,
"bJQueryUI": true, "bJQueryUI": true,
@ -435,7 +547,6 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
"aoColumns": [ {"bSortable":false, "sClass":"center"} , {"sClass":"center"}] "aoColumns": [ {"bSortable":false, "sClass":"center"} , {"sClass":"center"}]
}); });
}); });
$('#edit_detail_view').hide();
alert("Done!"); alert("Done!");
}, },
400: function() { 400: function() {
@ -443,8 +554,6 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
} }
} }
}); });
return 0; return 0;
} }
@ -467,19 +576,21 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
</script> </script>
<div class="ui-layout-north"> <div class="ui-layout-north">
<b><a href="/admin/index.html" id="database_header1" style="text-decoration: none; color:white">Home</b> <b><a href="/admin/index.html" id="database_header1" style="text-decoration: none; color:white">Home</b></a>
<b><a href=# id="database_header2" style="color:white; text-decoration:none"></a></b> <b><a href=# id="database_header2" style="color:white; text-decoration:none"></a></b>
<b><a href=# id="database_header3" style="color:white; text-decoration:none"></a></b>
</div> </div>
<div class="ui-layout-east" bgcolor=grey> <div class="ui-layout-east" bgcolor=grey>
<a href="/admin/index.html"><img src="/admin/images/avocado.png" style="width: 100%"></img></a><br> <a href="/admin/index.html"><img src="/admin/images/avocado.png" style="width: 100%"></img></a><br>
<ul> <div id = navigation>
<li><a href="#test">Aberdeen</a></li> <ul>
<li><a href="#">Ada</a></li> <a href="#test">Aberdeen</a><br>
<li><a href="#">Adamsville</a></li> <a href="#">Adamsville</a><br>
<li><a href="#">Addyston</a></li> <a href="#">Addyston</a><br>
<li><a href="#">Adelphi</a></li> <a href="#">Adelphi</a><br>
</ul> </ul>
</div>
</div> </div>
<div class="ui-layout-center"> <div class="ui-layout-center">
@ -500,7 +611,7 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
<div id="detail_view" style="display:none"> <div id="detail_view" style="display:none">
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="back_entry">Back</button> <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="back_entry">Back</button>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="new_entry">Add Document</button><br></br> <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="new_document">Add Document</button><br></br>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="subTable"> <table cellpadding="0" cellspacing="0" border="0" class="display" id="subTable">
<thead> <thead>
<tr> <tr>
@ -510,39 +621,20 @@ function fnDataTablesPipeline ( sSource, aoData, fnCallback ) {
</table> </table>
</div> </div>
<div> <div id="edit_view" style="display:none">
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="back_entry2"> Back </button>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="add_row"> Add Line </button>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all ui-state-disabled" id="save_doc"> Save Document </button><br></br>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="docTable"> <table cellpadding="0" cellspacing="0" border="0" class="display" id="docTable">
<thead> <thead>
<tr> <tr>
<th>Fields</th> <th>Fields</th>
<th>Value</th> <th>Value</th>
<thead> <thead>
</table> </table>
</div>
<div class="sub_right" id="new_entry_view" style="display:none">
<form action=textarea.htm">
<p>New Collection<br>
<textarea id="json_new_entry" cols="50" rows="10"></textarea>
</p>
</form>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="add_json">Add Collection</button>
</div>
<div id="edit_view" style="display:none">
<div id="edit_detail_view" style="display:none">
<form action="textarea.htm">
<p>Edit Collection <br>
<textarea id="json_user_edit" cols="50" rows="10">Hier sollte das json file erscheinen</textarea>
</p>
</form>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" id="update_json"> Update Collection </button>
</div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

4
html/admin/save.php
View File

@ -1,4 +0,0 @@
<?php
$editedValue = $_GET['value']
echo $editedValue
?>