|
@@ -9,12 +9,54 @@
|
|
<script src="../script/jquery.min.js"></script>
|
|
<script src="../script/jquery.min.js"></script>
|
|
<script src="../script/ao_module.js"></script>
|
|
<script src="../script/ao_module.js"></script>
|
|
<script src="../script/semantic/semantic.min.js"></script>
|
|
<script src="../script/semantic/semantic.min.js"></script>
|
|
|
|
+ <script type="application/javascript" src="../script/clipboard.min.js"></script>
|
|
<title>Lambda @ arozos</title>
|
|
<title>Lambda @ arozos</title>
|
|
<style>
|
|
<style>
|
|
body{
|
|
body{
|
|
background-color:white;
|
|
background-color:white;
|
|
}
|
|
}
|
|
- </style>
|
|
|
|
|
|
+ /* Tooltip container */
|
|
|
|
+ .tooltip {
|
|
|
|
+ position: relative;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ /* Tooltip text */
|
|
|
|
+ .tooltip .tooltiptext {
|
|
|
|
+ visibility: hidden;
|
|
|
|
+ width: 120px;
|
|
|
|
+ background-color: #555;
|
|
|
|
+ color: #fff;
|
|
|
|
+ text-align: center;
|
|
|
|
+ padding: 5px 0;
|
|
|
|
+ border-radius: 6px;
|
|
|
|
+
|
|
|
|
+ /* Position the tooltip text */
|
|
|
|
+ position: absolute;
|
|
|
|
+ z-index: 1;
|
|
|
|
+ bottom: 125%;
|
|
|
|
+ left: 50%;
|
|
|
|
+ margin-left: -60px;
|
|
|
|
+
|
|
|
|
+ /* Fade in tooltip */
|
|
|
|
+ opacity: 0;
|
|
|
|
+ transition: opacity 0.3s;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ /* Tooltip arrow */
|
|
|
|
+ .tooltip .tooltiptext::after {
|
|
|
|
+ content: "";
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 100%;
|
|
|
|
+ left: 50%;
|
|
|
|
+ margin-left: -5px;
|
|
|
|
+ border-width: 5px;
|
|
|
|
+ border-style: solid;
|
|
|
|
+ border-color: #555 transparent transparent transparent;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ </style>
|
|
</head>
|
|
</head>
|
|
<body>
|
|
<body>
|
|
<div class="ui container" style="height: 100% !important;">
|
|
<div class="ui container" style="height: 100% !important;">
|
|
@@ -28,6 +70,7 @@
|
|
</h1>
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
<div class="ui divider"></div>
|
|
<div class="ui divider"></div>
|
|
|
|
+ <div id="deleteSuceed" style="display:none;" class="ui green inverted segment"><i class="checkmark icon"></i>Deleted</div>
|
|
<div>
|
|
<div>
|
|
<table class="ui celled table">
|
|
<table class="ui celled table">
|
|
<thead>
|
|
<thead>
|
|
@@ -47,45 +90,111 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ui divider"></div>
|
|
<div class="ui divider"></div>
|
|
|
|
+ <div id="updateSuceed" style="display:none;" class="ui green inverted segment"><i class="checkmark icon"></i>Added</div>
|
|
<h4>Select AGI script Location</h4>
|
|
<h4>Select AGI script Location</h4>
|
|
- <div class="ui action fluid input">
|
|
|
|
- <input id="webroot" type="text" placeholder="Select Location" readonly="true">
|
|
|
|
- <button class="ui black button" onclick="openfileselector();"><i class="folder open icon"></i> Open</button>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="ui action fluid input">
|
|
|
|
+ <input id="agiPath" type="text" placeholder="Select Location" readonly="true">
|
|
|
|
+ <button class="ui black button" onclick="openfileselector();"><i class="folder open icon"></i> Open</button>
|
|
|
|
+ </div>
|
|
|
|
+ <br>
|
|
|
|
+ <button class="ui positive button" onclick="add();">Add</button>
|
|
<br><br>
|
|
<br><br>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
<script>
|
|
$.getJSON( "/api/ajgi/listExt", function( data ) {
|
|
$.getJSON( "/api/ajgi/listExt", function( data ) {
|
|
$.each( data, function( key, val ) {
|
|
$.each( data, function( key, val ) {
|
|
- $("#records").append(`tr>
|
|
|
|
- <td>` + key +`</th>
|
|
|
|
- <td>` + val.path + `</td>
|
|
|
|
- <td>
|
|
|
|
- <button class="ui icon negative button">
|
|
|
|
- <i class="close icon"></i>
|
|
|
|
- </button>
|
|
|
|
- </td>
|
|
|
|
- </tr>`);
|
|
|
|
|
|
+ appendTable(key, val.path);
|
|
});
|
|
});
|
|
|
|
+ if(Object.keys(data).length == 0) {
|
|
|
|
+ $("#records").append(`<tr id="zeroRec"><td>0 record returned.</td></tr>`);
|
|
|
|
+ }
|
|
});
|
|
});
|
|
|
|
|
|
function openfileselector(){
|
|
function openfileselector(){
|
|
- ao_module_openFileSelector(fileLoader, "user:/", "file",false);
|
|
|
|
|
|
+ ao_module_openFileSelector(fileLoader, "user:/", "file",false, {filter:["agi"]});
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
function fileLoader(filedata){
|
|
function fileLoader(filedata){
|
|
- if (filedata.length == 0){
|
|
|
|
- $("#flist").text("No file selected");
|
|
|
|
- return;
|
|
|
|
|
|
+ for (var i=0; i < filedata.length; i++){
|
|
|
|
+ var filename = filedata[i].filename;
|
|
|
|
+ var filepath = filedata[i].filepath;
|
|
|
|
+ $("#agiPath").val(filepath);
|
|
}
|
|
}
|
|
- $("#flist").html("");
|
|
|
|
- for (var i =0; i < filedata.length; i++){
|
|
|
|
- $("#flist").append(filedata[i].filename + " / " + filedata[i].filepath + "<br>");
|
|
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ function add() {
|
|
|
|
+ var path = $("#agiPath").val();
|
|
|
|
+ $.getJSON( "/api/ajgi/addExt?path=" + path, function( data ) {
|
|
|
|
+ if(data.error == undefined) {
|
|
|
|
+ $("#updateSuceed").slideDown("fast").delay(3000).slideUp("fast");
|
|
|
|
+ appendTable(data, path);
|
|
|
|
+ }else{
|
|
|
|
+ alert(data.error);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ function delRecord(element) {
|
|
|
|
+ $.getJSON( "/api/ajgi/rmExt?uuid=" + $(element).attr("uuid"), function( data ) {
|
|
|
|
+ if(data == "OK") {
|
|
|
|
+ $("#deleteSuceed").slideDown("fast").delay(3000).slideUp("fast");
|
|
|
|
+ }else{
|
|
|
|
+ alert(data.error);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ $(element).parent().parent().remove().slideUp("fast");
|
|
|
|
+ if($("#records").html().trim() == '') {
|
|
|
|
+ $("#records").append(`<tr id="zeroRec"><td>0 record returned.</td></tr>`);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ var tokenAccessPath = location.protocol + "//" + window.location.host + "/api/remote/";
|
|
|
|
+ new ClipboardJS('.copyURL', {
|
|
|
|
+ text: function(trigger) {
|
|
|
|
+ var token = $(trigger).attr("token");
|
|
|
|
+ var url = tokenAccessPath + token;
|
|
|
|
+ console.log( $(trigger).find(".tooltiptext"));
|
|
|
|
+ $(trigger).find(".tooltiptext").css({
|
|
|
|
+ "visibility": "visible",
|
|
|
|
+ "opacity": 1,
|
|
|
|
+ });
|
|
|
|
+ setTimeout(function(){
|
|
|
|
+ $(trigger).find(".tooltiptext").css({
|
|
|
|
+ "visibility": "hidden",
|
|
|
|
+ "opacity": 0,
|
|
|
|
+ });
|
|
|
|
+ }, 3000);
|
|
|
|
+ return url;
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ function generateClipboardText(uuid) {
|
|
|
|
+ return `
|
|
|
|
+ <div>
|
|
|
|
+ <div class="content" style="font-family: monospace;">
|
|
|
|
+ ${uuid} <a style="margin-left: 12px; font-family: Arial;" token="${uuid}" class="copyURL tooltip">
|
|
|
|
+ <i class="copy icon"></i> Copy
|
|
|
|
+ <span class="tooltiptext"><i class="checkmark icon"></i> Copied</span>
|
|
|
|
+ </a>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ `;
|
|
|
|
+ }
|
|
|
|
|
|
|
|
+ function appendTable(uuid, path) {
|
|
|
|
+ $("#zeroRec").remove().slideUp("fast");
|
|
|
|
+ $("#records").append(`<tr>
|
|
|
|
+ <td>` + generateClipboardText(uuid) +`</td>
|
|
|
|
+ <td>` + path + `</td>
|
|
|
|
+ <td>
|
|
|
|
+ <button class="ui icon negative button" uuid="` + uuid + `" onclick="delRecord(this)">
|
|
|
|
+ <i class="close icon"></i>
|
|
|
|
+ </button>
|
|
|
|
+ </td>
|
|
|
|
+ </tr>`);
|
|
|
|
+ }
|
|
</script>
|
|
</script>
|
|
</body>
|
|
</body>
|
|
</html>
|
|
</html>
|