Skip to content

Commit

Permalink
feat: add the debugger as container
Browse files Browse the repository at this point in the history
  • Loading branch information
ctron committed Aug 19, 2022
1 parent 523b2eb commit 3d6a6ea
Show file tree
Hide file tree
Showing 5 changed files with 212 additions and 80 deletions.
17 changes: 17 additions & 0 deletions Dockerfile
Original file line number Diff line number Diff line change
Expand Up @@ -69,3 +69,20 @@ LABEL org.opencontainers.image.source="https://github.com/drogue-iot/drogue-dopp
COPY --from=builder /output/drogue-doppelgaenger-waker /
ENTRYPOINT [ "/drogue-doppelgaenger-waker" ]

FROM ghcr.io/drogue-iot/frontend-base:0.2.0 as debugger

LABEL org.opencontainers.image.source="https://github.com/drogue-iot/drogue-doppelgaenger"

RUN true \
&& mkdir /public \
&& mkdir /endpoints

COPY debugger/nginx.conf /etc/nginx/nginx.conf
COPY debugger/nginx.sh /nginx.sh

RUN chmod a+x /nginx.sh
CMD ["/nginx.sh"]

# copy debugger files
COPY examples/30_notifications/debugger.html /public/index.html
COPY examples/30_notifications/thing.js /public/thing.js
1 change: 1 addition & 0 deletions Makefile
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ MODULES= \
server \
database-migration \
waker \
debugger \


#
Expand Down
53 changes: 53 additions & 0 deletions debugger/nginx.conf
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
# For more information on configuration, see:
# * Official English Documentation: http://nginx.org/en/docs/
# * Official Russian Documentation: http://nginx.org/ru/docs/

worker_processes auto;
error_log /dev/stdout info;

# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
worker_connections 1024;
}

