Local JavaScript Scripting with Node.JS

11 03 2013

It’s not much, but it’s my first little scriptlet with Node.JS,

specific purpose is to move files from one directory tree to an empty directory, one at a time, while another script processes each file as it enters the empty directory.

 





Automatically update your php_browscap.ini

19 10 2010

My website uses the PHP function get_browser to see if a client is Javascript enabled. (I use this primarily to see if the visitor is a search engine bot and should see a long list of data or a real person and can handle AJAX-loaded data in tabs – most real people these days are using Javascript-enabled browsers.)

get_browser relies on the php_browscap.ini file, and the problem is that keeping the php_browscap.ini file up-to-date can be a chore, and should certainly be done automatically. (I notice the problem now that I use Chrome, and with every major release, the browscap file has no clue about my new browser, which is silly.)

So I finally sat down and wrote a basic script to fetch the updated file and restart my web server, which I’ll run weekly. This works for my FreeBSD box – change the paths and download command to fit your installation.

/usr/local/bin/wget -Ophp_browscap.ini "http://browsers.garykeith.com/stream.asp?PHP_BrowsCapINI"
mv -f /usr/local/etc/php/php_browscap.ini /usr/local/etc/php/php_browscap.old.ini
mv -f php_browscap.ini /usr/local/etc/php/
/usr/local/etc/rc.d/apache22 restart

I saved to: usr/local/www/mysite.com/get_php_browscap.sh
Then add it to your crontab:

# php_browscap update
5       4       *       *       6       root    /usr/local/www/mysite.com/get_php_browscap.sh >> /var/log/cron.log

I run it Saturday morning.
Any questions?





Scriptaculous Image Hover Effect

16 06 2009

I’ll start with my editorializing; perhaps we (earlier Symfony/RoR users) chose poorly when integrating Prototype and Scriptaculous into the framework. It seems that jQuery is taking over, and a look at some of the Plugins being made for Symfony 1.2 are recognizing this, and moving some of the “Protaculous” functions out of the core and developing for jQuery. A search for specific Scriptaculous snippets provide fewer or no results relative to the same search for a jQuery snippet. Live and Learn.

Anyway, I was hoping to add some animation/effects to my otherwise very static website, and thought a simple hover-popup on the profile images could provide a small yet effective effect to give the site some modern motion. Here’s how I did it with the latest attempt for Scriptaculous Effects.

Based on these functions mentioned in the question here, I created these still simple functions:

var z1=0;
function popIn(ev) {
  item = Event.element(ev);
  if(!item.id)item.id='pop_'+(++z1);
  new Effect.Scale(item, 110, {scaleFromCenter:true,
    duration: .4, queue:{ position: 'end', scope: item.id }});
}

function popOut(ev) {
  item = Event.element(ev);
  new Effect.Scale(item, 91, {scaleFromCenter:true,
    duration: .4, queue:{ position: 'end', scope: item.id }});
}

For some brief explanation, these functions to be called on moveover/out events identify the item, if the item has no id, it creates one for it. The Scale effect "smoothly" zooms the element, and uses a scoped queue so that the zoom out will only be triggered after the zoom in completes, but multiple images can be zooming at once.

The effects can be attached with a call such as:

z=$$('.profile img');
z.each(function(n) {
  n.absolutize();
  n.observe('mouseover', popIn);
  n.observe('mouseout', popOut);
});

[Editor's note: it was brought to my attention that the above call might fail if the images (when attaching to images) were not yet loaded. As such, we should wrap the above call in a

Event.observe(window, 'load', function() {...});

if the images are loaded with the document, or if they're loaded later (e.g. AJAX), deal with both cases, when the images are and are not yet loaded:

z=$$('.profile img');
z.each(function(n) {
  if(n.complete){
    n.absolutize();
    n.observe('mouseover', popIn);
    n.observe('mouseout', popOut);
  }else{
    n.observe('load', function(ev) {
      n=Event.element(ev);n.absolutize();
      n.observe('mouseover', popIn);
      n.observe('mouseout', popOut);
    });
  }
});

]

Use the selector to find the elements to zoom, and attach the event observers to each.
Place this code after the elements are loaded, and BAM, you're good to go. It's nothing too fancy, but it works.

There's a similar effect with jQuery found here which uses more CSS and seems prettier. I'm open to improvements to this snippet.

As an aside, the only decent site I've found with a few custom-made snippets is the Script.aculo.us Samplr (see the sidebar, not the main area). If only there were more of these, Scriptaculous might have a chance for survival.





jQuery LTR/RTL News Ticker

25 03 2009

I’ve modified the wonderfully simple jQuery News Ticker, originally published here: http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html

The ticker now allows for another parameter, rtl: true, to allow for Right-to-Left scrolling for applicable fonts (such as Hebrew).

Download

Some of the original css syntax has been modified for stylistic reasons.

Usage: as original, or optional rtl parameter, such as

$(function(){
$("ul#ticker02").liScroll({travelocity: 0.05, rtl: true});
});





Unresolved: Position:absolute, MouseOut/Leave and Internet Explorer

19 02 2009

In a nutshell, my unresolved issue goes like this:

I’m trying to detect when the mouse leaves a region which is displayed on an absolute position on the page. The only problem is that IE keeps reporting that the mouse has entered the element underneath the position:absolute element, correctly firing the MouseOut event (also the MouseLeave event which I *really* want to use anyway).

For now, I’ve put in an acceptable work-around, placing an X to click, and capturing clicks on the document, so that the element disappears onclick on the X or elsewhere on the page.

P.S. the Prototype function spoofing IE’s MouseEnter and MouseLeave, located here worked very nicely. But IE’s native events seem to have problems!








Follow

Get every new post delivered to your Inbox.

Join 261 other followers