Adding node-type-specific anchor code
This commit is contained in:
		
							parent
							
								
									9ba2b8579e
								
							
						
					
					
						commit
						c2d8473425
					
				@ -6,22 +6,30 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
  type: 'charset',
 | 
					  type: 'charset',
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  _render() {
 | 
					  _render() {
 | 
				
			||||||
    var partContainer = this.container.group();
 | 
					    this.partContainer = this.container.group();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    return Q.all(_.map(this.parts.elements, part => {
 | 
					    return Q.all(_.map(this.parts.elements, (part => {
 | 
				
			||||||
      return part.render(partContainer.group());
 | 
					      return part.render(this.partContainer.group());
 | 
				
			||||||
    }))
 | 
					    }).bind(this)))
 | 
				
			||||||
      .then((() => {
 | 
					      .then((() => {
 | 
				
			||||||
        this.spaceVertically(this.parts.elements, {
 | 
					        this.spaceVertically(this.parts.elements, {
 | 
				
			||||||
          padding: 5
 | 
					          padding: 5
 | 
				
			||||||
        });
 | 
					        });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        return this.renderLabeledBox(this.invert() ? 'None of:' : 'One of:', partContainer, {
 | 
					        return this.renderLabeledBox(this.invert() ? 'None of:' : 'One of:', this.partContainer, {
 | 
				
			||||||
          padding: 5
 | 
					          padding: 5
 | 
				
			||||||
        });
 | 
					        });
 | 
				
			||||||
      }).bind(this));
 | 
					      }).bind(this));
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  _getAnchor() {
 | 
				
			||||||
 | 
					    var matrix = this.transform().localMatrix;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    return _.extend(Base._getAnchor.call(this), {
 | 
				
			||||||
 | 
					      ay: matrix.y(0, this.partContainer.getBBox().cy)
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  invert() {
 | 
					  invert() {
 | 
				
			||||||
    return this._invert.textValue !== '';
 | 
					    return this._invert.textValue !== '';
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
				
			|||||||
@ -27,6 +27,7 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
      return Q.all(_([start, partPromises, end]).flatten().compact().value())
 | 
					      return Q.all(_([start, partPromises, end]).flatten().compact().value())
 | 
				
			||||||
        .then(((items) => {
 | 
					        .then(((items) => {
 | 
				
			||||||
 | 
					          this.items = items;
 | 
				
			||||||
          this.spaceHorizontally(items, {
 | 
					          this.spaceHorizontally(items, {
 | 
				
			||||||
            padding: 10
 | 
					            padding: 10
 | 
				
			||||||
          });
 | 
					          });
 | 
				
			||||||
@ -58,5 +59,18 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
      return result;
 | 
					      return result;
 | 
				
			||||||
    }, []);
 | 
					    }, []);
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  _getAnchor() {
 | 
				
			||||||
 | 
					    var start = this.normalizeBBox(_.first(this.items).getBBox()),
 | 
				
			||||||
 | 
					        end = this.normalizeBBox(_.last(this.items).getBBox()),
 | 
				
			||||||
 | 
					        matrix = this.transform().localMatrix;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    return {
 | 
				
			||||||
 | 
					      atype: [start.atype, end.atype].join('/'),
 | 
				
			||||||
 | 
					      ax: matrix.x(start.ax, start.ay),
 | 
				
			||||||
 | 
					      ax2: matrix.x(end.ax2, end.ay),
 | 
				
			||||||
 | 
					      ay: matrix.y(start.ax, start.ay)
 | 
				
			||||||
 | 
					    };
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
				
			|||||||
@ -17,17 +17,17 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
          box = this._content.getBBox();
 | 
					          box = this._content.getBBox();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
          if (this._repeat.hasSkip()) {
 | 
					          if (this._repeat.hasSkip()) {
 | 
				
			||||||
            paths.push(Snap.format('M0,{box.cy}q10,0 10,-10v-{vert}q0,-10 10,-10h{horiz}q10,0 10,10v{vert}q0,10 10,10', {
 | 
					            paths.push(Snap.format('M0,{box.ay}q10,0 10,-10v-{vert}q0,-10 10,-10h{horiz}q10,0 10,10v{vert}q0,10 10,10', {
 | 
				
			||||||
              box,
 | 
					              box,
 | 
				
			||||||
              vert: box.height / 2 - 10,
 | 
					              vert: Math.max(0, box.ay - box.y - 10),
 | 
				
			||||||
              horiz: box.width - 10
 | 
					              horiz: box.width - 10
 | 
				
			||||||
            }));
 | 
					            }));
 | 
				
			||||||
          }
 | 
					          }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
          if (this._repeat.hasLoop()) {
 | 
					          if (this._repeat.hasLoop()) {
 | 
				
			||||||
            paths.push(Snap.format('M{box.x},{box.cy}q-10,0 -10,10v{vert}q0,10 10,10h{box.width}q10,0 10,-10v-{vert}q0,-10 -10,-10', {
 | 
					            paths.push(Snap.format('M{box.x},{box.ay}q-10,0 -10,10v{vert}q0,10 10,10h{box.width}q10,0 10,-10v-{vert}q0,-10 -10,-10', {
 | 
				
			||||||
              box,
 | 
					              box,
 | 
				
			||||||
              vert: box.height / 2 - 10
 | 
					              vert: box.y2 - box.ay - 10
 | 
				
			||||||
            }));
 | 
					            }));
 | 
				
			||||||
          }
 | 
					          }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -37,5 +37,16 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
          }
 | 
					          }
 | 
				
			||||||
        }).bind(this));
 | 
					        }).bind(this));
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  _getAnchor() {
 | 
				
			||||||
 | 
					    var anchor = this._content.getAnchor(),
 | 
				
			||||||
 | 
					        matrix = this.transform().localMatrix;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    return _.extend(anchor, {
 | 
				
			||||||
 | 
					      ax: matrix.x(anchor.ax, anchor.ay),
 | 
				
			||||||
 | 
					      ax2: matrix.x(anchor.ax2, anchor.ay),
 | 
				
			||||||
 | 
					      ay: matrix.y(anchor.ax, anchor.ay)
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
				
			|||||||
@ -31,16 +31,8 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
          containerBox = this.getBBox();
 | 
					          containerBox = this.getBBox();
 | 
				
			||||||
          paths = _.map(matches, this.makeConnectorLine.bind(this, containerBox));
 | 
					          paths = _.map(matches, this.makeConnectorLine.bind(this, containerBox));
 | 
				
			||||||
 | 
					
 | 
				
			||||||
          paths.push(Snap.format([
 | 
					          paths.push(this.makeSideLine(containerBox, _.first(matches)));
 | 
				
			||||||
            'M0,{box.cy}q10,0 10,-10V{top}',
 | 
					          paths.push(this.makeSideLine(containerBox, _.last(matches)));
 | 
				
			||||||
            'M0,{box.cy}q10,0 10,10V{bottom}',
 | 
					 | 
				
			||||||
            'M{box.width},{box.cy}m40,0q-10,0 -10,-10V{top}',
 | 
					 | 
				
			||||||
            'M{box.width},{box.cy}m40,0q-10,0 -10,10V{bottom}'
 | 
					 | 
				
			||||||
          ].join(''), {
 | 
					 | 
				
			||||||
            box: containerBox,
 | 
					 | 
				
			||||||
            top: _.first(matches).getBBox().ay + 10,
 | 
					 | 
				
			||||||
            bottom: _.last(matches).getBBox().ay - 10
 | 
					 | 
				
			||||||
          }));
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
          this.container.prepend(
 | 
					          this.container.prepend(
 | 
				
			||||||
            this.container.path(paths.join('')));
 | 
					            this.container.path(paths.join('')));
 | 
				
			||||||
@ -48,6 +40,25 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
    }
 | 
					    }
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  makeSideLine(containerBox, match) {
 | 
				
			||||||
 | 
					    var box = match.getBBox(),
 | 
				
			||||||
 | 
					        direction = box.ay > containerBox.cy ? 1 : -1,
 | 
				
			||||||
 | 
					        distance = Math.abs(box.ay - containerBox.cy);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    if (distance >= 15) {
 | 
				
			||||||
 | 
					      return Snap.format([
 | 
				
			||||||
 | 
					        'M0,{box.cy}q10,0 10,{shift}V{edge}',
 | 
				
			||||||
 | 
					        'M{box.width},{box.cy}m40,0q-10,0 -10,{shift}V{edge}'
 | 
				
			||||||
 | 
					      ].join(''), {
 | 
				
			||||||
 | 
					        box: containerBox,
 | 
				
			||||||
 | 
					        edge: box.ay - 10 * direction,
 | 
				
			||||||
 | 
					        shift: 10 * direction
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					    } else {
 | 
				
			||||||
 | 
					      return '';
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  makeConnectorLine(containerBox, match) {
 | 
					  makeConnectorLine(containerBox, match) {
 | 
				
			||||||
    var box = match.getBBox(),
 | 
					    var box = match.getBBox(),
 | 
				
			||||||
        direction = box.ay > containerBox.cy ? 1 : -1,
 | 
					        direction = box.ay > containerBox.cy ? 1 : -1,
 | 
				
			||||||
 | 
				
			|||||||
@ -20,17 +20,16 @@ export default {
 | 
				
			|||||||
  },
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  contentPosition() {
 | 
					  contentPosition() {
 | 
				
			||||||
    var x = 0, y = 0;
 | 
					    var x = 0;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    if (this.hasLoop()) {
 | 
					    if (this.hasLoop()) {
 | 
				
			||||||
      x = 10;
 | 
					      x = 10;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    if (this.hasSkip()) {
 | 
					    if (this.hasSkip()) {
 | 
				
			||||||
      y = 10;
 | 
					 | 
				
			||||||
      x = 15;
 | 
					      x = 15;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    return Snap.matrix().translate(x, y);
 | 
					    return Snap.matrix().translate(x, 0);
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
@ -36,4 +36,15 @@ export default _.extend({}, Base, {
 | 
				
			|||||||
  resetCounter() {
 | 
					  resetCounter() {
 | 
				
			||||||
    groupCounter = 1;
 | 
					    groupCounter = 1;
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  _getAnchor() {
 | 
				
			||||||
 | 
					    var anchor = this.regexp.getAnchor(),
 | 
				
			||||||
 | 
					        matrix = this.transform().localMatrix;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    return _.extend(anchor, {
 | 
				
			||||||
 | 
					      ax: matrix.x(anchor.ax, anchor.ay),
 | 
				
			||||||
 | 
					      ax2: matrix.x(anchor.ax2, anchor.ay),
 | 
				
			||||||
 | 
					      ay: matrix.y(anchor.ax, anchor.ay)
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user