Commit c3fb6df3 authored by Leigh B Stoller's avatar Leigh B Stoller
Browse files

Add use of CodeMirror syntax highlighter and editor mode. On the manage

profile page, the Source modal starts an editor that does highlighting and
smart indenting. The XML button does the same, but in display only mode.
Also use on the manifest tab on the status page.
parent fd41e82a
......@@ -27,7 +27,8 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment,
var amlist = null;
var modified = false;
var editor = null;
var stepsInitialized = false;
var myCodeMirror = null;
var genilibwarned= false;
var manageTemplate = _.template(manageString);
var waitwaitTemplate = _.template(waitwaitString);
var rendererTemplate = _.template(rendererString);
......@@ -36,6 +37,7 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment,
var oopsTemplate = _.template(oopsString);
var guestInstTemplate = _.template(guestInstantiateString);
var InstTemplate = _.template(instantiateString);
var stepsInitialized = false;
function initialize()
{
......@@ -89,6 +91,7 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment,
isadmin: window.ISADMIN,
history: window.HISTORY,
activity: window.ACTIVITY,
manual: window.MANUAL,
snapuuid: (window.SNAPUUID || null),
general_error: (errors.error || ''),
});
......@@ -203,10 +206,56 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment,
$('#rspec_modal').modal({'backdrop':'static','keyboard':false});
$('#rspec_modal').modal('show');
});
$('#rspec_modal').on('shown.bs.modal', function() {
var source = $('#modal_profile_rspec_textarea').val();
var mode = "text/xml";
// Need to determine the mode.
var myRe = /^import/m;
if (myRe.test(source)) {
mode = "text/x-python";
}
myCodeMirror = CodeMirror(function(elt) {
$('#modal_profile_rspec_div').prepend(elt);
}, {
value: source,
lineNumbers: false,
smartIndent: true,
autofocus: true,
mode: mode,
});
//
// Attempt to catch an insertion of python code, either to
// the empty source box, or as a replacement.
//
var watchdog_timer;
myCodeMirror.on("change", function() {
clearTimeout(watchdog_timer);
watchdog_timer =
setTimeout(function() {
var source = myCodeMirror.getValue();
var myRe = /^import/m;
if (myRe.test(source)) {
myCodeMirror.setOption("mode", "text/x-python");
}
}, 500);
});
});
// Collapse; done editing the rspec in the modal.
$('#collapse_rspec_modal_button').click(function (event) {
$('#rspec_modal').modal('hide');
changeRspec($('#modal_profile_rspec_textarea').val());
changeRspec(myCodeMirror.getValue());
$('.CodeMirror').remove();
$('#modal_profile_rspec_textarea').val("");
});
// Cancel; done editing the rspec in the modal, throw away and cleanup.
$('#cancel_rspec_modal_button, #close_rspec_modal_button')
.click(function (event) {
$('#rspec_modal').modal('hide');
$('.CodeMirror').remove();
$('#modal_profile_rspec_textarea').val("");
});
// Auto select the URL if the user clicks in the box.
......@@ -962,6 +1011,15 @@ function (_, sup, filesize, JacksEditor, ShowImagingModal, moment,
//
function checkScript(script)
{
// Beta feature; warn user, prompt for confirmation.
if (!genilibwarned) {
genilibwarned = 1;
var ok = confirm("geni-lib scripts are an experimental feature. "+
"Do you wish to continue?");
if (ok == false) {
return;
}
}
// Save for later.
$('#profile_script_textarea').val(script);
......
......@@ -670,10 +670,7 @@ function (_, sup, moment, marked, UriTemplate, ShowImagingModal,
var callback = function(json) {
//console.info(json);
if ($("#manifest_textarea").length) {
$("#manifest_textarea").val(json.value);
$("#manifest_textarea").css("height", "300");
}
ShowManifest(json.value);
var xmlDoc = $.parseXML(json.value);
var xml = $(xmlDoc);
......@@ -807,6 +804,30 @@ function (_, sup, moment, marked, UriTemplate, ShowImagingModal,
xmlthing.done(callback);
}
//
// Show the manifest in the tab, using codemirror.
//
function ShowManifest(manifest)
{
var mode = "text/xml";
$("#manifest_textarea").css("height", "300");
var myCodeMirror = CodeMirror(function(elt) {
$('#manifest_textarea').prepend(elt);
}, {
value: manifest,
lineNumbers: false,
smartIndent: true,
mode: mode,
readOnly: true,
});
$('#show_manifest_tab').on('shown.bs.tab', function (e) {
myCodeMirror.refresh();
});
}
function MakeUriData(xml)
{
var result = {};
......
......@@ -142,6 +142,7 @@ function SPITFORM($formfields, $errors)
href='css/jquery.appendGrid-1.3.1.min.css'>\n";
# For progress bubbles in the imaging modal.
echo "<link rel='stylesheet' href='css/progress.css'>\n";
echo "<link rel='stylesheet' href='css/codemirror.css'>\n";
echo "<script type='text/javascript'>\n";
echo " window.VIEWING = $viewing;\n";
......@@ -170,6 +171,7 @@ function SPITFORM($formfields, $errors)
}
echo "</script>\n";
echo "<script src='js/lib/jquery-2.0.3.min.js'></script>\n";
echo "<script src='js/lib/codemirror-min.js'></script>\n";
echo "<script src='js/lib/bootstrap.js'></script>\n";
echo "<script src='js/lib/require.js' data-main='js/manage_profile'>
</script>";
......
......@@ -157,8 +157,10 @@ $PAGEHEADER_FUNCTION = function($thinheader = 0, $ignore1 = NULL,
</head>
<body style='display: none;'>\n";
$manual = ($ISAPT ? "http://docs.aptlab.net" : "http://docs.cloudlab.us");
echo "<script type='text/javascript'>\n";
echo " window.ISCLOUD = " . ($ISAPT ? "0" : "1") . ";\n";
echo " window.MANUAL = '$manual';\n";
echo " window.EMBEDDED = $embedded;\n";
echo "</script>\n";
......
......@@ -186,12 +186,14 @@ if (isset($extend) && $extend != "") {
}
echo "</script>\n";
echo "<script src='js/lib/jquery-2.0.3.min.js'></script>\n";
echo "<script src='js/lib/codemirror-min.js'></script>\n";
echo "<script src='js/lib/bootstrap.js'></script>\n";
echo "<script src='js/lib/require.js' data-main='js/status'></script>";
echo "<link rel='stylesheet'
href='css/jquery-ui-1.10.4.custom.min.css'>\n";
# For progress bubbles in the imaging modal.
echo "<link rel='stylesheet' href='css/progress.css'>\n";
echo "<link rel='stylesheet' href='css/codemirror.css'>\n";
SPITFOOTER();
?>
......@@ -206,6 +206,15 @@
style='margin-right: 10px;'
id='show_xml_modal_button'>
XML</button>
<a href='#' class='btn btn-xs'
data-toggle='popover'
data-html='true'
data-delay='{"hide":1500}'
data-content="You can supply either an
<a href='<%- manual %>/advanced-topics.html'>
rspec or a geni-lib script</a>">
<span class='glyphicon glyphicon-question-sign'></span>
</a>
</div>
</div>
<textarea name="formfields[profile_rspec]"
......
......@@ -5,7 +5,7 @@
<div class='modal-header'>
<div id='rspec_modal_editbuttons'>
<button type='button' class='btn btn-danger btn-xs pull-right'
data-dismiss='modal'
id='cancel_rspec_modal_button'
style='margin-right: 10px;'>
Cancel</button>
<button type='button' class='btn btn-primary btn-xs pull-right'
......@@ -15,25 +15,24 @@
</div>
<div id='rspec_modal_viewbuttons' class='hidden'>
<button type='button' class='btn btn-danger btn-xs pull-right'
data-dismiss='modal'
id='close_rspec_modal_button'
style='margin-right: 10px;'>
Close</button>
</div>
<h3>Source</h3>
</div>
<div class='modal-body'>
<div class='modal-body' id='modal_profile_rspec_body'>
<div class='panel panel-default'>
<div class='panel-body'>
<div id='modal_profile_rspec_div' style='height:300px'></div>
</div>
<textarea name=\"formfields[profile_rspec_modal]\"
id='modal_profile_rspec_textarea'
rows=20
class='form-control'
class='form-control hidden'
type='textarea'></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
......@@ -126,7 +126,8 @@
<a href='#listview' data-toggle='tab'>List View</a>
</li>
<li>
<a href='#manifest' data-toggle='tab'>Manifest</a>
<a href='#manifest' id='show_manifest_tab'
data-toggle='tab'>Manifest</a>
</li>
</ul>
<div id='quicktabs_content' class='tab-content'>
......@@ -155,8 +156,7 @@
</div>
</div>
<div class='tab-pane' id='manifest'>
<textarea id='manifest_textarea' style='width: 100%;'
type='textarea'></textarea>
<div id='manifest_textarea' style='width: 100%;'></div>
</div>
</div>
</div>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment