/// <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_(); }