mirror of https://github.com/gophish/gophish
Added some loading gifs to make things seem smoother.
Working on fixing up campaign_results.html endpoint to have the graphs, results table, etc.pull/24/head
parent
67b28094db
commit
9df97d9d05
|
@ -1,90 +1,73 @@
|
|||
// labels is a map of campaign statuses to
|
||||
// CSS classes
|
||||
var labels = {
|
||||
"In progress" : "label-primary",
|
||||
"Queued" : "label-info",
|
||||
"Completed" : "label-success",
|
||||
"Email Sent" : "label-primary",
|
||||
"Email Opened" : "label-info",
|
||||
"Success" : "label-success",
|
||||
"Clicked Link" : "label-success",
|
||||
"Error" : "label-danger"
|
||||
}
|
||||
|
||||
var campaign = {}
|
||||
|
||||
// Save attempts to POST to /campaigns/
|
||||
function save(){
|
||||
var campaign = {
|
||||
name: $("#name").val(),
|
||||
template:{
|
||||
name: $("#template").val()
|
||||
},
|
||||
smtp: {
|
||||
from_address: $("input[name=from]").val(),
|
||||
host: $("input[name=host]").val(),
|
||||
username: $("input[name=username]").val(),
|
||||
password: $("input[name=password]").val(),
|
||||
},
|
||||
groups: [{name : "Test group"}]
|
||||
}
|
||||
// Submit the campaign
|
||||
api.campaigns.post(campaign)
|
||||
.success(function(data){
|
||||
successFlash("Campaign successfully launched!")
|
||||
load()
|
||||
})
|
||||
.error(function(data){
|
||||
$("#modal\\.flashes").empty().append("<div style=\"text-align:center\" class=\"alert alert-danger\">\
|
||||
<i class=\"fa fa-exclamation-circle\"></i> " + data.responseJSON.message + "</div>")
|
||||
})
|
||||
}
|
||||
|
||||
function dismiss(){
|
||||
$("#modal\\.flashes").empty()
|
||||
$("#modal").modal('hide')
|
||||
$("#groupTable").dataTable().DataTable().clear().draw()
|
||||
$("#resultsTable").dataTable().DataTable().clear().draw()
|
||||
}
|
||||
|
||||
function edit(campaign){
|
||||
// Clear the bloodhound instance
|
||||
bh.clear();
|
||||
if (campaign == "new") {
|
||||
api.groups.get()
|
||||
.success(function(groups){
|
||||
if (groups.length == 0){
|
||||
modalError("No groups found!")
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
bh.add(groups)
|
||||
}
|
||||
// Deletes a campaign after prompting the user
|
||||
function deleteCampaign(){
|
||||
if (confirm("Are you sure you want to delete: " + campaign.name + "?")){
|
||||
api.campaignId.delete(campaign.id)
|
||||
.success(function(msg){
|
||||
console.log(msg)
|
||||
})
|
||||
.error(function(e){
|
||||
$("#modal\\.flashes").empty().append("<div style=\"text-align:center\" class=\"alert alert-danger\">\
|
||||
<i class=\"fa fa-exclamation-circle\"></i> " + data.responseJSON.message + "</div>")
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
var id = window.location.pathname.split('/').slice(-1)[0]
|
||||
api.campaignId.get(id)
|
||||
campaign.id = window.location.pathname.split('/').slice(-1)[0]
|
||||
api.campaignId.get(campaign.id)
|
||||
.success(function(c){
|
||||
campaign = c
|
||||
if (campaign){
|
||||
$("#emptyMessage").hide()
|
||||
$("#campaignTable").show()
|
||||
campaignTable = $("#campaignTable").DataTable();
|
||||
$.each(campaigns, function(i, campaign){
|
||||
label = labels[campaign.status] || "label-default";
|
||||
campaignTable.row.add([
|
||||
campaign.name,
|
||||
moment(campaign.created_date).format('MMMM Do YYYY, h:mm:ss a'),
|
||||
"<span class=\"label " + label + "\">" + campaign.status + "</span>",
|
||||
"<div class='pull-right'><button class='btn btn-primary' onclick='alert(\"test\")'>\
|
||||
<i class='fa fa-bar-chart'></i>\
|
||||
</button>\
|
||||
<button class='btn btn-danger' onclick='alert(\"test\")'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
// Setup our graphs
|
||||
var timeline_chart = {labels:[],series:[[]]}
|
||||
var email_chart = {series:[]}
|
||||
var timeline_opts = {
|
||||
axisX: {
|
||||
showGrid: false
|
||||
},
|
||||
showArea: true,
|
||||
plugins: []
|
||||
}
|
||||
var email_opts = {
|
||||
donut : true,
|
||||
donutWidth: 40,
|
||||
chartPadding: 0,
|
||||
showLabel: false
|
||||
}
|
||||
$("#loading").hide()
|
||||
$("#campaignResults").show()
|
||||
resultsTable = $("#resultsTable").DataTable();
|
||||
$.each(campaign.results, function(i, result){
|
||||
label = labels[result.status] || "label-default";
|
||||
resultsTable.row.add([
|
||||
result.first_name || "",
|
||||
result.last_name || "",
|
||||
result.email || "",
|
||||
result.position || "",
|
||||
"<span class=\"label " + label + "\">" + result.status + "</span>"
|
||||
]).draw()
|
||||
})
|
||||
}
|
||||
})
|
||||
.error(function(){
|
||||
errorFlash("Error fetching campaign")
|
||||
errorFlash(" Campaign not found!")
|
||||
})
|
||||
})
|
||||
|
|
|
@ -60,8 +60,8 @@ function edit(campaign){
|
|||
$(document).ready(function(){
|
||||
api.campaigns.get()
|
||||
.success(function(campaigns){
|
||||
$("#loading").hide()
|
||||
if (campaigns.length > 0){
|
||||
$("#emptyMessage").hide()
|
||||
$("#campaignTable").show()
|
||||
campaignTable = $("#campaignTable").DataTable();
|
||||
$.each(campaigns, function(i, campaign){
|
||||
|
@ -78,9 +78,12 @@ $(document).ready(function(){
|
|||
</button></div>"
|
||||
]).draw()
|
||||
})
|
||||
} else {
|
||||
$("#emptyMessage").show()
|
||||
}
|
||||
})
|
||||
.error(function(){
|
||||
$("#loading").hide()
|
||||
errorFlash("Error fetching campaigns")
|
||||
})
|
||||
$("#groupForm").submit(function(){
|
||||
|
|
|
@ -21,8 +21,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main" ng-controller="CampaignResultsCtrl">
|
||||
<div ng-show="campaign">
|
||||
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
|
||||
<div id="loading">
|
||||
<i class="fa fa-spinner fa-spin fa-4x"></i>
|
||||
</div>
|
||||
<div style="display:none;" id="campaignResults">
|
||||
<div class="row">
|
||||
<h1 class="page-header" id="page-title">Results for campaign.name</h1>
|
||||
</div>
|
||||
|
@ -39,7 +42,8 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<button type="button" class="btn btn-danger" tooltip="Delete Campaign" tooltip-placement="right" ng-click="delete(campaign)" ng-href="/dashboard"><i class="fa fa-times fa-lg"></i>
|
||||
<button type="button" class="btn btn-danger" data-toggle="tooltip" data-placement="right" title="Delete Campaign" onclick="deleteCampaign()">
|
||||
<i class="fa fa-times fa-lg"></i>
|
||||
</button>
|
||||
</div>
|
||||
<br />
|
||||
|
@ -49,10 +53,10 @@
|
|||
<br/>
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
<highchart config="timeline_chart"></highchart>
|
||||
<div id="timeline_chart"></div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
<highchart config="email_chart"></highchart>
|
||||
<div id="email_chart"></div>
|
||||
</div>
|
||||
</div>
|
||||
</tab>
|
||||
|
@ -62,25 +66,25 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<h2>Details</h2>
|
||||
<table ng-table="mainTableParams" class="table table-hover table-striped table-bordered">
|
||||
<tbody>
|
||||
<tr ng-repeat="result in $data" class="editable-row">
|
||||
<td data-title="'Email'" class="col-sm-1">result.email</td>
|
||||
<td data-title="'Status'" class="col-sm-2">result.status</td>
|
||||
<table id="resultsTable" class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First Name</th>
|
||||
<th>Last Name</th>
|
||||
<th>Email</th>
|
||||
<th>Position</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="alert alert-danger">
|
||||
<i class="fa fa-exclamation-circle"></i> Campaign not found!
|
||||
</div>
|
||||
</div>
|
||||
<div id="flashes" class="row"></div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{define "scripts"}}
|
||||
<script src="/js/hogan.js"></script>
|
||||
<script src="/js/typeahead.min.js"></script>
|
||||
<script src="/js/jquery.ui.widget.js"></script>
|
||||
<script src="/js/app/campaign_results.js"></script>
|
||||
{{end}}
|
||||
|
|
|
@ -32,7 +32,10 @@
|
|||
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modal" onclick="edit('new')"><i class="fa fa-plus"></i> New Campaign</button>
|
||||
</div>
|
||||
|
||||
<div id="emptyMessage" class="row">
|
||||
<div id="loading">
|
||||
<i class="fa fa-spinner fa-spin fa-4x"></i>
|
||||
</div>
|
||||
<div id="emptyMessage" class="row" style="display:none;">
|
||||
<div class="alert alert-info">
|
||||
No campaigns created yet. Let's create one!
|
||||
</div>
|
||||
|
|
|
@ -128,12 +128,6 @@
|
|||
<th>Position</th>
|
||||
<th></th>
|
||||
<tbody>
|
||||
<!-- <tr ng-repeat="target in $data" class="editable-row">
|
||||
<td>target.email
|
||||
<span onclick="removeTarget()" class="remove-row"><i class="fa fa-trash-o"></i>
|
||||
</span>
|
||||
</td>
|
||||
</tr> -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue