nat/assets/index.html
patchon 5a0b1f5d4d Initial commit of Pastebin fork
This commit is quite big rewrite and individual commits for each feature is
unfortunately not available. This fork introduces quite a lot of new features,
and possibly while doing so, some bugs as well. Nonetheless the features
introduced are listed below.

- Support for multiple database backends (sqlite3, postgresql and mysql are now
  supported). Configurations options like dbname/tablename/ports/adresses/etc.
  are supported as well.

- Support for dynamically adding lexers (languages) and styles (themes) from
  pygments. This means no manual configuration depending on where the
  installation is done. There is however a way of adding "prioritized" lexers.
  This feature can be nice to use sine pygments now days support hundreds of
  languages, some more common than others. Simply add the "display name" for
  each lexer you want to prioritize in the file 'assets/prio-lexers' and they
  will show up first in the list when the user selects languages.

- Support for changing styles and lexers directly from the webgui on the fly
  (no reload of the page, just content update).

- Support for row-highlightning (on/off) and rownumbers (show/hide).

- Support for showing information about when paste expires.

- Support for goo.gl-shortener.

- Extreme debugging.
2016-12-19 19:43:37 +01:00

185 lines
8.5 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ .Title }}</title>
<!-- Material Design fonts -->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700">
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bootstrap.material-design/0.5.10/css/bootstrap-material-design.min.css" integrity="sha256-j3CLSRG31GkOu6kaeLh7XsRgL2YNvRl9aOtXoAYt320=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bootstrap.material-design/0.5.10/css/ripples.min.css" integrity="sha256-+Og2qJI9qzvKYwhGo/LYXg0FzE1BhEQfDsUSjKXQ3Bg=" crossorigin="anonymous">
<!-- Sweetalert css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css">
<!-- pastebin stylesheet -->
<link rel="stylesheet" type="text/css" href="/assets/pastebin.css">
</head>
<body>
<div class="container">
<div class="page-header">
<h1 id="page-title">{{ .Title }}</h1>
</div>
<div class="well">
<div class="form-group is-empty form-no-margin">
<textarea class="form-control" rows="1" id="title" name="title" placeholder="Title" maxlength="50">{{ .PasteTitle }}</textarea>
<span class="help-block">Paste Title</span>
</div>
<div class="form-group is-empty form-no-margin" >
<textarea class="form-control" rows="20" id="paste" name="paste" placeholder="Paste" data-autoresize>{{printf "%s" .Body}}</textarea>
<span class="help-block">Paste your text here</span>
</div>
</div>
<div class="row paste-actions">
<div class="group col-sm-3" style="margin-right:-30px">
<label class="control-label ">Language</label>
<div class="btn-group">
<a href="javascript:void(0)" id="button-language" class="btn btn-primary btn-raised dropdown-toggle" data-toggle="dropdown" value="autodetect">Autodetect</a>
<ul class="dropdown-menu dropdown-scrollbar" id="dropdown-language">
<li class="dropdown-item" value="language_autodetect" selected><a> Autodetect </a></li>
<li class="dropdown-item" value="language_text"><a> Text </a></li>
<li class="divider"></li>
<li class="dropdown-label">Commonly used </li>
{{ range $key, $value := .LangsFirst }}
<li class="dropdown-item" value="language_{{ $value }}" ><a> {{ $key }}</a></li>
{{ end }}
<li class="divider"></li>
<li class="dropdown-label">The rest </li>
{{ range $key, $value := .LangsLast }}
<li class="dropdown-item" value="language_{{ $value }}"><a> {{ $key }}</a></li>
{{ end }}
</ul>
</div>
</div>
<div class="group col-sm-2">
<label class="control-label">Expiry</label>
<div class="btn-group">
<a href="javascript:void(0)" id="button-expiry" class="btn btn-primary btn-raised dropdown-toggle" data-toggle="dropdown" >Forever</a>
<ul class="dropdown-menu scrollbar" id="dropdown-expiry">
<li class="dropdown-item" value="expiry_300"><a>5 minutes</a></li>
<li class="dropdown-item" value="expiry_3600"><a>1 hour</a></li>
<li class="dropdown-item" value="expiry_86400"><a>1 day</a></li>
<li class="dropdown-item" value="expiry_604800"><a>1 week</a></li>
<li class="dropdown-item" value="expiry_2592000"><a>1 month</a></li>
<li class="dropdown-item" value="expiry_31556952"><a>1 year</a></li>
<li class="dropdown-item" value="expiry_0" selected><a>Forever</a></li>
</ul>
</div>
</div>
<div class="group col-sm-2">
<label class="control-label">Help</label>
<div class="btn-group">
<a href="javascript:void(0)" id="button-help" class="btn btn-primary btn-raised dropdown-toggle" data-toggle="dropdown" >Help</a>
</div>
</div>
<div class="pull-right">
<label class="control-label ">&nbsp;</label>
<div class="row">
<button class="btn btn-raised btn-primary" id="button-save">Submit<div class="ripple-container"></button>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/bootstrap.material-design/0.5.10/js/ripples.min.js" integrity="sha256-TY/EO/++Ug/P+fSBjaqlmtuphCBKwlP7TOnS+SGnN8g=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.5.10/js/material.min.js"></script>
<!-- Sweetalert js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<script>
$(document).ready(function(){
$.material.init();
$("#button-help").click(function(){
swal({
title: "Help ",
customClass: 'swal-wide',
text: "\
<span class='swal-bold'> Create Paste</span> \
<span class='swal-code'>echo '{&quot;paste&quot;: &quot;Hello FooBar&quot;}' | curl -H 'Content-Type: application/json' -d @- {{ .UrlAddress }}/api </span> \
\
<span class='swal-bold'> Delete Paste </span> \
<span class='swal-code'> curl -X DELETE -F 'delkey=insert-your-delete-key-here' {{ .UrlAddress }}/api/{pasteid} </span> \
\
<span class='swal-bold'> Show Paste </span> \
<span class='swal-code'> {{ .UrlAddress }}/p/{passte-id} </span> \
\
<span class='swal-bold'> Show Paste with a specific language </span> \
<span class='swal-code'> {{ .UrlAddress }}/p/{passte-id}/{language} </span> \
\
<span class='swal-bold'> Show Paste with a specific language and style </span> \
<span class='swal-code'> {{ .UrlAddress }}/p/{passte-id}/{language}/{style} </span> \
<span class='swal-bold'> Notes, </span> \
<span class='swal-code'> * Languages and Styles are standard components of the Python Syntax Highlighter (pygments)</span><br>\
\
<span class='swal-code'>Source: <a href='https://github.com/ewhal/Pastebin'>Github</a></span>\
<span class='swal-code'>Tools: <a href='https://github.com/ewhal/scripts/blob/master/paste.sh'>Paste.sh</a></span>",
html: true
});
});
// Bind dropdowns,
$(".dropdown-item").click(function(){
var action = $(this).attr("value").match(/(language|expiry)_(.*)/);
if (action.length != 3){
return
}
$("#button-"+action[1]).text($(this).text());
$("#button-"+action[1]).attr("value",action[2]);
});
$( "#button-save" ).click(function() {
// Construct the data,
var data_lang = $("#button-language").attr("value");
var data_expiry = $("#button-expiry").attr("value");
var data_title = $("#title").val();
var data_paste = $("#paste").val();
var json_data = { expiry : data_expiry,
title : data_title,
paste : data_paste,
lang : data_lang,
webreq : true };
$.ajax({
url: "http://localhost:9999/api",
type: 'POST',
contentType: "application/json; charset=utf-8",
data: JSON.stringify(json_data),
dataType: "json",
success: function(json){
window.location = json.url+"/"+data_lang
},
error: function(json){
sweetAlert("", json.responseText, "error");
}
});
});
});
</script>
</body>
</html>