Dart Documentationdock_spawnDockWheel

DockWheel Class

Manages the dock overlay buttons that are displayed over the dock manager

Constructors

Code new DockWheel(DockManager dockManager) #

DockWheel(this.dockManager) {
  elementMainWheel = new DivElement();
  elementSideWheel = new DivElement();
  wheelItems = new Map<String, DockWheelItem>();
  var wheelTypes = [
      "left", "right", "top", "down", "fill",     // Main dock wheel buttons
      "left-s", "right-s", "top-s", "down-s",     // Buttons on the extreme 4 sides
  ];
  wheelTypes.forEach((String wheelType) {
    wheelItems[wheelType] = new DockWheelItem(this, wheelType);
    if (wheelType.endsWith("-s")) {
      // Side button
      elementSideWheel.nodes.add(wheelItems[wheelType].element);
    } else {
      // Main dock wheel button
      elementMainWheel.nodes.add(wheelItems[wheelType].element);
    }
  });

  int zIndex = 100000;
  elementMainWheel.classes.add("dock-wheel-base");
  elementSideWheel.classes.add("dock-wheel-base");
  elementMainWheel.style.zIndex = "${zIndex + 1}";
  elementSideWheel.style.zIndex = "$zIndex";
  
  elementPanelPreview = new DivElement();
  elementPanelPreview.classes.add("dock-wheel-panel-preview");
  elementPanelPreview.style.zIndex = "${zIndex - 1}";
}

Methods

Code DockNode get activeNode() #

DockNode get activeNode() {
  return _activeNode;
}

Code void set activeNode(DockNode value) #

void set activeNode(DockNode value) {
  var previousValue = _activeNode;
  _activeNode = value;

  if (previousValue != _activeNode) {
    // The active node has been changed. 
    // Reattach the wheel to the new node's element and show it again
    if (_visible) {
      showWheel();
    }
  }
}

Code void hideWheel() #

void hideWheel() {
  _visible = false;
  activeNode = null;
  elementMainWheel.remove();
  elementSideWheel.remove();
  elementPanelPreview.remove();
  
  // deactivate all wheels
  wheelItems.getValues().forEach((item) => item.active = false);
}

Code void onDialogDropped(Dialog dialog) #

Called if the dialog is dropped in a dock panel. The dialog might not necessarily be dropped in one of the dock wheel buttons, in which case the request will be ignored

void onDialogDropped(Dialog dialog) {
  // Check if the dialog was dropped in one of the wheel items
  DockWheelItem wheelItem = _getActiveWheelItem();
  if (wheelItem != null) {
    _handleDockRequest(wheelItem, dialog);
  }
}

Code void onMouseOut(DockWheelItem wheelItem, MouseEvent e) #

void onMouseOut(DockWheelItem wheelItem, MouseEvent e) {
  elementPanelPreview.remove();
}

Code void onMouseOver(DockWheelItem wheelItem, MouseEvent e) #

void onMouseOver(DockWheelItem wheelItem, MouseEvent e) {
  if (activeDialog == null) return;
  
  // Display the preview panel to show where the panel would be docked
  DockNode rootNode = dockManager.context.model.rootNode;
  Rectangle bounds;
  if (wheelItem.id == "top") {
    bounds = dockManager.layoutEngine.getDockBounds(_activeNode, activeDialog.panel, "vertical", true);
  } else if (wheelItem.id == "down") {
    bounds = dockManager.layoutEngine.getDockBounds(_activeNode, activeDialog.panel, "vertical", false);
  } else if (wheelItem.id == "left") {
    bounds = dockManager.layoutEngine.getDockBounds(_activeNode, activeDialog.panel, "horizontal", true);
  } else if (wheelItem.id == "right") {
    bounds = dockManager.layoutEngine.getDockBounds(_activeNode, activeDialog.panel, "horizontal", false);
  } else if (wheelItem.id == "fill") {
    bounds = dockManager.layoutEngine.getDockBounds(_activeNode, activeDialog.panel, "fill", false);
  } else if (wheelItem.id == "top-s") {
    bounds = dockManager.layoutEngine.getDockBounds(rootNode, activeDialog.panel, "vertical", true);
  } else if (wheelItem.id == "down-s") {
    bounds = dockManager.layoutEngine.getDockBounds(rootNode, activeDialog.panel, "vertical", false);
  } else if (wheelItem.id == "left-s") {
    bounds = dockManager.layoutEngine.getDockBounds(rootNode, activeDialog.panel, "horizontal", true);
  } else if (wheelItem.id == "right-s") {
    bounds = dockManager.layoutEngine.getDockBounds(rootNode, activeDialog.panel, "horizontal", false);
  }
  
  if (bounds != null) {
    dockManager.element.nodes.add(elementPanelPreview);
    elementPanelPreview.style.left = "${bounds.x.toInt()}px";
    elementPanelPreview.style.top = "${bounds.y.toInt()}px";
    elementPanelPreview.style.width = "${bounds.width.toInt()}px";
    elementPanelPreview.style.height = "${bounds.height.toInt()}px";
  }
}

Code void showWheel() #

void showWheel() {
  _visible = true;
  if (activeNode == null) {
    // No active node selected. make sure the wheel is invisible
    elementMainWheel.remove();
    elementSideWheel.remove();
    return;
  }
  Element element = activeNode.container.containerElement;
  int containerWidth = element.$dom_clientWidth;
  int containerHeight = element.$dom_clientHeight;
  int baseX = (containerWidth / 2).toInt() + element.$dom_offsetLeft;
  int baseY = (containerHeight / 2).toInt() + element.$dom_offsetTop;
  elementMainWheel.style.left = "${baseX}px";
  elementMainWheel.style.top = "${baseY}px";
  
  // The positioning of the main dock wheel buttons is done automatically through CSS
  // Dynamically calculate the positions of the buttons on the extreme sides of the dock manager
  num sideMargin = 20;
  num dockManagerWidth = dockManager.element.$dom_clientWidth;
  num dockManagerHeight = dockManager.element.$dom_clientHeight;
  num dockManagerOffsetX = dockManager.element.$dom_offsetLeft;
  num dockManagerOffsetY = dockManager.element.$dom_offsetTop;

  elementMainWheel.remove();
  elementSideWheel.remove();
  element.nodes.add(elementMainWheel);
  dockManager.element.nodes.add(elementSideWheel);

  _setWheelButtonPosition("left-s",   sideMargin, -dockManagerHeight / 2);
  _setWheelButtonPosition("right-s",  dockManagerWidth - sideMargin * 2, -dockManagerHeight / 2);
  _setWheelButtonPosition("top-s",    dockManagerWidth / 2, -dockManagerHeight + sideMargin);
  _setWheelButtonPosition("down-s",   dockManagerWidth / 2, -sideMargin);
  
}

Fields

Code Dialog activeDialog #

Dialog activeDialog;

Code DockManager dockManager #

DockManager dockManager;

Code DivElement elementMainWheel #

DivElement elementMainWheel;

Code DivElement elementPanelPreview #

DivElement elementPanelPreview;

Code DivElement elementSideWheel #

DivElement elementSideWheel;

Code Map<String, DockWheelItem> wheelItems #

Map<String, DockWheelItem> wheelItems;