Browse Source

First steps towards wiring

dev/git-series/gccdum
Matt Godbolt 7 years ago
parent
commit
6e8987d8e5
  1. 6
      .idea/jsLibraryMappings.xml
  2. 4
      .idea/misc.xml
  3. 83
      static/compiler.js
  4. 37
      static/editor.js
  5. 83
      static/hub.js
  6. 4
      static/index.html
  7. 18
      static/main.js

6
.idea/jsLibraryMappings.xml

@ -1,6 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptLibraryMappings">
<includedPredefinedLibrary name="Node.js Core" />
</component>
</project>

4
.idea/misc.xml

@ -1,4 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectRootManager" version="2" assert-keyword="false" jdk-15="false" />
</project>

83
static/compiler.js

@ -0,0 +1,83 @@
define(function (require) {
"use strict";
var CodeMirror = require('codemirror');
var $ = require('jquery');
require('asm-mode');
var options = require('options');
var compilers = options.compilers;
function Compiler(hub, container, state) {
var self = this;
var domRoot = container.getElement();
domRoot.html($('#compiler').html());
var outputEditor = CodeMirror.fromTextArea(domRoot.find("textarea")[0], {
lineNumbers: true,
mode: "text/x-asm",
readOnly: true,
gutters: ['CodeMirror-linenumbers'],
lineWrapping: true
});
function resize() {
outputEditor.setSize(domRoot.width(), domRoot.height());
outputEditor.refresh();
}
container.on('resize', resize);
container.on('open', resize);
container.setTitle("Compiled");
container.on('close', function () {
hub.removeCompiler(self);
});
this.source = state.source || 1;
this.sourceEditor = null;
}
var debouncedAjax = _.debounce($.ajax, 500);
Compiler.prototype.compile = function (fromEditor) {
var self = this;
if (!this.sourceEditor) return;
var request = {
fromEditor: fromEditor,
source: this.sourceEditor.getSource(),
compiler: compilers[0].id, // TODO
options: "-O1", // TODO
filters: {}
};
debouncedAjax({
type: 'POST',
url: '/compile',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify(request),
success: function (result) {
self.onCompileResponse(request, result);
},
error: function (xhr, e_status, error) {
console.log("AJAX request failed, reason : " + error);
},
cache: false
});
};
Compiler.prototype.onCompileResponse = function (request, result) {
console.log(request, result);
};
Compiler.prototype.onEditorListChange = function () {
// TODO: if we can't find our source, select none?
// TODO: Update dropdown of source
};
Compiler.prototype.onEditorChange = function (editor) {
if (editor.getId() == this.source) {
this.sourceEditor = editor;
this.compile();
}
};
return Compiler;
});

37
static/editor.js

