/// <summary> /// Destroy the widget and hide the div if it is being used by the specified /// object. /// </summary> /// <param name="oldOwner">The object that was using this container.</param> public static void hideIfOwner(object oldOwner) { if (WidgetDiv.owner_ == oldOwner) { WidgetDiv.hide(); } }
/// <summary> /// Initialize and display the widget div. Close the old one if needed. /// </summary> /// <param name="newOwner">The object that will be using this container.</param> /// <param name="rtl">Right-to-left (true) or left-to-right (false).</param> /// <param name="dispose">Optional cleanup function to be run when the widget /// is closed.</param> public static void show(object newOwner, bool rtl, Action dispose) { WidgetDiv.hide(); WidgetDiv.owner_ = newOwner; WidgetDiv.dispose_ = dispose; // Temporarily move the widget to the top of the screen so that it does not // cause a scrollbar jump in Firefox when displayed. var xy = goog.style.getViewportPageOffset(Document.Instance); WidgetDiv.DIV.Style.Top = xy.y + "px"; WidgetDiv.DIV.Style.Direction = rtl ? Direction.Rtl : Direction.Ltr; WidgetDiv.DIV.Style.Display = Display.Block; }
/// <summary> /// Close tooltips, context menus, dropdown selections, etc. /// </summary> /// <param name="opt_allowToolbox">If true, don't close the toolbox.</param> public static void hideChaff(bool opt_allowToolbox = false) { Tooltip.hide(); WidgetDiv.hide(); if (!opt_allowToolbox) { var workspace = Core.getMainWorkspace(); if (workspace.toolbox_ != null && workspace.toolbox_.flyout_ != null && workspace.toolbox_.flyout_.autoClose) { workspace.toolbox_.clearSelection(); } } }
/// <summary> /// Handle key down to the editor. /// </summary> /// <param name="e">Keyboard event.</param> private void onHtmlInputKeyDown_(KeyboardEvent e) { var htmlInput = FieldTextInput.htmlInput_; int tabKey = 9, enterKey = 13, escKey = 27; if (e.KeyCode == enterKey) { WidgetDiv.hide(); } else if (e.KeyCode == escKey) { htmlInput.Value = htmlInput.DefaultValue; WidgetDiv.hide(); } else if (e.KeyCode == tabKey) { WidgetDiv.hide(); this.sourceBlock_.tab(this, !e.ShiftKey); e.PreventDefault(); } }
/// <summary> /// Create a date picker under the date field. /// </summary> public override void showEditor_(bool opt_quietInput) { WidgetDiv.show(this, this.sourceBlock_.RTL, new Action(FieldDate.widgetDispose_)); // Create the date picker using Closure. FieldDate.loadLanguage_(); var picker = new goog.ui.DatePicker(); picker.setAllowNone(false); picker.setShowWeekNum(false); // Position the picker to line up with the field. // Record windowSize and scrollOffset before adding the picker. var windowSize = goog.dom.getViewportSize(); var scrollOffset = goog.style.getViewportPageOffset(Document.Instance); var xy = this.getAbsoluteXY_(); var borderBBox = this.getScaledBBox_(); var div = WidgetDiv.DIV; picker.render(div); picker.setDate(new Date(this.getValue())); // Record pickerSize after adding the date picker. var pickerSize = goog.style.getSize(picker.getElement()); // Flip the picker vertically if off the bottom. if (xy.y + pickerSize.height + borderBBox.height >= windowSize.height + scrollOffset.y) { xy.y -= pickerSize.height - 1; } else { xy.y += borderBBox.height - 1; } if (this.sourceBlock_.RTL) { xy.x += borderBBox.width; xy.x -= pickerSize.width; // Don't go offscreen left. if (xy.x < scrollOffset.x) { xy.x = scrollOffset.x; } } else { // Don't go offscreen right. if (xy.x > windowSize.width + scrollOffset.x - pickerSize.width) { xy.x = windowSize.width + scrollOffset.x - pickerSize.width; } } WidgetDiv.position(xy.x, xy.y, windowSize, scrollOffset, this.sourceBlock_.RTL); // Configure event handler. var thisField = this; FieldDate.changeEventKey_ = goog.events.listen(picker, goog.ui.DatePicker.Events.CHANGE, new Action <Bridge.Html5.Event>((e) => { var date = e.Date != null ? e.Date.ToIsoString(true) : ""; WidgetDiv.hide(); if (thisField.sourceBlock_ != null) { // Call any validation function, and allow it to override. date = thisField.callValidator(date); } thisField.setValue(date); })); }
/// <summary> /// Create a palette under the colour field. /// </summary> public override void showEditor_(bool opt_quietInput) { WidgetDiv.show(this, this.sourceBlock_.RTL, new Action(FieldColour.widgetDispose_)); // Create the palette using Closure. var picker = new goog.ui.ColorPicker(); picker.setSize(this.columns_ ?? FieldColour.COLUMNS); picker.setColors(new JsArray <string>(this.colours_ ?? FieldColour.COLOURS)); // Position the palette to line up with the field. // Record windowSize and scrollOffset before adding the palette. var windowSize = goog.dom.getViewportSize(); var scrollOffset = goog.style.getViewportPageOffset(Document.Instance); var xy = this.getAbsoluteXY_(); var borderBBox = this.getScaledBBox_(); var div = WidgetDiv.DIV; picker.render(div); picker.setSelectedColor(this.getValue()); // Record paletteSize after adding the palette. var paletteSize = goog.style.getSize(picker.getElement()); // Flip the palette vertically if off the bottom. if (xy.y + paletteSize.height + borderBBox.height >= windowSize.height + scrollOffset.y) { xy.y -= paletteSize.height - 1; } else { xy.y += borderBBox.height - 1; } if (this.sourceBlock_.RTL) { xy.x += borderBBox.width; xy.x -= paletteSize.width; // Don't go offscreen left. if (xy.x < scrollOffset.x) { xy.x = scrollOffset.x; } } else { // Don't go offscreen right. if (xy.x > windowSize.width + scrollOffset.x - paletteSize.width) { xy.x = windowSize.width + scrollOffset.x - paletteSize.width; } } WidgetDiv.position(xy.x, xy.y, windowSize, scrollOffset, this.sourceBlock_.RTL); // Configure event handler. var thisField = this; FieldColour.changeEventKey_ = goog.events.listen(picker, goog.ui.ColorPicker.EventType.CHANGE, new Action <goog.events.Event>((e) => { string colour = ((goog.ui.ColorPicker)e.target).getSelectedColor() ?? "#000000"; WidgetDiv.hide(); if (thisField.sourceBlock_ != null) { // Call any validation function, and allow it to override. colour = thisField.callValidator(colour); } if (colour != null) { thisField.setValue(colour); } })); }