1
0
mirror of https://github.com/jhillyerd/inbucket.git synced 2026-01-28 14:05:57 +00:00

webui: Renamed themes dir to ui

- Eliminated intermediate bootstrap dir
This commit is contained in:
James Hillyerd
2018-03-25 11:21:53 -07:00
parent 0d6936d1b3
commit b50c926745
660 changed files with 5 additions and 3 deletions

100
ui/templates/_base.html Normal file
View File

@@ -0,0 +1,100 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>{{template "title" .}}</title>
<link href="/public/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="/public/bower_components/bootstrap/dist/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="/public/inbucket.css" rel="stylesheet">
<link href="/public/favicon.png" rel="shortcut icon" type="image/png">
<script src="/public/bower_components/jquery/dist/jquery.min.js"></script>
<script src="/public/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="/public/bower_components/clipboard/dist/clipboard.min.js"></script>
<script src="/public/bower_components/jquery-load-template/dist/jquery.loadTemplate.min.js"></script>
<script src="/public/bower_components/moment/min/moment.min.js"></script>
{{template "script" .}}
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">@ inbucket</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
{{with .ctx.Session.Values.recentMailboxes}}
<li id="nav-mail" class="dropdown">
<a class="dropdown-toggle"
href="#"
accesskey="1"
data-toggle="dropdown"
role="button"
aria-haspopup="true"
aria-expanded="false">Recent Mailboxes <span class="caret"></span></a>
<ul class="dropdown-menu">
{{range .}}
<li><a href="{{reverse "MailboxIndex"}}?name={{.}}">{{.}}</a></li>
{{end}}
</ul>
</li>
{{end}}
{{if .ctx.WebConfig.MonitorVisible}}
<li id="nav-monitor"><a href="/monitor" accesskey="2">Monitor</a></li>
{{end}}
<li id="nav-status"><a href="/status" accesskey="3">Status</a></li>
</ul>
<form class="navbar-form navbar-right" action="{{reverse "MailboxIndex"}}" method="GET">
<div class="form-group">
<div class="input-group">
<input name="name"
type="text"
placeholder="mailbox"
class="form-control"
aria-describedby="at-inbucket-addon"/>
{{with .ctx.WebConfig.MailboxPrompt}}
<span class="input-group-addon" id="at-inbucket-addon">{{.}}</span>
{{end}}
</div>
</div>
<button type="submit" class="btn btn-success">View</button>
</form>
</div><!--/.nav-collapse -->
</div>
</nav>
<div class="container">
{{with .errorFlash}}
<div class="alert alert-danger">
<p>Please fix the following errors and try again:<p>
<ul>
{{range .}}
<li>{{.}}</li>
{{end}}
</ul>
</div>
{{end}}
{{template "content" .}}
</div>
<footer class="footer">
<div class="container">
<p class="text-muted">
<a href="http://www.inbucket.org/">Inbucket</a> is an open source project hosted at
<a href="http://github.com/jhillyerd/inbucket">github</a>.
Design by <a href="http://getbootstrap.com/">Bootstrap</a>.
</p>
</div>
</footer>
</body>
</html>

View File

@@ -0,0 +1 @@
{{.body}}

View File

