adamkdean

software engineering

Git workflow scripts

By Adam K Dean on

The following are a couple of general purpose scripts which will help you to work quicker with Git. Put these in your bin folder, so either /home/user/bin or C:\Users\Username\bin depending on your OS. Remember if it's nix, chmod +x them.

ga - Git add script:

#!/bin/sh
git add -A

gs - Git status script:

#!/bin/sh
git status

gpull - Git pull script (origin master):

#!/bin/sh
git pull origin master

gpush - Git push script (origin master):

#!/bin/sh
git push origin master

gc - Git commit script:

#!/bin/sh
read -p "Commit msg: " desc
git commit -m "$desc"

gfull - Git add, status, commit (with msg) and push (origin master) script.

#!/bin/sh
git add -A
git status
read -p "Commit msg: " desc
git commit -m "$desc"
git push origin master

I may post more if I come up with anything more intricate, but for now, these can save a lot of time.

If you have any scripts you use often, be sure to share them!

Fix jagged fonts in Chrome/WebKit

By Adam K Dean on

Just a quick post today, more of a reminder for myself than anything. The following is a great way to fix jagged fonts when using font kits with Chrome/WebKit based browsers.

The following is what you'd expect to see when defining a font face:

@font-face {
  font-family: 'FontName';
  src: url('../fonts/FontName.eot');
  src: url('../fonts/FontName.eot?#iefix') format('embedded-opentype'),
       url('../fonts/FontName.woff') format('woff'),
       url('../fonts/FontName.ttf') format('truetype'),
       url('../fonts/FontName.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

Well, apparently Chrome uses the SVG and does not like it coming last.

Append this to your CSS and you'll get much better results:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'FontName';
    src: url('../fonts/FontName.svg') format('svg');
  }
}

Without fix, and with the fix:

Fix jagged fonts in Chrome/WebKit

Easily bypass Same Origin Policy

By Adam K Dean on

If you've ever tried to use AJAX or an iFrame to load another website in javascript and been unable to, it will have been because of the Same Origin Policy. To quote Wikipedia:

In computing, the same origin policy is an important security concept for a number of browser-side programming languages, such as JavaScript. The policy permits scripts running on pages originating from the same site – a combination of scheme, hostname, and port number – to access each other's methods and properties with no specific restrictions, but prevents access to most methods and properties across pages on different sites.

This means that you can only grab files/scripts which are on your current site, which stops you from grabbing external resources. This can be a pain when you're actually trying to do something legitimate.

If you have backend access, you could always have a PHP page which grabs the URL and prints out the contents, or you could send out Access-Control-Allow-Origin: headers allowing certain sites or even wildcard to open it up fully. But when you don't have this access, when you only have HTML and JS at your disposal, what do you do?

You can use jQuery's getJSON function to grab JSON from an external source, and an external provider such as AnyOrigin or whateverorigin will grab the contents for you and return them in a JSON object. Amazing.

// use jQuery to grab the contents of an url
var url = encodeURIComponent("http://www.google.com");
$.getJSON('http://whateverorigin.org/get?url=' + url + '&callback=?', 
    function(data) {
        var html = data.contents;
        // your code here
    }
);

Works great, though you do have to rely on a third-party.

If you're okay with that, then this should be okay with you!

Check for valid url with JavaScript + RegEx

By Adam K Dean on

This next snippet is going to look hideous. If you're eating right now, swallow first. If you're drinking, put down the coffee and empty your mouth of fluid.

I am henceforth borrowing the following regex from jquery.validation.js. The plugin requires a form to validate, but I want access to it without a form, or without the rest of the plugin for that matter. So here we are, url validation, it looks horrible, but it works.

var validUrl = function(value) {
    return /^(https?|s?ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(value);        
}

Thank you Scott Gonzalez (http://projects.scottsplayground.com/iri/).

Detect enter key hit using jQuery

By Adam K Dean on

Just a little snippet today, for future reference more than anything.

$('.textbox').bind('onEnter', function(e) {    
    // your code here
});
$('.textbox').keyup(function(e) {
    if (e.keyCode == 13) 
        $(this).trigger('onEnter');
});

It's pretty much self-explanatory. When enter is pressed, the above function fires.