Continue #29, playpens are now runnable

This commit is contained in:
Mathieu David 2016-01-01 00:32:12 +01:00
parent 0ac0301d72
commit db7424e947
3 changed files with 91 additions and 17 deletions

View File

@ -299,16 +299,22 @@ h5 {
.light pre {
position: relative;
}
.light pre > i {
.light pre > .buttons {
position: absolute;
right: 5px;
top: 5px;
color: #364149;
cursor: pointer;
}
.light pre > i :hover {
.light pre > .buttons :hover {
color: #008cff;
}
.light pre > .buttons i {
margin-left: 8px;
}
.light pre > .result {
margin-top: 10px;
}
.light .sidebar {
background-color: #fafafa;
color: #364149;
@ -372,16 +378,22 @@ h5 {
.coal pre {
position: relative;
}
.coal pre > i {
.coal pre > .buttons {
position: absolute;
right: 5px;
top: 5px;
color: #a1adb8;
cursor: pointer;
}
.coal pre > i :hover {
.coal pre > .buttons :hover {
color: #3473ad;
}
.coal pre > .buttons i {
margin-left: 8px;
}
.coal pre > .result {
margin-top: 10px;
}
.coal .sidebar {
background-color: #292c2f;
color: #a1adb8;
@ -445,16 +457,22 @@ h5 {
.navy pre {
position: relative;
}
.navy pre > i {
.navy pre > .buttons {
position: absolute;
right: 5px;
top: 5px;
color: #c8c9db;
cursor: pointer;
}
.navy pre > i :hover {
.navy pre > .buttons :hover {
color: #2b79a2;
}
.navy pre > .buttons i {
margin-left: 8px;
}
.navy pre > .result {
margin-top: 10px;
}
.navy .sidebar {
background-color: #282d3f;
color: #c8c9db;
@ -518,16 +536,22 @@ h5 {
.rust pre {
position: relative;
}
.rust pre > i {
.rust pre > .buttons {
position: absolute;
right: 5px;
top: 5px;
color: #c8c9db;
cursor: pointer;
}
.rust pre > i :hover {
.rust pre > .buttons :hover {
color: #e69f67;
}
.rust pre > .buttons i {
margin-left: 8px;
}
.rust pre > .result {
margin-top: 10px;
}
.rust .sidebar {
background-color: #3b2e2a;
color: #c8c9db;

View File

@ -140,18 +140,20 @@ $( document ).ready(function() {
$("code.language-rust").each(function(i, block){
var code_block = $(this);
var pre_block = $(this).parent();
// hide lines
var lines = $(this).html().split("\n");
var lines = code_block.html().split("\n");
var first_non_hidden_line = false;
var lines_hidden = false;
for(var n = 0; n < lines.length; n++){
if($.trim(lines[n])[0] == hiding_character){
if(first_non_hidden_line){
lines[n] = "<span class=\"hidden\">" + "\n" + lines[n].substr(1) + "</span>";
lines[n] = "<span class=\"hidden\">" + "\n" + lines[n].replace(/(\s*)#/, "$1") + "</span>";
}
else {
lines[n] = "<span class=\"hidden\">" + lines[n].substr(1) + "\n" + "</span>";
lines[n] = "<span class=\"hidden\">" + lines[n].replace(/(\s*)#/, "$1") + "\n" + "</span>";
}
lines_hidden = true;
}
@ -162,25 +164,65 @@ $( document ).ready(function() {
first_non_hidden_line = true;
}
}
$(this).html(lines.join(""));
code_block.html(lines.join(""));
// If no lines were hidden, return
if(!lines_hidden) { return; }
// add expand button
$(this).parent().prepend("<i class=\"fa fa-expand\"></i>");
pre_block.prepend("<div class=\"buttons\"><i class=\"fa fa-expand\"></i></div>");
$(this).parent().find("i").click(function(e){
pre_block.find("i").click(function(e){
if( $(this).hasClass("fa-expand") ) {
$(this).removeClass("fa-expand").addClass("fa-compress");
$(this).parent().find("span.hidden").removeClass("hidden").addClass("unhidden");
pre_block.find("span.hidden").removeClass("hidden").addClass("unhidden");
}
else {
$(this).removeClass("fa-compress").addClass("fa-expand");
$(this).parent().find("span.unhidden").removeClass("unhidden").addClass("hidden");
pre_block.find("span.unhidden").removeClass("unhidden").addClass("hidden");
}
});
});
// Process playpen code blocks
$(".playpen").each(function(block){
var pre_block = $(this);
// Add play button
var buttons = pre_block.find(".buttons");
if( buttons.length === 0 ) {
pre_block.prepend("<div class=\"buttons\"></div>");
buttons = pre_block.find(".buttons");
}
buttons.prepend("<i class=\"fa fa-play play-button\"></i>");
buttons.find(".play-button").click(function(e){
run_rust_code(pre_block);
});
});
});
function run_rust_code(code_block) {
var result_block = code_block.find(".result");
if(result_block.length === 0) {
code_block.append("<code class=\"result hljs language-bash\"></code>");
result_block = code_block.find(".result");
}
result_block.text("Running...");
$.ajax({
url: "https://play.rust-lang.org/evaluate.json",
method: "POST",
crossDomain: true,
dataType: "json",
contentType: "application/json",
data: JSON.stringify({version: "stable", optimize: "0", code: code_block.find(".language-rust").text() }),
success: function(response){
result_block.text(response.result);
}
});
}

View File

@ -10,7 +10,7 @@
pre {
position: relative;
}
pre > i {
pre > .buttons {
position: absolute;
right: 5px;
top: 5px;
@ -21,6 +21,14 @@
:hover {
color: $sidebar-active;
}
i {
margin-left: 8px;
}
}
pre > .result {
margin-top: 10px;
}
color: $fg