Resizable HTML Table Columns Using jQuery UI

I went round and round this afternoon trying to find something to resize my table columns. It seemed like it should be easy but unfortunately it was not. All of the plug-ins I found seemed promising until I actually tried to implement them in my code. I finally realized that most of them worked...as long as my table was smaller than my viewport. I had tried to use the jQuery UI resizable function but to no avail. Finally, I figured out a way to do it.

The trick was to add a blank div within my <th> tag. Then upon resizing the column header, it would actually resize the div within.

Here's the code on Codepen.

Edit: I'm positive this code could be refactored to look/work better. This is just my first go at it.

Date Arithmetic

I am working this weekend on a major data migration. I have several millions records to manipulate, store, and index. I needed a way to calculate how long the process was going to take. Once I had it in hours, I still needed an easy way to figure out the end time. Instead of trying to do the math in my head, I figured there had to be a site that would calculate that for me. Sure enough there is and it's nicely done. Here's a link: http://www.timeanddate.com/date/timeadd.html.

Making Lists into To-Do Lists with jQuery

I have a folder containing several procedures that are in written with HTML lists. I wanted a way to quickly modify them so that I could check off each line item as I went through the procedure. And as I checked off the line items, I wanted it to strike through the text to make it clearer that that step had been done.

The first thing I did was define a CSS class:

.strikethrough {
    text-decoration: line-through;
}

Then I added this JavaScript to my header file:

function strikethrough(element) {
    var $checkbox = $(element);
    if ($checkbox.prop("checked")) {
        $checkbox.parent().addClass("strikethrough");
    }
    else {
       $checkbox.parent().removeClass("strikethrough");
    }
}
$(function() {
    var checkboxCode = "<input type='checkbox' onclick='strikethrough(this)' style='margin-right: 10px' title='Mark this item done' />";
    $("li").each(function() {
        $(this).html(checkboxCode + $(this).html());
    });
});

Here is a demo on CodePen along with the source.

A Better Geolocation Prompt

Derek Featherstone makes a good point: The current implementation of the geolocation prompt on most browsers does not give enough information. Wouldn't it be nice if we could provide more information to the user as to why we need this information from them? I would love to see something in JavaScript like this:

if (navigator.geolocation) {
    var geolocationApproved = 
      navigator.geolocation.prompt("This information will be used to provide you with directions to xyz.");
}

would produce something like this:

Show "loading" icon for long running AJAX calls only.

If an AJAX call is slow, then I want to present a "loading" overlay to let the user know the process is still working. However, on short calls, it is distracting to the user to flash the "loading" overlay and then immediately remove it. This code allows me to specify a time (in milliseconds) for how long to wait before showing the spinning wheel.
http://codepen.io/clarmond/pen/mvalt

Oracle Equivalent of MySQL's LIMIT (Or how to page results in Oracle)

I'm really just posting this for my own benefit but if you're reading this and it has been helpful, drop me a comment to let me know.

SELECT
  *
FROM (
  SELECT 
    a.*,
    ROW_NUMBER() OVER (ORDER BY column_to_sort) rn
  FROM
    my_table a
  WHERE
    my_column_to_filter = 'my_value_to_filter'
 )
WHERE
  rn >= my_starting_row AND rn <= my_ending_row

Evaluating Backreferences in Oracle REGEXP_REPLACE

Here's the problem. I want to use Oracle's REGEXP_REPLACE function to replace a string of digits with a zero-padded string. In Perl I would do it like this:

#--- Change xyz123 to xyz000123
my $string = "xyz123";
$string =~ s/(\d+)$/sprintf("%06d", $1)/e;

So here is what I started with in Oracle PL/SQL:

my_string := 'xyz123'
regexp_replace(my_string, '(\d+)$', lpad('\1', 6, 0));

And what I got was xyz0000123. What I discovered was that the LPAD function was being evaluated before the backreference (\1) was. So no matter what I did, the LPAD function always saw the string to be padded as 2 characters long.

So to get around this, I wrote another function called evalpad. With this, I do the replacement in 2 steps. The first is to replace the string with an embedded pad psuedo-function. Then I call a second function to do the actual replacement. Here's the code:

create or replace function evalpad (
  strIn in varchar
)
return
  varchar
as
  retval varchar(255);
  arg1 varchar(50);
  arg2 varchar(50);
  padded_number varchar(100);
begin
  retval := strIn;
  while (regexp_instr(retval, 'pad\((\d+)') > 0) loop
    arg1 := regexp_substr(retval, 'pad\((\d+)');
    arg1 := regexp_replace(arg1, 'pad\(', '');
    arg2 := regexp_substr(retval, 'pad\((\d+),\s*(\d+)');
    arg2 := regexp_replace(arg2, 'pad\((\d+),\s*', '');
    padded_number := lpad(arg1, arg2, 0);
    retval := regexp_replace(retval, 'pad\((\d+),\s*(\d+)\)', padded_number, 1, 1);
  end loop;
  return retval;
end;

Then in my original function I do this:

my_string := 'xyz123'
regexp_replace(my_string, '(\d+)$', 'pad(\1, 6)');
my_string := evalpad(my_string);