dethos
/
webhook_logger
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add highlightjs for the body of the requests

This commit is contained in:
Gonçalo Valério 2019-05-18 19:20:35 +01:00
parent 0ed52a3cf6
commit 8a069cda2c
2 changed files with 45 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
callbacks/static/js/viewer.js
View File

@ -43,6 +43,24 @@ function setupConnection() {
setupConnection(); setupConnection();
}; };
} }
/*
Create the highlight directive
*/
Vue.directive("highlightjs", {
deep: true,
bind: function(el, binding) {
if (binding.value) {
el.textContent = binding.value;
}
hljs.highlightBlock(el);
},
componentUpdated: function(el, binding) {
if (binding.value) {
target.textContent = binding.value;
hljs.highlightBlock(target);
}
}
});
/* /*
Setup a simple components to handle the display of new content. Setup a simple components to handle the display of new content.

35
callbacks/templates/callbacks/check.html
View File

@ -8,13 +8,18 @@
rel="stylesheet" rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css"
/> />
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" <link
href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
rel="stylesheet" rel="stylesheet"
integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
crossorigin="anonymous" crossorigin="anonymous"
/> />
<link rel="stylesheet" href="{% static 'css/main.css' %}"></link> <link
<link rel="stylesheet" href="{% static 'css/gh-corner.css' %}"></link> rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/default.min.css"
/>
<link rel="stylesheet" href="{% static 'css/main.css' %}" />
<link rel="stylesheet" href="{% static 'css/gh-corner.css' %}" />
<title>Webhook Logger</title> <title>Webhook Logger</title>
</head> </head>
<body> <body>
@ -42,7 +47,10 @@
</span> </span>
</div> </div>
<div class="control"> <div class="control">
<a class="button is-info is-outlined is-large" v-on:click="copytoclipboard()"> <a
class="button is-info is-outlined is-large"
v-on:click="copytoclipboard()"
>
<i class="fa fa-files-o"></i> <i class="fa fa-files-o"></i>
</a> </a>
</div> </div>
@ -107,8 +115,14 @@
<header class="card-header"> <header class="card-header">
<p class="card-header-title">Body</p> <p class="card-header-title">Body</p>
</header> </header>
<div class="card-content"> <div
[[request.body]] class="card-content"
v-if="request.headers['Content-Type']"
>
<pre v-highlightjs>[[request.body]]</pre>
</div>
<div class="card-content" v-else>
<pre>[[request.body]]</pre>
</div> </div>
</div> </div>
</div> </div>
@ -120,8 +134,12 @@
<footer class="footer"> <footer class="footer">
<div class="content has-text-centered"> <div class="content has-text-centered">
<p> <p>
<strong>Webhook Logger</strong> by <a href="https://ovalerio.net">Gonçalo Valério</a>. The source code is licensed <strong>Webhook Logger</strong> by
<a href="https://github.com/dethos/webhook_logger/blob/master/LICENSE">GPL-3.0</a>. <a href="https://ovalerio.net">Gonçalo Valério</a>. The source code is
licensed
<a href="https://github.com/dethos/webhook_logger/blob/master/LICENSE"
>GPL-3.0</a
>.
</p> </p>
</div> </div>
</footer> </footer>
@ -152,6 +170,7 @@
</svg> </svg>
</a> </a>
<script src="https://cdn.jsdelivr.net/npm/vue"></script> <script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js"></script>
<script src="{% static 'js/viewer.js' %}"></script> <script src="{% static 'js/viewer.js' %}"></script>
</body> </body>
</html> </html>