System.register(['src/client/morphic/node-helpers.js', 'src/client/morphic/event-helpers.js', 'src/client/graphics.js', 'src/components/halo/lively-halo-item.js', 'src/client/preferences.js', 'src/client/morphic/snapping.js', 'utils', 'src/components/halo/lively-halo.js'], function (_export, _context) {
  "use strict";

  var nodes, events, pt, HaloItem, Preferences, Snapping, Grid, getTempKeyFor, asDragImageFor, HaloService;
  return {
    setters: [function (_srcClientMorphicNodeHelpersJs) {
      nodes = _srcClientMorphicNodeHelpersJs;
    }, function (_srcClientMorphicEventHelpersJs) {
      events = _srcClientMorphicEventHelpersJs;
    }, function (_srcClientGraphicsJs) {
      pt = _srcClientGraphicsJs.pt;
    }, function (_srcComponentsHaloLivelyHaloItemJs) {
      HaloItem = _srcComponentsHaloLivelyHaloItemJs.default;
    }, function (_srcClientPreferencesJs) {
      Preferences = _srcClientPreferencesJs.default;
    }, function (_srcClientMorphicSnappingJs) {
      Snapping = _srcClientMorphicSnappingJs.default;
      Grid = _srcClientMorphicSnappingJs.Grid;
    }, function (_utils) {
      getTempKeyFor = _utils.getTempKeyFor;
      asDragImageFor = _utils.asDragImageFor;
    }, function (_srcComponentsHaloLivelyHaloJs) {
      HaloService = _srcComponentsHaloLivelyHaloJs.default;
    }],
    execute: function () {
      const __SystemJSRewritingHack = {};
      _recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js = _recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js || {};
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'nodes', {
        get() {
          return nodes;
        },

        set(thisIsVererySecretVariableName) {
          nodes = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'events', {
        get() {
          return events;
        },

        set(thisIsVererySecretVariableName) {
          events = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'pt', {
        get() {
          return pt;
        },

        set(thisIsVererySecretVariableName) {
          pt = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'HaloItem', {
        get() {
          return HaloItem;
        },

        set(thisIsVererySecretVariableName) {
          HaloItem = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'Preferences', {
        get() {
          return Preferences;
        },

        set(thisIsVererySecretVariableName) {
          Preferences = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'Snapping', {
        get() {
          return Snapping;
        },

        set(thisIsVererySecretVariableName) {
          Snapping = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'Grid', {
        get() {
          return Grid;
        },

        set(thisIsVererySecretVariableName) {
          Grid = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'asDragImageFor', {
        get() {
          return asDragImageFor;
        },

        set(thisIsVererySecretVariableName) {
          asDragImageFor = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'getTempKeyFor', {
        get() {
          return getTempKeyFor;
        },

        set(thisIsVererySecretVariableName) {
          getTempKeyFor = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'HaloService', {
        get() {
          return HaloService;
        },

        set(thisIsVererySecretVariableName) {
          HaloService = thisIsVererySecretVariableName;
          return true;
        },

        enumerable: true,
        configurable: true
      });
      class HaloVivideAddOutportItem extends HaloItem {

        initialize() {
          this.style['user-select'] = 'none';
          this.setAttribute('draggable', "true");
          this.style['user-drag'] = 'element';
          this.addEventListener('dragstart', evt => this.startMyDrag(evt));
          this.addEventListener('drag', evt => {
            lively.warn('drag');
          });
          this.addEventListener('dragend', evt => {
            HaloService.hideHalos();
          });
        }

        startMyDrag(evt) {
          if (!this._view) {
            lively.warn('No view given to add a connection.');
            return;
          }
          evt.stopPropagation();
          // preventDefault is harmful here: it prevents drag data and images

          this._view.addDragInfoTo(evt);
          const { x, y } = pt(evt.clientX, evt.clientY).subPt(lively.getGlobalPosition(this));
          asDragImageFor.call(this, evt, x, y);
        }

        //   // Drag API
        //   start(evt) {
        //     return lively.warn('start')
        //     this.dragTarget = window.that;
        //     if (this.dragTarget) {
        //       this.dragStartNodePosition = lively.getPosition(this.dragTarget);
        //       this.dragStartEventPosition = events.globalPosition(evt);
        //       evt.preventDefault();

        //       this.snapping = new Snapping(this.dragTarget) 
        //       this.halo.info =  lively.showInfoBox(this.dragTarget)

        //       if (this.dragTarget.haloDragStart) {
        //         this.dragTarget.haloDragStart(this.dragStartEventPosition)
        //       }
        //     }
        //   }

        //   move(evt) {
        //     return lively.warn('move')
        //     if (this.dragTarget && !this.isDragging && 
        //       events.noticableDistanceTo(evt, this.dragStartEventPosition)) {
        //       // this.dragTarget.style.position = 'absolute';
        //       this.isDragging = true;
        //     }
        //     if (this.isDragging) {
        //       this.dragTo(evt);
        //     }
        //   }

        //   stop(evt) {
        //     return lively.warn('stop')
        //     this.halo.info.stop()
        //     //  STOP DRAGGING
        //     if (this.isDragging) {    
        //       this.isDragging = false;
        //       evt.preventDefault();
        //     }
        //     this.dragTarget = null;
        //     this.dragStartEventPosition = null;
        //     this.dragStartNodePosition = null;
        //     this.snapping.clearHelpers()
        //     this.snapping = null
        //   }

        //   dragTo(evt) {
        //     return lively.warn('dragTo')
        //     if (this.dragTarget.haloDragTo) {
        //       this.dragTarget.haloDragTo(events.globalPosition(evt), this.dragStartEventPosition)
        //     } else {
        //       var eventPos = events.globalPosition(evt);
        //       var newPosition = eventPos.subPt(this.dragStartEventPosition).
        //         addPt(this.dragStartNodePosition)

        //       newPosition = newPosition.rounded()
        //       if (this.dragTarget.style.position == "absolute") {
        //         lively.setPosition(this.dragTarget, Grid.optSnapPosition(newPosition, evt));
        //         if(!evt.altKey) {
        //           this.snapping.snap()
        //         }
        //       } else {
        //          lively.setPosition(this.dragTarget, newPosition, "relative");
        //       }
        //       this.halo.info.innerHTML = "drag " + lively.getPosition(this.dragTarget)
        //     }
        //     evt.preventDefault();
        //   }

        updateTarget(view) {
          this._view = view;
        }
      }

      _export('default', HaloVivideAddOutportItem);

      Object.defineProperty(_recorder_._src_components_halo_lively_halo_vivide_add_outport_item_js, 'HaloVivideAddOutportItem', {
        get() {
          return HaloVivideAddOutportItem;
        },

        set(thisIsVererySecretVariableName) {
          _export('default', HaloVivideAddOutportItem = thisIsVererySecretVariableName);

          return true;
        },

        enumerable: true,
        configurable: true
      });
    }
  };
});