Additional parsing support (eg. emoticons)

[krittick]

When I was hacking on the original qwebirc, I added a parser I found in a random comment from its issues page, which converted smiley codes to their corresponding tags. This was basically a setInterval with a bunch of regex and replacing, but it worked without any noticeable lag.

Is there an event that can be caught when a new chat line is inserted to the channel? I suppose I could just do another setInterval when the DOM's ready, but if there's an existing event I can hook into, that would be ideal for replicating the parser. The method used to generate the mouseover images might even be suited for this.

Would also be happy to submit a pull request once I get it working. :)

[krittick]

This also could probably fall under #47

[megawac]

Yeah, it lumps under #47. All you'd need to do is add a pattern to qwebirc.util.urlifier which I use to hyperlink links and channels -- you could add a pattern for favicons or whatver. Let me know if you hit trouble

If you get it working send a pull to the /plugins directory :)

[krittick]

If I have 500+ images and associated smiley codes in two objects/arrays, is there a way to add a pattern for each one in a loop without needing to add 500+ manual patterns? It's acting as if any matched pattern was matched to the last item in the array, not the one that was detected. This is what I have this so far with using objects, but only the last pattern is working. Adding them both manually instead of the loop works fine.

I might be missing something obvious as my javascript is admittedly intermediate but hopefully it's not something too simple.

var patterns = {
e01 : /:\(/gmi,,
e02 : /:\)/gmi
};

var emoticons = {
e01:'<img alt="" title=":\\(" src="https://example.com/img/emots/frown.gif" />',
e02:'<img alt="" title=":\\)" src="https://example.com/img/emots/smile.gif" />'
};

for(var key in patterns) {
        if(!patterns.hasOwnProperty(key)) {
            continue;
        }
        urlifier.addPattern(patterns[key], function(word) {
            var parsedword = this.parsePunctuation(word);
            var fullword = parsedword.mid + parsedword.end;
            return fullword.replace(fullword, emoticons[key]);
        });
    }

[krittick]

Also, thanks for the lead on that file. This was encouraging, haha:

//welcome to my dirty code corner.

[megawac]

Well if you can figure out a regexp or several regexs that encompass all your emojis you can do something like the untested code below

var emojiTemplate = _.tempalte("<img alt='' title='<%= emoji %>' src='https://example.com/img/emots/<%= type %>.gif' />");
var emoticons = {
    ":)": "smile",
    ":(": "frown",
    "=)": "smile",
    "=D": "happy"
};

qwebirc.util.addPattern(/^[:=]/, function(word) {
    if (_.has(emoticons, word)) {
        return emojiTemplate({
            emoji: word,
            type: emoticons[word];
        });
    }
    return word;
});

---

that file used to be even worse xD still better than what it used to be

[krittick]

Regex, my worst enemy.

I'll look that over and play around with the code some more and see what I can come up with. Just getting one image to parse has been encouraging at least. :)

[megawac]

Cool cool. If you'd prefer to write a function to match emoji's you can fudge it like {test: function(word) {return true}}

[krittick]

Writing tests, my other enemy. Good to know, thanks again.

[krittick]

var emoticonTemplate = _.template("<img alt='' title='<%= emoticon %>' src='https://example.com/img/emots/<%= type %>' />");
var emoticons = {
    ":)": "smile.gif",
    ":(": "frown.gif" // and so forth
};

qwebirc.util.urlifier.addPattern(/^[:=]/, function (word) { 
    if (_.has(emoticons, word)) {
        return emoticonTemplate({
            emoticon: word,
            type: emoticons[word]
        });
    }
    return word;
});

Gonna work on it some more, maybe even learn some regex to handle the random mix of .png/jpg/gif files in our collection. Look for a pull soon. 👍

[krittick]

Resorted to manually adding each filename (lots of find+replace regex) to the emoticons object and it works amazingly well for our site. Needs a little polish to finish the regex for those that use more standardized filenames, but it's quite close to "done." 😁

[krittick]

Somewhat related:

I really like the autocomplete history feature, but was wondering if there's a way to pre-fill commands? The use case is that we have a bot and would like its common commands to auto-complete right away for users, even if they've never used the commands before.

[krittick]

For the emoticon plugin itself, it's nearly flawless after a few days of running it. The only bug I've noticed so far is that sometimes codes aren't parsed if they're inside text that has been made bold or mircColor'd.

Which is probably something related to regex. 😢

[megawac]

Maybe, not a case I'd expect to be an issue or at least not a difficult
one. Send a PR when you're ready and I'll take a look
On Aug 31, 2014 5:22 PM, "krittick" notifications@github.com wrote:

For the emoticon plugin itself, it's nearly flawless after a few days of
running it. The only bug I've noticed so far is that sometimes codes aren't
parsed if they're inside text that has been made bold or mircColor'd.

Which is probably something related to regex. [image: 😢]

—
Reply to this email directly or view it on GitHub
#60 (comment)
.

[megawac]

Can you create an issue for the auto complete part. I think it may be
possible right now to do easily... I'll pet you know when I set my computer
up
On Aug 31, 2014 5:21 PM, "krittick" notifications@github.com wrote:

Somewhat related:

I really like the autocomplete history feature, but was wondering if
there's a way to pre-fill commands? The use case is that we have a bot and
would like its common commands to auto-complete right away for users, even
if they've never used the commands before.

—
Reply to this email directly or view it on GitHub
#60 (comment)
.