Skip to content

Commit

Permalink
UI fixes
Browse files Browse the repository at this point in the history
Fixes noted from avdaredevil:

* Fix XSS vulnerability
* Use template literals for HTML inside JS

Signed-off-by: Kimonas Sotirchos <kimwnasptd@arrikto.com>
  • Loading branch information
kimwnasptd committed Feb 13, 2019
1 parent 928c95d commit c5cf523
Show file tree
Hide file tree
Showing 5 changed files with 92 additions and 81 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -729,13 +729,15 @@ function postNotebook(form, data) {
window.location.href = prefix + "/notebooks" +"?namespace=" + ns
}
else {
$("#error-msgs").empty();
var innerHTML = ''
innerHTML = '<div class="alert alert-danger alert-dismissible">';
innerHTML += '<span class="close" '
innerHTML += 'onclick="this.parentElement.style.display=\'none\';">&times;</span>';
innerHTML += '<strong>Error: </strong>' + res.log + ' </div>';
$("#error-msgs").html(innerHTML);
innerHTML = `
<div class="alert alert-danger">
<span class="close" onclick="this.parentElement.style.display='none'">&times;</span>
<strong>Error: </strong><span class='danger-log'></span>
</div>`

const $e = $("#error-msgs").html(innerHTML)
$('.danger-log', $e).text(res.log)

window.scrollTo(0, 0);
}
})
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,33 @@
$(document).ready(function(){
// Update the Notebooks when a Namespace is selected
$("#ns-select").on("change", function() {
var ns = this.value;
updateNotebooksInNamespace(ns);

// Change the function for the CREATE NOTEBOOK button
$("#create-nb-btn").click(_ => createNotebook(ns))
});

// Search Bar
$('#search-nb').bind("enterKey",function(e){
var ns = this.value;
updateNotebooksInNamespace(ns);

// Change the function for the CREATE NOTEBOOK button
$("#create-nb-btn").click(_ => createNotebook(ns))

// In case user sees only default ns and we go to a ns with search bar
// then the change listener won't be triggered
$("#ns-select").val("")

});

$('#search-nb').keyup(function(e){
if(e.keyCode == 13) {
$(this).trigger("enterKey");
}
});

// Get Notebooks for the ServiceAccount's Namespace
var ns = new URL(window.location.href).searchParams.get("namespace")
if (ns) {
Expand All @@ -10,35 +39,34 @@ $(document).ready(function(){

function deleteNotebook(ns, nb) {
$.getJSON(prefix + "/delete-notebook", { namespace:ns, notebook:nb}, function(data, status) {
var innerHTML = $("#error-msgs").html()
var innerHTML = ''
if(data.success == true) {
updateNotebooksInNamespace(ns)
innerHTML = '';
}
else {
innerHTML = '<div class="alert alert-warning">';
innerHTML += '<span class="close" '
innerHTML += 'onclick="this.parentElement.style.display=\'none\';">&times;</span>';
innerHTML += '<strong>Warning! </strong>' + data.log + ' </div>';
innerHTML = `
<div class="alert alert-warning">
<span class="close" onclick="this.parentElement.style.display='none'">&times;</span>
<strong>Warning!</strong><span class='warning-log'></span>
</div>`
}
$("#error-msgs").html(innerHTML);
const $e = $("#error-msgs").html(innerHTML)
$('.warning-log', $e).text(data.log)
});
};

function connectNotebook(ns, nb) {
window.open("/" + ns + "/" + nb, "_blank");
window.open(`/${ns}/${nb}`, "_blank");
};

function createNotebook(ns) {
// Redirect to Add Notebook URL
window.location.href = prefix + "/add-notebook?namespace="+ns
window.location.href = `${prefix}/add-notebook?namespace=${ns}`
};

function updateNotebooksInNamespace(ns) {
// Put the add Notebook button
$('#nb-table-body').html("");
var row = $("<tr>");
// var row = ""

// Get the Notebooks for selected Namespace
$.getJSON(prefix + "/list-notebooks", { namespace:ns }, function(data, status) {
Expand Down Expand Up @@ -101,11 +129,14 @@ function updateNotebooksInNamespace(ns) {
}
}
else{
var innerHTML = ''
innerHTML = '<div class="alert alert-warning alert-dismissible">';
innerHTML += '<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>';
innerHTML += '<strong>Warning! </strong>' + data.log + ' </div>';
$("#error-msgs").html(innerHTML);
innerHTML = `
<div class="alert alert-warning">
<span class="close" onclick="this.parentElement.style.display='none'">&times;</span>
<strong>Warning!</strong><span class='warning-log'></span>
</div>`

const $e = $("#error-msgs").html(innerHTML)
$('.warning-log', $e).text(data.log)
}

// Load the dynamic components of mdl
Expand All @@ -115,35 +146,6 @@ function updateNotebooksInNamespace(ns) {
});
}

// Search Bar
$('#search-nb').bind("enterKey",function(e){
var ns = this.value;
updateNotebooksInNamespace(ns);

// Change the function for the CREATE NOTEBOOK button
$("#create-nb-btn").attr("onclick", "createNotebook('" + ns + "')")

// In case user sees only default ns and we go to a ns with search bar
// then the change listener won't be triggered
$("#ns-select").val("")

});

$('#search-nb').keyup(function(e){
if(e.keyCode == 13) {
$(this).trigger("enterKey");
}
});

function searchOut() {
$("#ns-select").text("")
}

// Update the Notebooks when a Namespace is selected
$("#ns-select").on("change", function() {
var ns = this.value;
updateNotebooksInNamespace(ns);

// Change the function for the CREATE NOTEBOOK button
$("#create-nb-btn").attr("onclick", "createNotebook('" + ns + "')")
});
}
Original file line number Diff line number Diff line change
@@ -1,6 +1,11 @@
{% extends "layout.html" %}
{% block content %}
{% block javascript %}
{{ super() }}
<script src="{{ prefix + url_for('static', filename='js/notebooks.js') }}">
</script>
{% endblock %}

{% block content %}
<!-- Namespaces Control Buttons -->
<table class="ns" align="center">
<tr>
Expand Down Expand Up @@ -71,6 +76,4 @@ <h2 class="mdl-card__title-text mdl-typography--title">Notebooks</h2>
</div>
</div>
</div>

<script src="{{ prefix + url_for('static', filename='js/notebooks.js') }}"></script>
{% endblock content %}
Original file line number Diff line number Diff line change
Expand Up @@ -796,13 +796,15 @@ function postNotebook(form, data) {
window.location.href = prefix + "/notebooks" +"?namespace=" + ns
}
else {
$("#error-msgs").empty();
var innerHTML = ''
innerHTML = '<div class="alert alert-danger alert-dismissible">';
innerHTML += '<span class="close" '
innerHTML += 'onclick="this.parentElement.style.display=\'none\';">&times;</span>';
innerHTML += '<strong>Error: </strong>' + res.log + ' </div>';
$("#error-msgs").html(innerHTML);
innerHTML = `
<div class="alert alert-danger">
<span class="close" onclick="this.parentElement.style.display='none'">&times;</span>
<strong>Error: </strong><span class='danger-log'></span>
</div>`

const $e = $("#error-msgs").html(innerHTML)
$('.danger-log', $e).text(res.log)

window.scrollTo(0, 0);
}
})
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ $(document).ready(function(){
updateNotebooksInNamespace(ns);

// Change the function for the CREATE NOTEBOOK button
$("#create-nb-btn").attr("onclick", "createNotebook('" + ns + "')")
$("#create-nb-btn").click(_ => createNotebook(ns))
});

// Search Bar
Expand All @@ -14,7 +14,7 @@ $(document).ready(function(){
updateNotebooksInNamespace(ns);

// Change the function for the CREATE NOTEBOOK button
$("#create-nb-btn").attr("onclick", "createNotebook('" + ns + "')")
$("#create-nb-btn").click(_ => createNotebook(ns))

// In case user sees only default ns and we go to a ns with search bar
// then the change listener won't be triggered
Expand All @@ -39,35 +39,34 @@ $(document).ready(function(){

function deleteNotebook(ns, nb) {
$.getJSON(prefix + "/delete-notebook", { namespace:ns, notebook:nb}, function(data, status) {
var innerHTML = $("#error-msgs").html()
var innerHTML = ''
if(data.success == true) {
updateNotebooksInNamespace(ns)
innerHTML = '';
}
else {
innerHTML = '<div class="alert alert-warning">';
innerHTML += '<span class="close" '
innerHTML += 'onclick="this.parentElement.style.display=\'none\';">&times;</span>';
innerHTML += '<strong>Warning! </strong>' + data.log + ' </div>';
innerHTML = `
<div class="alert alert-warning">
<span class="close" onclick="this.parentElement.style.display='none'">&times;</span>
<strong>Warning!</strong><span class='warning-log'></span>
</div>`
}
$("#error-msgs").html(innerHTML);
const $e = $("#error-msgs").html(innerHTML)
$('.warning-log', $e).text(data.log)
});
};

function connectNotebook(ns, nb) {
window.open("/" + ns + "/" + nb, "_blank");
window.open(`/${ns}/${nb}`, "_blank");
};

function createNotebook(ns) {
// Redirect to Add Notebook URL
window.location.href = prefix + "/add-notebook?namespace="+ns
window.location.href = `${prefix}/add-notebook?namespace=${ns}`
};

function updateNotebooksInNamespace(ns) {
// Put the add Notebook button
$('#nb-table-body').html("");
var row = $("<tr>");
// var row = ""

// Get the Notebooks for selected Namespace
$.getJSON(prefix + "/list-notebooks", { namespace:ns }, function(data, status) {
Expand Down Expand Up @@ -130,11 +129,14 @@ function updateNotebooksInNamespace(ns) {
}
}
else{
var innerHTML = ''
innerHTML = '<div class="alert alert-warning alert-dismissible">';
innerHTML += '<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>';
innerHTML += '<strong>Warning! </strong>' + data.log + ' </div>';
$("#error-msgs").html(innerHTML);
innerHTML = `
<div class="alert alert-warning">
<span class="close" onclick="this.parentElement.style.display='none'">&times;</span>
<strong>Warning!</strong><span class='warning-log'></span>
</div>`

const $e = $("#error-msgs").html(innerHTML)
$('.warning-log', $e).text(data.log)
}

// Load the dynamic components of mdl
Expand Down

0 comments on commit c5cf523

Please sign in to comment.