scratchfoundation/scratch-blocks
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-blocks.git synced 2025-08-28 22:10:31 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix positioning of drag surface using relative container

Browse source
This commit is contained in:
Tim Mickel 2016-04-01 17:32:01 -04:00
parent 5c0522638e
commit e8c0346378
4 changed files with 23 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

10
core/css.js
View file

@ -139,6 +139,13 @@ Blockly.Css.CONTENT = [
'overflow: hidden;', /* IE overflows by default. */
'}',
/* Necessary to position the drag surface */
'.blocklyRelativeWrapper {',
'position: relative;',
'width: 100%;',
'height: 100%;',
'}',
'.blocklyWidgetDiv {',
'display: none;',
'position: absolute;',
@ -168,7 +175,8 @@ Blockly.Css.CONTENT = [
'.blocklyDragSurface {',
'display: none;',
'position: relative;',
'position: absolute;',
'top: 0;',
'overflow: visible;',
'z-index: 5000;', /* Always display on top */
'-webkit-backface-visibility: hidden;',

4
core/dragsurface_svg.js
View file

@ -65,12 +65,10 @@ Blockly.DragSurfaceSvg.prototype.createDom = function () {
* Set the dimensions (width, height, top offset) of the surface.
* @param {Number} width Width of the surface in pixels
* @param {Number} height Height of the surface in pixels
* @param {Number} top Top offset of the surface in pixels
*/
Blockly.DragSurfaceSvg.prototype.setSurfaceDimensions = function (width, height, top) {
Blockly.DragSurfaceSvg.prototype.setSurfaceDimensions = function (width, height) {
this.SVG_.setAttribute('width', width + 'px');
this.SVG_.setAttribute('height', height + 'px');
this.SVG_.style.top = top + 'px';
};
/**

11
core/inject.js
View file

@ -51,8 +51,15 @@ Blockly.inject = function(container, opt_options) {
throw 'Error: container is not in current document.';
}
var options = new Blockly.Options(opt_options || {});
var svg = Blockly.createDom_(container, options);
var dragSurface = new Blockly.DragSurfaceSvg(container);
// Add the relative wrapper. This is for positioning the drag surface exactly
// on top of the blockly SVG. Without this, top positioning of the drag surface
// is always off by a few pixels.
var relativeWrapper = goog.dom.createDom('div', 'blocklyRelativeWrapper');
container.appendChild(relativeWrapper);
var svg = Blockly.createDom_(relativeWrapper, options);
var dragSurface = new Blockly.DragSurfaceSvg(relativeWrapper);
var workspace = Blockly.createMainWorkspace_(svg, options, dragSurface);
Blockly.init_(workspace);
workspace.markFocused();

6
core/workspace_svg.js
View file

@ -336,8 +336,10 @@ Blockly.WorkspaceSvg.prototype.resize = function() {
* Resize the drag surface according to new workspace metrics.
*/
Blockly.WorkspaceSvg.prototype.resizeDragSurface_ = function () {
var bbox = this.svgGroup_.getBBox();
this.dragSurface.setSurfaceDimensions(bbox.width, bbox.height, -bbox.height)
var workspaceBBox = this.svgBackground_.getBBox();
var workspaceWidth = workspaceBBox.width;
var workspaceHeight = workspaceBBox.height;
this.dragSurface.setSurfaceDimensions(workspaceWidth, workspaceHeight, -workspaceHeight)
};
/**