Exporting the calendar to Outlook

Posted July 3rd, 2008 by Danny

I just got a Windows Mobile smartphone to replace my Palm TX (screen digitizer died). It’s an ugly, kludgy and slow operating system (even after upgrading to WM 6). There’s nothing as elegant as Luach that integrates Jewish calendar data in the datebook. There’s a Jewish Calendar that’s nice, but I ended up writing my own program that generates a CSV file with Hebrew dates etc. It allows you to import candlelighting times, calendar info, and even all the Young Israel events into Outlook. It’s at
http://youngisrael-stl.org/articles/exportCalendarFull.php

Next up for that program: Cardinals, Rams and Blues schedules!

The new Young Israel site

Posted December 8th, 2007 by admin

It’s finally live: the redesigned Young Israel site. So far, the feedback has been all positive, and I figured I’d have more free time once it was done. But nooooooo: I’m going to have to reorganize the shiur archives; with Rabbi Shulman adding 2+ a week, it’s going to add up fast. I like the idea of organizing with tags, but right now the search is with regular expressions. Expressing ‘or’ is easy: tanach|kohelet. But is there a way to do ‘and’ with RE’s? Something like tanach&audio ? I don’t think so. So it’s back to the drawing board.

Maintaining this site, in pictures

Posted November 6th, 2007 by Danny

’nuff said.

http://irregularwebcomic.net/1736.html

Keepaway, a silly jQuery plugin

Posted October 28th, 2007 by Danny

My brother sent me a “salary survey” with one question, “Are you happy with your current salary,” where the “No” button ran away from the mouse. I thought it might be useful for gag sites, so I created a jquery plugin that mimics that effect, at http://youngisrael-stl.org/wordpress/blogfiles/keepaway.html.

It’s easy enough to use, just $(selector).keepaway(options) ,with options of

  • jump: the distance to jump away from the mouse, in pixels; default 500
  • speed: the speed to move (passed intact to the animate plugin); default ‘fast’
  • home: time to return to the starting position if nothing happens, in ms; default 1000

Have fun!

CSS parser in Javascript

Posted October 19th, 2007 by Danny

I had an idea to write a CSS parser to allow custom jQuery attributes, since a lot of the jQuery I use is more presentation than behavior, and the redesign of the YI website allows for switching stylesheets, which may require different plugins to be applied. My idea would be to allow something like:

div {
-jquery-round: 5;
-jquery-gradient: {from: '#008800', to: '#000088'}
}

But I never did anything about until Andy Kent developed JSS which does something similar for CSS selectors that a browser can’t handle but that jQuery can. His code also includes a cache for selectors that implements partial selector caching (thus div span img would also search the cache for div and div span as well). I emailed him back and forth a few times, and made some suggestions; my best css parser and selector cache are available here (look at the code and use Firebug to look at the console). I still haven’t got the custom jQuery stuff together yet, but the pieces may be useful right now.

Ajax, Style elements and Safari

Posted October 2nd, 2007 by Danny

As I mentioned before, I don’t have access to a modern version of Safari and when I pass an Apple store, I try to play with it and the site. Something always pops up to bite me.
This time it was an improved version of my Hebrew keyboard, that I made into a popup, absolutely-positioned <div> instead of a separate page, using sprites for the keyboard button rollovers. Nice and elegant, but it means loading the <style> element with all those a:hover {background: 0 -150px}’s via Ajax as well. Just putting a <style> element in the loaded <div> worked fine in IE and Firefox, but today Safari wouldn’t show any styles. Turns out Safari is technically right; <style>’s go in the <head>, not the middle of the <body>. That’s a rule that doesn’t make any sense, any more than requiring <script> elements to be limited to the <head> would. But such are the rules.

I looked up a few ways to include a <style> element, but realized there’s an easier way; I split the style into its own stylesheet and added a line to Javascript:
$('head').append('<link type="text/css" href="/css/kb.css" rel="stylesheet" >');
before the
$('<div id="keyboard-holder">').insertAfter('#q').load('/inc/keyboard.html'); // load via Ajax
and now the style loads dynamically and easily.
Luckily, jQuery handles identifying and executing <script> elements in Ajax’ed code, so I don’t have to pull that out.

Redesign meeting

Posted August 15th, 2007 by Danny