http {
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';

access_log /dev/stdout main;

sendfile on;
tcp_nopush on;
tcp_nodelay on;
keepalive_timeout 65;
types_hash_max_size 2048;

include /etc/nginx/mime.types;
default_type application/octet-stream;

# Load modular configuration files from the /etc/nginx/conf.d directory.
# See http://nginx.org/en/docs/ngx_core_module.html#include
# for more information.
include /etc/nginx/conf.d/*.conf;

server {
listen 8080;
server_name _;
root /public;
absolute_redirect off;

error_page 404 =200 /index.html;

location /endpoints/ {
alias /endpoints/;
}

location / {
index index.html;
}
}

}
39 changes: 39 additions & 0 deletions debugger/nginx.sh
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
#!/usr/bin/env bash

set -e
set -x
set -o pipefail

: "${API_URL:=http://localhost:8011}"

: "${KEYCLOAK_URL:=http://localhost:8012}"
: "${REALM:=doppelgaenger}"
: "${CLIENT_ID:=api}"

: "${BACKEND_JSON:="{}"}"
: "${BACKEND_JSON_FILE:=/etc/config/login/backend.json}"

echo "Setting backend information:"

if [ -f "$BACKEND_JSON_FILE" ]; then
echo "Using base config from file: $BACKEND_JSON_FILE"
BACKEND_JSON="$(cat "$BACKEND_JSON_FILE")"
fi

# inject backend URL
echo "$BACKEND_JSON" | jq --arg value "$API_URL" '. + {api: $value}' | tee /endpoints/backend.json

# inject oauth2 information
jq --arg value "$CLIENT_ID" '.keycloak += {clientId: $value}' < /endpoints/backend.json | tee /endpoints/backend.json.tmp
mv /endpoints/backend.json.tmp /endpoints/backend.json
jq --arg value "$KEYCLOAK_URL" '.keycloak += {url: $value}' < /endpoints/backend.json | tee /endpoints/backend.json.tmp
mv /endpoints/backend.json.tmp /endpoints/backend.json
jq --arg value "$REALM" '.keycloak += {realm: $value}' < /endpoints/backend.json | tee /endpoints/backend.json.tmp
mv /endpoints/backend.json.tmp /endpoints/backend.json

echo "Final backend information:"
echo "---"
cat /endpoints/backend.json
echo "---"

exec /usr/sbin/nginx -g "daemon off;"
182 changes: 102 additions & 80 deletions examples/30_notifications/debugger.html
Original file line number Diff line number Diff line change
Expand Up @@ -87,103 +87,125 @@

<script src="thing.js"></script>

<script defer>
<script>
function init(backend) {
const keycloak = new Keycloak(backend.keycloak);

const api = new Api(backend.api, "default", {
tokenProvider: () => keycloak
.updateToken(30)
.then(() => keycloak.token)
});
let selectedThing = null;
let showDesired = false;

$('#showDesiredCheck').change(function () {
console.log(this.checked);
setDesired(this.checked);
});

const keycloak = new Keycloak({
url: 'http://localhost:8081',
realm: 'doppelgaenger',
clientId: 'api',
});

const api = new Api("http://localhost:8080", "default", {
tokenProvider: () => keycloak
.updateToken(30)
.then(() => keycloak.token)
});
let selectedThing = null;
let showDesired = false;

$('#showDesiredCheck').change(function () {
console.log(this.checked);
setDesired(this.checked);
});

function setDesired(flag) {
showDesired = flag;
if (selectedThing) {
selectedThing.options.showDesired = showDesired;
selectedThing.render();
function setDesired(flag) {
showDesired = flag;
if (selectedThing) {
selectedThing.options.showDesired = showDesired;
selectedThing.render();
}
}
}

function showThing(thing) {
function showThing(thing) {

if (thing === "") {
return;
}
if (thing === "") {
return;
}

let card = $('#selected-thing');
card.find('.card-header .drogue-device-name').html($(`<code>${thing}</code>`));

let card = $('#selected-thing');
card.find('.card-header .drogue-device-name').html($(`<code>${thing}</code>`));
if (selectedThing) {
selectedThing.dispose();
selectedThing.thing.dispose();
selectedThing = null;
}

if (selectedThing) {
selectedThing.dispose();
selectedThing.thing.dispose();
selectedThing = null;
selectedThing = new ThingCard(new Thing(api, thing), card, {
showTimestamps: true,
showDesired,
controlDesired: true,
refClicked: (ref) => {
showThing(ref);
}
});
}

selectedThing = new ThingCard(new Thing(api, thing), card, {
showTimestamps: true,
showDesired,
controlDesired: true,
refClicked: (ref) => {
showThing(ref);
$('#btn-lookup').on('click', e => {
showThing($('#lookup-thing-name').val());
$(e).blur();
});
$('#form-lookup').on('submit', e => {
e.preventDefault();
const ele = $('#lookup-thing-name');
showThing(ele.val());
ele.blur();
});
$('#lookup-thing-name').on('keydown', e => {
e.stopPropagation();
});
$('body').on('keydown', e => {
if (e.key === '/') {
e.preventDefault();
$('#lookup-thing-name').focus().val("");
}
});
}

$('#btn-lookup').on('click', e => {
showThing($('#lookup-thing-name').val());
$(e).blur();
});
$('#form-lookup').on('submit', e => {
e.preventDefault();
const ele = $('#lookup-thing-name');
showThing(ele.val());
ele.blur();
});
$('#lookup-thing-name').on('keydown', e => {
e.stopPropagation();
});
$('body').on('keydown', e => {
if (e.key === '/') {
e.preventDefault();
$('#lookup-thing-name').focus().val("");
function initUi() {
const selected = window.location.hash;
console.log("Pre-selected: ", selected);
if (selected !== undefined && selected !== "") {
showThing(selected.substring(1));
} else {
showThing("/");
}
}
});

function initUi() {
const selected = window.location.hash;
console.log("Pre-selected: ", selected);
if (selected !== undefined && selected !== "") {
showThing(selected.substring(1));
} else {
showThing("/");

function initKeycloak() {
keycloak.init({onLoad: 'login-required'})
.then((authenticated) => {
if (authenticated) {
initUi(keycloak);
}
})
.catch(() => {
console.error("Failed to initialize")
});
}

initKeycloak();
}
</script>

<script defer>

function initKeycloak() {
keycloak.init({onLoad: 'login-required'})
.then((authenticated) => {
if (authenticated) {
initUi(keycloak);
fetch('/endpoints/backend.json')
.then((response) => {
if (!response.ok) {
throw new Error("Failed to load backend information");
}
return response.json();
})
.then((backend)=> {
init(backend);
})
.catch((error) => {
console.error("Failed to load backend information: ", error);
init({
api: "http://localhost:8080",
keycloak: {
url: 'http://localhost:8081',
realm: 'doppelgaenger',
clientId: 'api',
}
})
.catch(() => {
console.error("Failed to initialize")
});
}

initKeycloak();
});

</script>

Expand Down

0 comments on commit 3d6a6ea

Please sign in to comment.