@@ -0,0 +1,127 @@
{{$name := .name}}
{{$id := .message.ID}}
<div class="btn-group btn-group-sm message-controls" role="group" aria-label="Message Controls">
<button type="button"
class="btn btn-primary"
onClick="toggleMessageLink('{{.message.ID}}');">
<span class="glyphicon glyphicon-link" aria-hidden="true"></span>
Link
</button>
<button type="button"
class="btn btn-danger"
onClick="deleteMessage('{{.message.ID}}');">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
Delete
</button>
<button type="button"
class="btn btn-primary"
onClick="messageSource('{{.message.ID}}');">
<span class="glyphicon glyphicon-education" aria-hidden="true"></span>
Source
</button>
{{if .htmlAvailable}}
<button type="button"
class="btn btn-primary"
onClick="htmlView('{{.message.ID}}');">
<span class="glyphicon glyphicon-new-window" aria-hidden="true"></span>
Raw HTML
</button>
{{end}}
</div>
<div id="link-row" class="row" style="display: none; padding-bottom: 10px;">
<div class="col-lg-12">
<div class="input-group input-group-sm">
<span class="input-group-btn">
<button class="btn btn-default btn-clipboard"
type="button"
title="Copy"
data-toggle="tooltip"
data-placement="bottom"
data-clipboard-target="#link-input-control">
<span class="glyphicon glyphicon-copy" aria-hidden="true"></span>
</button>
</span>
<input id="link-input-control" type="text" class="form-control">
</div>
</div>
</div>
<div class="panel panel-default message-header">
<div class="panel-body">
<dl class="dl-horizontal">
<dt>From:</dt>
<dd>{{.message.From}}</dd>
<dt>To:</dt>
<dd>
{{range $i, $addr := .message.To}}
{{- if $i}},{{end}}
{{$addr -}}
{{end}}
</dd>
<dt>Date:</dt>
<dd>{{.message.Date}}</dd>
<dt>Subject:</dt>
<dd>{{.message.Subject}}</dd>
</dl>
</div>
</div>
{{with .mimeErrors}}
<div class="alert alert-warning" role="alert">
<strong>Notice:</strong> MIME parsing <u>W</u>arnings and/or <u>E</u>rrors were encountered
<ul>
{{range $i, $err := .}}
<li>{{$err}}</li>
{{end}}
</ul>
</div>
{{end}}
<nav>
<ul id="body-tabs" class="nav nav-tabs" role="tablist">
{{if .htmlAvailable}}
<li role="presentation">
<a href="#body-html" aria-controls="body-html" role="tab" data-toggle="tab">Safe HTML</a>
</li>
{{end}}
<li role="presentation">
<a href="#body-text" aria-controls="body-text" role="tab" data-toggle="tab">Plain Text</a>
</li>
</ul>
</nav>
<div class="tab-content">
<div role="tabpanel" class="tab-pane message-body" id="body-html">{{.htmlBody}}</div>
<div role="tabpanel" class="tab-pane message-body" id="body-text">{{.body}}</div>
</div>
{{with .attachments}}
<div class="well message-attachments">
{{range $i, $e := .}}
<div class="row">
<div class="col-sm-6">
<span class="glyphicon glyphicon-paperclip" aria-hidden="true"></span>
{{$e.FileName}}
({{$e.ContentType}})
</div>
<div class="col-sm-6">
<a class="btn btn-success btn-xs"
role="button"
href="/mailbox/vattach/{{$name}}/{{$id}}/{{$i}}/{{$e.FileName}}"
target="_blank"
aria-label="View">
<span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
View
</a>
<a class="btn btn-primary btn-xs"
role="button"
href="/mailbox/dattach/{{$name}}/{{$id}}/{{$i}}/{{$e.FileName}}"
aria-label="Download">
<span class="glyphicon glyphicon-download" aria-hidden="true"></span>
Download
</a>
</div>
</div>
{{end}}
</div>
{{end}}

View File

@@ -0,0 +1,80 @@
{{define "title"}}{{printf "Inbucket for %v" .name}}{{end}}
{{$name := .name}}
{{define "script"}}
<script src="/public/mailbox.js" type="text/javascript" charset="utf-8"></script>
<script>
var selected = "{{.selected}}";
var mailbox = "{{.name}}";
$(document).ready(function() {
$('#nav-mail').addClass("active");
onDocumentReady();
});
</script>
<script type="text/html" id="list-entry-template">
<button data-id="id" type="button" class="message-list-entry list-group-item">
<div class="row">
<div class="col-sm-4 col-md-12 text-primary" data-content-text="subject"
data-format="subject"/>
<div class="col-sm-4 col-md-12 small" data-content-text="from"/>
<div class="col-sm-4 col-md-12 small" data-content="date" data-format="date"/>
</div>
</button>
</script>
{{end}}
{{define "content"}}
<div class="panel panel-info">
<div class="panel-heading mailbox-header">
<span class="glyphicon glyphicon-inbox" aria-hidden="true"></span>
{{.name}}
</div>
</div>
<div class="col-md-3">
<div class="input-group">
<input id="message-search"
type="search"
class="form-control"
placeholder="search"
data-toggle="tooltip"
data-placement="top"
title="Search Sender and Subject"/>
<div class ="input-group-btn">
<button class="btn btn-default"
type="button"
data-toggle="tooltip"
data-placement="top"
title="Clear&nbsp;Search"
onclick="clearMessageSearch()">
<span class="glyphicon glyphicon-remove-circle"></span>
</button>
<button class="btn btn-default"
type="button"
data-toggle="tooltip"
data-placement="top"
title="Refresh&nbsp;List"
onclick="loadList()">
<span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
</button>
<button class="btn btn-default"
type="button"
data-toggle="tooltip"
data-placement="top"
title="Delete&nbsp;Mailbox"
onclick="deleteMailbox()">
<span class="glyphicon glyphicon-trash"></span>
</button>
</div>
</div>
<div id="message-list-wrapper">
<div id="message-list" class="list-group"></div>
</div>
</div>
<div id="message-container" class="col-md-9">
<div id="message-content">
<p>Select a message at left, or enter a different username into the box on upper right.</p>
</div>
</div>
{{end}}

