Add UTF-8 encode (and maybe more?)

[Smolations]

The reason I gave this package a go was to avoid using exact characters in strings within CSS files (e.g. i.tri { content: "▲" }, but html entities only work directly in markup. In order to get the correct encoding for CSS, it needs to match the character set for the CSS. In my case, it is UTF-8. I realize that there are many character sets, but since UTF-8 is by far the most popular for web pages, it seems like this additional conversion operation would be a useful addition to this plugin.

In addition to the above, it might also be useful to do the same for octal/unicode encodings, which are also commonly used on the web.

Other than that, great plugin! :smile:

[colinta]

Hey there! I don't understand what you're describing here... what is the desired vs observed behavior?

[Smolations]

Alright, I will attempt to clarify.

Using the example in my original post, let's assume the goal is display the upright triangle icon (▲) as an accent character of some sort within a parent element using the <i> element. To insert it directly in the markup, it can be highlighted in ST and then "entitized" into ▲. That can then be used in the markup like this: <i class="tri">&#x25b2;</i>. The character will render in the browser as expected. However, in order to use that character in CSS (as a pseudo-element, for example) without pasting it directly in the stylesheet, you would need to use the escaped unicode: i.tri { content: "\25B2" }. Attempting to used the "entitized" version will simply render out the text.

There are several common encodings that can be used to render the character. I came across this site in order to get the right code to use in my CSS (see bottom right for CSS). It provides many translations:

Does that help? :smile:

[colinta]

Oh, that's easy. It's the same as the hyml encoding, but "\" instead of "&#x" in front.

This would be easy to add: copy the html encoders, modify them to output this css format, and add them to the sublime-command file for easy access.

On Apr 7, 2015, at 8:50 PM, Chris Smola notifications@github.com wrote:

Alright, I will attempt to clarify.

Using the example in my original post, let's assume the goal is display the upright triangle icon ($B"%(B) as an accent character of some sort within a parent element using the element. To insert it directly in the markup, it can be highlighted in ST and then "entitized" into ▲. That can then be used in the markup like this: ▲. The character will render in the browser as expected. However, in order to use that character in CSS (as a pseudo-element, for example) without pasting it directly in the stylesheet, you would need to use the escaped unicode: i.tri { content: "\25B2" }. Attempting to used the "entitized" version will simply render out the text.

There are several common encodings that can be used to render the character. I came across this site in order to get the right code to use in my CSS (see bottom right for CSS). It provides many translations:

Does that help?

$B!=(B Reply to this email directly or view it on GitHub.

[Smolations]

Yes, and the Javascript version would probably also be useful, as well as easy to add (\u25B2 for my example).

[colinta]

I agree… I’d love to see a PR! :-)

On Apr 8, 2015, at 10:49 AM, Chris Smola notifications@github.com wrote:

Yes, and the Javascript version would probably also be useful, as well as easy to add (\u25B2 for my example).

— Reply to this email directly or view it on GitHub https://github.com/colinta/SublimeStringEncode/issues/18#issuecomment-90972334.

[Smolations]

LOL Come on man, your project has two issues: one saying how awesome your plugin is, and this one. It's not like you're being flooded with requests. I don't develop ST plugins normally and I don't really have the time at the moment to submit a PR. I believe in you. You can do it! :+1:

[colinta]

I hope you're joking...

I maintain these: https://github.com/colinta?tab=repositories and these: https://github.com/rubymotion I work here: http://ello.co/colinta and provide rubymotion support here: https://gitter.im/rubymotion/rubymotion

If you want this done the fastest way is to open the .py file and DIY, which is what the last person did (see closed PRs on this repo)

On Wed, Apr 8, 2015 at 11:05 AM, Chris Smola notifications@github.com wrote:

LOL Come on man, your project has two issues: one saying how awesome your plugin is, and this one. It's not like you're being flooded with requests. I don't develop ST plugins normally and I don't really have the time at the moment to submit a PR. I believe in you. You can do it! [image: :+1:]

— Reply to this email directly or view it on GitHub https://github.com/colinta/SublimeStringEncode/issues/18#issuecomment-90976388 .

[colinta]

And there's always https://gratipay.com/colinta/

[Smolations]

Wow. So basically, "If you want it done, do it yourself?" Horrible attitude as a maintainer of a public project. I'll just use the ugly website I referenced above.

[colinta]

If you need it done now, then yes, do it yourself. I'm busy right now. If you are willing to wait till i can tackle it, then awesome. I'm not currently sure when that might be. Sorry!

[Smolations]

Clearly, the website provides a workaround. I posted this issue to say "Hey, this plugin seems aimed at web developers, and front-end devs could really use this feature." Of course I am willing to wait. However, the fact that you have already closed this issue makes it seem that you have no plans to ever "tackle" it.

[jamonholmgren]

You've got to be kidding me, @Smolations. Colin (a good friend of mine) devotes significant amounts of time, for free, building and maintaining many projects that he open sources out of the goodness of his heart.

Here's his public contributions chart:

Here's yours:

Who "doesn't have time" again?!?

[Smolations]

Right, because I obviously don't have a full time job or other obligations besides public contribution, @jamonholmgren. It's cute that you're standing up for your buddy though! :+1:

[jamonholmgren]

Do you think we don't have full time jobs and other obligations?

[colinta]

I implemented the "CSS half" of this feature (99465cf). Here's the diff:

-class HtmlEntitizeCommand(StringEncode):
+class CssEscapeCommand(StringEncode):
     def encode(self, text):
-        text = text.replace('&', '&')
-        for k in html_escape_table:
-            v = html_escape_table[k]
-            text = text.replace(k, v)
         ret = ''
         for i, c in enumerate(text):
             if ord(c) > 127:
-                ret += hex(ord(c)).replace('0x', '&#x') + ';'
+                ret += hex(ord(c)).replace('0x', '\\')
             else:
                 ret += c
         return ret

-class HtmlDeentitizeCommand(StringEncode):
+class CssUnescapeCommand(StringEncode):
     def encode(self, text):
-        for k in html_escape_table:
-            v = html_escape_table[k]
-            text = text.replace(v, k)
-        while re.search('&#[xX][a-fA-F0-9]+;', text):
-            match = re.search('&#[xX]([a-fA-F0-9]+);', text)
+        while re.search(r'\\[a-fA-F0-9]+', text):
+            match = re.search(r'\\([a-fA-F0-9]+)', text)
             text = text.replace(match.group(0), unichr(int('0x' + match.group(1), 16)))
-        text = text.replace('&', '&')
         return text

(I modified the diff to show what the before/after looked like when I modified the HtmlEntitize/Deentitize commands)

Btw, there is another plugin that can help you, too, called SimpleMovements. It's kind of a dumping ground for lots of commands, but this one in particular could be really useful for what you're doing here:

class SimpleMovementSnippetPickerCommand(sublime_plugin.TextCommand):
    def run(self, edit, choices):
        prompts = []
        snippets = []
        for prompt, insert in choices:
            prompts.append(prompt)
            snippets.append(insert)
        self.view.window().show_quick_panel(prompts, self.handler(snippets))

    def handler(self, snippets):
        def _handler(index):
            if index != -1:
                self.view.run_command('insert_snippet', {'contents': snippets[index]})
        return _handler

You'll need to add this to your user key bindings:

 { "keys": ["alt+t"], "command": "simple_movement_snippet_picker",
   "args": { "choices": [
       ["⌘ Command", "⌘"],
       ["⇧ Shift", "⇧"],
       ["⌃ Ctrl", "⌃"],
       ["⌥ Alt", "⌥"]
       // ...
       ["▲ Triangle", "▲"]
   ]}
}

[colinta]

Now let's sum up here, to see what we all learned.

colinta: I’d love to see a PR! :-)

smola: It's not like you're being flooded with requests... I don't really have the time at the moment to submit a PR

colinta: If you want this done the fastest way is to open the .py file and DIY

smola: Horrible attitude as a maintainer of a public project

colinta: If you need it done now, then yes, do it yourself. I'm busy right now. If you are willing to wait till i can tackle it, then awesome. I'm not currently sure when that might be. Sorry

smola: the fact that you have already closed this issue makes it seem that you have no plans to ever "tackle" it

jamon: Colin... devotes significant amounts of time... building and maintaining many projects that he open sources

smola: It's cute that you're standing up for your buddy

I dunno about you, but I learned:

1. It's good to have friends like Jamon to work with on excellent projects like github.com/MotionKit
2. Sometimes it's frustrating to maintain open source projects, because some people expect you to add the features they want, and are appalled when you recommend they try it themselves.

I'm locking this issue. I'm done devoting time and energy to it.