Sublime Forum

**facelessuser** · January 13, 2016, 7:47am

lol, I know right .

So here is an example of the new background handeling.

This is ST2

Here is Export HTML (notice I don’t pad the end of the lines yet with color, but generally it looks pretty good…except for the horrible theme ).

Transparency might not be exactly spot on, but it is pretty close. I have to guess how ST2 might be doing it, and then I have a little fudge factor in their to adjust things. In the example above, I believe the reddish and purplish colors use transparency, so they are pretty close.

The padding is trickier than you would think. I am trying to keep the text in tables so I can easily copy and paste any section to an email (which I use a lot). And I am also trying to preserve wrapping for printing. All of these things can be at odds with each other…and exhausting. This is also why, if you use certain fonts, you may see a break between code lines. It is hard for me to get the spans to fill in those lines because they don’t respond to height properites, but I can’t check their pixel height at compile time in python, I would have to do that at run time and then pad every span…ugh. If I remove the table, the problem goes away, but then if I copy and paste a section of the HTML, I lose page background color, and it loses the uniform right edge. If I use block elements and float them left, I lose the easy way to test for line length and wrap them. Web coding can be a real pain.

**sublimator** · January 13, 2016, 7:47am

[quote=“facelessuser”]castles_made_of_sand wrote:
This is lame dude, I can’t even change theme on the fly

lol, I know right .[/quote]

Glad you got the joke

**facelessuser** · January 13, 2016, 7:47am

Okay. Background support is done. I think I may have also solved the gaps between rows with certain fonts on certain platforms.

This is generated by ExportHTML, not ST2 .

That’s all.

**facelessuser** · January 13, 2016, 7:47am

One more thing. The new background coloring feature caused one side affect for people me when copying and pasting code into Outlook.

Apparently, if outlook has html code pasted in it with spans who have a color darker than about 62 luminescence, it renders all the text in those spans as white. Kind of annoying. So I added a feature that the few people who paste dark themes into emails in Outlook might use. The feature causes ExportHTML to scale up the entire theme to ensure that all background colors are at least 62 luminescence (this can be configured to a different value if desired; between 0-255). I also fixed an issue where some themes wouldn’t work because I hadn’t encoded the plist proper that I stuff into the HTML; that is now fixed as well.

Example:
[pre=#2D2D2D] // Minum allowed background lumens a.k.a brightness (0-255)
“bg_min_lumen_threshold”: 62,

…

    // Browser view color (selections and multi-selections allowed)
    {
        "Browser View - Current Color (EMAIL)": {
            "numbers": true,
            "multi_select": true,
            "shift_brightness": true
        }
    },[/pre]

**facelessuser** · January 13, 2016, 7:47am

A fairly useless feature I added for fun. You can use filters in ExportHtml and ExportBbcode. I guess this could be useful if you wanted to apply some filter to theme. Then you could use exportHtml to apply the filter and then extract the theme from the HTML via the download option in the toolbar. Anyways, I realize this feature is pretty worthless, but it was fun nonetheless.

You can use the following: invert, grayscale, sepia, brightness, saturation, hue, colorize.

Unaltered:
[pre=#2D2D2D] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true
}
},[/pre]

Invert:
[pre=#D2D2D2] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “invert”
}
},[/pre]

grayscale:
[pre=#2D2D2D] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “grayscale”
}
},[/pre]

sepia:
[pre=#3C362A] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “sepia”
}
},[/pre]

Saturation:
[pre=#2D2D2D] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “saturation(1.5)”
}
},[/pre]

Brightness:
[pre=#606060] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “brightness(1.2)”
}
},[/pre]

colorize:
[pre=#2D2D2D] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “colorize(0)”
}
},[/pre]

hue (shift):
[pre=#2D2D2D] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “hue(60)”
}
},[/pre]

