/// <summary>
/// Scroll by one pageful.
/// Called when scrollbar background is clicked.
/// </summary>
/// <param name="e">Mouse down event.</param>
private void onMouseDownBar_(MouseEvent e)
{
Touch.clearTouchIdentifier(); // This is really a click.
this.cleanUp_();
if (Core.isRightButton(e))
{
// Right-click.
// Scrollbars have no context menu.
e.StopPropagation();
return;
}
var mouseXY = Core.mouseToSvg(e, this.workspace_.getParentSvg(),
this.workspace_.getInverseScreenCTM());
var mouseLocation = this.horizontal_ ? mouseXY.x : mouseXY.y;
var handleXY = Core.getSvgXY_(this.svgHandle_, this.workspace_);
var handleStart = this.horizontal_ ? handleXY.x : handleXY.y;
var handlePosition = this.handlePosition_;
var pageLength = this.handleLength_ * 0.95;
if (mouseLocation <= handleStart)
{
// Decrease the scrollbar's value by a page.
handlePosition -= pageLength;
}
else if (mouseLocation >= handleStart + this.handleLength_)
{
// Increase the scrollbar's value by a page.
handlePosition += pageLength;
}
this.setHandlePosition(this.constrainHandle_(handlePosition));
this.onScroll_();
e.StopPropagation();
e.PreventDefault();
}
/// <summary>
/// Handle a mouse-up anywhere on the page.
/// </summary>
/// <param name="e">Mouse up event.</param>
internal static void onMouseUp_(Event e)
{
var workspace = Core.getMainWorkspace();
if (workspace.dragMode_ == Core.DRAG_NONE)
{
return;
}
Touch.clearTouchIdentifier();
Css.setCursor(Css.Cursor.OPEN);
workspace.dragMode_ = Core.DRAG_NONE;
// Unbind the touch event if it exists.
if (Touch.onTouchUpWrapper_ != null)
{
Core.unbindEvent_(Touch.onTouchUpWrapper_);
Touch.onTouchUpWrapper_ = null;
}
if (Core.onMouseMoveWrapper_ != null)
{
Core.unbindEvent_(Core.onMouseMoveWrapper_);
Core.onMouseMoveWrapper_ = null;
}
}
/// <summary>
/// Create the zoom controls.
/// </summary>
/// <returns>The zoom controls SVG group.</returns>
public SVGElement createDom()
{
var workspace = this.workspace_;
/* Here's the markup that will be generated:
* <g class="blocklyZoom">
* <clippath id="blocklyZoomoutClipPath837493">
* <rect width="32" height="32" y="77"></rect>
* </clippath>
* <image width="96" height="124" x="-64" y="-15" xlink:href="media/sprites.png"
* clip-path="url(#blocklyZoomoutClipPath837493)"></image>
* <clippath id="blocklyZoominClipPath837493">
* <rect width="32" height="32" y="43"></rect>
* </clippath>
* <image width="96" height="124" x="-32" y="-49" xlink:href="media/sprites.png"
* clip-path="url(#blocklyZoominClipPath837493)"></image>
* <clippath id="blocklyZoomresetClipPath837493">
* <rect width="32" height="32"></rect>
* </clippath>
* <image width="96" height="124" y="-92" xlink:href="media/sprites.png"
* clip-path="url(#blocklyZoomresetClipPath837493)"></image>
* </g>
*/
this.svgGroup_ = Core.createSvgElement("g", new Dictionary <string, object>()
{
{ "class", "blocklyZoom" }
}, null);
var rnd = Script.Random().ToString().Substring(2);
var clip = Core.createSvgElement("clipPath", new Dictionary <string, object>()
{
{ "id", "blocklyZoomoutClipPath" + rnd }
},
this.svgGroup_);
Core.createSvgElement("rect", new Dictionary <string, object>()
{
{ "width", 32 }, { "height", 32 }, { "y", 77 }
},
clip);
var zoomoutSvg = Core.createSvgElement("image", new Dictionary <string, object>()
{
{ "width", Core.SPRITE.width },
{ "height", Core.SPRITE.height }, { "x", -64 },
{ "y", -15 },
{ "clip-path", "url(#blocklyZoomoutClipPath" + rnd + ")" }
},
this.svgGroup_);
zoomoutSvg.SetAttributeNS("http://www.w3.org/1999/xlink", "xlink:href",
workspace.options.pathToMedia + Core.SPRITE.url);
clip = Core.createSvgElement("clipPath", new Dictionary <string, object>()
{
{ "id", "blocklyZoominClipPath" + rnd }
},
this.svgGroup_);
Core.createSvgElement("rect", new Dictionary <string, object>()
{
{ "width", 32 }, { "height", 32 }, { "y", 43 }
},
clip);
var zoominSvg = Core.createSvgElement("image", new Dictionary <string, object>()
{
{ "width", Core.SPRITE.width },
{ "height", Core.SPRITE.height },
{ "x", -32 },
{ "y", -49 },
{ "clip-path", "url(#blocklyZoominClipPath" + rnd + ")" }
},
this.svgGroup_);
zoominSvg.SetAttributeNS("http://www.w3.org/1999/xlink", "xlink:href",
workspace.options.pathToMedia + Core.SPRITE.url);
clip = Core.createSvgElement("clipPath", new Dictionary <string, object>()
{
{ "id", "blocklyZoomresetClipPath" + rnd }
},
this.svgGroup_);
Core.createSvgElement("rect", new Dictionary <string, object>()
{
{ "width", 32 }, { "height", 32 }
},
clip);
var zoomresetSvg = Core.createSvgElement("image", new Dictionary <string, object>()
{
{ "width", Core.SPRITE.width },
{ "height", Core.SPRITE.height }, { "y", -92 },
{ "clip-path", "url(#blocklyZoomresetClipPath" + rnd + ")" }
},
this.svgGroup_);
zoomresetSvg.SetAttributeNS("http://www.w3.org/1999/xlink", "xlink:href",
workspace.options.pathToMedia + Core.SPRITE.url);
// Attach event listeners.
Core.bindEventWithChecks_(zoomresetSvg, "mousedown", null, new Action <Event>((e) => {
workspace.setScale((double)workspace.options.zoomOptions.startScale);
workspace.scrollCenter();
Touch.clearTouchIdentifier(); // Don't block future drags.
e.StopPropagation(); // Don't start a workspace scroll.
e.PreventDefault(); // Stop double-clicking from selecting text.
}));
Core.bindEventWithChecks_(zoominSvg, "mousedown", null, new Action <Event>((e) => {
workspace.zoomCenter(1);
Touch.clearTouchIdentifier(); // Don't block future drags.
e.StopPropagation(); // Don't start a workspace scroll.
e.PreventDefault(); // Stop double-clicking from selecting text.
}));
Core.bindEventWithChecks_(zoomoutSvg, "mousedown", null, new Action <Event>((e) => {
workspace.zoomCenter(-1);
Touch.clearTouchIdentifier(); // Don't block future drags.
e.StopPropagation(); // Don't start a workspace scroll.
e.PreventDefault(); // Stop double-clicking from selecting text.
}));
return(this.svgGroup_);
}
/// <summary>
/// Initializes the toolbox.
/// </summary>
public void init()
{
var workspace = this.workspace_;
var svg = this.workspace_.getParentSvg();
// Create an HTML container for the Toolbox menu.
this.HtmlDiv = (HTMLDivElement)
goog.dom.createDom(goog.dom.TagName.DIV, "blocklyToolboxDiv");
this.HtmlDiv.SetAttribute("dir", workspace.RTL ? "RTL" : "LTR");
svg.ParentNode.InsertBefore(this.HtmlDiv, svg);
// Clicking on toolbox closes popups.
Core.bindEventWithChecks_(this.HtmlDiv, "mousedown", null,
new Action <MouseEvent>((e) => {
if (Core.isRightButton(e) || e.Target == this.HtmlDiv)
{
// Close flyout.
Core.hideChaff(false);
}
else
{
// Just close popups.
Core.hideChaff(true);
}
Touch.clearTouchIdentifier(); // Don't block future drags.
}));
var workspaceOptions = new Options {
disabledPatternId = workspace.options.disabledPatternId,
parentWorkspace = workspace,
RTL = workspace.RTL,
oneBasedIndex = workspace.options.oneBasedIndex,
horizontalLayout = workspace.horizontalLayout,
toolboxPosition = workspace.options.toolboxPosition
};
/**
* @type {!Blockly.Flyout}
* @private
*/
this.flyout_ = new Flyout(workspaceOptions);
goog.dom.insertSiblingAfter(this.flyout_.createDom(), workspace.svgGroup_);
this.flyout_.init(workspace);
this.config_.cleardotPath = workspace.options.pathToMedia + "1x1.gif";
this.config_.cssCollapsedFolderIcon =
"blocklyTreeIconClosed" + (workspace.RTL ? "Rtl" : "Ltr");
var tree = new Toolbox.TreeControl(this, this.config_);
this.tree_ = tree;
tree.setShowRootNode(false);
tree.setShowLines(false);
tree.setShowExpandIcons(false);
tree.setSelectedItem(null);
var openNode = this.populate_(workspace.options.languageTree);
tree.render(this.HtmlDiv);
if (openNode != null)
{
tree.setSelectedItem(openNode);
}
this.addColour_();
this.position();
}
/// <summary>
/// Release the scrollbar handle and reset state accordingly.
/// </summary>
private void onMouseUpHandle_(Event e)
{
Touch.clearTouchIdentifier();
this.cleanUp_();
}
/// <summary>
/// Handle a mouse-up event while dragging a bubble's border or resize handle.
/// </summary>
/// <param name="e">Mouse up event.</param>
private static void bubbleMouseUp_(MouseEvent e)
{
Touch.clearTouchIdentifier();
Css.setCursor(Css.Cursor.OPEN);
Bubble.unbindDragEvents_();
}
