1 files changed, 83 insertions, 0 deletions
diff --git a/sdc-workflow-designer-ui/src/app/paletx/core/overlay/position/free-position-strategy.ts b/sdc-workflow-designer-ui/src/app/paletx/core/overlay/position/free-position-strategy.ts
new file mode 100644
index 00000000..bd33e404
--- /dev/null
+++ b/sdc-workflow-designer-ui/src/app/paletx/core/overlay/position/free-position-strategy.ts
@@ -0,0 +1,83 @@
+/* tslint:disable:array-type member-access variable-name typedef
+ only-arrow-functions directive-class-suffix component-class-suffix
+ component-selector no-unnecessary-type-assertion arrow-parens*/
+import {PositionStrategy} from './position-strategy';
+
+/**
+ * Free position strategy for overlay without origin
+ * @author lingyi.zcs
+ */
+export class FreePositionStrategy implements PositionStrategy {
+  private _wrapper: HTMLElement;
+  // private _cssPosition: string = '';
+  // private _top: string = '';
+  // private _left: string = '';
+  // private _width: string = '';
+  // private _height: string = '';
+
+  // cssPosition(value: string) {
+  //   this._cssPosition = value;
+  //   return this;
+  // }
+
+  // top(value: number | string): this {
+  //   this._top = this._toCssValue(value);
+  //   return this;
+  // }
+
+  // left(value: number | string): this {
+  //   this._left = this._toCssValue(value);
+  //   return this;
+  // }
+
+  // width(value: number | string): this {
+  //   this._width = this._toCssValue(value);
+  //   return this;
+  // }
+
+  // height(value: number | string): this {
+  //   this._height = this._toCssValue(value);
+  //   return this;
+  // }
+
+  /**
+   * Apply the position to the element. (NOTE: normally will triggered by
+   * scrolling)
+   * @docs-private
+   *
+   * @param element Element to which to apply the CSS.
+   * @returns Resolved when the styles have been applied.
+   */
+  apply(element: HTMLElement): void {
+	if (!this._wrapper) {
+		this._wrapper = document.createElement('div');
+		this._wrapper.classList.add('cdk-free-overlay-wrapper');
+		element.parentNode.insertBefore(this._wrapper, element);
+		this._wrapper.appendChild(element);
+
+      // // Initialized style once
+      // const style = element.style;
+      // style.position = this._cssPosition;
+      // style.top = this._top;
+      // style.left = this._left;
+      // style.width = this._width;
+      // style.height = this._height;
+	}
+
+    // TODO: do somethings while triggered (eg. by scrolling)
+  }
+
+  /**
+   * Removes the wrapper element from the DOM.
+   */
+  dispose(): void {
+	if (this._wrapper && this._wrapper.parentNode) {
+		this._wrapper.parentNode.removeChild(this._wrapper);
+		this._wrapper = null;
+	}
+  }
+
+  // private _toCssValue(value: number | string) {
+  //   return typeof value === 'number' ? value + 'px' : value;
+  // }
+}