spacedeck-open/helpers/space-render.js

150 lines
4.0 KiB
JavaScript

var fs = require('fs');
var cheerio = require("cheerio");
var artifact_vector_render = require("../public/javascripts/vector-render.js");
global.render_vector_shape = artifact_vector_render.render_vector_shape;
global.render_vector_drawing = artifact_vector_render.render_vector_drawing;
var artifact_view_model = require("../public/javascripts/spacedeck_board_artifacts.js").SpacedeckBoardArtifacts;
var template = fs.readFileSync("views/partials/space-isolated.html");
var dom = cheerio.load(template);
var compiled_js = "";
function emit(str,indent) {
var spaces="";
for (var i=0; i<indent; i++) spaces+=" ";
compiled_js+=spaces+str;
}
function compile_expr(v) {
v=v.replace(/'/g,"\\'");
v=v.replace(/[\r\n]/g," ");
f=/\{([^\|\{]+)\|([^\}]+)\}/.exec(v);
if (f) {
v=v.replace(f[1]+"|"+f[2],f[2]+"("+f[1]+")");
}
// replace braces
v=v.replace(/\{\{\{?/g,"'+");
v=v.replace(/\}\}\}?/g,"+'");
return v;
}
var iterators = 0;
function walk(n,indent) {
if (n.type == "tag") {
//console.log("n: ",n.type,n.name,n.attribs);
}
var braces = 0;
if (n.type == "text") {
if (n.data.match(/[a-zA-Z0-9\{]+/)) {
emit("h+='"+compile_expr(n.data)+"';",indent);
}
}
else if (n.type == "tag") {
var attrs = [];
var keys = Object.keys(n.attribs);
for (var i=0; i<keys.length; i++) {
var k = keys[i];
var v = n.attribs[k];
if (k.substring(0,2) == "v-") {
// vue attribute
if (k.match("v-if")) {
var test = emit("if ("+v+") {",indent);
braces++;
indent++;
}
else if (k.match("v-repeat")) {
var parts = v.split("|")[0].split(":");
var left = parts[0].replace(/ /g,"");
var right = parts[1].replace(/ /g,"");
iterators++;
emit("for (var i"+iterators+"=0;i"+iterators+"<"+right+".length;i"+iterators+"++) {",indent);
emit("var "+left+"="+right+"[i"+iterators+"];",indent+1);
braces++;
indent++;
}
} else {
v=compile_expr(v);
attrs.push(k+"=\""+v+"\"");
}
}
emit("h+='<"+n.name+" "+attrs.join(" ")+">';",indent);
for (var i=0; i<n.children.length; i++) {
walk(n.children[i],indent);
}
emit("h+='</"+n.name+">';", indent);
for (var i=braces; i>0; i--) {
indent--;
emit("}",indent);
}
}
}
function render_space_as_html(space, artifacts) {
if (!compiled_js.length) {
walk(dom("#space")[0],0);
//console.log("compiled template: \n"+compiled_js);
}
// --------
var mouse_state = "idle";
var active_tool = "pointer";
var active_space = space;
var active_space_artifacts = artifacts;
var bounds_zoom = 1;
var bounds_margin_horiz = 0;
var bounds_margin_vert = 0;
var viewport_zoom = 1;
// --------
var editing_artifact_id = null;
var urls_to_links = function(html) {
return html;
}
artifact_view_model.selected_artifacts_dict = {};
for (var i=0; i<active_space_artifacts.length; i++) {
var a = active_space_artifacts[i];
artifact_view_model.update_board_artifact_viewmodel(a);
if (!a.description) a.description = "";
if (!a.title) a.title = "";
}
var h="";
try {
eval(compiled_js);
} catch (e) {
console.error("error rendering space "+space._id+" as html: "+e);
}
var style="html, body, #space { overflow: visible !important; }\n";
style+=".wrapper { border: none !important; }\n";
h='<html>\n<head>\n<link href="https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,700,600,800,300|Montserrat:400,700|EB+Garamond|Vollkorn|Fire+Sans|Lato|Roboto|Source+Code+Pro|Ubuntu|Raleway|Playfair+Display|Crimson+Text" rel="stylesheet" type="text/css">\n<link type="text/css" rel="stylesheet" href="https://fast.fonts.net/cssapi/ee1a3484-4d98-4f9f-9f55-020a7b37f3c5.css"/>\n<link rel="stylesheet" href="/stylesheets/style.css"><style>'+style+'</style>\n</head>\n<body id="main">\n'+h+"\n</html>\n";
return h;
}
exports.render_space_as_html = render_space_as_html;