wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Bug 1026576 - Resets the web audio editor graph's position and scale on refresh. r=vp

Browse Source
This commit is contained in:
Jordan Santell 2014-06-24 15:15:00 +02:00
parent fa50b3d321
commit 355e7509f4
3 changed files with 82 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
browser/devtools/webaudioeditor/test/browser.ini
View File

@ -32,6 +32,7 @@ support-files =
[browser_wa_graph-render-02.js]
[browser_wa_graph-markers.js]
[browser_wa_graph-selected.js]
[browser_wa_graph-zoom.js]
[browser_wa_inspector.js]
[browser_wa_inspector-toggle.js]

45
browser/devtools/webaudioeditor/test/browser_wa_graph-zoom.js Normal file
View File

@ -0,0 +1,45 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests that the graph's scale and position is reset on a page reload.
*/
function spawnTest() {
let [target, debuggee, panel] = yield initWebAudioEditor(SIMPLE_CONTEXT_URL);
let { panelWin } = panel;
let { gFront, $, $$, EVENTS, WebAudioGraphView } = panelWin;
let started = once(gFront, "start-context");
yield Promise.all([
reload(target),
waitForGraphRendered(panelWin, 3, 2)
]);
is(WebAudioGraphView.getCurrentScale(), 1, "Default graph scale is 1.");
is(WebAudioGraphView.getCurrentTranslation()[0], 20, "Default x-translation is 20.");
is(WebAudioGraphView.getCurrentTranslation()[1], 20, "Default y-translation is 20.");
// Change both attribute and D3's internal store
panelWin.d3.select("#graph-target").attr("transform", "translate([100, 400]) scale(10)");
WebAudioGraphView._zoomBinding.scale(10);
WebAudioGraphView._zoomBinding.translate([100, 400]);
is(WebAudioGraphView.getCurrentScale(), 10, "After zoom, scale is 10.");
is(WebAudioGraphView.getCurrentTranslation()[0], 100, "After zoom, x-translation is 100.");
is(WebAudioGraphView.getCurrentTranslation()[1], 400, "After zoom, y-translation is 400.");
yield Promise.all([
reload(target),
waitForGraphRendered(panelWin, 3, 2)
]);
is(WebAudioGraphView.getCurrentScale(), 1, "After refresh, graph scale is 1.");
is(WebAudioGraphView.getCurrentTranslation()[0], 20, "After refresh, x-translation is 20.");
is(WebAudioGraphView.getCurrentTranslation()[1], 20, "After refresh, y-translation is 20.");
yield teardown(panel);
finish();
}

43
browser/devtools/webaudioeditor/webaudioeditor-view.js
View File

@ -16,10 +16,11 @@ const COLLAPSE_INSPECTOR_STRING = L10N.getStr("collapseInspector");
const INSPECTOR_WIDTH = 300;
// Globals for d3 stuff
// Width/height in pixels of SVG graph
// TODO investigate to see how this works in other host types bug 994257
const WIDTH = 1000;
const HEIGHT = 400;
// Default properties of the graph on rerender
const GRAPH_DEFAULTS = {
translate: [20, 20],
scale: 1
};
// Sizes of SVG arrows in graph
const ARROW_HEIGHT = 5;
@ -84,17 +85,41 @@ let WebAudioGraphView = {
* and clears out old content
*/
resetUI: function () {
this.resetGraph();
this.clearGraph();
this.resetGraphPosition();
},
/**
* Clears out the rendered graph, called when resetting the SVG elements to draw again,
* or when resetting the entire UI tool
*/
resetGraph: function () {
clearGraph: function () {
$("#graph-target").innerHTML = "";
},
/**
* Moves the graph back to its original scale and translation.
*/
resetGraphPosition: function () {
if (this._zoomBinding) {
let { translate, scale } = GRAPH_DEFAULTS;
// Must set the `zoomBinding` so the next `zoom` event is in sync with
// where the graph is visually (set by the `transform` attribute).
this._zoomBinding.scale(scale);
this._zoomBinding.translate(translate);
d3.select("#graph-target")
.attr("transform", "translate(" + translate + ") scale(" + scale + ")");
}
},
getCurrentScale: function () {
return this._zoomBinding ? this._zoomBinding.scale() : null;
},
getCurrentTranslation: function () {
return this._zoomBinding ? this._zoomBinding.translate() : null;
},
/**
* Makes the corresponding graph node appear "focused", removing
* focused styles from all other nodes. If no `actorID` specified,
@ -124,7 +149,7 @@ let WebAudioGraphView = {
*/
draw: function () {
// Clear out previous SVG information
this.resetGraph();
this.clearGraph();
let graph = new dagreD3.Digraph();
let edges = [];
@ -220,6 +245,10 @@ let WebAudioGraphView = {
.attr("transform", "translate(" + ev.translate + ") scale(" + ev.scale + ")");
});
d3.select("svg").call(this._zoomBinding);
// Set initial translation and scale -- this puts D3's awareness of
// the graph in sync with what the user sees originally.
this.resetGraphPosition();
}
},