diff --git a/core/resource_test.go b/core/resource_test.go index 7e053c2..b3764b3 100644 --- a/core/resource_test.go +++ b/core/resource_test.go @@ -60,7 +60,7 @@ func Test_prepareImport(t *testing.T) { } for _, tt := range tests { t.Run(tt.name, func(t *testing.T) { - if got := prepareImport(tt.args.proto, ""); !reflect.DeepEqual(got, tt.want) { + if got := prepareImport(tt.args.proto); !reflect.DeepEqual(got, tt.want) { t.Errorf("prepareImport() = %v, want %v", string(got), string(tt.want)) diff --git a/handler/routes.go b/handler/routes.go index 4e5c27c..b949737 100644 --- a/handler/routes.go +++ b/handler/routes.go @@ -29,6 +29,7 @@ func Init(router *mux.Router) { router.PathPrefix("/js/").Handler(http.StripPrefix("/js/", http.FileServer(http.Dir(assetsPath+"/js/")))) router.PathPrefix("/font/").Handler(http.StripPrefix("/font/", http.FileServer(http.Dir(assetsPath+"/font/")))) router.PathPrefix("/img/").Handler(http.StripPrefix("/img/", http.FileServer(http.Dir(assetsPath+"/img/")))) + router.PathPrefix("/database/").Handler(http.StripPrefix("/database/", http.FileServer(http.Dir(assetsPath+"/database/")))) } func corsHandler(h http.HandlerFunc) http.HandlerFunc { diff --git a/index/css/style.css b/index/css/style.css index ae61674..c3a18a5 100644 --- a/index/css/style.css +++ b/index/css/style.css @@ -1,59 +1,77 @@ +html { + min-height: 100%; +} + body { + min-height: 100%; +} + +.mt-10 { + margin-top: 10px; +} + +.pt-50 { + padding-top: 50px; +} + +.pb-50 { padding-bottom: 50px; } -.mt-10 { - margin-top:10px; -} -.pt-50 { - padding-top:50px; -} + .w-120 { width: 120px; } + .custom-pretty { - border:none!important; + border: none!important; } + .custom-control-label:hover { cursor: pointer; } + #choose-service, #choose-function, #body-request { margin-top: 40px; } + .schema-body { height: 250px; overflow-y: scroll; } + #response { margin-top: 30px; } /* github corner */ -.github-corner:hover .octo-arm{ - animation:octocat-wave 560ms ease-in-out + +.github-corner:hover .octo-arm { + animation: octocat-wave 560ms ease-in-out } -@keyframes octocat-wave{ - 0%,100%{ - transform:rotate(0) + +@keyframes octocat-wave { + 0%, 100% { + transform: rotate(0) } - 20%,60%{ - transform:rotate(-25deg) + 20%, 60% { + transform: rotate(-25deg) } - 40%,80%{ - transform:rotate(10deg) + 40%, 80% { + transform: rotate(10deg) } } -@media (max-width:500px){ - .github-corner:hover .octo-arm{ - animation:none +@media (max-width:500px) { + .github-corner:hover .octo-arm { + animation: none } - - .github-corner .octo-arm{ - animation:octocat-wave 560ms ease-in-out + .github-corner .octo-arm { + animation: octocat-wave 560ms ease-in-out } } /* connections */ + .connections { font-weight: 100; background: #efefef; @@ -62,8 +80,8 @@ body { position: fixed; top: 200px; z-index: 100; - -webkit-box-shadow: -3px 0px 5px 0px rgba(0,0,0,0.2); - box-shadow: -3px 0px 5px 0px rgba(0,0,0,0.2); + -webkit-box-shadow: -3px 0px 5px 0px rgba(0, 0, 0, 0.2); + box-shadow: -3px 0px 5px 0px rgba(0, 0, 0, 0.2); left: -190px; transition: all .3s; -webkit-transition: all .3s; @@ -110,7 +128,9 @@ body { cursor: pointer; } -.connections .nav li a:hover { color: #aaa } +.connections .nav li a:hover { + color: #aaa +} .dots { position: absolute; @@ -149,6 +169,7 @@ circle { } /* loading spinner */ + .spinner { margin: 10px auto; width: 180px; @@ -157,12 +178,11 @@ circle { font-size: 80px; } -.spinner > div { +.spinner>div { background-color: #59698d; height: 100%; width: 18px; display: inline-block; - -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; animation: sk-stretchdelay 1.2s infinite ease-in-out; } @@ -188,15 +208,20 @@ circle { } @-webkit-keyframes sk-stretchdelay { - 0%, 40%, 100% { -webkit-transform: scaleY(0.4) } - 20% { -webkit-transform: scaleY(1.0) } + 0%, 40%, 100% { + -webkit-transform: scaleY(0.4) + } + 20% { + -webkit-transform: scaleY(1.0) + } } @keyframes sk-stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); - } 20% { + } + 20% { transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } diff --git a/index/database/database.json b/index/database/database.json new file mode 100644 index 0000000..e3d651a --- /dev/null +++ b/index/database/database.json @@ -0,0 +1,10 @@ +[ + { + "name": "Example 1", + "ip": "localhost:8000" + }, + { + "name": "Example 2", + "ip": "localhost:8585" + } +] \ No newline at end of file diff --git a/index/index.html b/index/index.html index 9896a5c..6bcca19 100644 --- a/index/index.html +++ b/index/index.html @@ -1,5 +1,6 @@ + @@ -14,98 +15,135 @@ -
+
-
- - -
- -
-
-
- - -
+
+
+ + + + +
+
+
+ +
+ +
+
+
+ +
+
+ +
+ +
+
+
+
-
+ + +
+ +
+
+
-
- -
- + - -
@@ -126,6 +163,12 @@
+
+
+ +
+
+ + -
-
- - Active Connection(s) -
- - -
- - @@ -183,6 +233,7 @@ + - + \ No newline at end of file diff --git a/index/js/load-database.js b/index/js/load-database.js new file mode 100644 index 0000000..0c6c848 --- /dev/null +++ b/index/js/load-database.js @@ -0,0 +1,10 @@ +(function () { + const el = $('#select-server-target'); + + $.get('database/database.json', function (response) { + $.each(response, function (index, value) { + el.append(``); + }); + }); + +})(); \ No newline at end of file diff --git a/index/js/style.js b/index/js/style.js index f214850..81b3598 100644 --- a/index/js/style.js +++ b/index/js/style.js @@ -1,11 +1,30 @@ -var target, use_tls, editor; +var target, use_tls, editor, targetScroll, mode; -$('#get-services').click(function(){ +$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { + switch (e.target.innerHTML) { + case "Mode 1": + mode = 'select'; + break; + case "Mode 2": + mode = 'input'; + break; + } +}); + +$('#select-server-target').change(function () { + if ($(this).val() == "") { + return + } + + $('#select-get-services').click(); +}); + +$('.get-services').click(function () { var t = get_valid_target(); use_tls = "false"; var restart = "0" - if($('#restart-conn').is(":checked")) { + if ($('#restart-conn').is(":checked")) { restart = "1" } @@ -21,10 +40,10 @@ $('#get-services').click(function(){ // prepare ajax options beforehand // makes it easier for local proto to modify some of its properties const ajaxProps = { - url: "server/"+target+"/services?restart="+restart, + url: "server/" + target + "/services?restart=" + restart, global: true, method: "GET", - success: function(res){ + success: function (res) { if (res.error) { target = ""; use_tls = ""; @@ -35,18 +54,18 @@ $('#get-services').click(function(){ $.each(res.data, (_, item) => $("#select-service").append(new Option(item, item))); $('#choose-service').show(); }, - error: function(_, _, errorThrown) { + error: function (_, _, errorThrown) { target = ""; use_tls = ""; alert(errorThrown); }, - beforeSend: function(xhr){ + beforeSend: function (xhr) { $('#choose-service').hide(); xhr.setRequestHeader('use_tls', use_tls); $(this).html("Loading..."); show_loading(); }, - complete: function(){ + complete: function () { applyConnCount(); $(this).html(button); hide_loading(); @@ -68,7 +87,7 @@ $('#get-services').click(function(){ $.ajax(ajaxProps); }); -$('#select-service').change(function(){ +$('#select-service').change(function () { var selected = $(this).val(); if (selected == "") { return false; @@ -77,31 +96,31 @@ $('#select-service').change(function(){ $('#body-request').hide(); $('#response').hide(); $.ajax({ - url: "server/"+target+"/service/"+selected+"/functions", + url: "server/" + target + "/service/" + selected + "/functions", global: true, method: "GET", - success: function(res){ + success: function (res) { if (res.error) { alert(res.error); return; } $("#select-function").html(new Option("Choose Method", "")); - $.each(res.data, (_, item) => $("#select-function").append(new Option(item.substr(selected.length) , item))); + $.each(res.data, (_, item) => $("#select-function").append(new Option(item.substr(selected.length), item))); $('#choose-function').show(); }, error: err, - beforeSend: function(xhr){ + beforeSend: function (xhr) { $('#choose-function').hide(); xhr.setRequestHeader('use_tls', use_tls); show_loading(); }, - complete: function(){ + complete: function () { hide_loading(); } }); }); -$('#select-function').change(function(){ +$('#select-function').change(function () { var selected = $(this).val(); if (selected == "") { return false; @@ -109,10 +128,10 @@ $('#select-function').change(function(){ $('#response').hide(); $.ajax({ - url: "server/"+target+"/function/"+selected+"/describe", + url: "server/" + target + "/function/" + selected + "/describe", global: true, method: "GET", - success: function(res){ + success: function (res) { if (res.error) { alert(res.error); return; @@ -123,22 +142,22 @@ $('#select-function').change(function(){ $('#body-request').show(); }, error: err, - beforeSend: function(xhr){ + beforeSend: function (xhr) { $('#body-request').hide(); xhr.setRequestHeader('use_tls', use_tls); show_loading(); }, - complete: function(){ + complete: function () { hide_loading(); } }); }); -$('#invoke-func').click(function(){ +$('#invoke-func').click(function () { // use metadata if there is any ctxArr = []; - $(".ctx-metadata-input-field").each(function(index, val){ + $(".ctx-metadata-input-field").each(function (index, val) { ctxArr.push($(val).text()) }); @@ -149,12 +168,12 @@ $('#invoke-func').click(function(){ var body = editor.getValue(); var button = $(this).html(); $.ajax({ - url: "server/"+target+"/function/"+func+"/invoke", + url: "server/" + target + "/function/" + func + "/invoke", global: true, method: "POST", data: body, dataType: "json", - success: function(res){ + success: function (res) { if (res.error) { alert(res.error); return; @@ -164,24 +183,27 @@ $('#invoke-func').click(function(){ $('#response').show(); }, error: err, - beforeSend: function(xhr){ + beforeSend: function (xhr) { $('#response').hide(); xhr.setRequestHeader('use_tls', use_tls); - if(ctxUse) { + if (ctxUse) { xhr.setRequestHeader('Metadata', ctxArr); } $(this).html("Loading..."); show_loading(); }, - complete: function(){ + complete: function () { $(this).html(button); hide_loading(); + $('html, body').animate({ + scrollTop: targetScroll + }, 500); } }); }); function generate_editor(content) { - if(editor) { + if (editor) { editor.setValue(content); return true; } @@ -197,14 +219,16 @@ function generate_editor(content) { } function get_valid_target() { - t = $('#server-target').val().trim(); + el = $(`#${mode}-server-target`) + + t = el.val().trim(); if (t == "") { return target; } ts = t.split("://"); if (ts.length > 1) { - $('#server-target').val(ts[1]); + el.val(ts[1]); return ts[1]; } return ts[0]; @@ -222,7 +246,7 @@ function hide_loading() { $('.spinner').hide(); } -$(".connections ul").on("click", "i", function(){ +$(".connections ul").on("click", "i", function () { $icon = $(this); $parent = $(this).parent("li"); var ip = $(this).siblings("span").text(); @@ -231,15 +255,15 @@ $(".connections ul").on("click", "i", function(){ url: "active/close/" + ip, global: true, method: "DELETE", - success: function(res){ + success: function (res) { $('[data-toggle="tooltip"]').tooltip('hide'); - if(res.data.success) { + if (res.data.success) { $parent.remove(); updateCountNum(); } }, error: err, - beforeSend: function(xhr){ + beforeSend: function (xhr) { $icon.attr('class', 'fa fa-spinner'); }, }); @@ -256,10 +280,10 @@ function applyConnCount() { url: "active/get", global: true, method: "GET", - success: function(res){ + success: function (res) { $(".connections .title span").html(res.data.length); $(".connections .nav").html(""); - res.data.forEach(function(item){ + res.data.forEach(function (item) { $list = $("#conn-list-template").clone(); $list.find(".ip").html(item); $(".connections .nav").append($list.html()); @@ -284,6 +308,8 @@ function refreshToolTip() { }) } -$(document).ready(function(){ +$(document).ready(function () { + mode = 'select' refreshConnCount(); -}); + targetScroll = window.innerHeight + 50; +}); \ No newline at end of file