Chain some together:
[pre=#FFFFFF] // BBCODE menu items
“bbcode_panel”:
{
“To Clipboard - Format as BBCode”: {
“numbers”: false,
“multi_select”: true,
“filter”: “hue(60);saturation(1.5);brightness(.8);invert”
}
},[/pre]

**quodlibet** · January 13, 2016, 7:47am

I think you just made Instagram for coders.

**facelessuser** · January 13, 2016, 7:47am

[quote=“quodlibet”]
I think you just made Instagram for coders.[/quote]

instacode?

I know, I hate myself a little for it .

**C0D312** · January 13, 2016, 7:47am

1 out of 5 *s

I need blur and vignette to make my code look pretty!1!!1!11!!!

(Also, torn edges would be nice)

**facelessuser** · January 13, 2016, 7:47am

[quote=“C0D312”]1 out of 5 *s

I need blur and vignette to make my code look pretty!1!!1!11!!!

(Also, torn edges would be nice)[/quote]

Yes, I think I heard that code runs better if it is prettier.

**Grant** · January 13, 2016, 7:47am

@facelessuser: you are now inscribed in my signature. classic.

**facelessuser** · January 13, 2016, 7:47am

That’s funny .

**facelessuser** · January 13, 2016, 7:48am

So, ever since I added background colors to scopes, I have been struggling with the getting the CSS right to support code wrapped in tables (so I can copy and paste into Outlook emails; and other emails), inline spans (they don’t seem to expand to fill the table unless they are inline-block; inline-blocks fix the gap issues, but they don’t wrap well), annotation underlines ( underlining the annotations with dotted underlines started to break when I added background colors; some weird overlaps etc.).

So I fixed the above issues finally, but the gaps in background color can return if you are using certain fonts. I removed the workaround (which really only helped 70% of the time, but also caused me other headaches). I now recommend if you are using a theme that has background colors to just hard code the font-face in the settings file to something reliable like Courier or Courier New (this font doesn’t cause gaps in background colors. It is also much more likely to be on another users computer if you share the html output.). I also changed the underline method for annotations; it now just uses text-decoration: underline; much more reliable when working with the spans and background colors and trying to keep the dotted border from getting overlapped with the odd dynamics that are going on with the spans.

Also added better tooltips for annotations that follow the mouse. I am hoping this is the last update for a bit. I have been getting tired of tweaking all of this stuff.

Its funny, if I just gave up in trying to wrap this stuff in tables, and gave up on the pretty wrapping (wrapping after the gutter), I could solve almost all of these issues quite easily, but the feature I use the most in this is copying to emails, so I need the table wrapping in order to handle themes with non-white backgrounds. So that clears it up. Everything should be more reliable now, but if you get gaps in background colors when using font X, try hard coding the settings file to always use a font like Courier (or something else that is equally reliable for monospace fonts).

Version 0.5.7

Better tooltips for annotations (they now follow the mouse)
Remove workaround to fix gaps in background color (it is recommended to just use a reliable font like Courier)
Change method of underlining annotations to work in wrap mode and non-wrap mode and with background colors
Fix for CSS in annotation table not handling comment overflow

**sublimator** · January 13, 2016, 7:48am

Could you add an air conditioner?

**facelessuser** · January 13, 2016, 7:48am

I will have to figure out how to make it work with the air purification system first .

In all seriousness, I do think I am done with features (and bloat).

If I have to be honest though, the only thing I use ExportHtml for is pasting code to emails. It is funny, because ExportHtml started as a way to print from a browser, but I never print code.

**sublimator** · January 13, 2016, 7:48am

Wish I could dig up some 10 second youtube of 2 junkies talking about getting off the gear

Sublime + Python == Crack

**facelessuser** · January 13, 2016, 7:48am

[quote=“castles_made_of_sand”]
Sublime + Python == Crack [/quote]

It’s funny because it’s true . The kind of code I do to pay my bills is very different than this kind of stuff. Python is a very fun language to code in and I also like coding topics that are far away from what I actually do…mainly because they are so different. It can be very addictive.

**sublimator** · January 13, 2016, 7:48am

What sort of stuff you usually write for $ ?

**facelessuser** · January 13, 2016, 7:48am

Embedded systems/firmware. I do C/C++/(stare at assembly when I am debugging). A lot of coding directly with the hardware; dealing with registers, keeping memory footprint low, etc.

I like what I do, but stuff like this is a nice break from all the complexity and low level coding.

**sublimator** · January 13, 2016, 7:48am

That shit be whack. My brain just doesn’t cope with C/C++

Waspect for those whose can

**agibsonsw** · January 13, 2016, 7:48am

int(*f(char c))(int, long); ?

or, to put it another way…

void *((*fnp[4])())();

ExportHtml Plugin (rename from PrintHtml)