<commit_before>$(function(){

  var template = 
    '<div class="module" style="left:<%= get("x")-10 %>px;top:<%= get("y")-30 %>px;width:<%= get("w")+20 %>px;height:<%= get("h")+40 %>px;" >'+
      '<div class="outer"></div>'+
      '<div class="ports ports-in"></div>'+
      '<div class="ports ports-out"></div>'+
      '<h1 class="title">...</h1>'+
      '<button type="button" class="showcontrols">show controls</button>'+
      '<div class="controls">'+
        '<button type="button" class="remove">remove</button>'+
        '<button type="button" class="hidecontrols">hide controls</button>'+
      '</div>'+
      '<div class="inner"></div>'+
    '</div>';

  // var innerTemplate = '<div class="info" />';

  Iframework.NodeBoxView = Iframework.NodeView.extend({
    tagName: "div",
    className: "node",
    template: _.template(template),
    // innerTemplate: _.template(innerTemplate),
    events: {
      "dragstart .module":   "dragstart",
      "drag .module":        "drag",
      "dragstop .module":    "dragstop",
      "resizestart .module": "resizestart",
      "resize .module":      "resize",
      "resizestop .module":  "resizestop",
      "mousedown .module, .title": "mousedown",
      "click .module, .title": "click",
      "click .showcontrols": "showControls",
      "click .hidecontrols": "hideControls",
      "click .remove":       "removeModel"
    },
    initialize: function () {
      this.render();
      this.$(".module")
        .data({view: this})
        .draggable({ handle: "h1" })
        .resizable({ minHeight: 100, minWidth: 100 });
      this.$(".showcontrols")
        .button({ icons: { primary: "icon-left-open" }, text: false });
      this.$(".hidecontrols")
        .button({ icons: { primary: "icon-right-open" }, text: false });
      this.$(".remove")
        .button({ icons: { primary: "icon-trash" }, text: false });

      // Disable selection for better drag+drop
      this.$("h1").disableSelection();

      // Bring newest to top
      this.mousedown();

    },
    initializeNative: function () {
      // Called from GraphView.addNode
      if (!this.Native){
        if (Iframework.NativeNodes.hasOwnProperty(this.model.lazyLoadType)) {
          this.Native = new Iframework.NativeNodes[this.model.lazyLoadType]({model:this.model});
          this.$(".inner").append( this.Native.initialize().$el );
          // Check if all modules are loaded
          this.model.loaded = true;
          this.model.graph.checkLoaded();
        } else {
          console.warn("No native node found.");
        }
      }
    },
    render: function () {
      this.$el.html(this.template(this.model));
      return this;
    },
    infoLoaded: function (info) {
      this.$('h1')
        .text(this.model.get("id") + ": " + info.title)
        .attr({
          title: (info.author ? "by "+info.author+": " : "" ) + info.description
        });
    },
    _relatedEdges: null,
    relatedEdges: function () {
      // Resets to null on dis/connect
      if ( this._relatedEdges === null ) {
        var edges = [];
        this.model.Inputs.each(function(port){
          port.Edges.each(function(edge){
            edges.push(edge);
          });
        });
        this.model.Outputs.each(function(port){
          port.Edges.each(function(edge){
            edges.push(edge);
          });
        });
        this._relatedEdges = edges;
      }
      return this._relatedEdges;
    },
    resetRelatedEdges: function () {
      this._relatedEdges = null;
      this.relatedEdges();
    },
    _delta: {},
    dragstart: function (event, ui) {
      // Add a mask so that iframes don't steal mouse
      this.model.graph.view.maskFrames();

      // Start dragging a deselected module
      if (!this.$(".module").hasClass("ui-selected")) {
        // Deselect others and select this one
        $("div.module.ui-selected").removeClass("ui-selected");
        this.$(".module").addClass("ui-selected");
      }

      // Reset offsets of selected
      this.model.graph.view.selectableStop();

      this._delta = this.$(".module").offset();
    },
    drag: function (event, ui) {
      _.each(this.relatedEdges(), function(edge){
        if (edge.view) {
          edge.view.redraw();
        }
      });

      if (event) {
        // Drag is coming from this module
        // Move other modules
        var others = this.model.graph.view._selected;
        var deltaL = this._delta.left - ui.offset.left - $('.graph').scrollLeft();
        var deltaT = this._delta.top - ui.offset.top - $('.graph').scrollTop();
        for (var i=0; i<others.length; i++) {
          if (this.$(".module")[0] !== others[i].el) {
            // Move other selected module
            $(others[i].el).css({
              left: (others[i].offset.left - deltaL) + "px",
              top: (others[i].offset.top - deltaT) + "px"
            });
            // Redraw edges<commit_msg>drag bug<commit_after>$(function(){

  var template = 
    '<div class="module" style="left:<%= get("x")-10 %>px;top:<%= get("y")-30 %>px;width:<%= get("w")+20 %>px;height:<%= get("h")+40 %>px;" >'+
      '<div class="outer"></div>'+
      '<div class="ports ports-in"></div>'+
      '<div class="ports ports-out"></div>'+
      '<h1 class="title">...</h1>'+
      '<button type="button" class="showcontrols">show controls</button>'+
      '<div class="controls">'+
        '<button type="button" class="remove">remove</button>'+
        '<button type="button" class="hidecontrols">hide controls</button>'+
      '</div>'+
      '<div class="inner"></div>'+
    '</div>';

  // var innerTemplate = '<div class="info" />';

  Iframework.NodeBoxView = Iframework.NodeView.extend({
    tagName: "div",
    className: "node",
    template: _.template(template),
    // innerTemplate: _.template(innerTemplate),
    events: {
      "dragstart .module":   "dragstart",
      "drag .module":        "drag",
      "dragstop .module":    "dragstop",
      "resizestart .module": "resizestart",
      "resize .module":      "resize",
      "resizestop .module":  "resizestop",
      "mousedown .module, .title": "mousedown",
      "click .module, .title": "click",
      "click .showcontrols": "showControls",
      "click .hidecontrols": "hideControls",
      "click .remove":       "removeModel"
    },
    initialize: function () {
      this.render();
      this.$(".module")
        .data({view: this})
        .draggable({ handle: "h1" })
        .resizable({ minHeight: 100, minWidth: 100 });
      this.$(".showcontrols")
        .button({ icons: { primary: "icon-left-open" }, text: false });
      this.$(".hidecontrols")
        .button({ icons: { primary: "icon-right-open" }, text: false });
      this.$(".remove")
        .button({ icons: { primary: "icon-trash" }, text: false });

      // Disable selection for better drag+drop
      this.$("h1").disableSelection();

      // Bring newest to top
      this.mousedown();

    },
    initializeNative: function () {
      // Called from GraphView.addNode
      if (!this.Native){
        if (Iframework.NativeNodes.hasOwnProperty(this.model.lazyLoadType)) {
          this.Native = new Iframework.NativeNodes[this.model.lazyLoadType]({model:this.model});
          this.$(".inner").append( this.Native.initialize().$el );
          // Check if all modules are loaded
          this.model.loaded = true;
          this.model.graph.checkLoaded();
        } else {
          console.warn("No native node found.");
        }
      }
    },
    render: function () {
      this.$el.html(this.template(this.model));
      return this;
    },
    infoLoaded: function (info) {
      this.$('h1')
        .text(this.model.get("id") + ": " + info.title)
        .attr({
          title: (info.author ? "by "+info.author+": " : "" ) + info.description
        });
    },
    _relatedEdges: null,
    relatedEdges: function () {
      // Resets to null on dis/connect
      if ( this._relatedEdges === null ) {
        var edges = [];
        this.model.Inputs.each(function(port){
          port.Edges.each(function(edge){
            edges.push(edge);
          });
        });
        this.model.Outputs.each(function(port){
          port.Edges.each(function(edge){
            edges.push(edge);
          });
        });
        this._relatedEdges = edges;
      }
      return this._relatedEdges;
    },
    resetRelatedEdges: function () {
      this._relatedEdges = null;
      this.relatedEdges();
    },
    _delta: {},
    dragstart: function (event, ui) {
      // Add a mask so that iframes don't steal mouse
      this.model.graph.view.maskFrames();

      // Start dragging a deselected module
      if (!this.$(".module").hasClass("ui-selected")) {
        // Deselect others and select this one
        $("div.module.ui-selected").removeClass("ui-selected");
        this.$(".module").addClass("ui-selected");
      }

      // Reset offsets of selected
      this.model.graph.view.selectableStop();

      this._delta = this.$(".module").offset();
    },
    drag: function (event, ui) {
      _.each(this.relatedEdges(), function(edge){
        if (edge.view) {
          edge.view.redraw();
        }
      });

      if (event && ui) {
        // Drag is coming from this module
        // Move other modules
        var others = this.model.graph.view._selected;
        var deltaL = this._delta.left - ui.offset.left - $('.graph').scrollLeft();
        var deltaT = this._delta.top - ui.offset.top - $('.graph').scrollTop();
        for (var i=0; i<others.length; i++) {
          if (this.$(".module")[0] !== others[i].el) {
            // Move other selected module
            $(others[i].el).css({
              left: (others[i].offset.left - deltaL) + "px",
              top: (others[i].offset.top - deltaT) + "px"
            });
            // Redraw edges
{'fraction_non_alphanumeric': 0.18391969988847207, 'fraction_numerical': 0.0042583392476933995, 'mean_word_length': 2.194300518134715, 'pattern_counts': {'":': 26, '<': 55, '<?xml version=': 0, '>': 53, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1316763', 'n_tokens_mistral': 3024, 'n_tokens_neox': 2969, 'n_words': 609}