@ -5,10 +5,13 @@ define(function (require) {
require('codemirror/mode/d/d');
require('codemirror/mode/go/go');
require('codemirror/mode/rust/rust');
require('asm-mode');
return function Editor(container, lang) {
function Editor(hub, id, container, lang) {
var self = this;
this.id = id;
var domRoot = container.getElement();
domRoot.html($('#codeEditor').html());
var cmMode;
switch (lang.toLowerCase()) {
default:
@ -28,7 +31,7 @@ define(function (require) {
break;
}
var cppEditor = CodeMirror.fromTextArea(domRoot.find("textarea")[0], {
this.editor = CodeMirror.fromTextArea(domRoot.find("textarea")[0], {
lineNumbers: true,
matchBrackets: true,
useCPP: true,
@ -37,21 +40,33 @@ define(function (require) {
// With reference to "fix typing '#' in emacs mode"
// https://github.com/mattgodbolt/gcc-explorer/pull/131
cppEditor.setOption("extraKeys", {
this.editor.setOption("extraKeys", {
"Alt-F": false
});
// cppEditor.on("change", function () {
// if ($('.autocompile').hasClass('active')) {
// onEditorChange();
// }
// });
this.editor.on("change", function () {
hub.onEditorChange(self);
});
function resize() {
cppEditor.setSize(domRoot.width(), domRoot.height());
cppEditor.refresh();
self.editor.setSize(domRoot.width(), domRoot.height());
self.editor.refresh();
}
container.on('resize', resize);
container.on('open', resize);
container.on('close', function () {
hub.removeEditor(self);
});
container.setTitle(lang + " source");
}
Editor.prototype.getSource = function () {
return this.editor.getValue();
};
Editor.prototype.getId = function () {
return this.id;
};
return Editor;
});

83
static/hub.js

@ -0,0 +1,83 @@
define(function (require) {
"use strict";
var _ = require('underscore');
var options = require('options');
var Editor = require('editor');
var Compiler = require('compiler');
function Hub(layout) {
this.layout = layout;
this.compilers = [];
this.editors = {};
this.initialised = false;
var self = this;
layout.registerComponent('codeEditor', function (container, state) {
return self.codeEditorFactory(container, state);
});
layout.registerComponent('compilerOutput', function (container, state) {
return self.compilerOutputFactory(container, state);
});
layout.init();
this.initialised = true;
_.each(this.editors, function (editor) {
self.onEditorChange(editor);
});
this.onEditorListChange();
}
Hub.prototype.addCompiler = function (compiler) {
this.compilers.push(compiler);
};
Hub.prototype.removeCompiler = function (compiler) {
this.compilers = _.without(this.compilers, compiler);
};
Hub.prototype.addEditor = function (editor) {
this.editors[editor.getId()] = editor;
this.onEditorListChange();
};
Hub.prototype.removeEditor = function (editor) {
delete this.editors[editor.getId()];
this.onEditorListChange();
};
Hub.prototype.onEditorListChange = function () {
if (!this.initialised) return;
_.each(this.compilers, function (compiler) {
compiler.onEditorListChange();
});
};
Hub.prototype.nextEditorId = function () {
for (var i = 1; i < 100000; ++i) {
if (!this.editors[i]) return i;
}
throw "Ran out of ids!?";
};
Hub.prototype.codeEditorFactory = function (container, state) {
var id = state.id || this.nextEditorId();
var editor = new Editor(this, id, container, options.language);
this.addEditor(editor);
return editor;
};
Hub.prototype.compilerOutputFactory = function (container, state) {
var compiler = new Compiler(this, container, state);
this.addCompiler(compiler);
return compiler;
};
Hub.prototype.onEditorChange = function (editor) {
if (!this.initialised) return;
_.each(this.compilers, function (compiler) {
compiler.onEditorChange(editor);
});
};
return Hub;
});

4
static/index.html

@ -68,6 +68,10 @@
<textarea>// Type your code here, or load an example.</textarea>
</div>
<div id="compiler" class="template">
<textarea> mov eax, $20</textarea>
</div>
<div class="container-fluid" id="#root"></div>
<div class="template lang c">// Type your code here, or load an example.

18
static/main.js

@ -23,18 +23,11 @@ define(function (require) {
var _ = require('underscore');
var $ = require('jquery');
var GoldenLayout = require('goldenlayout');
var Editor = require('editor');
var Hub = require('hub');
analytics.initialise();
sharing.initialise();
function codeEditorFactory(container, state) {
var template = $('#codeEditor');
var options = state.options;
container.getElement().html(template.html());
return new Editor(container, options.language);
}
var options = require('options');
var config = {
content: [{
@ -42,11 +35,14 @@ define(function (require) {
content: [{
type: 'component',
componentName: 'codeEditor',
componentState: {options: options}
componentState: {}
}, {
type: 'component',
componentName: 'compilerOutput',
componentState: {}
}]
}]
};
var myLayout = new GoldenLayout(config, $("#root")[0]);
myLayout.registerComponent('codeEditor', codeEditorFactory);
myLayout.init();
var hub = new Hub(myLayout);
});
Loading…
Cancel
Save