MightyPork
/
php-sandbox
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

now shows fatal error message (if possible)

Browse Source
master
Ondřej Hruška 9 years ago
parent 16cd163cb8
commit 551a10bbf5
3 changed files with 239 additions and 219 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 14
      index.php
  2. 260
      php-console.js
  3. 184
      styles.css

14
index.php
Unescape View File

@ -1,6 +1,16 @@
<?php <?php
ini_set('log_errors', 0);
ini_set('display_errors', 1); /**
* PHP Sandbox: https://github.com/MightyPork/php-sandbox
*/
ini_set('log_errors', false);
ini_set('display_errors', true);
ini_set('display_startup_errors', true);
ini_set('display_not_found_reason', true);
ini_set('display_exceptions', true);
ini_set('html_errors', false);
error_reporting(E_ALL | E_STRICT); error_reporting(E_ALL | E_STRICT);
// --- Handle config --- // --- Handle config ---

260
php-console.js
Unescape View File

@ -15,134 +15,134 @@
* Source on Github http://github.com/MightyPork/php-sandbox * Source on Github http://github.com/MightyPork/php-sandbox
*/ */
(function (require, $, ace) { (function (require, $, ace) {
"use strict"; "use strict";
var updateStatusBar, handleSubmit, initializeAce, handleAjaxError, options, editor; var updateStatusBar, handleSubmit, initializeAce, handleAjaxError, options, editor;
options = { options = {
tabsize: 4, tabsize: 4,
editor: 'editor' editor: 'editor'
}; };
/** /**
* updates the text of the status bar * updates the text of the status bar
*/ */
updateStatusBar = function (e) { updateStatusBar = function (e) {
var cursor_position = editor.getCursorPosition(); var cursor_position = editor.getCursorPosition();
$('.statusbar .position').text('Line: ' + (1 + cursor_position.row) + ', Column: ' + cursor_position.column); $('.statusbar .position').text('Line: ' + (1 + cursor_position.row) + ', Column: ' + cursor_position.column);
}; };
/** /**
* does an async request to eval the php code and displays the result * does an async request to eval the php code and displays the result
*/ */
handleSubmit = function (e) { handleSubmit = function (e) {
e.preventDefault(); e.preventDefault();
//$('div.output').html('<img src="loader.gif" class="loader" alt="" /> Loading ...'); /* loader sucks */ //$('div.output').html('<img src="loader.gif" class="loader" alt="" /> Loading ...'); /* loader sucks */
// store session // store session
if (window.localStorage) { if (window.localStorage) {
localStorage.setItem('phpCode', editor.getSession().getValue()); localStorage.setItem('phpCode', editor.getSession().getValue());
} }
// eval server-side // eval server-side
$.post('?js=1', { code: editor.getSession().getValue() }, function (res, status, jqXHR) { $.post('?js=1', {code: editor.getSession().getValue()}, function (res, status, jqXHR) {
var mem = jqXHR.getResponseHeader("X-Memory-Usage") || "", var mem = jqXHR.getResponseHeader("X-Memory-Usage") || "",
rendertime = jqXHR.getResponseHeader("X-Rendertime") || ""; rendertime = jqXHR.getResponseHeader("X-Rendertime") || "";
if (mem || rendertime) { if (mem || rendertime) {
$('.statusbar .runtime-info').text('Memory usage: '+ mem + ' MB, Rendertime: ' + rendertime + 'ms'); $('.statusbar .runtime-info').text('Memory usage: ' + mem + ' MB, Rendertime: ' + rendertime + 'ms');
} else { } else {
$('.statusbar .runtime-info').text(''); $('.statusbar .runtime-info').text('');
} }
if (res.match(/#end-php-console-output#$/)) { if (res.match(/#end-php-console-output#$/)) {
var result = res.substring(0, res.length - 24); var result = res.substring(0, res.length - 24);
$('div.output').text(result); // or html? $('div.output').text(result); // or html?
} else { } else {
$('div.output').text(res + "\n\n*** Script ended unexpectedly. ***"); $('div.output').text(res + "\n\n*** Script ended unexpectedly. ***");
} }
}); });
}; };
handleAjaxError = function (event, jqxhr, settings, exception) { handleAjaxError = function (event, jqxhr, settings, exception) {
$('div.output').html("<em>Error occured while posting your code.</em>"); $('div.output').html("<em>Error occured while posting your code.</em>" + jqxhr.responseText);
}; };
initializeAce = function () { initializeAce = function () {
var PhpMode, code, storedCode; var PhpMode, code, storedCode;
code = $('#' + options.editor).text(); code = $('#' + options.editor).text();
// reload last session // reload last session
if (window.localStorage && code.match(/(<\?php)?\s*/)) { if (window.localStorage && code.match(/(<\?php)?\s*/)) {
storedCode = localStorage.getItem('phpCode'); storedCode = localStorage.getItem('phpCode');
if (storedCode) { if (storedCode) {
code = storedCode; code = storedCode;
} }
} }
$('#' + options.editor).replaceWith('<div id="' + options.editor + '" class="' + options.editor + '"></div>'); $('#' + options.editor).replaceWith('<div id="' + options.editor + '" class="' + options.editor + '"></div>');
$('#' + options.editor).text(code); $('#' + options.editor).text(code);
editor = ace.edit(options.editor); editor = ace.edit(options.editor);
editor.focus(); editor.focus();
editor.gotoLine(3, 0); editor.gotoLine(3, 0);
editor.setTheme("ace/theme/monokai"); editor.setTheme("ace/theme/monokai");
editor.setOptions({ editor.setOptions({
showPrintMargin: false, showPrintMargin: false,
fontSize: '18px', fontSize: '18px',
enableBasicAutocompletion: true, enableBasicAutocompletion: true,
fontFamily: 'Source Code Pro' fontFamily: 'Source Code Pro'
}); });
// set mode // set mode
PhpMode = require("ace/mode/php").Mode; PhpMode = require("ace/mode/php").Mode;
editor.getSession().setMode(new PhpMode()); editor.getSession().setMode(new PhpMode());
// tab size // tab size
if (options.tabsize) { if (options.tabsize) {
editor.getSession().setTabSize(options.tabsize); editor.getSession().setTabSize(options.tabsize);
editor.getSession().setUseSoftTabs(true); editor.getSession().setUseSoftTabs(true);
} else { } else {
editor.getSession().setUseSoftTabs(false); editor.getSession().setUseSoftTabs(false);
} }
// events // events
editor.getSession().selection.on('changeCursor', updateStatusBar); editor.getSession().selection.on('changeCursor', updateStatusBar);
// reset button // reset button
if (window.localStorage) { if (window.localStorage) {
$('.statusbar .reset').on('click', function (e) { $('.statusbar .reset').on('click', function (e) {
editor.getSession().setValue('<?php\n\n'); editor.getSession().setValue('<?php\n\n');
editor.focus(); editor.focus();
editor.gotoLine(3, 0); editor.gotoLine(3, 0);
window.localStorage.setItem('phpCode', ''); window.localStorage.setItem('phpCode', '');
e.preventDefault(); e.preventDefault();
}); });
} }
// commands // commands
editor.commands.addCommand({ editor.commands.addCommand({
name: 'submitForm', name: 'submitForm',
bindKey: { bindKey: {
win: 'Ctrl-Return|Alt-Return', win: 'Ctrl-Return|Alt-Return',
mac: 'Command-Return|Alt-Return' mac: 'Command-Return|Alt-Return'
}, },
exec: function (editor) { exec: function (editor) {
$('form').submit(); $('form').submit();
} }
}); });
}; };
$.console = function (settings) { $.console = function (settings) {
$.extend(options, settings); $.extend(options, settings);
$(function () { $(function () {
$(document).ready(initializeAce); $(document).ready(initializeAce);
$(document).ajaxError(handleAjaxError); $(document).ajaxError(handleAjaxError);
$('form').submit(handleSubmit); $('form').submit(handleSubmit);
}); });
}; };
}(ace.require, jQuery, ace)); }(ace.require, jQuery, ace));