Just completed a long meeting about the website, which will be undergoing a major redesign, hopefully before the yomim tovim. The Lubchansky’s think we should roll it out all at once, completed, rather than redesign and then recompose, to maximize the impact. So the site will stay as it is. Watch this space for more info!

Redesign!

Posted August 9th, 2007 by Danny

I can’t claim any talent at design; I just used the old design when I made the YI website. I have help now! A few people who want to remain nameless are helping remake the site into something both more modern-looking and more streamlined, easier to use. As Cameron Moll said, Good Designers Redesign, Great Designers Realign and I certainly think we need a complete realignment, to put the important stuff on the home page and other things back behind (we don’t need a list of officers on the front page, and the map, while incredibly cool, slows the initial load time immensely).
The plan now is to make it more Wordpress-y (fixed width, site navigation across the top), based on a design by Jenna Smith.

The photo cross-fader

Posted July 19th, 2007 by Danny

I just uploaded the pictures for the annual dinner. Rabbi Shulman is a brilliant and inspiring speaker (confirming my first impressions when he came here). He discussed how a navi (prophet) always spoke in his unique voice yet never added to the unchanging truth of the Torah, and that is the same way we all must look at Judaism, and he tied it in with the dinner theme of Honoring our Past, Building our Future. I’m looking forward to hearing him weekly.
The photo page on the website is one that I’m particularly proud of. The cross-fading code is based on Image Cross Fade Redux and jQuery slideshow (whose website seems to have disappeared) with some enhancements. The whole thing is 39 lines long (jQuery rocks!).
The markup is simple: a div with contained images, which I get from Flickr and are wrapped in an </A> element to the original image:
<div class="make_fader">
  <a href="image link 1"><img src="image file 1/></a>
  <a href="image link 2"><img src="image file 2/></a>
  <a href="image link 3"><img src="image file 3/></a>
  <a href="image link 4"><img src="image file 4/></a>
</div>

That’s as unobtrusive as it can get!
The CSS uses absolute positioning to stack all the images on top of one another:
div.make_fader {
  position:relative;
  height: 5em;
}
div.make_fader img {
  position:absolute;
  height: 5em;
}

So without javascript it only shows the last picture; the rest are hidden behind. If you want to show them all with scripting off, don’t make the images position: absolute in the CSS; do it in the script as:
$('make_fader img').css('position', 'absolute');
The container needs the height set; if all its contents are position: absolute it would otherwise shrink to nothing.
The only actual code you need after including the cross fader code is
$('.make_fader').xfade();
and it starts fading!
Options are, as usual for jQuery plugins, in the form of an object as the first argument:
$('.make_fader').xfade({pause: 100, random: 4000, fadeIn: true});
Options include:

  • pause: {Number} minimum number of ms to show the picture. Default: 1000.
  • random: {Number} 0 to this number will randomly be added to pause. Default 0. This keeps all the faders on a page from fading at the same time.
  • fadeTime: {Number} ms for the fade effect. Default: 2000.
  • fadeIn: {Boolean} true to have the images start invisible and fade in. Default: false;

The random is very useful because with multiple faders on one page, having them all fade in and out at the same time looks bad. fadeIn makes the images fade into view rather than starting out visible.
The plugin creates an object that is attached to the div that can be used to control the fading.
var xfader = $('.make_fader')[0].xfade;
xfader.stop(); // stop fading. The current image will fade in completely before the fading stops
xfade.start(); // restart fading
xfade.isStopped(); // returns true if the fader is stopped

Enjoy!

Updated: I forgot the ‘.’ before the class name in the code to start fading (was $('make-fader') , should have been $('.make-fader') ). Apologies to all who tried to make it work!

Google maps mapping tool

Posted May 1st, 2007 by Danny

To make the eruv map, someone had to enter all the individual points of the eruv boundary. That someone was Mickey Ariel (thanks!). To make it possible, I wrote a simple web application that contains a Google map and placs a marker at every mouse click. Each marker has a number, and the list of each marker’s latitude and longitude is inserted at the end of the page. The markers can be dragged to new locations, and the boundary is drawn between the markers. Clicking a marker brings up a small callout window where notes can be added, the marker can be deleted and it can be renumbered (to move a marker between markers 4 and 5, change its number to 4.5. When you hit Update, the list will be renumbered appropriately.
The tool can be used anytime you need the latitude/longitude for any route. Enjoy!