/script-kiddie/002_script_kiddie/script-kiddie/index.html |
@@ -0,0 +1,417 @@ |
<!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 --> |
<meta name="description" content="Corrade Nucleon"> |
<meta name="author" content="Wizardry and Steamworks"> |
<link rel="icon" href="favicon.ico"> |
|
<title>Corrade Nucleus - LSL Scripting Environment</title> |
|
<!-- Bootstrap core CSS --> |
<link href="/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css"> |
<!-- Corrade Nucleus Fonts --> |
<link href="/css/nucleus/fonts.css" rel="stylesheet" type="text/css"> |
<!-- Customized Nucleus style. --> |
<link href="/css/nucleus/nucleus.css" rel="stylesheet" type="text/css"> |
<!-- Script Kiddie style. --> |
<link href="/script-kiddie/css/style.css" rel="stylesheet" type="text/css"> |
|
<!-- Bootstrap Toggle --> |
<link href="/script-kiddie/bower_components/bootstrap-toggle/css/bootstrap-toggle.min.css" rel="stylesheet" type="text/css"> |
|
</script> |
</head> |
|
<body> |
<!-- Dialog Modal --> |
<div id="popup" class="modal fade bs-example-modal-lg" role="dialog"> |
<div class="modal-dialog modal-lg"> |
<!-- Modal content--> |
|
<div class="modal-content"> |
<div class="modal-header"> |
<button type="button" class="close" data-dismiss="modal">×</button> |
|
<h1 id="title" class="modal-title"></h1> |
</div> |
|
<div id="content" class="modal-body"> |
<div class="progress"> |
<div id="progressbar" class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em; width: 2%;"> |
0% |
</div> |
</div> |
|
<div class="modal-footer"> |
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> |
</div> |
</div> |
</div> |
</div> |
</div> |
|
<div class="container"> |
<div class="jumbotron"> |
<h1>Corrade Script Kiddie</h1> |
<p class="lead">Script Kiddie is an LSL editor using Corrade as a backend for developing scripts.</p> |
<img src="script-kiddie/img/script-kiddie.png"></div> |
|
<!-- <div id="drag-1" class="draggable"> |
<p> You can drag one element </p> |
</div> --> |
|
<div id="editor-panel" class="panel panel-default draggable movable"> |
<div class="panel-heading"> |
<form id="script-tools" class="form-inline" data-toggle="validator" onSubmit="event.preventDefault();"> |
<div class="input-group"> |
<span class="input-group-btn"> |
<button id="compile-script" class="btn btn-default check-image checkButton" type="button" title="Compile script.">Compile</button> |
<button id="tidy-script" class="btn btn-default" type="button" title="Tidy source-code.">Cleanup</button> |
</span> |
</div> |
<div class="form-group has-feedback"> |
<div class="input-group"> |
<span class="input-group-btn"> |
<input id="store-script" type="checkbox" data-toggle="toggle" data-on="Store" data-off="No Store" data-onstyle="success" disabled="disabled"> |
</span> |
<input id="script-name" type="text" class="form-control" placeholder="Script Name" aria-describedby="basic-addon1" required> |
<span class="input-group-addon">-</span> |
<input id="script-UUID" type="text" class="form-control" aria-describedby="basic-addon2" size="36" readonly> |
</div> |
</div> |
</form> |
</div> |
<div class="panel-body" id="editorpanel"> |
<div id="editor" style="height: 500px;">default |
{ |
state_entry() |
{ |
llSay(0, "Hello, Avatar!"); |
} |
|
touch_start(integer total_number) |
{ |
llSay(0, "Touched."); |
} |
} |
</div> |
</div> |
</div> |
|
<div id="error-panel" class="panel panel-default draggable movable"> |
<div class="panel-heading"> |
<p>Compilation Errors</p> |
</div> |
<div class="panel-body" id="errorpanel"> |
<div id="errors"> |
<textarea id="message" class="form-control" rows="5" style="min-width: 100%; max-width: 100%; font-family: monospace; display: none;" readonly></textarea> |
</div> |
</div> |
</div> |
|
</div> <!-- /container --> |
|
<footer class="footer"> |
<p>© 2017 Wizardry and Steamworks</p> |
</footer> |
|
<!-- jQuery --> |
<script src="/bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script> |
<!-- Bootstrap Javascript --> |
<script src="/bower_components/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script> |
<!-- Bootstrap Validator --> |
<script src="/script-kiddie/bower_components/bootstrap-validator/dist/validator.min.js" type="text/javascript"></script> |
<!-- Bootstrap Toggle --> |
<script src="/script-kiddie/bower_components/bootstrap-toggle/js/bootstrap-toggle.min.js" type="text/javascript"></script> |
<!-- ACE --> |
<script type="text/javascript" src="/script-kiddie/bower_components/ace-builds/src-min-noconflict/ace.js"></script> |
<script type="text/javascript" src="/script-kiddie/bower_components/ace-builds/src-min-noconflict/ext-language_tools.js"></script> |
<!-- Beautify.JS --> |
<script type="text/javascript" src="/script-kiddie/bower_components/js-beautify/js/lib/beautify.js"></script> |
<!-- Velocity --> |
<script type="text/javascript" src="/script-kiddie/bower_components/velocity/velocity.min.js"></script> |
<!-- Interact JS --> |
<script type="text/javascript" src="/script-kiddie/bower_components/interactjs/dist/interact.min.js"></script> |
<!-- CryptoJS --> |
<script src="/bower_components/cryptojslib/components/core.js" type="text/javascript"></script> |
<script src="/bower_components/cryptojslib/components/enc-base64-min.js" type="text/javascript"></script> |
<!-- Wizardry and Steamworks JavaScript Includes --> |
<script src="/js/was/csv.js" type="text/javascript"></script> |
<script src="/js/was/jquery/arrays.js" type="text/javascript"></script> |
<script> |
$(document).ready(() => { |
// Auto-complete. |
ace.require("ace/ext/language_tools"); |
|
// Create the editor. |
var editor = ace.edit("editor"); |
editor.setTheme("ace/theme/twilight"); |
editor.getSession().setMode("ace/mode/lsl"); |
editor.setOptions({ |
enableBasicAutocompletion: true, |
enableSnippets: false, |
enableLiveAutocompletion: true |
}); |
|
// Get the script from the storage. |
var storeScriptText = localStorage.getItem("nucleus-script-kiddie.lsl"); |
if (typeof value == "string") |
editor.getSession().setValue(storeScriptText); |
|
function compile(lsl) { |
// Set the editor to read-only. |
editor.setReadOnly(true); |
|
// Set the button image. |
$('#compile-script').removeClass("check-image"); |
$('#compile-script').removeClass("checkButton"); |
|
$('#compile-script').removeClass("cross-image"); |
$('#compile-script').removeClass("crossButton"); |
|
$('#compile-script').addClass("activity-image"); |
$('#compile-script').addClass("activityButton"); |
|
$.ajax({ |
type: 'POST', |
url: '/', |
data: { |
command: 'compilescript', |
data: lsl |
}, |
dataType: 'json' |
}).done(function(response) { |
// Set the editor to read-enabled. |
editor.setReadOnly(false); |
|
if(response.success === "True") { |
// Set the button image. |
$('#compile-script').removeClass("activity-image"); |
$('#compile-script').removeClass("activityButton"); |
|
$('#compile-script').addClass("check-image"); |
$('#compile-script').addClass("checkButton"); |
|
$("#message").velocity("slideUp", { |
duration: 1000 |
}); |
return; |
} |
|
// Move panel to top. |
$('#error-panel').css('z-index', getTopWindowIndex() + 1); |
$('#error-panel').css('position', 'relative'); |
|
// Set the button image. |
$('#compile-script').removeClass("activity-image"); |
$('#compile-script').removeClass("activityButton"); |
|
$('#compile-script').addClass("cross-image"); |
$('#compile-script').addClass("crossButton"); |
|
$("#message").velocity("slideDown", { |
duration: 1000 |
}); |
|
$('#message').val(wasCSVToArray(response.data).join('')); |
}); |
} |
|
function store(lsl) { |
$.ajax({ |
type: 'POST', |
url: '/', |
data: { |
command: 'upload', |
type: 'LSLText', |
item: $('#script-UUID').val(), |
name: $('#script-name').val(), |
data: CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse(lsl)) |
}, |
dataType: 'json' |
}).done(function(response) { |
if(response.success === "True") { |
var data = wasCSVToArray(response.data); |
var UUID = data[data.indexOf('item') + 1]; |
|
// Set the inventory UUID of the saved script. |
$('#script-UUID').val(UUID); |
|
localStorage.setItem('nucleus-script-kiddie-script-UUID', UUID); |
} |
}); |
} |
|
// Add compiling with Ctrl-S |
editor.commands.addCommand({ |
name: 'Compile', |
bindKey: { |
win: 'Ctrl-S', |
mac: 'Command-S' |
}, |
exec: editor => { |
var data = editor.getSession().getValue(); |
compile(data); |
if($('#store-script').prop('checked') === true) |
store(data); |
}, |
readOnly: false // false if this command should not apply in readOnly mode |
}); |
|
// Add click listener for compile button. |
$('#compile-script').on('click', function (e) { |
if($('#compile-script').hasClass("activity-image")) |
return; |
|
var data = editor.getSession().getValue(); |
compile(data); |
if($('#store-script').prop('checked') === true) |
store(data); |
}); |
|
// Add click listener for tidy button. |
$('#tidy-script').on('click', function (e) { |
if($('#compile-script').hasClass("activity-image")) |
return; |
|
// Code cleanup parameters. |
editor.setValue( |
js_beautify( |
editor.getSession().getValue(), |
{ |
"indent_size": 4, |
"indent_char": " ", |
"indent_with_tabs": false, |
"eol": "\n", |
"end_with_newline": true, |
"indent_level": 0, |
"preserve_newlines": true, |
"max_preserve_newlines": 10, |
"space_in_paren": false, |
"space_in_empty_paren": false, |
"jslint_happy": false, |
"space_after_anon_function": false, |
"brace_style": "expand", |
"break_chained_methods": false, |
"keep_array_indentation": false, |
"unescape_strings": false, |
"wrap_line_length": 0, |
"e4x": false, |
"comma_first": false, |
"operator_position": "before-newline" |
} |
) |
); |
}); |
|
// Save script on change. |
editor.getSession().on('change', function(e) { |
localStorage.setItem("nucleus-script-kiddie.lsl", editor.getValue()); |
}); |
|
// Move windows to top on click. |
$('.draggable').click(function() { |
$(this).css('z-index', getTopWindowIndex() + 1); |
}); |
|
// target elements with the "draggable" class |
interact('.draggable') |
.draggable({ |
// enable inertial throwing |
inertia: true, |
// keep the element within the area of it's parent |
restrict: { |
// Let the user move the windows freely. |
//restriction: "parent", |
endOnly: true, |
elementRect: { top: 0, left: 0, bottom: 1, right: 1 } |
}, |
|
// enable autoScroll |
autoScroll: true, |
|
onmove: dragMoveListener, |
onend: function (event) { |
event.target.style.opacity = 1; |
}, |
onstart: function(event) { |
// Move windows to top on drag. |
event.target.style.zIndex = getTopWindowIndex() + 1; |
event.target.style.opacity = 0.5; |
} |
}) |
.allowFrom('.panel-heading'); |
|
function getTopWindowIndex() { |
return Math.max.apply(null, |
$.map($('.draggable'), function(e, n) { |
if ($(e).css('position') != 'static') |
return parseInt($(e).css('z-index')) || 1; |
}) |
); |
} |
|
function dragMoveListener (event) { |
var target = event.target, |
// keep the dragged position in the data-x/data-y attributes |
x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx, |
y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; |
|
// translate the element |
target.style.webkitTransform = |
target.style.transform = |
'translate(' + x + 'px, ' + y + 'px)'; |
|
// update the posiion attributes |
target.setAttribute('data-x', x); |
target.setAttribute('data-y', y); |
} |
|
// this is used later in the resizing and gesture demos |
window.dragMoveListener = dragMoveListener; |
|
// Get the item name from the storage. |
var storeScriptUUID = localStorage.getItem('nucleus-script-kiddie-script-UUID'); |
if (typeof storeScriptUUID == "string") |
$('#script-UUID').val(storeScriptUUID); |
|
// Get the item name from the storage. |
var storeScriptName = localStorage.getItem('nucleus-script-kiddie-script-name'); |
if (typeof storeScriptName == "string") |
$('#script-name').val(storeScriptName); |
|
// Store script name on modification. |
var scriptNameTimerID; |
$('#script-name').on('input',function(e){ |
var value = $(this).val(); |
if($(this).data('lastval')!= value){ |
|
$(this).data('lastval',value); |
clearTimeout(scriptNameTimerID); |
|
scriptNameTimerID = setTimeout(function() { |
localStorage.setItem('nucleus-script-kiddie-script-name', value); |
},500); |
}; |
}); |
|
// Enable storing of script only if the form validates. |
$('#script-tools').on('validated.bs.validator', function (e) { |
if($('#script-tools').has('.has-error').length !== 0) { |
$('#store-script').bootstrapToggle('off'); |
$('#store-script').bootstrapToggle('disable'); |
return; |
} |
$('#store-script').bootstrapToggle('enable'); |
}); |
|
|
}); |
</script> |
</body> |
</html> |