View File

@@ -0,0 +1,12 @@
{{define "title"}}Inbucket{{end}}
{{define "script"}}{{end}}
{{define "menu"}}
<div id="logo">
<h1><a href="/">inbucket</a></h1>
<h2>email testing service</h2>
</div>
{{end}}
{{define "content"}}{{.greeting}}{{end}}

View File

@@ -0,0 +1,58 @@
{{define "title"}}Inbucket Monitor{{end}}
{{define "script"}}
<script src="/public/monitor.js" type="text/javascript" charset="utf-8"></script>
<script>
$(document).ready(function () {
$('#nav-monitor').addClass('active');
startMonitor('{{.name}}');
});
</script>
<script type="text/html" id="message-template">
<tr data-href="href" onclick="messageClick(this);">
<td data-content="date" data-format="date"/>
<td data-content-text="from"/>
<td data-content-text="mailbox"/>
<td data-content-text="subject" data-format="subject"/>
</tr>
</script>
{{end}}
{{define "menu"}}
<div id="logo">
<h1><a href="/">inbucket</a></h1>
<h2>email testing service</h2>
</div>
{{end}}
{{define "content"}}
<h2>Inbucket Monitor</h2>
<div class="pull-right">
<button class="btn btn-primary" onclick="clearClick();">Clear</button>
</div>
<p class="small">
Messages will be listed here shortly after delivery.
{{with .name}}
Only showing messages for mailbox <code>{{.}}</code>.
{{end}}
</p>
<div class="table-responsive clearfix">
<table class="table table-condensed table-hover">
<thead>
<tr>
<th>Date</th>
<th>From</th>
<th>Mailbox</th>
<th>Subject</th>
</tr>
</thead>
<tbody id="monitor-message-list"></tbody>
</table>
</div>
<div id="conn-status">Connecting...</div>
{{end}}

View File

