mirror of
https://github.com/perlbot/perlbuut-pastebin
synced 2025-06-07 14:17:26 -04:00
Work in progress for multifile
This commit is contained in:
Ryan Voots
parent
183a4159ad
commit
5d05e378b2
5 changed files with 475 additions and 0 deletions
29
static/editor.css
Normal file
29
static/editor.css
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
#editor {
|
||||
margin: auto;
|
||||
position: relative !important;
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
display: none;
|
||||
font-variant-ligatures: none;
|
||||
}
|
||||
|
||||
#paste {
|
||||
font-family: 'monospace'
|
||||
}
|
||||
|
||||
html, body, #content {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "AnonymousPro";
|
||||
src: url("/static/fonts/AnonymousPro-Regular.woff2") format('woff2');
|
||||
}
|
||||
|
||||
.options label {
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
.options label:not(:first-child) {
|
||||
padding-left: 2em;
|
||||
}
|
||||
174
static/editor.js
Normal file
174
static/editor.js
Normal file
|
|
@ -0,0 +1,174 @@
|
|||
$(function() {
|
||||
var hostname = $(location).attr('hostname');
|
||||
var channel = $(location).attr('hash');
|
||||
|
||||
// console.log("host: " + hostname + " channel: " + channel);
|
||||
|
||||
// fuck parsing the hostname
|
||||
var servers = {
|
||||
"f.perlbot.pl": "localhost:perlbot:",
|
||||
"freenode.perlbot.pl": "localhost:perlbot:",
|
||||
"m.perlbot.pl": "localhost:perlbot-magnet:",
|
||||
"magnet.perlbot.pl": "localhost:perlbot-magnet:",
|
||||
"o.perlbot.pl": "localhost:perlbot-oftc:",
|
||||
"oftc.perlbot.pl": "localhost:perlbot-oftc:",
|
||||
"f.perl.bot": "localhost:perlbot:",
|
||||
"freenode.perl.bot": "localhost:perlbot:",
|
||||
"m.perl.bot": "localhost:perlbot-magnet:",
|
||||
"magnet.perl.bot": "localhost:perlbot-magnet:",
|
||||
"o.perl.bot": "localhost:perlbot-oftc:",
|
||||
"oftc.perl.bot": "localhost:perlbot-oftc:",
|
||||
};
|
||||
|
||||
if (channel && servers[hostname]) { // only do this if we have a channel and a valid server
|
||||
// console.log("found default channel to post: "+servers[hostname]+channel);
|
||||
var option = $("option[value='"+servers[hostname]+channel+"']");
|
||||
// console.log(option);
|
||||
option.prop('selected', true);
|
||||
}
|
||||
|
||||
if (servers[hostname]) {
|
||||
var badoptions = $("select#channel option:not([value^='"+servers[hostname]+"'])");
|
||||
console.log(badoptions);
|
||||
badoptions.remove();
|
||||
}
|
||||
});
|
||||
|
||||
$(function() {
|
||||
var showingmodules = 0;
|
||||
var showingeval = 0;
|
||||
|
||||
var editor;
|
||||
|
||||
var use_editor = function() {
|
||||
if ($("#raw_editor").is(":checked")) {
|
||||
if (editor) {
|
||||
$("#paste").val(editor.getValue());
|
||||
}
|
||||
$("#editor").hide();
|
||||
$("#paste").show();
|
||||
} else {
|
||||
$("#paste").hide();
|
||||
$("#editor").show();
|
||||
if (!editor) {
|
||||
$("#editor").text($("#paste").val());
|
||||
} else {
|
||||
editor.setValue($("#paste").val(),0);
|
||||
editor.clearSelection();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
use_editor();
|
||||
$("#raw_editor").on("change", use_editor);
|
||||
editor = ace.edit("editor");
|
||||
//editor.setTheme("ace/theme/twilight");
|
||||
|
||||
//safely delete all bindings
|
||||
var save_keys={};
|
||||
Object.keys(editor.keyBinding.$defaultHandler.commandKeyBinding)
|
||||
.filter((value) => value.match(/(?:(?:backspac|hom)e|d(?:elete|own)|(?:righ|lef)t|end|up|tab)/))
|
||||
.forEach((key) => save_keys[key] = editor.keyBinding.$defaultHandler.commandKeyBinding[key]);
|
||||
|
||||
editor.keyBinding.$defaultHandler.commandKeyBinding = save_keys;
|
||||
|
||||
|
||||
$("#language").on('change', function () {
|
||||
var language = $('#language option').filter(':selected').attr('data-lang');
|
||||
console.log("language: ", language);
|
||||
editor.session.setMode("ace/mode/" + language);
|
||||
});
|
||||
|
||||
var channel = $(location).attr('hash');
|
||||
if (channel == "#perl6") {
|
||||
$("#language").val("perl6").change();
|
||||
} else if (channel == "#cobol") {
|
||||
$("#language").val("cobol").change();
|
||||
}
|
||||
|
||||
editor.session.setMode("ace/mode/perl");
|
||||
|
||||
// editor.setOptions({fontFamily: ['AnonymousPro', 'monospace', 'mono']});
|
||||
|
||||
|
||||
function setup_columns() {
|
||||
if (showingeval && showingmodules) {
|
||||
$("#editors").removeClass().addClass('col-md-6');
|
||||
$("#evalcol").removeClass().addClass('col-md-4');
|
||||
$("#modules").removeClass().addClass('col-md-2');
|
||||
} else if (showingeval) {
|
||||
$("#editors").removeClass().addClass('col-md-10');
|
||||
$("#evalcol").removeClass().addClass('col-md-2');
|
||||
$("#modules").removeClass().addClass('hidden');
|
||||
} else if (showingmodules) {
|
||||
$("#editors").removeClass().addClass('col-md-10');
|
||||
$("#evalcol").removeClass().addClass('hidden');
|
||||
$("#modules").removeClass().addClass('col-md-2');
|
||||
} else {
|
||||
$("#editors").removeClass().addClass('col-md-12');
|
||||
$("#evalcol").removeClass().addClass('hidden');
|
||||
$("#modules").removeClass().addClass('hidden');
|
||||
}
|
||||
};
|
||||
|
||||
function resizeAce() {
|
||||
var h = window.innerHeight;
|
||||
if (h > 360) {
|
||||
$('#editor').css('height', (h - 175).toString() + 'px');
|
||||
}
|
||||
};
|
||||
$(window).on('resize', function () {
|
||||
resizeAce();
|
||||
});
|
||||
resizeAce();
|
||||
|
||||
$("#submit").on('click', function () {
|
||||
var code = $("#raw_editor").is(":checked") ?
|
||||
$("#paste").val() :
|
||||
editor.getValue();
|
||||
$("#paste").text(code); // copy to the textarea
|
||||
});
|
||||
|
||||
$('#evalme').on('click', function () {
|
||||
showingeval = 1;
|
||||
$('#eval').text("Evaluating...");
|
||||
|
||||
setup_columns();
|
||||
|
||||
var code = $("#raw_editor").is(":checked") ?
|
||||
$("#paste").val() :
|
||||
editor.getValue();
|
||||
|
||||
var language = $('#language option').filter(':selected').val();
|
||||
|
||||
$.ajax('/eval', {
|
||||
method: 'post',
|
||||
data: {code: code, language: language},
|
||||
dataType: "json",
|
||||
success: function(data, status) {
|
||||
console.log("data out", data);
|
||||
var keys = Object.keys(data.evalout);
|
||||
var outputarr = [];
|
||||
|
||||
if (keys.length > 1) {
|
||||
outputarr = $.map(data.evalout, function(output, lang) {
|
||||
return "[[ "+lang+" ]]\n"+output+"\n\n";
|
||||
});
|
||||
} else {
|
||||
outputarr = [data.evalout[keys[0]]];
|
||||
}
|
||||
console.log("outputarr", outputarr);
|
||||
console.log(outputarr.join("\n"));
|
||||
|
||||
$('#eval').text(outputarr.join("\n"));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$("#showmodules").on('click', function() {
|
||||
showingmodules = 1 - showingmodules;
|
||||
|
||||
setup_columns();
|
||||
});
|
||||
|
||||
});
|
||||
162
static/test.html
Normal file
162
static/test.html
Normal file
|
|
@ -0,0 +1,162 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>Amazon Lex for JavaScript - Sample Application (BookTrip)</title>
|
||||
<script src="https://sdk.amazonaws.com/js/aws-sdk-2.41.0.min.js"></script>
|
||||
<style language="text/css">
|
||||
input#wisdom {
|
||||
padding: 4px;
|
||||
font-size: 1em;
|
||||
width: 400px
|
||||
}
|
||||
|
||||
input::placeholder {
|
||||
color: #ccc;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
p.userRequest {
|
||||
margin: 4px;
|
||||
padding: 4px 10px 4px 10px;
|
||||
border-radius: 4px;
|
||||
min-width: 50%;
|
||||
max-width: 85%;
|
||||
float: left;
|
||||
background-color: #7d7;
|
||||
}
|
||||
|
||||
p.lexResponse {
|
||||
margin: 4px;
|
||||
padding: 4px 10px 4px 10px;
|
||||
border-radius: 4px;
|
||||
text-align: right;
|
||||
min-width: 50%;
|
||||
max-width: 85%;
|
||||
float: right;
|
||||
background-color: #bbf;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
p.lexError {
|
||||
margin: 4px;
|
||||
padding: 4px 10px 4px 10px;
|
||||
border-radius: 4px;
|
||||
text-align: right;
|
||||
min-width: 50%;
|
||||
max-width: 85%;
|
||||
float: right;
|
||||
background-color: #f77;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1 style="text-align: left">Amazon Lex - BookTrip</h1>
|
||||
<p style="width: 400px">
|
||||
This little chatbot shows how easy it is to incorporate
|
||||
<a href="https://aws.amazon.com/lex/" title="Amazon Lex (product)" target="_new">Amazon Lex</a> into your web pages. Try it out.
|
||||
</p>
|
||||
<div id="conversation" style="width: 400px; height: 400px; border: 1px solid #ccc; background-color: #eee; padding: 4px; overflow: scroll"></div>
|
||||
<form id="chatform" style="margin-top: 10px" onsubmit="return pushChat();">
|
||||
<input type="text" id="wisdom" size="80" value="" placeholder="I need a hotel room">
|
||||
</form>
|
||||
<script type="text/javascript">
|
||||
// set the focus to the input box
|
||||
document.getElementById("wisdom").focus();
|
||||
|
||||
// Initialize the Amazon Cognito credentials provider
|
||||
AWS.config.region = 'us-east-1'; // Region
|
||||
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
|
||||
// Provide your Pool Id here
|
||||
IdentityPoolId: 'us-east-1:dbe1d89b-d4ed-459d-ba40-ef8f096b5e4b',
|
||||
});
|
||||
|
||||
var lexruntime = new AWS.LexRuntime();
|
||||
var lexUserId = 'chatbot-demo' + Date.now();
|
||||
var sessionAttributes = {};
|
||||
|
||||
function pushChat() {
|
||||
|
||||
// if there is text to be sent...
|
||||
var wisdomText = document.getElementById('wisdom');
|
||||
if (wisdomText && wisdomText.value && wisdomText.value.trim().length > 0) {
|
||||
|
||||
// disable input to show we're sending it
|
||||
var wisdom = wisdomText.value.trim();
|
||||
wisdomText.value = '...';
|
||||
wisdomText.locked = true;
|
||||
|
||||
// send it to the Lex runtime
|
||||
var params = {
|
||||
botAlias: '$LATEST',
|
||||
botName: 'BookTrip',
|
||||
inputText: wisdom,
|
||||
userId: lexUserId,
|
||||
sessionAttributes: sessionAttributes
|
||||
};
|
||||
showRequest(wisdom);
|
||||
lexruntime.postText(params, function(err, data) {
|
||||
if (err) {
|
||||
console.log(err, err.stack);
|
||||
showError('Error: ' + err.message + ' (see console for details)')
|
||||
}
|
||||
if (data) {
|
||||
// capture the sessionAttributes for the next cycle
|
||||
sessionAttributes = data.sessionAttributes;
|
||||
// show response and/or error/dialog status
|
||||
showResponse(data);
|
||||
}
|
||||
// re-enable input
|
||||
wisdomText.value = '';
|
||||
wisdomText.locked = false;
|
||||
});
|
||||
}
|
||||
// we always cancel form submission
|
||||
return false;
|
||||
}
|
||||
|
||||
function showRequest(daText) {
|
||||
|
||||
var conversationDiv = document.getElementById('conversation');
|
||||
var requestPara = document.createElement("P");
|
||||
requestPara.className = 'userRequest';
|
||||
requestPara.appendChild(document.createTextNode(daText));
|
||||
conversationDiv.appendChild(requestPara);
|
||||
conversationDiv.scrollTop = conversationDiv.scrollHeight;
|
||||
}
|
||||
|
||||
function showError(daText) {
|
||||
|
||||
var conversationDiv = document.getElementById('conversation');
|
||||
var errorPara = document.createElement("P");
|
||||
errorPara.className = 'lexError';
|
||||
errorPara.appendChild(document.createTextNode(daText));
|
||||
conversationDiv.appendChild(errorPara);
|
||||
conversationDiv.scrollTop = conversationDiv.scrollHeight;
|
||||
}
|
||||
|
||||
function showResponse(lexResponse) {
|
||||
|
||||
var conversationDiv = document.getElementById('conversation');
|
||||
var responsePara = document.createElement("P");
|
||||
responsePara.className = 'lexResponse';
|
||||
if (lexResponse.message) {
|
||||
responsePara.appendChild(document.createTextNode(lexResponse.message));
|
||||
responsePara.appendChild(document.createElement('br'));
|
||||
}
|
||||
if (lexResponse.dialogState === 'ReadyForFulfillment') {
|
||||
responsePara.appendChild(document.createTextNode(
|
||||
'Ready for fulfillment'));
|
||||
// TODO: show slot values
|
||||
} else {
|
||||
responsePara.appendChild(document.createTextNode(
|
||||
'(' + lexResponse.dialogState + ')'));
|
||||
}
|
||||
conversationDiv.appendChild(responsePara);
|
||||
conversationDiv.scrollTop = conversationDiv.scrollHeight;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
9
static/test2.html
Normal file
9
static/test2.html
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<html>
|
||||
<title>perlbot v2 api test</title>
|
||||
|
||||
<form action="/api/v2/add_file" method="post">
|
||||
<input name="filename_1" value="foo.txt" />
|
||||
<textarea name="filecontent_1">hello world</textarea>
|
||||
<input type="submit"/>
|
||||
</form>
|
||||
</html>
|
||||
101
templates/neweditor.html.tt
Normal file
101
templates/neweditor.html.tt
Normal file
|
|
@ -0,0 +1,101 @@
|
|||
[% BLOCK body_style %]
|
||||
<link rel="stylesheet" type="text/css" href="/static/editor.css" />
|
||||
<script src="/static/ace/ace.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="/static/editor.js"></script>
|
||||
[% END %]
|
||||
|
||||
[% BLOCK page_header %]
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<label for="username">Who: </label>
|
||||
<input size="20" name="username" placeholder="Anonymous" />
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<label for="channel">Where: </label>
|
||||
<select name="channel" id="channel">
|
||||
<option value="">-- IRC Channel --</option>
|
||||
[% FOREACH channel = channels %]
|
||||
<option value="[% channel.key %]">[% channel.value %]</option>
|
||||
[% END %]
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
<label for="desc">What: </label>
|
||||
<input size="40" name="description" placeholder="I broke this" maxlength="40"/>
|
||||
<input type="button" value="Show supported modules" id="showmodules" style="float:right"/>
|
||||
</div>
|
||||
<div class="col-md-1">
|
||||
<a href="http://www.cafepress.com/perlbot">Perlbot Merch</a>
|
||||
</div>
|
||||
</div>
|
||||
[% END %]
|
||||
|
||||
[% BLOCK body %]
|
||||
<form action="/api/v1/paste" method="POST" id="form">
|
||||
<input type="hidden" name="redirect" value="1" />
|
||||
<div id="content" class="container">
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
[% PROCESS page_header %]
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
<div id="editors" class="col-md-12">
|
||||
<div class="options">
|
||||
<!-- TODO this should come from the eval server somehow -->
|
||||
<label>Expire in</label>
|
||||
<select name="expire">
|
||||
<option value="1">1 hour</option>
|
||||
<option value="8">8 hours</option>
|
||||
<option value="24">24 hours</option>
|
||||
<option value="48">2 days</option>
|
||||
<option value="168" selected>1 week</option>
|
||||
<option value="720">1 month</option>
|
||||
<option value="8760">1 year</option>
|
||||
<option value="">Never</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- BEGIN LOOP -->
|
||||
<div id="file_1" class="file">
|
||||
<div class="fileheader col-md-12">
|
||||
<label>Filename</label>
|
||||
<input type="text" name="filename_1" placeholder=""/>
|
||||
<label>Language</label>
|
||||
<select name="filelang_1" id="filelang_1">
|
||||
[% FOREACH lang IN languages %]
|
||||
<option value="[% lang.name %]" data-lang="[% lang.mode %]">[% lang.description %]</option>
|
||||
[% END %]
|
||||
</select>
|
||||
<input type="file" name="fileupload_1" />
|
||||
<!-- use a hidden field when we've been rebuilt <input type="hidden" name="fileupload_1" /> -->
|
||||
<input type="submit" name="filedelete_1" value="Delete File"/>
|
||||
<label>Raw Editor</label>
|
||||
<input type="checkbox" id="raw_editor_1"/>
|
||||
</div>
|
||||
<div class="filecontents col-md-12">
|
||||
<textarea name="filecontents_1" id="filecontents_1" cols="80" rows="25">[% pastedata | html %]</textarea>
|
||||
<pre id="editor"></pre>
|
||||
</div>
|
||||
</div>
|
||||
<!-- END LOOP -->
|
||||
</div>
|
||||
<div id="evalcol" class="hidden">
|
||||
<h3>Program Output:</h3>
|
||||
<pre id="eval">[% eval | html %]</pre>
|
||||
</div>
|
||||
<div id="modules" class="hidden">
|
||||
<h3>Supported modules</h3>
|
||||
Under construction
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer">
|
||||
<input value="Submit" type="submit" id="submit" />
|
||||
<input value="Check Eval" type="button" id="evalme" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
[% END %]
|
||||
Loading…
Add table
Reference in a new issue