mirror of https://github.com/MISP/misp-modules
add: [website] lib js misp object parser
David Cruciani
parent
91ce285067
commit
59a0131880
|
|
@ -0,0 +1,67 @@
|
|||
function parseMispObject(misp_object, query_url, functionToCall){
|
||||
|
||||
function generate(misp_object, query_url, functionToCall){
|
||||
let $container = $("<div>")
|
||||
misp_object.Attribute.forEach(function (v, i) {
|
||||
let $query = $("<a>")
|
||||
let $query_same = null
|
||||
|
||||
if(v.type != 'counter' && v.type != 'datetime'){
|
||||
if(query_url){
|
||||
$query=$("<a>").attr("href", query_url+v.value).text("query").css("margin-left", "10px")
|
||||
}
|
||||
// `_${functionToCall.name}('${v.value}')` refer to 'window._query_as_same = query_as_same' in my vue file
|
||||
$query_same = $("<button>").attr({"onclick": `_${functionToCall.name}('${v.value}')`,
|
||||
"title": "Query this value with the same attribute and modules as the main query",
|
||||
"class": "btn btn-link"
|
||||
})
|
||||
.text("query as same")
|
||||
.css({"margin-left": "10px", "padding": "0", "--bs-btn-border-width": "0"})
|
||||
}
|
||||
|
||||
$container.append(
|
||||
$("<div>").css("margin-top", "10px").append(
|
||||
$("<h6>").append($("<u>").text(v.object_relation)),
|
||||
$("<div>").css("display", "flex").append(
|
||||
$("<div>").css({
|
||||
"border-left": "2px solid grey",
|
||||
"border-bottom": "2px solid grey",
|
||||
"width": "15px",
|
||||
"height": "15px",
|
||||
"display": "flex",
|
||||
"margin-left": "0.5em",
|
||||
}),
|
||||
$("<div>").text("Type: "+ v.type)
|
||||
),
|
||||
$("<div>").css("display", "flex").append(
|
||||
$("<div>").css({
|
||||
"border-left": "2px solid grey",
|
||||
"border-bottom": "2px solid grey",
|
||||
"width": "15px",
|
||||
"height": "15px",
|
||||
"display": "flex",
|
||||
"margin-left": "0.5em",
|
||||
}),
|
||||
$("<div>").text("Value: "+ v.value),
|
||||
$query,
|
||||
$query_same
|
||||
)
|
||||
)
|
||||
)
|
||||
});
|
||||
return $container
|
||||
}
|
||||
|
||||
var $mainContainer = $('<div>')
|
||||
let first_elem = $("<div>").css({"display": "flex", "align-items": "baseline"}).append(
|
||||
$("<i>").attr({"class": "fa-solid fa-cube", "title": "MISP Object"}),
|
||||
$('<h4>').css("margin-left", "5px").append(
|
||||
$("<small>").text(misp_object.name)
|
||||
)
|
||||
)
|
||||
$mainContainer.append(first_elem)
|
||||
$mainContainer.append(first_elem)
|
||||
$mainContainer.append(generate(misp_object, query_url, functionToCall))
|
||||
$mainContainer.append($("<hr>"))
|
||||
return $mainContainer
|
||||
}
|
||||
|
|
@ -18,6 +18,7 @@
|
|||
<script src="{{ url_for('static',filename='js/utils.js') }}"></script>
|
||||
|
||||
<script src="{{ url_for('static',filename='js/jsonParser.js') }}"></script>
|
||||
<script src="{{ url_for('static',filename='js/mispParser.js') }}"></script>
|
||||
|
||||
<script src="{{ url_for('static',filename='js/dayjs/dayjs.min.js') }}"></script>
|
||||
<script src="{{ url_for('static',filename='js/dayjs/dayjs-utc.js') }}"></script>
|
||||
|
|
|
|||
|
|
@ -67,17 +67,38 @@
|
|||
<hr>
|
||||
<ul class="nav nav-tabs" style="margin-bottom: 10px;">
|
||||
<li class="nav-item">
|
||||
<button class="nav-link active" id="tab-json" aria-current="page" @click="active_tab('json')">Json</button>
|
||||
<button class="nav-link active" id="tab-visual" @click="active_tab('visual')">Visual</button>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<button class="nav-link" id="tab-parser" @click="active_tab('parser')">Parser</button>
|
||||
<button class="nav-link" id="tab-json" aria-current="page" @click="active_tab('json')">Json</button>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<button class="nav-link" id="tab-markdown" @click="active_tab('markdown')">Markdown</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<template v-if="tab_list == 'json'">
|
||||
<template v-if="tab_list == 'visual'">
|
||||
<div class="accordion" v-if="Object.keys(modules_res).length" style="width: 95%">
|
||||
<div class="accordion-item" v-for="result, key in modules_res">
|
||||
<template v-if="!('error' in result)">
|
||||
<h2 class="accordion-header">
|
||||
<button class="accordion-button" type="button" data-bs-toggle="collapse" :data-bs-target="'#panelsStayOpen-'+key" aria-expanded="true" :aria-controls="'panelsStayOpen-'+key">
|
||||
[[key]]
|
||||
</button>
|
||||
</h2>
|
||||
<div :id="'panelsStayOpen-'+key" class="accordion-collapse collapse show">
|
||||
<div class="accordion-body row">
|
||||
<template v-for="obj in result.results.Object">
|
||||
<div v-html="parseMispObject(obj, '/home/{{sid}}?query=', query_as_same)[0].outerHTML"></div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else-if="tab_list == 'json'">
|
||||
<div class="row" v-if="Object.keys(modules_res).length">
|
||||
<div class="col-10">
|
||||
<h3 id="results_part">Results</h3>
|
||||
|
|
@ -122,40 +143,6 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else-if="tab_list == 'parser'">
|
||||
<div class="accordion" v-if="Object.keys(modules_res).length" style="width: 95%">
|
||||
<div class="accordion-item" v-for="result, key in modules_res">
|
||||
<template v-if="!('error' in result)">
|
||||
<h2 class="accordion-header">
|
||||
<button class="accordion-button" type="button" data-bs-toggle="collapse" :data-bs-target="'#panelsStayOpen-'+key" aria-expanded="true" :aria-controls="'panelsStayOpen-'+key">
|
||||
[[key]]
|
||||
</button>
|
||||
</h2>
|
||||
<div :id="'panelsStayOpen-'+key" class="accordion-collapse collapse show">
|
||||
<div class="accordion-body row">
|
||||
<template v-for="obj, key_obj in result.results.Object">
|
||||
<h4>Object #[[key_obj+1]] - <small>[[obj.name]]</small></h4>
|
||||
<div class="row" style="margin: 5px; padding: 5px;">
|
||||
<div class="col-4 mb-3" style="border: 1px solid #939393; border-radius: 10px;" v-for="attr, key_attr in obj.Attribute">
|
||||
<h6>Attributes #[[key_attr+1]]</h6>
|
||||
<div>
|
||||
Type: [[attr.type]]
|
||||
</div>
|
||||
<div>
|
||||
Value: [[attr.value]]
|
||||
</div>
|
||||
<a v-if="attr.type != 'counter' && attr.type != 'datetime'" :href="'/home/{{sid}}?query='+attr.value">query</a>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else-if="tab_list == 'markdown'">
|
||||
<div v-if="Object.keys(modules_res).length" class="accordion" style="width: 95%">
|
||||
<div class="accordion-item" v-for="result, key in modules_res">
|
||||
|
|
@ -208,7 +195,7 @@
|
|||
const modules_res = ref({})
|
||||
const progress = ref(0)
|
||||
const status_site = ref()
|
||||
const tab_list = ref("json")
|
||||
const tab_list = ref("visual")
|
||||
const history = ref({})
|
||||
|
||||
|
||||
|
|
@ -254,13 +241,13 @@
|
|||
tab_list.value = "json"
|
||||
if ( !document.getElementById("tab-json").classList.contains("active") ){
|
||||
document.getElementById("tab-json").classList.add("active")
|
||||
document.getElementById("tab-parser").classList.remove("active")
|
||||
document.getElementById("tab-visual").classList.remove("active")
|
||||
document.getElementById("tab-markdown").classList.remove("active")
|
||||
}
|
||||
}else if(active_tab == "parser"){
|
||||
tab_list.value = "parser"
|
||||
if ( !document.getElementById("tab-parser").classList.contains("active") ){
|
||||
document.getElementById("tab-parser").classList.add("active")
|
||||
}else if(active_tab == "visual"){
|
||||
tab_list.value = "visual"
|
||||
if ( !document.getElementById("tab-visual").classList.contains("active") ){
|
||||
document.getElementById("tab-visual").classList.add("active")
|
||||
document.getElementById("tab-json").classList.remove("active")
|
||||
document.getElementById("tab-markdown").classList.remove("active")
|
||||
}
|
||||
|
|
@ -269,7 +256,7 @@
|
|||
if ( !document.getElementById("tab-markdown").classList.contains("active") ){
|
||||
document.getElementById("tab-markdown").classList.add("active")
|
||||
document.getElementById("tab-json").classList.remove("active")
|
||||
document.getElementById("tab-parser").classList.remove("active")
|
||||
document.getElementById("tab-visual").classList.remove("active")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -294,7 +281,8 @@
|
|||
tab_list,
|
||||
history,
|
||||
generateCoreFormatUI,
|
||||
active_tab
|
||||
parseMispObject,
|
||||
active_tab,
|
||||
}
|
||||
}
|
||||
}).mount('.container-fluid')
|
||||
|
|
|
|||
Loading…
Reference in New Issue