@@ -0,0 +1,220 @@
{{define "title"}}Inbucket Status{{end}}
{{define "script"}}
<script src="/public/bower_components/jquery-color/jquery.color.js"></script>
<script src="/public/bower_components/jquery-sparkline/dist/jquery.sparkline.min.js"></script>
<script src="/public/metrics.js" type="text/javascript" charset="utf-8"></script>
<script>
$(document).ready(
function() {
$('#nav-status').addClass('active');
loadMetrics();
setInterval(loadMetrics, 10000);
});
</script>
{{end}}
{{define "menu"}}
<div id="logo">
<h1><a href="/">inbucket</a></h1>
<h2>email testing service</h2>
</div>
{{end}}
{{define "content"}}
<h2>Inbucket Status</h2>
<p class="small">Metrics are polled every 10 seconds. Inbucket does not keep history for the
10 minute graphs, but your web browser will accumulate the data over time.</p>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>
Configuration</h3>
</div>
<div class="panel-body">
<table class="metrics">
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Version:</b></div>
<div class="col-sm-8 col-xs-5"><span>{{.version}}, built on {{.buildDate}}</span></div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>SMTP Listener:</b></div>
<div class="col-sm-8 col-xs-5"><span>{{.smtpListener}}</span></div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>POP3 Listener:</b></div>
<div class="col-sm-8 col-xs-5"><span>{{.pop3Listener}}</span></div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>HTTP Listener:</b></div>
<div class="col-sm-8 col-xs-5"><span>{{.webListener}}</span></div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>No-Store Domain:</b></div>
<div class="col-sm-8 col-xs-5">
{{with .smtpConfig}}
<span>{{or .DomainNoStore .DomainNoStore "Not Configured"}}</span>
{{end}}
</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Message Cap:</b></div>
<div class="col-sm-8 col-xs-5">
{{with .storageConfig}}
<span>{{.MailboxMsgCap}} messages per mailbox</span>
{{end}}
</div>
</div>
</table>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-scale" aria-hidden="true"></span>
General Metrics</h3>
</div>
<div class="panel-body">
<table class="metrics">
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Uptime:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-uptime">.</span></div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>System Memory:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-memstatsSys">.</span></div>
<div class="col-sm-4"><span id="s-memstatsSys">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Heap Size:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-memstatsHeapSys">.</span></div>
<div class="col-sm-4"><span id="s-memstatsHeapSys">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Heap In-Use:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-memstatsHeapAlloc">.</span></div>
<div class="col-sm-4"><span id="s-memstatsHeapAlloc">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Heap # Objects:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-memstatsHeapObjects">.</span></div>
<div class="col-sm-4"><span id="s-memstatsHeapObjects">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Goroutines:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-goroutinesCurrent">.</span></div>
<div class="col-sm-4"><span id="s-goroutinesCurrent">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Open WebSockets:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-httpWebSocketConnectsCurrent">.</span></div>
<div class="col-sm-4"><span id="s-httpWebSocketConnectsCurrent">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
</table>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>
SMTP Metrics</h3>
</div>
<div class="panel-body">
<table class="metrics">
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Current Connections:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-smtpConnectsCurrent">.</span></div>
<div class="col-sm-4"><span id="s-smtpConnectsCurrent">.</span></div>
<div class="col-sm-2 hidden-xs">(10min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Total Connections:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-smtpConnectsTotal">.</span></div>
<div class="col-sm-4"><span id="s-smtpConnectsTotal">.</span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Messages Received:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-smtpReceivedTotal">.</span></div>
<div class="col-sm-4"><span id="s-smtpReceivedTotal">.</span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Errors Logged:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-smtpErrorsTotal">.</span></div>
<div class="col-sm-4"><span id="s-smtpErrorsTotal"></span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Warnings Logged:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-smtpWarnsTotal">.</span></div>
<div class="col-sm-4"><span id="s-smtpWarnsTotal"></span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
</table>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-hdd" aria-hidden="true"></span>
Storage Metrics</h3>
</div>
<div class="panel-body">
<table class="metrics">
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Store Type:</b></div>
<div class="col-sm-8 col-xs-5">{{ .storageConfig.Type }}</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Retention Period:</b></div>
<div class="col-sm-8 col-xs-5">
{{if .storageConfig.RetentionPeriod}}
<span id="m-retentionPeriod">.</span>
{{else}}
Disabled
{{end}}
</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Retention Scan:</b></div>
<div class="col-sm-8 col-xs-5">
{{if .storageConfig.RetentionPeriod}}
Completed <span id="m-retentionScanCompleted">.</span> ago
{{else}}
Disabled
{{end}}
</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Retention Deletes:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-retentionDeletesTotal">.</span></div>
<div class="col-sm-4"><span id="s-retentionDeletesTotal"></span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Currently Retained:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-retainedCurrent">.</span></div>
<div class="col-sm-4"><span id="s-retainedCurrent"></span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
<div class="row">
<div class="col-sm-3 col-xs-7"><b>Store Size:</b></div>
<div class="col-sm-3 col-xs-5"><span id="m-retainedSize">.</span></div>
<div class="col-sm-4"><span id="s-retainedSize"></span></div>
<div class="col-sm-2 hidden-xs">(60min)</div>
</div>
</table>
</div>
</div>
{{end}}