JavaScript
March 16, 2012
Fixing the scrollbar issue in GoogleMaps InfoWindow
<script type="text/javascript"> var contentString = '<div style="max-width: 200px; overflow: hidden; display: none;" id="noscroll"><h4>The Business School</h4>29 Buccleuch Place, EH8 9JS</div>'; jQuery(document).ready(function(){ var latlong = new google.maps.LatLng(55.942802, -3.186896); var opts = { zoom: 15, center: new google.maps.LatLng(55.945000, -3.186896), mapTypeControl: false, disableDefaultUI: false, mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true }; var map = new google.maps.Map(document.getElementById("map"), opts); var infowindow = new google.maps.InfoWindow({ content: contentString, maxWidth: 100 }); var marker = new google.maps.Marker({ position: new google.maps.LatLng(55.942802, -3.186896), map: map, title: "Business School" }); infowindow.open(map, marker); }); </script>
The function call infowindow.open(map, marker) sets up your bubble content in two nested DIVs with overflow: auto styling set. This needs to be undone once the bubble is created. Hence the 2 second wait.
<script type="text/javascript">
var ns;
var flag = 0;
function fix_it(lag){
setTimeout(function(){
try{
ns = document.getElementById('noscroll');
var pops = ns.parentNode;
var gramps = pops.parentNode;
gramps.style.overflow = 'hidden';
pops.style.overflow = 'hidden';
ns.style.overflow = 'hidden';
ns.style.display = 'block';
}
catch(e){ if(flag == 0){ flag = 1; fix_it(2000); } }
}, lag);
}
jQuery(document).ready(function(){
fix_it(2000);
});
</script>
Posted by pj at 10:42 PM | Comments (0)
November 05, 2011
Spine JS Framework
Posted by pj at 05:40 PM | Comments (0)
October 30, 2011
Detect an iPad and provide a non-Flash alternative
try{ ["iPad","iPod","iPhone"].each(
function(i){
if(navigator.userAgent.indexOf(i) > -1){
//Do iPad stuff here
}
}); } catch(e){ var meh = 'meh'; }
Posted by pj at 08:40 PM | Comments (0)
July 25, 2011
Link bare URLs in a HTML element
function link_em(da_id){
try{ var tml = document.getElementById(da_id).innerHTML; } catch(e){ return false; }
var reg = /[^href\=\"](http|https):\/\/([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?\/?/gm;
var list = [];
list = tml.match(reg);
var count = 0;
for(i in list){
if(list[i]){ if(list[i] != document.getElementById(da_id).innerHTML){ if( parseInt(list[i]) + '' != list[i]){
count++;
tml = tml.replace(list[i].replace(/\(/,''), '<a href="' + list[i].replace(/\(/,'') + '">' + list[i].replace(/\(/,'') + '</a>');
}}}
}
try{ if(list[0]){
document.getElementById(da_id).innerHTML = tml;
} } catch(e){ var blah = ''; }
}
Posted by pj at 04:38 PM | Comments (0)
July 12, 2011
Online IDE for Node.js
Interwebs IDE hits the mother Node • The Register
Posted by pj at 06:20 PM | Comments (0)
June 13, 2011
Detect curly quotes with JavaScript
function check_quotes(){
var s = '';
var regex = /\W/g;
var m = null;
var text = null;
var code = null;
['asset_name','body','summary'].each(function(da_id){
text = document.getElementById(da_id).value;
m = regex.exec(text);
if(da_id == 'asset_name'){ da_id = 'title'; }
var count = 0;
while(m){
code = m[0].charCodeAt(0);
if(code > 8200){
s = s + "\n<li> Found " + m + " in " + da_id.split('_').join(' ') + " text</li>";
count++;
}
count++;
m = regex.exec(text);
}
});
if(s != ''){ poppy('Illegal characters found in your title or description:<br/><br/><ul>' + s + '</ul><br/>Delete and then re-type quotes and long dashes in the editor above before proceeding. Please try and avoid cutting and pasting from Word.'); return true; }
return false;
}
Posted by pj at 04:23 PM | Comments (0)
March 30, 2011
Doing foreach iteration in JavaScript
['email','first_name','last_name','photo_url'].each(function(i){ //Or forEach
if(document.getElementById(i)){
$jq('#' +i).attr({ 'readonly' : '' });
$jq('#' + i).removeClass('readonly');
}
});
Posted by pj at 03:31 PM | Comments (0)
Javascript array iteration
How many ways can you iterate over an array in JavaScript?Posted by pj at 01:30 PM | Comments (0)
March 01, 2011
Node.js
Node.js community wiki - GitHub
Also:
http://www.nakedjavascript.com/going-evented-with-nodejs
Posted by pj at 10:37 PM | Comments (0)
October 18, 2010
Checking PHP form array has a value
function valet(els){
if(validate(els)){
var checks = document.getElementsByName('category[]');
for (i = 0; i < checks.length; i++){
if(checks[i].checked == true){ return true; }
}
poppy('You need to choose at least one Region or Sector.'); return false;
}
return false;
}
Posted by pj at 01:11 PM | Comments (0)
May 13, 2010
jQuery Gallery with Flikr hooks
Galleria — A JavaScript gallery for the Fastidious
Posted by pj at 03:35 PM | Comments (0)
February 18, 2010
JS to make one button the same size as another
var padme = $('m_butt').offsetWidth - $('sum_butt').offsetWidth;
// The 3 is the padding applied to the first element,
// which needs to be added to the difference
$('sum_butt').style.paddingRight = (padme + 3) + 'px';
Posted by pj at 09:45 AM | Comments (0)
November 13, 2009
Really fast Ajax
Ajax/load - jQuery JavaScript Library
Posted by pj at 04:24 PM | Comments (0)
October 26, 2009
Thickbox and Prototype
getting thickbox, jquery, and prototype to play together nicely | disjoint thoughts
Posted by pj at 11:22 AM | Comments (0)
October 15, 2009
Prototype-based Carousel
Posted by pj at 11:46 AM | Comments (0)
August 06, 2009
Ajax URL Checker
The JS goes like this:
function check_url(me_url){
$('url_message').innerHTML = '';
var url_match = /https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?/;
if(url_match.test(me_url)){ poppy('URL is well-formed.'); $('url_warning').style.display = "none"; }
else{ poppy('The URL entered appears to be invalid. Please ensure it begins with http:// or https://!'); $('url_warning').style.display = 'block'; return false; }
$('url_message').style.display = 'inline';
$('url_message').innerHTML = ' <strong style="text-decoration: blink;">Checking Link..</strong>';
var da_url = 'check_url.php';
var params = '?url=' + me_url;
var myAjax = new Ajax.Request(
da_url,
{
method: 'get',
parameters: params,
onComplete: success
});
function success(this_request){
try{
var reply = this_request.responseText.evalJSON(true);
if(reply['status_code']){
if( reply['status_code'] < 400){ $('url_message').innerHTML = ' <strong style="color: green">Link OK: Code ' + reply['status_code']+ '</strong>'; }
else{ $('url_message').innerHTML = ' <strong style="color: red">Broken: Code ' + reply['status_code'] + '</strong>'; }
} else { $('url_message').innerHTML = ' <strong style="color: red">No Such Site.</strong>'; }
} catch(e){ blah = ''; }
}
}
The PHP goes like this:
<?
require_once "HTTP/Request.php";
$req =& new HTTP_Request($_REQUEST['url']);
$response = $req->sendRequest();
header('Status:'.$req->getResponseCode());
print json_encode(array("status_code" => $req->getResponseCode()));
?>
Posted by pj at 01:15 PM | Comments (0)
July 15, 2009
jQuery powered inline HTML editing
WYSIWYG Inline Edit with Jeditable
Posted by pj at 09:54 AM | Comments (0)
July 13, 2009
jQuery sprintf and editable areas
Posted by pj at 07:37 PM | Comments (0)
May 29, 2009
Getting GET parameters with JavaScript and setting them in a cookie
var queryString = window.top.location.search.substring(1);
function getParameter ( queryString, parameterName ) {
// Add "=" to the parameter name (i.e. parameterName=value)
var parameterName = parameterName + "=";
if ( queryString.length > 0 ) {
// Find the beginning of the string
begin = queryString.indexOf ( parameterName );
// If the parameter name is not found, skip it, otherwise return the value
if ( begin != -1 ) {
// Add the length (integer) to the beginning
begin += parameterName.length;
// Multiple parameters are separated by the "&" sign
end = queryString.indexOf ( "&" , begin );
if ( end == -1 ) {
end = queryString.length
}
// Return the string
return unescape ( queryString.substring ( begin, end ) );
}
// Return "null" if no parameter has been found
return false;
}
}
function get_start_date(queryString){
var start_date = getParameter(queryString, 'SQ_CALENDAR_DATE')
if(start_date){ return start_date; }
return false;
}
function get_view(queryString){
var view = getParameter(queryString, 'SQ_CALENDAR_VIEW')
if(view){ return view; }
return false;
}
function create_cookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function read_cookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0){
//alert(c.substring(nameEQ.length,c.length));
return c.substring(nameEQ.length,c.length);
}
}
return false;
}
//If we don't have a start date in the URL, try getting the cookie and if we have one redirect back to ourselves including the start_date in the URL
if(get_start_date(queryString) == false){
var bicky = read_cookie('start_date');
if(bicky != false){ document.location.href = document.location.href + '?SQ_CALENDAR_DATE=' + bicky; }
}
//Otherwise we have a start date in the URL query so grab it and slot it into a cookie
else{ create_cookie('start_date', get_start_date(queryString), 1); }
//If we have called a day view then redirect us to the day view asset
if(get_view(queryString) == 'day'){ document.location = 'day'; }
if(get_view(queryString) == 'week'){ document.location = 'week'; }
if(get_view(queryString) == 'month'){ document.location = 'month'; }
//alert(read_cookie('start_date'));
Posted by pj at 09:54 PM | Comments (0)
Get query string with JS
Using JavaScript to get the Query_String from a frameset (Page 2)
Posted by pj at 12:47 PM | Comments (0)
November 19, 2008
Getting highlighted text with Javascript
CodeToad - Javascript Get Selected Text.
Sometimes you want to know what
Posted by pj at 11:12 AM | Comments (0)
May 19, 2008
Using Range to get selected text in JS
Posted by pj at 01:04 PM | Comments (0)
December 13, 2007
JS URI parser
parseUri: Split URLs in JavaScript
Posted by pj at 12:34 PM | Comments (0)
October 04, 2007
JS for iterating through all document elements
JS to select the options in all the select-one document elements where the text (as opposed to the value) == the value passed:
function select_option_by_text(my_text){
var els = document.getElementsByTagName('*');
//var regex = new RegExp(my_text + '.');
for(var i = 0; i < els.length; i++){
if(els[i].type == 'select-one'){
var opts = els[i].options;
for(var o = 0; o < opts.length; o++){
var label = opts[o].text;
if(label == my_text){ opts[o].selected = true; }
}
}
}
}
Posted by pj at 09:51 AM | Comments (0)
March 22, 2007
Image crop and resize
Crop & Resize with JavaScript, PHP, and ImageMagick - Monday By Noon
Posted by pj at 06:41 PM | Comments (0)
December 14, 2006
Web App framework using XML and JS compiled into Flash
XML.com: Introducing OpenLaszlo
Posted by pj at 10:33 PM
November 07, 2006
Getting the checked radio button when there's only one
If I only have one radio button, JS decides it ain't a list and won't give you a length for it, so you have to trap for this:
limit = document.forms[1].customer_id.length;
if(limit){ for(i = 0; i < limit; i++){
if(document.forms[1].customer_id[i].checked == true){
this_id = document.forms[1].customer_id[i].value; }
}
}
else { this_id = document.forms[1].customer_id.value; }
window.opener.document.location='index.php?customer_id=' + this_id;
window.close();
Posted by pj at 04:01 PM
May 04, 2006
QuirksMode Javascript Tutorials
Posted by pj at 12:24 PM | Comments (0)
How to do hashes properly in JavaScript
JavaScript - Objects as associative arrays : http://www.quirksmode.org/js/associative.html
Posted by pj at 12:16 PM | Comments (0)
March 30, 2006
Handling cookies in JavaScript
Posted by pj at 10:02 AM
March 09, 2006
JavaScript code for base64 encoding and decoding mailto URLs
//First things first, set up our array that we are going to use.
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZ" + //all caps
"abcdefghijklmnopqrstuvwxyz" + //all lowercase
"0123456789+/="; // all numbers plus +/=
//Heres the encode function
function base64_encode(inp)
{
var out = ""; //This is the output
var chr1, chr2, chr3 = ""; //These are the 3 bytes to be encoded
var enc1, enc2, enc3, enc4 = ""; //These are the 4 encoded bytes
var i = 0; //Position counter
do { //Set up the loop here
chr1 = inp.charCodeAt(i++); //Grab the first byte
chr2 = inp.charCodeAt(i++); //Grab the second byte
chr3 = inp.charCodeAt(i++); //Grab the third byte
//Here is the actual base64 encode part.
//There really is only one way to do it.
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
//Lets spit out the 4 encoded bytes
out = out + keyStr.charAt(enc1) + keyStr.charAt(enc2) + keyStr.charAt(enc3) +
keyStr.charAt(enc4);
// OK, now clean out the variables used.
chr1 = chr2 = chr3 = "";
enc1 = enc2 = enc3 = enc4 = "";
} while (i < inp.length); //And finish off the loop
//Now return the encoded values.
return out;
}
//Heres the decode function
function base64_decode(inp)
{
var out = ""; //This is the output
var chr1, chr2, chr3 = ""; //These are the 3 decoded bytes
var enc1, enc2, enc3, enc4 = ""; //These are the 4 bytes to be decoded
var i = 0; //Position counter
// remove all characters that are not A-Z, a-z, 0-9, +, /, or =
var base64test = /[^A-Za-z0-9\+\/\=]/g;
if (base64test.exec(inp)) { //Do some error checking
alert("There were invalid base64 characters in the input text.\n" +
"Valid base64 characters are A-Z, a-z, 0-9, ?+?, ?/?, and ?=?\n" +
"Expect errors in decoding.");
}
inp = inp.replace(/[^A-Za-z0-9\+\/\=]/g, "");
do { //Here’s the decode loop.
//Grab 4 bytes of encoded content.
enc1 = keyStr.indexOf(inp.charAt(i++));
enc2 = keyStr.indexOf(inp.charAt(i++));
enc3 = keyStr.indexOf(inp.charAt(i++));
enc4 = keyStr.indexOf(inp.charAt(i++));
//Heres the decode part. There’s really only one way to do it.
chr1 = (enc1 << 2) | (enc2 >> 4);
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
chr3 = ((enc3 & 3) << 6) | enc4;
//Start to output decoded content
out = out + String.fromCharCode(chr1);
if (enc3 != 64) {
out = out + String.fromCharCode(chr2);
}
if (enc4 != 64) {
out = out + String.fromCharCode(chr3);
}
//now clean out the variables used
chr1 = chr2 = chr3 = "";
enc1 = enc2 = enc3 = enc4 = "";
} while (i < inp.length); //finish off the loop
//Now return the decoded values.
return out;
}
function encode(text){
document.write(base64_encode(text));
}
function decode(text){
document.write(base64_decode(text));
}
function decode_mailto(text){
dato = new Date();
email = base64_decode(text);
email2 = email.replace('@',"@");
email3 = email2.replace('.',".");
//alert(email3);
document.write('' + email3 + '');
}
function decode_link_mailto(text){
dato = new Date();
email = base64_decode(text);
email2 = email.replace('@',"@");
email3 = email2.replace('.',".");
//alert(email3);
document.write('<a href="mailto:' + email +'">' + email3 + '</a>');
}
Posted by pj at 10:22 AM
January 24, 2006
XML parsing in JavaScript
Started playing with parsing and extractin information from XML documents with JavaScript:
This XML is parsed by this page..
Posted by pj at 05:17 PM