2014-11-30 19:10:27 +00:00
|
|
|
import _ from 'lodash';
|
2014-11-30 15:48:33 +00:00
|
|
|
|
2014-12-17 16:53:04 +00:00
|
|
|
export default {
|
2014-12-03 01:10:56 +00:00
|
|
|
type: 'root',
|
|
|
|
|
2014-12-11 00:01:57 +00:00
|
|
|
_render() {
|
2014-12-17 19:44:48 +00:00
|
|
|
var flagLabels = [];
|
2014-12-16 15:14:37 +00:00
|
|
|
|
2014-12-17 19:44:48 +00:00
|
|
|
if (this.flags.global) {
|
2014-12-16 15:14:37 +00:00
|
|
|
flagLabels.push('Global');
|
|
|
|
}
|
2014-12-17 19:44:48 +00:00
|
|
|
if (this.flags.ignore_case) {
|
2014-12-16 15:14:37 +00:00
|
|
|
flagLabels.push('Ignore Case');
|
|
|
|
}
|
2014-12-17 19:44:48 +00:00
|
|
|
if (this.flags.multiline) {
|
2014-12-16 15:14:37 +00:00
|
|
|
flagLabels.push('Multiline');
|
|
|
|
}
|
|
|
|
|
|
|
|
if (flagLabels.length > 0) {
|
|
|
|
this.flagText = this.container.text(0, 0, `Flags: ${flagLabels.join(', ')}`);
|
|
|
|
}
|
|
|
|
|
2014-12-04 01:20:08 +00:00
|
|
|
this.start = this.container.circle()
|
|
|
|
.addClass('pin')
|
|
|
|
.attr({ r: 5 });
|
|
|
|
this.end = this.container.circle()
|
|
|
|
.addClass('pin')
|
|
|
|
.attr({ r: 5 });
|
2014-12-13 14:09:58 +00:00
|
|
|
|
2014-12-13 17:55:03 +00:00
|
|
|
return this.regexp.render(this.container.group())
|
2014-12-16 03:00:24 +00:00
|
|
|
.then(() => {
|
2014-12-16 15:14:37 +00:00
|
|
|
var box,
|
|
|
|
offset = 0;
|
|
|
|
|
|
|
|
if (this.flagText) {
|
|
|
|
offset = this.flagText.getBBox().height;
|
|
|
|
}
|
2014-12-15 00:28:50 +00:00
|
|
|
|
|
|
|
this.regexp.transform(Snap.matrix()
|
2014-12-16 15:14:37 +00:00
|
|
|
.translate(10, offset));
|
2014-12-15 00:28:50 +00:00
|
|
|
|
2014-12-16 02:51:17 +00:00
|
|
|
box = this.regexp.getBBox();
|
2014-12-15 00:28:50 +00:00
|
|
|
|
|
|
|
this.start.transform(Snap.matrix()
|
2014-12-16 02:51:17 +00:00
|
|
|
.translate(0, box.ay));
|
2014-12-15 00:28:50 +00:00
|
|
|
this.end.transform(Snap.matrix()
|
2014-12-16 02:51:17 +00:00
|
|
|
.translate(box.x2 + 10, box.ay));
|
2014-12-15 02:37:56 +00:00
|
|
|
|
|
|
|
this.container.prepend(
|
2014-12-16 02:51:17 +00:00
|
|
|
this.container.path(`M${box.ax},${box.ay}H0M${box.ax2},${box.ay}H${box.x2 + 10}`));
|
2014-12-16 03:00:24 +00:00
|
|
|
});
|
2014-11-30 20:36:53 +00:00
|
|
|
},
|
|
|
|
|
2014-12-17 19:44:48 +00:00
|
|
|
setup() {
|
|
|
|
var flagsStr;
|
2014-11-26 23:24:40 +00:00
|
|
|
|
2014-12-17 20:28:04 +00:00
|
|
|
if (this.properties.flags) {
|
|
|
|
flagsStr = this.properties.flags.textValue;
|
2014-11-26 23:24:40 +00:00
|
|
|
} else {
|
2014-12-17 19:44:48 +00:00
|
|
|
flagsStr = '';
|
2014-11-26 23:24:40 +00:00
|
|
|
}
|
|
|
|
|
2014-12-17 19:44:48 +00:00
|
|
|
this.flags = {
|
|
|
|
global: /g/.test(flagsStr),
|
|
|
|
ignore_case: /i/.test(flagsStr),
|
|
|
|
multiline: /m/.test(flagsStr)
|
2014-11-26 23:24:40 +00:00
|
|
|
};
|
2014-12-17 19:44:48 +00:00
|
|
|
|
|
|
|
this.regexp = this.properties.regexp
|
2014-11-26 23:24:40 +00:00
|
|
|
}
|
2014-12-17 16:53:04 +00:00
|
|
|
};
|