marc
/
gcc-explorer
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

Separate settings, make delay time configurable

dev/git-series/gccdum
Matt Godbolt 6 years ago
parent
4c7787631e
commit
02881080d7
7 changed files with 146 additions and 37 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      .idea/inspectionProfiles/profiles_settings.xml
  2. 3
      bower.json
  3. 40
      static/editor.js
  4. 5
      static/explorer.css
  5. 45
      static/index.html
  6. 18
      static/main.js
  7. 66
      static/settings.js

6
.idea/inspectionProfiles/profiles_settings.xml
Unescape View File

@ -1,6 +0,0 @@
<component name="InspectionProjectProfileManager">
<settings>
<option name="PROJECT_PROFILE" />
<version value="1.0" />
</settings>
</component>

3
bower.json
Unescape View File

@ -27,6 +27,7 @@
"clipboard": "^1.5.12",
"raven-js": "^3.7.0",
"es6-promise": "^4.0.5",
"lru-cache": "2.7.3"
"lru-cache": "2.7.3",
"seiyria-bootstrap-slider": "9.7.x"
}
}

40
static/editor.js
Unescape View File

@ -28,7 +28,6 @@ define(function (require) {
var _ = require('underscore');
var $ = require('jquery');
var colour = require('colour');
var Toggles = require('toggles');
var loadSaveLib = require('loadSave');
var FontScale = require('fontscale');
var Sharing = require('sharing');
@ -46,13 +45,12 @@ define(function (require) {
this.domRoot = container.getElement();
this.domRoot.html($('#codeEditor').html());
this.eventHub = hub.createEventHub();
this.settings = {};
this.widgetsByCompiler = {};
this.asmByCompiler = {};
this.busyCompilers = {};
this.colours = [];
this.options = new Toggles(this.domRoot.find('.options'), state.options);
this.options.on('change', _.bind(this.onOptionsChange, this));
var cmMode;
switch (lang.toLowerCase()) {
@ -98,10 +96,7 @@ define(function (require) {
// * Only actually triggering a change if the document text has changed from
// the previous emitted.
this.lastChangeEmitted = null;
var ChangeDebounceMs = 800;
this.debouncedEmitChange = _.debounce(function () {
if (self.options.get().compileOnChange) self.maybeEmitChange();
}, ChangeDebounceMs);
this.onSettingsChange({});
this.editor.getModel().onDidChangeContent(_.bind(function () {
this.debouncedEmitChange();
this.updateState();
@ -148,6 +143,8 @@ define(function (require) {
this.eventHub.on('compileResult', this.onCompileResponse, this);
this.eventHub.on('selectLine', this.onSelectLine, this);
this.eventHub.on('settingsChange', this.onSettingsChange, this);
// NB a new compilerConfig needs to be created every time; else the state is shared
// between all compilers created this way. That leads to some nasty-to-find state
// bugs e.g. https://github.com/mattgodbolt/compiler-explorer/issues/225
@ -187,8 +184,7 @@ define(function (require) {
Editor.prototype.updateState = function () {
var state = {
id: this.id,
source: this.getSource(),
options: this.options.get()
source: this.getSource()
};
this.fontScale.addState(state);
this.container.setState(state);
@ -198,17 +194,27 @@ define(function (require) {
return this.editor.getModel().getValue();
};
Editor.prototype.onOptionsChange = function (before, after) {
this.updateState();
Editor.prototype.onSettingsChange = function (newSettings) {
var before = this.settings;
var after = newSettings;
this.settings = _.clone(newSettings);
// TODO: bug when:
// * Turn off auto.
// * edit code
// * change compiler or compiler options (out of date code is used)
if (after.compileOnChange && !before.compileOnChange) {
// If we've just enabled "compile on change"; forcibly send a change
// which will recolourise as required.
this.maybeEmitChange(true);
} else if (before.colouriseAsm !== after.colouriseAsm) {
if (before.delayAfterChange !== after.delayAfterChange || !this.debouncedEmitChange) {
if (after.delayAfterChange) {
this.debouncedEmitChange = _.debounce(_.bind(function () {
this.maybeEmitChange();
}, this), after.delayAfterChange);
this.maybeEmitChange(true);
} else {
this.debouncedEmitChange = _.noop;
}
}
if (before.colouriseAsm !== after.colouriseAsm) {
// if the colourise option has been toggled...recompute colours
this.numberUsedLines();
}
@ -229,7 +235,7 @@ define(function (require) {
});
if (_.any(this.busyCompilers)) return;
this.updateColours(this.options.get().colouriseAsm ? result : []);
this.updateColours(this.settings.colouriseAsm ? result : []);
};
Editor.prototype.updateColours = function (colours) {

5
static/explorer.css
Unescape View File

@ -2,12 +2,17 @@
@import url("ext/golden-layout/src/css/goldenlayout-base.css");
@import url("ext/golden-layout/src/css/goldenlayout-light-theme.css");
@import url("ext/selectize/dist/css/selectize.bootstrap2.css");
@import url("ext/seiyria-bootstrap-slider/dist/css/bootstrap-slider.css");
.navbar {
border-radius: 0;
margin-bottom: 2px;
}
.navbar-brand {
width: 13.5em;
}
.navbar-inverse {
background-color: #226;
}

45
static/index.html
Unescape View File

@ -20,9 +20,13 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Compiler Explorer &dash; <span class="language-name"></span></a>
<a class="navbar-brand" href="#" title="Compiler Explorer">Compiler Explorer &dash; <span
class="language-name"></span></a>
</div>
<li class="navbar-collapse collapse" id="navbar-collapse">
<ul class="nav navbar-nav navbar-left">
<li><a href="#" data-target="#settings" data-toggle="modal">Settings</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="https://www.patreon.com/mattgodbolt">
<img height="20" width="20" src="assets/patreon_logo.png">&nbsp;
@ -66,16 +70,6 @@
<div class="gl_keep template">
<div id="codeEditor">
<div class="top-bar btn-toolbar" role="toolbar">
<div class="btn-group btn-group-sm options" role="group">
<button title="Colourise lines so one can see how the source maps to the output"
class="btn btn-default btn-sm active" data-bind="colouriseAsm">
<span class="glyphicon glyphicon-adjust"></span>
</button>
<button title="Run the compilers automatically as you type"
class="btn btn-default btn-sm active" data-bind="compileOnChange">
<span class="glyphicon glyphicon-play-circle"></span>
</button>
</div>
<div class="btn-group btn-group-sm">
<button title="Decrease font size"
class="btn btn-default btn-sm decrease-font-size">
@ -302,5 +296,34 @@ int square(int num) {
<!-- /.modal-dialog -->
</div>
<div class="modal fade gl_keep" id="settings">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Compiler Explorer Settings</h4>
</div>
<div class="modal-body">
<div>These settings control how Compiler Explorer acts for you. They are not preserved as part of shared
URLs, and are persisted locally using browser local storage.
</div>
<div class="form-group options" role="group">
<div class="checkbox"><label><input type="checkbox" class="colourise">Colourise lines so one can see how the source
maps to the output</label></div>
<div>Delay before compiling:&nbsp;<b>Disabled</b>
<div class="slider slider-horizontal delay"></div>
<b>3s</b></div>
</div>
</div>
<!-- model-body -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
</body>
</html>

18
static/main.js
Unescape View File

@ -38,18 +38,21 @@ require.config({
'raven-js': 'ext/raven-js/dist/raven',
'es6-promise': 'ext/es6-promise/es6-promise',
'lru-cache': 'ext/lru-cache/lib/lru-cache',
'vs': "ext/monaco-editor/min/vs"
'vs': "ext/monaco-editor/min/vs",
'bootstrap-slider': 'ext/seiyria-bootstrap-slider/dist/bootstrap-slider'
},
shim: {
underscore: {exports: '_'},
'lru-cache': {exports: 'LRUCache'},
bootstrap: ['jquery']
bootstrap: ['jquery'],
'bootstrap-slider': ['bootstrap']
}
});
define(function (require) {
"use strict";
require('bootstrap');
require('bootstrap-slider');
var analytics = require('analytics');
var sharing = require('sharing');
var _ = require('underscore');
@ -60,6 +63,7 @@ define(function (require) {
var clipboard = require('clipboard');
var Hub = require('hub');
var Raven = require('raven-js');
var settings = require('./settings');
function start() {
analytics.initialise();
@ -147,6 +151,16 @@ define(function (require) {
new clipboard('.btn.clippy');
settings($('#settings'), function () {
return JSON.parse(window.localStorage.getItem('settings'));
}(), function (settings) {
try {
window.localStorage.setItem('settings', JSON.stringify(settings));
} catch (e) {
}
layout.eventHub.emit('settingsChange', settings);
});
sharing.initShareButton($('#share'), layout);
$('#ui-reset').click(function () {
window.localStorage.removeItem('gl');

66
static/settings.js
Unescape View File

@ -0,0 +1,66 @@
// Copyright (c) 2012-2017, Matt Godbolt
//
// All rights reserved.
//
// Redistribution and use in source and binary forms, with or without
// modification, are permitted provided that the following conditions are met:
//
// * Redistributions of source code must retain the above copyright notice,
// this list of conditions and the following disclaimer.
// * Redistributions in binary form must reproduce the above copyright
// notice, this list of conditions and the following disclaimer in the
// documentation and/or other materials provided with the distribution.
//
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
// AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
// IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
// ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
// LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
// CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
// SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
// CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
// ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
// POSSIBILITY OF SUCH DAMAGE.
define(function (require) {
var _ = require('underscore');
function setupSettings(root, settings, onChange) {
settings = settings || {};
if (settings.delayAfterChange === undefined)
settings.delayAfterChange = 750;
if (settings.colouriseAsm === undefined)
settings.colouriseAsm = true;
root.find('.slider').slider({
value: settings.delayAfterChange,
max: 3000,
step: 250,
formatter: function (x) {
if (x === 0) return "Disabled";
return (x / 1000.0).toFixed(2) + "s";
}
});
function onSettingsChange(settings) {
root.find('.colourise').prop('checked', settings.colouriseAsm);
root.find('.slider').slider('setValue', settings.delayAfterChange);
onChange(settings);
}
function onUiChange() {
var settings = {};
settings.colouriseAsm = !!root.find('.colourise').prop('checked');
settings.delayAfterChange = root.find('.slider').slider('getValue');
onChange(settings);
}
root.find('.colourise').change(onUiChange);
root.find('.slider').change(onUiChange);
onSettingsChange(settings);
}
return setupSettings;
});
Write Preview
Loading…
Cancel
Save