Skip to content

Additional options for tags#1

Open
mrbubblesort wants to merge 6 commits intogoat1000:masterfrom
mrbubblesort:master
Open

Additional options for tags#1
mrbubblesort wants to merge 6 commits intogoat1000:masterfrom
mrbubblesort:master

Conversation

@mrbubblesort
Copy link

I added these options for tags:
bgBox - (true|false) background box on/off
bgBoxPadX - (int) x padding on tag
bgBoxPadY - (int) y padding on tag
bgBoxStroke - (string) outline color for bg box
bgBoxColor - (string) color for bg box
bgBoxRadius - (int) radius of bg box corners

For example, this would make the tags look like a bootstrap labels or buttons (http://getbootstrap.com/components/#labels):
$('#tag-canvas').tagcanvas({
'textColour' : '#FFFFFF',
'bgBox': true,
'bgBoxPadX' : 6,
'bgBoxPadY' : 10,
'bgBoxStroke' : "#5BC0DE",
'bgBoxColor' : "#5BC0DE",
'bgBoxRadius' : 5,
});

These options are now available for styling tags:
bgBox - (true|false) background box on/off
bgBoxPadX - (int) x padding on tag
bgBoxPadY - (int) y padding on tag
bgBoxStroke - (string) outline color for bg box
bgBoxColor - (string) color for bg box
bgBoxRadius - (int) radius of bg box corners

For example, this would make the tags look like a bootstrap label (http://getbootstrap.com/components/#labels): 
$('#tag-canvas').tagcanvas({
   'textColour' : '#FFFFFF',
   'bgBox': true,
   'bgBoxPadX' : 6,
   'bgBoxPadY' : 10,
   'bgBoxStroke' : "#5BC0DE",
   'bgBoxColor' : "#5BC0DE",
   'bgBoxRadius' : 5,
});
@nurikabe
Copy link

+1 to make it easier to use with Bootstrap. Nice to see this library in GitHub.

@goat1000
Copy link
Owner

I've had a quick look over this, and found a couple of minor problems:

  1. The padding and radius options don't take into account the "txtScale" value - this is easy to fix in the Tproto.Measure function by multiplying (like s * this.height and s * t.shadowBlur).
  2. With the "outlineMethod" set to "colour", the whole tag is opaque in the outline colour, so you can't read it. Not sure if there is an easy fix for this.
  3. Not really a problem, but "bgBoxColor" for the option name when I've spelled the other options "textColour" and "outlineColour" could cause confusion.

Otherwise, it looks good.

@mrbubblesort
Copy link
Author

OK, no problem. I'll try to get that in this week then. Thanks for the input.

@nurikabe
Copy link

Bump

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants