also show proxied urls
This commit is contained in:
16
app.js
16
app.js
@@ -19,7 +19,21 @@ app.use(cookieParser())
|
||||
app.use(require('stylus').middleware(path.join(__dirname, 'style')))
|
||||
app.use(express.static(path.join(__dirname, 'style')))
|
||||
app.use(express.static(path.join(__dirname, 'client')))
|
||||
app.use(express.static(path.join(__dirname, 'node_modules', 'jquery', 'dist')))
|
||||
app.get('/jquery.min.js', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, 'node_modules', 'jquery', 'dist', 'jquery.min.js'))
|
||||
})
|
||||
app.get('/jquery-ui.structure.min.css', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, 'node_modules', 'jqueryui', 'jquery-ui.structure.min.css'))
|
||||
})
|
||||
app.get('/jquery-ui.theme.min.css', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, 'node_modules', 'jqueryui', 'jquery-ui.theme.min.css'))
|
||||
})
|
||||
app.get('/jquery-ui.min.css', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, 'node_modules', 'jqueryui', 'jquery-ui.min.css'))
|
||||
})
|
||||
app.get('/jquery-ui.min.js', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, 'node_modules', 'jqueryui', 'jquery-ui.min.js'))
|
||||
})
|
||||
app.use(express.static(path.join(__dirname, 'node_modules', 'viz.js')))
|
||||
app.use(express.static(path.join(__dirname, 'node_modules', 'socket.io-client', 'dist')))
|
||||
app.use(express.static(path.join(__dirname, 'node_modules', 'docker.js')))
|
||||
|
@@ -10,14 +10,39 @@ function sigstack() {
|
||||
var dot = docker.graphics.stack()
|
||||
var svg = docker.graphics.viz(dot, error)
|
||||
$('#stacks').html(svg)
|
||||
$('a#svgStacks').attr('href', 'data:image/svg;base64,'+btoa(svg))
|
||||
$('a#svg').attr('href', 'data:image/svg;base64,'+btoa(svg))
|
||||
.attr('target', '_blank')
|
||||
.attr('download', window.location.hostname+'.svg')
|
||||
.show()
|
||||
$('a#dot').attr('href', 'data:text/vnd.graphviz;base64,'+btoa(dot))
|
||||
.attr('target', '_blank')
|
||||
.attr('download', window.location.hostname+'.dot')
|
||||
|
||||
}
|
||||
|
||||
function init() {
|
||||
socket = io.connect()
|
||||
docker = new Docker(socket, error, sigstack)
|
||||
$('header').attr('draggable', 'true')
|
||||
.on('dragstart', (event) => {
|
||||
event.originalEvent.dataTransfer.setData("text", event.originalEvent.target.id);
|
||||
})
|
||||
$('*').on('dragover', (event) => {
|
||||
event.preventDefault()
|
||||
var e = event.originalEvent
|
||||
var obj = $('body')
|
||||
var w = window.innerWidth
|
||||
var h = window.innerHeight
|
||||
if (e.clientY < h*.1) {
|
||||
obj.removeClass('bottom').removeClass('left').removeClass('right').addClass('top')
|
||||
} else if (e.clientY > h*.9) {
|
||||
obj.addClass('bottom').removeClass('left').removeClass('right').removeClass('top')
|
||||
} else if (e.clientX < w*.1) {
|
||||
obj.removeClass('bottom').addClass('left').removeClass('right').removeClass('top')
|
||||
} else if (e.clientX > w*.9) {
|
||||
obj.removeClass('bottom').removeClass('left').addClass('right').removeClass('top')
|
||||
}
|
||||
}).on('drop', (event) => {
|
||||
event.preventDefault()
|
||||
})
|
||||
}
|
||||
$(init)
|
||||
|
@@ -10,10 +10,11 @@
|
||||
"child_process": "^1.0.2",
|
||||
"cookie-parser": "*",
|
||||
"debug": "*",
|
||||
"docker.js": "^1.4.0",
|
||||
"docker.js": "^1.4.2",
|
||||
"dockerode": "^2.5.7",
|
||||
"express": "*",
|
||||
"jquery": "^3.1.1",
|
||||
"jqueryui": "^1.11.1",
|
||||
"morgan": "*",
|
||||
"pty.js": "^0.3.1",
|
||||
"pug": "*",
|
||||
|
@@ -2,9 +2,95 @@ svg
|
||||
width: 100%
|
||||
height: auto
|
||||
|
||||
header
|
||||
display: flex
|
||||
justify-content: space-between
|
||||
background-color: blue
|
||||
color: white
|
||||
line-height: 1em
|
||||
h1
|
||||
font-size: 100%
|
||||
a:link
|
||||
color: white
|
||||
#downloads
|
||||
display: flex
|
||||
|
||||
#info
|
||||
display: none
|
||||
|
||||
#error
|
||||
display: none
|
||||
background-color: red
|
||||
|
||||
#svgStacks
|
||||
display: none
|
||||
#svg, #dot
|
||||
text-decoration: inherit
|
||||
color: white
|
||||
display: none
|
||||
&[href]
|
||||
display: block
|
||||
|
||||
.top
|
||||
header
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
right: 0
|
||||
height: 2em
|
||||
overflow: hidden
|
||||
main
|
||||
position: absolute
|
||||
top: 2em
|
||||
left: 0
|
||||
right: 0
|
||||
bottom: 0
|
||||
overflow: auto
|
||||
|
||||
.bottom
|
||||
header
|
||||
position: absolute
|
||||
bottom: 0
|
||||
left: 0
|
||||
right: 0
|
||||
height: 2em
|
||||
overflow: hidden
|
||||
main
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
right: 0
|
||||
bottom: 2em
|
||||
overflow: auto
|
||||
|
||||
.left
|
||||
header
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 2em
|
||||
left: 0
|
||||
height: 2em
|
||||
overflow: hidden
|
||||
transform: translate(-50%) translate(1em) rotate(270deg) translate(-50%) translate(2em)
|
||||
main
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 2em
|
||||
right: 0
|
||||
bottom: 0
|
||||
overflow: auto
|
||||
|
||||
.right
|
||||
header
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 0
|
||||
left: 3em
|
||||
height: 2em
|
||||
overflow: hidden
|
||||
transform: translate(50%) translate(-1em) rotate(90deg) translate(50%) translate(-1em)
|
||||
main
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
right: 2em
|
||||
bottom: 0
|
||||
overflow: auto
|
||||
|
@@ -2,4 +2,3 @@ extends layout
|
||||
|
||||
block content
|
||||
div#stacks loading...
|
||||
a#svgStacks download image
|
@@ -3,12 +3,23 @@ html
|
||||
head
|
||||
title= title
|
||||
link(rel='stylesheet', href='/style.css')
|
||||
link(rel='stylesheet', href='/jquery-ui.structure.min.css')
|
||||
link(rel='stylesheet', href='/jquery-ui.theme.min.css')
|
||||
link(rel='stylesheet', href='/jquery-ui.min.css')
|
||||
script(type="text/javascript", src="/jquery.min.js")
|
||||
script(type="text/javascript", src="/jquery-ui.min.js")
|
||||
script(type="text/javascript", src="/viz.js")
|
||||
script(type="text/javascript", src="/docker.js")
|
||||
script(type="text/javascript", src="/socket.io.js")
|
||||
script(type="text/javascript", src="/servicedock.js")
|
||||
body
|
||||
block content
|
||||
footer
|
||||
div#error
|
||||
body.top
|
||||
header#header
|
||||
h1 ServiceDock
|
||||
div#downloads
|
||||
a#svg download image
|
||||
a#dot download source
|
||||
main
|
||||
block content
|
||||
footer
|
||||
div#info
|
||||
div#error
|
||||
|
Reference in New Issue
Block a user