184
styles.css
Unescape View File

@ -1,155 +1,165 @@
body, textarea, input { body, textarea, input {
font-size: 12px; font-size: 12px;
font-family: monospace "Source Code Pro"; font-family: "Source Code Pro", monospace;
} }
body { body {
background: #191A16; background: #191A16;
color: #F0F0F0; color: #F0F0F0;
margin: 0; margin: 0;
padding: 0; padding: 0;
width: 100%; width: 100%;
height:100%; height:100%;
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow:hidden; overflow:hidden;
} }
/* ace-editor requires to define styles by id (specificity) */ /* ace-editor requires to define styles by id (specificity) */
.editor#editor { .editor#editor {
/** / /** /
width: 80%; width: 80%;
left: 20%; left: 20%;
/**/ /**/
width: 100%; width: 100%;
/**/ /**/
position: relative; position: relative;
flex: 1 1 auto; flex: 1 1 auto;
} }
.console-wrapper { .console-wrapper {
flex: 1 1 auto; flex: 1 1 auto;
display: flex; display: flex;
} }
.footer-wrapper { .footer-wrapper {
flex: 0 1 auto; flex: 0 1 auto;
} }
a { a {
color: #88f; color: #88f;
} }
.expand { .expand {
display: block; display: block;
margin-bottom: 5px; margin-bottom: 5px;
} }
.output, .input { .output, .input {
} }
.output-wrapper, .input-wrapper { .output-wrapper, .input-wrapper {
flex: 1 1 50%; flex: 1 1 50%;
position: relative; position: relative;
} }
.output { .output {
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
overflow: auto; overflow: auto;
padding: 0 5px; padding: 0 5px;
font-size: 18px; font-size: 18px;
white-space: pre-wrap; /* CSS 3 */ white-space: pre-wrap; /* CSS 3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */ white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */ white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */ word-wrap: break-word; /* Internet Explorer 5.5+ */
}
.output h1 {
margin: .5em 0 0 0;
}
.output p, .output pre {
margin: .5em 0;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
} }
.input-wrapper { .input-wrapper {
border-right: 4px solid #686860; border-right: 4px solid #686860;
} }
.input-wrapper form { .input-wrapper form {
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.input { .input {
flex: 1 1 auto; flex: 1 1 auto;
display: flex; display: flex;
} }
.statusbar { .statusbar {
padding: 3px 5px; padding: 3px 5px;
background: #686860; background: #686860;
text-shadow: 0 -1px 1px black; text-shadow: 0 -1px 1px black;
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
position:relative; position:relative;
color:white; color:white;
} }
.statusbar .runtime-info { .statusbar .runtime-info {
text-align: right; text-align: right;
float: right; float: right;
clear: right; clear: right;
/*width: 350px;*/ /*width: 350px;*/
padding-right: 90px; padding-right: 90px;
} }
input[type=submit] { input[type=submit] {
position: absolute; position: absolute;
right: 0; right: 0;
height: 26px; height: 26px;
margin: 0; margin: 0;
top:0; top:0;
width: 80px; width: 80px;
} }
.output img.loader { .output img.loader {
display:none;/*it's ugly*/ display:none;/*it's ugly*/
} }
.help { .help {
width: 33%; width: 33%;
float: left; float: left;
white-space: pre; white-space: pre;
} }
.footer { .footer {
width: 100%; width: 100%;
clear: left; clear: left;
text-align: center; text-align: center;
color: #aaa; color: #aaa;
} }
.footer a { .footer a {
color: #aaa; color: #aaa;
} }
.control-char { .control-char {
background: #000; background: #000;
color: #fff; color: #fff;
margin-left: 2px; margin-left: 2px;
margin-right: 2px; margin-right: 2px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; border-radius: 3px;
padding: 1px 2px; padding: 1px 2px;
} }

Write Preview
Loading…
Cancel
Save