Hacking at 0300

Update: I no longer (2012-08-05) use Chili, so this bug isn't relevant

Update: I haven't figured it out, but I did get a workaround. The bug is that any unmatched end of text leads to deleted characters in the middle of the text, so I added a line $.chili.recipes[recipeName]._main.endoftext = {_match: /$/}; to the downloadRecipe method, and now the bug doesn't show up.

I'm running Firefox 7.0.1 and I'm coming across a very strange bug in my syntax highlighter, chili. It doesn't show up with any other browser (and I can't try older Firefox versions, with the auto-updating). I'm still working out the details, but it's erasing all the code from a string to 2 characters from the end. Thus:

$('foo').show();

becomes

$('foo').show();

If you don't see a problem, great. If you do, switch to a different browser. Or figure out what's going on and let me know. Continue reading ‘Weird bug with chili and Firefox’ »

For those following flexcal, my jQuery UI date picker, I've just released version 1.3. It fixes a bug in the setDate routine that would cause it to fail if called before the calendar was shown, and added date filtering. See the original post (now updated) for details.

For those following this, I corrected some typos (חשון spelled wrong; numbers should not use the סופית form) in the Hebrew calendar. flexcal now stands at version 1.2

I'm trying to test textpopup but (at least with jQuery 1.6.1 in Firefox), $.get with a local file fetches an XML document, not the text, unless I explicitly use the dataType parameter to set it to 'html'. Which I have now done. A small change, but it took me an hour to track it down.

Plus, a small bug fix that was bothering me: clicking outside the textbox hides it but that was failing if I clicked in another textbox trigger. That is now fixed; I had been too aggressive with stopPropagation.

I've been trying on and off to get my head around continuations in Scheme, which is the language that gnucash uses for reports. It's one of the modern versions of Lisp. And then I came across a throwaway line in the YQL documentation about JSONP with a callback is a also called continuation-passing style. A little Googling finds this fascinating lecture by Douglas Crockford, a short summary by John Lam that makes it clear that the continuation idea is obvious to anyone who's done any asynchronous Javascript like AJAX, and a more intellectual discussion by Matt Might that goes through the Lisp side.

Now that it turns out that I already understand continuations, I'll have to go back and prove that to myself. And yes, Javascript is Lisp in C's clothing.

Well, jQuery 1.5 is out and there's yet another incompatibility: they changed the way attribute selectors work. You used to be able to use them without quotes, as [attr=value] but that now throws an exception. Now you have to use [attr="value"]. Not sure why they changed it; The CSS level 3 definition is ambiguous about when you need quotes, and it may be that jQuery is OK with leaving the quotes off for simple (letters/numbers) values. I don't have time to experiment; I just changed things to use the quotes. It affects parsecss and flexcal; I haven't found any other places I used this.

Now that sendkeys is fixed to work with contenteditable and I've analyzed Lebedev's VirtualKeyboard to allow typing on the physical keyboard, updating the hebrewKeyboard plugin was straightforward. I had to learn a fair amount about the difference between keyup, keydown, and keypress events, but I think everything works. Check it out!

Update: I no longer (2012-08-05) use Chili, I've switched to Prism.

I wanted to try different syntax highlighters so I wrote a little WordPress plugin that let me switch between different highlighters (email me if you would like that code). I wanted syntax highlighters that were javascript-based (ruling out GeSHi), and that allowed me to highlight inline code elements as well as code elements within block-level pre elements, using the HTML5 <code class="language-whatever"> notation for determining language. I also wanted something that didn't do any fancy javascript or Flash for selection and copying, and either supported Lisp and Basic or was easy enough to extend.

Everyone seems to use Alex Gorbatchev's syntaxhighlighter but it uses nonstandard name attributes and only works on pre and textarea elements, so I haven't tried that. I tried Benjamin Lupton's jQuery syntaxhighlighter based on Google's prettify. It insisted on making all elements display: block but a little CSS manipulation fixed that.

Then I tried snippet, which only works on pre elements but was easily modifiable to get around that, then also needed some stylesheet changes to keep the results from being display: block. Adding new languages however looks far too complicated; it uses shjs which uses language definitions from GNU Source-highlight, which is a whole different language.

jush does things right (working on code elements and not forcing them to be block) but it's hardwired for a limited number of languages and the CSS is pretty ugly. That could be fixed, though, and it does a cool trick of turning keywords into links to the documentation. Too limited a language selection, though, but it would be a nice base for working on.

In the end, I'm going to stick with chili. It's simple enough for me to modify to suit my needs, it's easy to add new languages and it works. Creating new "themes" is impossible; the styles are hard-coded into the javascript files, but I can live with that. I may sometime write my own highlighter, but for now, I'll stick with what works.

The $.fn.sendkeys Plugin

This is now obsolete. sendkeys is at version 4, and is documented at "Rethinking $.fn.sendkeys".

I wanted to make a general-purpose onscreen keypad, and wasted a huge amount of time trying to find a way to simulate a keypress. $(element).trigger("keypress",...) won't work. Neither will keyup or keydown. For security reasons, I guess, you can't tell an element to pretend a key was pressed. The browser is too worried that you will access menus or something.

So I wrote my own plugin and named it after Microsoft's sendkeys which does similar things. For any editable element elem, $(elem).sendkeys(string) inserts string at the insertion point or selection. It's the insertion point sensitivity that makes it more sophisticated than elem.value += string.

It depends on my bililiteRange routines to manage the selections in a cross-browser way.

Downloads

See $.fn.sendkeys on github.

See bililiteRange on github.

See the demo.

Continue reading ‘Improved sendkeys’ »

Updated to version 2.3 on 2014-02-26 for data routines.

I was trying to update my sendkeys plugin to use contentEditable, and realized that it was getting harder and harder to do without some selection/text replacement library. Each browser is different and even different elements are treated differently. There are a few libraries out there, but none handled both input and textarea elements and regular elements, and would constrain the selections to a given element (critical if I want to edit only part of a document) and none made it easy to simulate arrow keys, moving the selection left or right. So I figured I would make my own.

See the code on Github.

See the demo (try it in different browsers!).

Continue reading ‘Cross-Browser Text Ranges and Selections’ »