Skip to content

Commit

Permalink
Extracting code for "text in a rectangle"
Browse files Browse the repository at this point in the history
  • Loading branch information
@javallone
javallone committed Dec 30, 2012
1 parent c6d2c7c commit 31456ab
Show file tree
Hide file tree
Showing 8 changed files with 150 additions and 269 deletions.
35 changes: 5 additions & 30 deletions app/assets/javascripts/regexper/any_character.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
define(['regexper', 'regexper/base'], function(Regexper, Base) {
var text_margin = 5,
base_text_attrs = {
define(['regexper', 'regexper/base', 'regexper/text_box'], function(Regexper, Base, TextBox) {
var base_text_attrs = {
'font-size': 12,
fill: '#ffffff'
},
Expand All @@ -11,40 +10,16 @@ define(['regexper', 'regexper/base'], function(Regexper, Base) {
};

var AnyCharacter = function(paper, structure) {
var text_box;

Base.call(this);

this._text = paper.text(0, 0, 'any character');
this._text.attr(base_text_attrs);
text_box = this._text.getBBox();

this._rect = paper.rect(0, 0,
text_box.width + 2 * text_margin,
text_box.height + 2 * text_margin);
this._rect.attr(base_rect_attrs);
TextBox.call(this, paper, 'any character',
base_text_attrs, base_rect_attrs);

this._stack_order = [this._rect, this._text];

this._mark_complete();
};

Regexper.extend(AnyCharacter.prototype, Base.prototype, {
position: function(x, y) {
var text_box = this._text.getBBox(),
rect_box = this._rect.getBBox();

this._rect.attr({ x: x, y: y });
this._text.attr({
x: x + rect_box.width / 2,
y: y + rect_box.height / 2
});
},

get_box: function() {
return this._rect.getBBox();
}
});
Regexper.extend(AnyCharacter.prototype, Base.prototype, TextBox.prototype);

return AnyCharacter;
});
42 changes: 10 additions & 32 deletions app/assets/javascripts/regexper/escaped.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
define(['regexper', 'regexper/base'], function(Regexper, Base) {
var text_margin = 5,
base_text_attrs = {
define(['regexper', 'regexper/base', 'regexper/text_box'], function(Regexper, Base, TextBox) {
var base_text_attrs = {
'font-size': 12
},
base_rect_attrs = {
Expand All @@ -10,53 +9,32 @@ define(['regexper', 'regexper/base'], function(Regexper, Base) {
};

var Escaped = function(paper, structure) {
var text_box;
var label = structure.content;

Base.call(this);

this._text = paper.text(0, 0, structure.content);
this._text.attr(base_text_attrs);
if (typeof structure.content.type !== 'undefined') {
switch (structure.content.type) {
case 'control':
this._text.attr('text', 'Ctrl-' + structure.content.code);
label = 'Ctrl-' + structure.content.code;
break;
case 'hex':
this._text.attr('text', '0x' + structure.content.code);
label = '0x' + structure.content.code;
break;
case 'unicode':
this._text.attr('text', 'U+' + structure.content.code);
label = 'U+' + structure.content.code;
break;
}
}
text_box = this._text.getBBox();

this._rect = paper.rect(0, 0,
text_box.width + 2 * text_margin,
text_box.height + 2 * text_margin);
this._rect.attr(base_rect_attrs);
Base.call(this);
TextBox.call(this, paper, label,
base_text_attrs, base_rect_attrs);

this._stack_order = [this._rect, this._text];

this._mark_complete();
};

Regexper.extend(Escaped.prototype, Base.prototype, {
position: function(x, y) {
var text_box = this._text.getBBox(),
rect_box = this._rect.getBBox();

this._rect.attr({ x: x, y: y });
this._text.attr({
x: x + rect_box.width / 2,
y: y + rect_box.height / 2
});
},

get_box: function() {
return this._rect.getBBox();
}
});
Regexper.extend(Escaped.prototype, Base.prototype, TextBox.prototype);

return Escaped;
});
35 changes: 5 additions & 30 deletions app/assets/javascripts/regexper/literal.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
define(['regexper', 'regexper/base'], function(Regexper, Base) {
var text_margin = 5,
base_text_attrs = {
define(['regexper', 'regexper/base', 'regexper/text_box'], function(Regexper, Base, TextBox) {
var base_text_attrs = {
'font-size': 12
},
base_rect_attrs = {
Expand All @@ -10,40 +9,16 @@ define(['regexper', 'regexper/base'], function(Regexper, Base) {
};

var Literal = function(paper, structure) {
var text_box;

Base.call(this);

this._text = paper.text(0, 0, '"' + structure.content + '"');
this._text.attr(base_text_attrs);
text_box = this._text.getBBox();

this._rect = paper.rect(0, 0,
text_box.width + 2 * text_margin,
text_box.height + 2 * text_margin);
this._rect.attr(base_rect_attrs);
TextBox.call(this, paper, '"' + structure.content + '"',
base_text_attrs, base_rect_attrs);

this._stack_order = [this._rect, this._text];

this._mark_complete();
};

Regexper.extend(Literal.prototype, Base.prototype, {
position: function(x, y) {
var text_box = this._text.getBBox(),
rect_box = this._rect.getBBox();

this._rect.attr({ x: x, y: y });
this._text.attr({
x: x + rect_box.width / 2,
y: y + rect_box.height / 2
});
},

get_box: function() {
return this._rect.getBBox();
}
});
Regexper.extend(Literal.prototype, Base.prototype, TextBox.prototype);

return Literal;
});
36 changes: 36 additions & 0 deletions app/assets/javascripts/regexper/text_box.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
define(['regexper'], function(Regexper) {
var text_margin = 5;

var TextBox = function(paper, label, text_attrs, rect_attrs) {
var text_box;

this._text = paper.text(0, 0, label);
this._text.attr(text_attrs);

text_box = this._text.getBBox();

this._rect = paper.rect(0, 0,
text_box.width + 2 * text_margin,
text_box.height + 2 * text_margin);
this._rect.attr(rect_attrs);
};

Regexper.extend(TextBox.prototype, {
position: function(x, y) {
var text_box = this._text.getBBox(),
rect_box = this._rect.getBBox();

this._rect.attr({ x: x, y: y });
this._text.attr({
x: x + rect_box.width / 2,
y: y + rect_box.height / 2
});
},

get_box: function() {
return this._rect.getBBox();
}
});

return TextBox;
});
57 changes: 0 additions & 57 deletions spec/javascripts/regexper/any_character_spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,12 +21,6 @@ define(['regexper/any_character', 'mock/paper'], function(AnyCharacter, Paper) {

describe('text element', function() {

it('creates a text element', function() {
var any_character = new AnyCharacter(paper, structure());

expect(paper.text).toHaveBeenCalled();
});

it('sets the text of the text element to the content of the any_character surrounded by quotes', function() {
var any_character = new AnyCharacter(paper, structure());

Expand All @@ -49,21 +43,6 @@ define(['regexper/any_character', 'mock/paper'], function(AnyCharacter, Paper) {

describe('rect element', function() {

it('creates a rect element', function() {
var any_character = new AnyCharacter(paper, structure());

expect(paper.rect).toHaveBeenCalled();
});

it('sets the dimensions of the rect to be the dimensions of the text plus a margin', function() {
var any_character = new AnyCharacter(paper, structure()),
text_box = any_character._text.getBBox();
rect_box = any_character._rect.getBBox();

expect(rect_box.width).toEqual(text_box.width + 10);
expect(rect_box.height).toEqual(text_box.height + 10);
});

it('sets the corner radius of the rect', function() {
var any_character = new AnyCharacter(paper, structure());

Expand All @@ -79,41 +58,5 @@ define(['regexper/any_character', 'mock/paper'], function(AnyCharacter, Paper) {

});

describe('.position', function() {

it('sets the position of the rect to the given coordinates', function() {
var any_character = new AnyCharacter(paper, structure());

any_character.position(10, 20);

expect(any_character._rect.attrs.x).toEqual(10);
expect(any_character._rect.attrs.y).toEqual(20);
});

it('sets the position of the text to be centered in the rect', function() {
var any_character = new AnyCharacter(paper, structure()),
text_box, rect_box;

any_character.position(10, 20);

text_box = any_character._text.getBBox();
rect_box = any_character._rect.getBBox();

expect(text_box.x + text_box.width / 2).toEqual(rect_box.x + rect_box.width / 2);
expect(text_box.y + text_box.height / 2).toEqual(rect_box.y + rect_box.height / 2);
});

});

describe('.get_box', function() {

it('returns the rect element\'s bounding box', function() {
var any_character = new AnyCharacter(paper, structure());

expect(any_character.get_box()).toEqual(any_character._rect.getBBox());
});

});

});
});
63 changes: 0 additions & 63 deletions spec/javascripts/regexper/escaped_spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,18 +22,6 @@ define(['regexper/escaped', 'mock/paper'], function(Escaped, Paper) {

describe('text element', function() {

it('creates a text element', function() {
var escaped = new Escaped(paper, structure('Test'));

expect(paper.text).toHaveBeenCalled();
});

//it('sets the text of the text element to the content of the escaped surrounded by quotes', function() {
// var escaped = new Escaped(paper, structure('Test'));

// expect(escaped._text.attrs.text).toEqual('"Test"');
//});

it('sets the font-size of the text element', function() {
var escaped = new Escaped(paper, structure('Test'));

Expand Down Expand Up @@ -93,21 +81,6 @@ define(['regexper/escaped', 'mock/paper'], function(Escaped, Paper) {

describe('rect element', function() {

it('creates a rect element', function() {
var escaped = new Escaped(paper, structure('Test'));

expect(paper.rect).toHaveBeenCalled();
});

it('sets the dimensions of the rect to be the dimensions of the text plus a margin', function() {
var escaped = new Escaped(paper, structure('Test')),
text_box = escaped._text.getBBox();
rect_box = escaped._rect.getBBox();

expect(rect_box.width).toEqual(text_box.width + 10);
expect(rect_box.height).toEqual(text_box.height + 10);
});

it('sets the corner radius of the rect', function() {
var escaped = new Escaped(paper, structure('Test'));

Expand All @@ -123,41 +96,5 @@ define(['regexper/escaped', 'mock/paper'], function(Escaped, Paper) {

});

describe('.position', function() {

it('sets the position of the rect to the given coordinates', function() {
var escaped = new Escaped(paper, structure('Test'));

escaped.position(10, 20);

expect(escaped._rect.attrs.x).toEqual(10);
expect(escaped._rect.attrs.y).toEqual(20);
});

it('sets the position of the text to be centered in the rect', function() {
var escaped = new Escaped(paper, structure('Test')),
text_box, rect_box;

escaped.position(10, 20);

text_box = escaped._text.getBBox();
rect_box = escaped._rect.getBBox();

expect(text_box.x + text_box.width / 2).toEqual(rect_box.x + rect_box.width / 2);
expect(text_box.y + text_box.height / 2).toEqual(rect_box.y + rect_box.height / 2);
});

});

describe('.get_box', function() {

it('returns the rect element\'s bounding box', function() {
var escaped = new Escaped(paper, structure('Test'));

expect(escaped.get_box()).toEqual(escaped._rect.getBBox());
});

});

});
});
Loading

0 comments on commit 31456ab

Please sign in to comment.