Monday 26 December 2011

Greasemonkey UserScript

// ==UserScript==
// @name           test
// @namespace      test
// @include        http://www.facebook.com/johnny.k.sunny
// @exclude        
// ==/UserScript==



document.getElementById('headerArea').innerHTML = 'Life is out!';

Monday 19 December 2011

Wednesday 7 December 2011

js

var classicModulePattern = function(){
var privateVar = 1;
function privateFunction(){
alert('private');
}
return {
publicVar:2,
publicFunction:function(){
classicModulePattern.anotherPublicFunction();
},
anotherPublicFunction:function(){
privateFunction();
}
}
}();
classicModulePattern.publicFunction();
 
 
 
 
http://christianheilmann.com/2008/02/07/five-things-to-do-to-a-script-before-handing-it-over-to-the-next-developer/ 

font: 12px/18px "Monaco","Courier New","Courier",monospace; }

drop-in-modals #3 (line 181)

deep linking

http://www.thetutorialblog.com/demos/jQueryDeepLinking/#/test2

Tuesday 6 December 2011

animate css

http://daneden.me/animate/slider/

css3 rebbons

 h1{
        text-align: center;
        position: relative;
        color: #fff;
        margin: 0 -30px 30px -30px;
        padding: 10px 0;
        text-shadow: 0 1px rgba(0,0,0,.8);
        background: #5c5c5c;
        background-image: -moz-linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,0));
        background-image: -webkit-linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,0));
        background-image: -o-linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,0));
        background-image: -ms-linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,0));
        background-image:  linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,0));
        -moz-box-shadow: 0 2px 0 rgba(0,0,0,.3);
        -webkit-box-shadow: 0 2px 0 rgba(0,0,0,.3);
        box-shadow: 0 2px 0 rgba(0,0,0,.3);
    }

    h1:before, h1:after
    {
        content: '';
        position: absolute;
        border-style: solid;
        border-color: transparent;
        bottom: -10px;
    }

    h1:before
    {
        border-width: 0 10px 10px 0;
        border-right-color: #222;
        left: 0;
    }

    h1:after
    {
        border-width: 0 0 10px 10px;
        border-left-color: #222;
        right: 0;
    }

php debuging

echo "<pre>";
var_dump(get_defined_vars());
exit;

grid system layout / template

http://960.gs/


http://grids.heroku.com/

Monday 5 December 2011

css3 buttons

http://hellohappy.org/css3-buttons/CSS - http://hellohappy.org/css3-buttons/

Collapse All
Expand All

http://hellohappy.org/css3-buttons/
http://hellohappy.org/css3-buttons/css/buttons.css
http://www.webdesignerwall.com/demo/css-buttons.html


http://tutorialzine.com/

jquery slider

http://jqueryfordesigners.com/demo/simple-spy.html


http://janne.aukia.com/zoomooz/

Sunday 4 December 2011

url clean

def clean(string)
  string = string.strip
  string = string.tr(' ', '_')
  string = string.tr("'", "")
  string = string.tr("$", "")
  string = string.tr("&", "")
  string = string.tr("<", "")
  string = string.tr(">", "")
  string = string.tr("*", "")
  string = string.tr("@", "")
  string = string.tr(".", "")
  string = string.tr(":", "")
  string = string.tr("|", "")
  string = string.tr("~", "")
  string = string.tr("`", "")
  string = string.tr("(", "")
  string = string.tr(")", "")
  string = string.tr("%", "")
  string = string.tr("#", "")
  string = string.tr("^", "")
  string = string.tr("?", "")
  string = string.tr("/", "")
  string = string.tr("{", "")
  string = string.tr("}", "")
  string = string.tr(",", "")
  string = string.tr(";", "")
  string = string.tr("!", "")
  string = string.tr("+", "")
  string = string.tr("=", "")
  string = string.tr("-", "_")
end




ruby arrays

ruby arraysArrays are ordered, integer-indexed collections of any object. Array indexing starts at 0, as in C# or Java. A negative index is assumed to be relative to the end of the array-that is, an index of -1 indicates the last element of the array, -2 is the next to last element in the array, and so on.

Creating a new array

array = Array.new
# or
array = []

Adding array elements By position

array = []
array[0] = "first element"

To the end

array << "last element"
# This adds "last element" to the end of the array
# or
array.push("last element")
# This adds "last element" to the end of the array

To the beginning

array = ["first element", "second element"]
array.unshift("before first element")
# This adds "before first element" to the beginning of the array

Retrieving array elements

By position

array = ["first element", "second element", "third element"]
third_element = array[2]
# This returns the third element.

By positions

second_and_third_element = array[1, 2]
# This returns a new array that contains the second & third elements

Removing array elements

From the beginning

array = ["first element", "second element"]
first_element = array.shift
# This removes "first element" from the beginning of the array

From the end

last_element = array.pop
# This removes "second element" or the last element from the end of the array

Combining arrays

To a new array

array = [1, 2, 3]
array.concat([4, 5, 6, 7])
[1, 2, 3, 4, 5, 6, 7]
#or
new_array = array + [4, 5, 6]
# Using the "+" method returns a new array, but does not modify the original array

Modifying the array

array.replace([4, 5, 6])
[4, 5, 6]

Pairing items

array = [1, 2, 3]
new_paired_array = array.zip([4, 5, 6])
[[1,4],[2, 5],[3, 6]]
# This creates an array of arrays

Flattening array of arrays

array = [1, 2, 3]
new_paired_array_flattened = array.zip([4, 5, 6]).flatten
[1, 4, 2, 5, 3, 6]
This flattens the arrays of arrays into one Array.

Collecting array elements

array = [1, 2, 3]
array.collect {|x| x * 2 }
[2, 4, 6]
Invokes block once for each element of self. Creates a new array containing the values returned by the block.

Iterating over arrays

[1, 2, 3, 4] .each {|x| puts x}
1
2
3
4

Filtering arrays

[1, 2, 3, 4, 5, 6] .find {|x| puts x > 5}
This returns the first element that matches the block criteria.

Querying arrays

array.find_all {|item| criteria }
This returns a new array containing all the elements of the array that match the block criteria.
array.size
This returns the number of elements in the array.
array.empty?
This returns true if the array is empty; false otherwise.
array.include?(item)
This returns true if the array contains the item; false otherwise.
array.any? {|item| criteria }
This returns true if any item in the array matches the block criteria; false otherwise.
array.all? {|item| criteria }
This returns true if all items in the array match the block criteria; false otherwise
Hopefully if you are new to the Ruby or you have been doing some Rails work but have not really dug into Ruby, this very basic overview will spark deeper interest into the powerful (and very fun) world of Ruby.
http://carlosgabaldon.com/ruby/ruby-arrays/

books

osx tools

http://carlosgabaldon.com/2010/05/30/rubyist-os-x-dev-setup/

Rails Common Commands

rvm ruby-1.9.2-p0 - ruby version manager; switches to Ruby 1.9.2
rvm --default ruby-1.9.2-p0 - ruby version manager; sets 1.9.2 as default
rvm system - ruby version manager; switches to Ruby 1.87
rails new - creates a new Rails application
rails server [s] - launches WEBrick web server
rails generate [g] - lists available generators
rails generate controller --help - provides usage documentation
rails generate model --help - provides usage documentation
rails generate migration --help - provides usage documentation
rails destroy controller [Name] - undo generate controller
rails destroy model [Name] - undo generate model
rails generate scaffold [Name] --skip --no-migration - scaffold skipping existing files
rake db:migrate - runs database migrations
rake db:test:clone - clones current environment's database schema
rake db:test:purge - empties the test database
rake routes - list of all of the available routes
rake -T - list of rake commands
git init - creates git repo
git add . - adds all files to working tree
git commit -m "Initial commit" - commits files to repo
git status - status of the working tree
git push origin master - merges local repo with remote
git checkout -b new-dev - creates topic branch
git checkout master - switches to master branch
git merge new-dev - merges new-dev branch into master branch
git checkout -f - undo uncommitted changes on working tree
git branch - list branches
git branch -d modify-README - deletes branch
git mv README README.markdown - renames files using move command
heroku create - creates app on Heroku servers
git push heroku master - pushs app on to Heroku servers
heroku rake db:migrate - runs database migrations on Heroku servers
heroku pg:reset --db SHARED_DATABASE_URL - deletes database file
heroku db:push - transfer an existing database to Heroku.
rails console - command line interface to Rails app
rails dbconsole - command line database interface
bundle install - installs gems from Gemfile

a nice sinatra tutorial

http://carlosgabaldon.com/ruby/singing-with-sinatra/

Compass CSS Authoring Framework.

http://compass-style.org/install/

Sintra quick realod on request

require 'rubygems'
require 'sinatra'

configure :development do
Sinatra::Application.reset!
use Rack::Reloader
end

Tuesday 29 November 2011

Ruby on Rails on DreamHost Installation

Ruby on Rails on DreamHost Installation
http://www.fogel.ca/2009/02/10/ruby-on-rails-on-dreamhost-installation/

Monday 28 November 2011

Play framework (Java)

git clone git://github.com/playframework/play.git
&&
cd play/framework &&
ant
&&
cd ..
&&
./play new myApp
&&
testApp
&&
./play run myApp/



In myApp/confing change the port to 9999 (default it 9000)

http://www.playframework.org/documentation/1.2.3/ide


Play and scala

http://www.jamesward.com/2011/10/19/running-play-framework-scala-apps-on-heroku











--> http://blazing-sunset-9132.herokuapp.com/application/sayhello?myName=say+hello

Sunday 27 November 2011

demos

http://css-tricks.com/downloads/


jquery plugin http://lab.smashup.it/flip/

Saturday 26 November 2011

template

class my_page
{
    public function template($name=null)
    {
        static $template = 'templates/page.html';
        if ($name) $template = "templates/{$name}.html";
        else return $template;
    }
}

$p = new my_page;
$p->template('product');
include $p->template();

php timeago

<?php
## alex at nyoc dot net
## Feel free to better for your needs

function timeago($referencedate=0, $timepointer='', $measureby='', $autotext=true){    ## Measureby can be: s, m, h, d, or y
    if($timepointer == '') $timepointer = time();
    $Raw = $timepointer-$referencedate;    ## Raw time difference
    $Clean = abs($Raw);
    $calcNum = array(array('s', 60), array('m', 60*60), array('h', 60*60*60), array('d', 60*60*60*24), array('y', 60*60*60*24*365));    ## Used for calculating
    $calc = array('s' => array(1, 'second'), 'm' => array(60, 'minute'), 'h' => array(60*60, 'hour'), 'd' => array(60*60*24, 'day'), 'y' => array(60*60*24*365, 'year'));    ## Used for units and determining actual differences per unit (there probably is a more efficient way to do this)
   
    if($measureby == ''){    ## Only use if nothing is referenced in the function parameters
        $usemeasure = 's';    ## Default unit
   
        for($i=0; $i<count($calcNum); $i++){    ## Loop through calcNum until we find a low enough unit
            if($Clean <= $calcNum[$i][1]){        ## Checks to see if the Raw is less than the unit, uses calcNum b/c system is based on seconds being 60
                $usemeasure = $calcNum[$i][0];    ## The if statement okayed the proposed unit, we will use this friendly key to output the time left
                $i = count($calcNum);            ## Skip all other units by maxing out the current loop position
            }       
        }
    }else{
        $usemeasure = $measureby;                ## Used if a unit is provided
    }
   
    $datedifference = floor($Clean/$calc[$usemeasure][0]);    ## Rounded date difference
   
    if($autotext==true && ($timepointer==time())){
        if($Raw < 0){
            $prospect = ' from now';
        }else{
            $prospect = ' ago';
        }
    }
   
    if($referencedate != 0){        ## Check to make sure a date in the past was supplied
        if($datedifference == 1){    ## Checks for grammar (plural/singular)
            return $datedifference . ' ' . $calc[$usemeasure][1] . ' ' . $prospect;
        }else{
            return $datedifference . ' ' . $calc[$usemeasure][1] . 's ' . $prospect;
        }
    }else{
        return 'No input time referenced.';
    }
}


$gmtimenow = time() - (int)substr(date('O'),0,3)*60*60; 


echo timeago($gmtimenow);

Friday 25 November 2011

css tools web2

tools: http://pelfusion.com/tools/7-useful-css3-code-generators/

css 3 selectors:
http://www.456bereastreet.com/archive/200601/css_3_selectors_explained/

How to save your youtube videos with javascript

index.php


<?php 
/**
* Save favorite youtube links in one place
 *
* @author Ioannis Kolovos
 * @version $Id$
* @copyright netWorks Inc!, 25 November, 2011
 * @package default
*javascript link: javascript: var l = window.location;  var t = escape(document.title); window.location ="HOST/?l="+ l + "&t="+t+"&h=02ce4c679b9a06815a8644a5d911e46b";
**/



$date = date('l jS \of F Y h:i:s A');
$url= $_GET[l];
$tmp= str_replace("::", " " , $_GET[t]);
$title = str_replace("- YouTube", "", $tmp);
$hash= $_GET[h];
$vdb = "videos.txt";
$line = file_get_contents($vdb);
$host = "/";
$validation = "02ce4c679b9a06815a8644a5d911e46b";
$cache ="./cache/";
$cache_imgs = scandir($cache);

 
function getImage($id)
{
 global $cache_imgs, $cache;

 if (in_array($id .".jpg", $cache_imgs)){
  return $cache.$id .".jpg";
 }


 else {
  $thumb = "http://img.youtube.com/vi/". $id. "/0.jpg";
  $get_image = file_get_contents($thumb);
  $local_image = $cache.$id.".jpg";
  file_put_contents($local_image, $get_image, FILE_APPEND | LOCK_EX);
  return $local_image;

 }



}



if (isset($hash) && $hash == $validation) {

 parse_str( parse_url( $url, PHP_URL_QUERY ), $getdata );
 $data = $getdata['v'];

 if ( preg_match( "/^" . $data . "/", $line ) )
 {
  print "<b>Video posted allready</b><br/>";
  exit();
 } else {
  $stringData = $title . "::" . $data . "::" . $date . "#";
  file_put_contents($vdb, $stringData, FILE_APPEND | LOCK_EX);
  echo"<meta http-equiv=\"refresh\" content=\"0; url= $host\">";
  echo "<div style=\"text-aling:center\"><h1>Video saved :)</h1></div>"; 



 }
}

else {


 ?>

 <!doctype html public "�">
  <head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1" >
  <title dir="ltr">:: Emergency Favorite Songs ::</title>
 <meta name="viewport" content="width=device-width, initial-scale=1.0">  
  <link rel="stylesheet" media="screen" href="style.css?v=2" >
  <script src="http://code.jquery.com/jquery-latest.js"></script>

 <!--http://johnkolovos.blogspot.com/2011/11/how-to-save-youtube-links-in-your-page.html -->
 </head>
 <body>

  <?php

 $info = explode("#", $line);
 array_reverse($info);
 $size = count($info)-1;

 $i = 0;
 echo $i;

 foreach ($info as $value) { 
  if ($i<$size) {

   $video = split("::", $value); 
   ?>

   <div class="box">
    <!-- <h1><?php echo $video[0]; ?></h1>-->


   <?php 



   ?>

   <a  href="#"><img   id="<?php echo  $video[1]; ?>" style="height: 200; width: 200px"  src="<?php echo getImage( $video[1]); ?>" /></a>

   <p id="<?php echo  $video[1]; ?>_p" title="@<?php echo  $video[2]; ?>"><?php echo $video[0]; ?></p>



   <div id="<?php echo  $video[1]; ?>_" style="display:none">
   <object style="height: 200; width: 200px" >
    <param name="movie" value="http://www.youtube.com/v/<?php echo $video[1]; ?>?version=3&feature=player_detailpage&autoplay=1">
   <param name="allowFullScreen" value="true"><param name="allowScriptAccess" value="always">
    <embed src="http://www.youtube.com/v/<?php echo  $video[1]; ?>?version=3&feature=player_detailpage&autoplay=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="200" height="200"></object>

   </div>


   </div>





   <?php }

   $i++; 

  }}


  ?>


  <script>
  $('img').click(function () {   
   var id =$(this).attr('id');
   $(this).fadeOut("fast");
   $('#'+id+'_p').css("display", "none");
   $('#'+id+'_').css("display", "inline");
   return false;

  });
  </script>


style.css

.video {
     text-shadow: 1px 1px 3px #888; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
-webkit-box-shadow: 0px 0px 4px #ffffff; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
     -moz-box-shadow: 0px 0px 4px #ffffff; /* FF3.5 - 3.6 */
          box-shadow: 0px 0px 4px #ffffff; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
text-align:center;
padding-top:10px;

  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #444444, #999999); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #444444, #999999); /* IE10 */
  background-image:      -o-linear-gradient(top, #444444, #999999); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #444444, #999999);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6-IE9 */

 -webkit-border-radius: 12px; /* Saf3-4, iOS 1-3.2, Android <e;1.6 */
     -moz-border-radius: 12px; /* FF1-3.6 */
          border-radius: 12px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; 
padding-bottom:20px;

 
  font-family:Georgia
}

p{

margin-top:-35px;
padding-bottom:10px;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
  
}
 

h1 {
padding-top:-35px;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
 

}

body{
background:#D1D1D1;
color:#323232;
 
 
  
 text-align:center;
 text-shadow:0 1px 0 #FFFFFF;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
 font-size: 13px;


}

.video {
     text-shadow: 1px 1px 3px #888; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
-webkit-box-shadow: 0px 0px 4px #ffffff; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
     -moz-box-shadow: 0px 0px 4px #ffffff; /* FF3.5 - 3.6 */
          box-shadow: 0px 0px 4px #ffffff; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
text-align:center;
padding-top:10px;

  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #444444, #999999); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #444444, #999999); /* IE10 */
  background-image:      -o-linear-gradient(top, #444444, #999999); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #444444, #999999);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6-IE9 */

 -webkit-border-radius: 12px; /* Saf3-4, iOS 1-3.2, Android <e;1.6 */
     -moz-border-radius: 12px; /* FF1-3.6 */
          border-radius: 12px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; 
padding-bottom:20px;

 
  font-family:Georgia
}

p{

margin-top:35px;
 
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
  
}
 

h1 {
padding-top:-35px;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
 

}

body{
background:#D1D1D1;
color:#323232;
 
 
  
 text-align:center;
 text-shadow:0 1px 0 #FFFFFF;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
 font-size: 13px;


}

.box {
float:left;
width: 200px;
     text-shadow: 1px 1px 3px #888; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */

height: 200px;
margin:10px;

 
 
}
 



javascript: var l = window.location;  var t = escape(document.title); window.location ="HOST/?l="+ l + "&t="+t+"&h=02ce4c679b9a06815a8644a5d911e46b"

drag drop link in bookmark : Save video


http://www.net-works.gr/music/

UPDATE:
javascript:%20var%20l%20=%20window.location.href.replace("#","").replace("!",%20"");;%20%20var%20t%20=%20escape(document.title);%20window.location%20="HOST/?l="+%20l%20+%20"&t="+t+"&h=02ce4c679b9a06815a8644a5d911e46b"

Monday 21 November 2011

window.localStorage

// See if the property that we want is pre-cached in the localStorage
if ( window.localStorage !== null && window.localStorage.gameDict ) {
  dictReady( window.localStorage.gameDict );

// Load in the dictionary from the server
} else {
  jQuery.ajax({
    url: cdnHREF + "dict/dict.js",
    dataType: "jsonp",
    jsonp: false,
    jsonpCallback: "dictLoaded",
    success: function( txt ) {
      // Cache the dictionary, if possible
      if ( window.localStorage !== null ) {
        window.localStorage.gameDict = txt;
      }

      // Let the rest of the game know
      // that the dictionary is ready
      dictReady( txt );
    }
    // TODO: Add error/timeout handling
  });
}


scripts

Moment.js


http://momentjs.com/
http://listjs.com/examples/standard.html
http://gitlabhq.com/index.html

http://dhtmlx.github.com/message/

animate.css
http://daneden.me/animate/#cta
http://peerbind.com/


http://simplemodal.plasm.it/#examples

fire and assert key combination strings against elements and events
http://keithcirkel.co.uk/jwerty/
https://github.com/keithamus/jwerty/blob/master/README-DETAILED.md

https://github.com/jeresig/jquery.hotkeys

image class
http://imagine.readthedocs.org/en/latest/index.html
http://stefangabos.ro/php-libraries/zebra-image/

imagemapster
http://www.outsharked.com/imagemapster/
https://github.com/jamietre/ImageMapster
map->
http://socrtwo.info/image_map.htm
http://sourceforge.net/projects/inkscapemap/

http://www.boutell.com/mapedit/

add sliding (aka "floating") panel functionality to your web page
http://simianstudios.com/portamento/

restler
http://luracast.com/products/restler/
https://github.com/Luracast/Restler
http://singmood.com/Source.zip

http://www.webresourcesdepot.com/15-must-have-bookmarklets-for-web-designers-and-developers/

alert -->sticky
http://thrivingkings.com/sticky/
http://thrivingkings.com/apprise/


form
http://thrivingkings.com/formly/

css-->
http://lea.verou.me/chainvas/

read-->
http://perfectionkills.com/
http://ejohn.org/category/blog/page/2/

http://kangax.github.com/fabric.js/demos/


READ---->http://jsninja.com/

jquery.transit

http://ricostacruz.com/jquery.transit/

Sunday 20 November 2011

Geolocation

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  <title>Getting the user location via  IP Geo lookup</title>
  <link rel="stylesheet" href="http://yui.yahooapis.com/2.7.0/build/reset-fonts-grids/reset-fonts-grids.css" type="text/css">
  <link rel="stylesheet" href="http://yui.yahooapis.com/2.7.0/build/base/base.css" type="text/css">
  <style type="text/css" media="screen">
  body,html{
    background:#333;
    color:#ccc;
  }
  #doc{
    background:#f8f8f8;
    color:#333;
    border:1em solid #f8f8f8;
    font-family:georgia,serif;
  }
  h1{
    font-size:180%;
    color:#363;
  }
  h2{
    font-size:150%;
    color:#393;
  }
  h3{
    font-size:140%;
    color:#696;
  }
  p,li{font-size:130%;}
  ul{margin:0 0 0 1.5em;}
  li{padding:.2em 0;}
  li strong{
    width:8em;
    float:left;
    display:block;
  }
  a{color:#363;}
  #ft p{
    font-size:80%;
    text-align:right;
  }
  #map{
    height:300px;
    width:300px;
    position:relative;
  }
  #map span{
    height:280px;
    width:280px;
    background:rgba(0,0,0,.5);
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    font-size:200%;
    padding:10px;
    overflow:hidden;
  }
  #map span strong{display:block;color:#0f0;}
  </style>
</head>
<body>
<div id="doc" class="yui-t7">

  <div id="hd" role="banner"><h1>Getting location from IP</h1></div>
  <div id="bd" role="main">
    <h2>Map and info</h2>
       <div class="yui-g">
         <div class="yui-u first"><div id="map"></div>
      </div>
      <div class="yui-u" id="info"></div>
    </div>

    <h2>Thanks</h2>
    <p>Thanks to <a href="http://www.maxmind.com">Maxmind</a> for the Geo IP database.</p>
  </div>
  <div id="ft" role="contentinfo"><p>Written by <a href="http://wait-till-i.com">Chris Heilmann</a></p></div>
</div>
<script type="text/javascript" src="http://j.maxmind.com/app/geoip.js"></script>

<script>
(function(){

  var info = document.getElementById('info');
  var lat = geoip_latitude();
  var lon = geoip_longitude();
  var city = geoip_city();
  var out = '<h3>Information from your IP</h3>'+ 
            '<ul>'+
            '<li>Latitude: ' + lat + '</li>'+
            '<li>Longitude: ' + lon + '</li>'+
            '<li>City: ' + city + '</li>'+
            '<li>Region: ' + geoip_region() + '</li>'+
            '<li>Region Name: ' + geoip_region_name() + '</li>'+
            '<li>Postal Code: ' + geoip_postal_code() + '</li>'+
            '<li>Country Code: ' + geoip_country_code() + '</li>'+
            '<li>Country Name: ' + geoip_country_name() + '</li>'+
            '</ul>';
  info.innerHTML = out;
  var url = 'http://maps.google.com/maps/api/staticmap?center='+
            lat+','+lon+'&sensor=false&size=300x300&maptype=roadmap&key='+
            'ABQIAAAAijZqBZcz-rowoXZC1tt9iRT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQQBCa'+
            'F1R_k1GBJV5uDLhAKaTePyQ&markers=color:blue|label:I|'+lat+
            ','+lon+'6&visible='+lat+','+lon+'|'+(+lat+1)+','+(+lon+1);
  var map = document.getElementById('map');
  map.innerHTML = '<img src="'+url+'" alt="'+city+'">';
  
})();
</script>
</body>
</html>


http://isithackday.com/hacks/geo/js-location.html

JavaScript_syntax

alert(a || b);    // When a is true, there is no reason to evaluate b.
alert(a && b);    // When a is false, there is no reason to evaluate b.
alert(c ? t : f); // When c is true, there is no reason to evaluate f.

alert(a || b); // if a is true, return a, otherwise return b
alert(a && b); // if a is false, return a, otherwise return b

var s = t || "(default)"; // assigns t, or the default value if t is null, empty, etc.  



str = "ab" + "cd";   // "abcd"
str += "e";          // "abcde"
 
str2 = "2"+2         // "22", not "4" or 4.


// SWICH: 

switch (expr) {
   case SOMEVALUE:
     //statements;
     break;
   case ANOTHERVALUE:
     //statements;
     break;
   default:
     //statements;
     break;
 }  




var z;
var  x= z || 1;


switch (x) {  
   case 2:  
    alert("");
     break;  
   case 1:  
    alert(x);

   default:  
     //statements;  
     break;  
 } 



//IN:

 

for (var property_name in some_object) {
   //statements using some_object[property_name];
 } 

var person={fname:"John",lname:"Doe",age:25};

for (x in person)
{
alert(person[x] + " ");
}


//Object literals and array literals allow one to easily create flexible data structures:

var myStructure = {
  name: {
    first: "Mel",
    last: "Smith"
  },
  age: 33,
  hobbies: ["chess", "jogging"]
}; 

 --------------------



var myStructure = {  
  name: {  
    first: "Mel",  
    last: "Smith"  
  },  
  age: 33,  
  hobbies: ["chess", "jogging"]  
};   


for (x in myStructure)
{
alert(myStructure[x] + " ");
}

//Object
//33
//chess,jogging




alert(myStructure.name.first);

//Mel



alert(myStructure.hobbies[0]);
//chess

Javascript Object Literals


// Object Literals

timObject = {
 property1 : "Hello",
 property2 : "MmmMMm",
 property3 : ["mmm", 2, 3, 6, "kkk"],
 method1 : function(){alert("Method had been called" + this.property1)}
};

timObject.method1();
alert(timObject.property3[2]) // will yield 3

OR------------------------
 
 
 
 
 
person = new Object()
person.name = "Tim Scarfe"
person.height = "6Ft"

person.run = function() {
 this.state = "running"
 this.speed = "4ms^-1"
}
 
 
http://mckoss.com/jscript/object.htm 

Protype js example

 

function A()

{

    this.x = 1;

}

A.prototype.DoIt = function()    // Define Method

{

    this.x += 1;

}

function B()

{

    this.x = 1;

}

B.prototype.DoIt = function()    // Define Method

{

    this.x += 2;

}

a = new A;

b = new B;

a.DoIt();

b.DoIt();

document.write(a.x + ', ' + b.x);

 

 

Plain Javascript

// Object Literals

timObject = {
 property1 : "Hello",
 property2 : "MmmMMm",
 property3 : ["mmm", 2, 3, 6, "kkk"],
 method1 : function(){alert("Method had been called" + this.property1)}
};

timObject.method1();
alert(timObject.property3[2]) // will yield 3

var circle = { x : 0, y : 0, radius: 2 } // another example

// nesting is no problem.
var rectangle = { 
 upperLeft : { x : 2, y : 2 },
 lowerRight : { x : 4, y : 4}
}

alert(rectangle.upperLeft.x) // will yield 2 

 //With comments

/* Finds the lowest common multiple of two numbers */
function LCMCalculator(x, y) { // constructor function
    var checkInt = function (x) { // inner function
        if (x % 1 !== 0) {
            throw new TypeError(x + " is not an integer"); // throw an exception
        }
        return x;
    };
    this.a = checkInt(x)
    // ^ semicolons are optional
    this.b = checkInt(y);
}
// The prototype of object instances created by a constructor is 
// that constructor's "prototype" property.
LCMCalculator.prototype = { // object literal
    constructor: LCMCalculator, // when reassigning a prototype, set the constructor property appropriately
    gcd: function () { // method that calculates the greatest common divisor
        // Euclidean algorithm:
        var a = Math.abs(this.a), b = Math.abs(this.b), t;
        if (a < b) {
            // swap variables
            t = b; b = a;  a = t; 
        }
        while (b !== 0) {
            t = b;
            b = a % b;
            a = t;
        }
        // Only need to calculate GCD once, so "redefine" this method.
        // (Actually not redefinition - it's defined on the instance itself,
        // so that this.gcd refers to this "redefinition" instead of LCMCalculator.prototype.gcd.)
        // Also, 'gcd' == "gcd", this['gcd'] == this.gcd
        this['gcd'] = function() { 
            return a; 
        };
        return a;
    },
    "lcm"/* can use strings here */: function() {
        // Variable names don't collide with object properties, e.g. |lcm| is not |this.lcm|.
        // not using |this.a * this.b| to avoid FP precision issues
        var lcm = this.a / this.gcd() * this.b; 
        // Only need to calculate lcm once, so "redefine" this method.
        this.lcm = function() { 
            return lcm; 
        };
        return lcm;
    },
    toString: function () {
        return "LCMCalculator: a = " + this.a + ", b = " + this.b;
    }
};
 
//define generic output function; this implementation only works for web browsers
function output(x) { document.write(x + "
"); }
 
// Note: Array's map() and forEach() are defined in JavaScript 1.6.
// They are used here to demonstrate JavaScript's inherent functional nature.
[[25, 55],[21, 56],[22, 58],[28, 56]].map(function(pair) { // array literal + mapping function
    return new LCMCalculator(pair[0], pair[1]);
}).sort(function(a, b) { // sort with this comparative function
    return a.lcm() - b.lcm();
}).forEach(function(obj) {
    output(obj + ", gcd = " + obj.gcd() + ", lcm = " + obj.lcm());
});

 

 
//--------------------------------------------


function A()
{
    this.x = 1;
}
 
A.prototype.DoIt = function()    // Define Method
{
    this.x += 1;
}
 
function B()
{
    this.x = 1;
}
 
B.prototype.DoIt = function()    // Define Method
{
    this.x += 2;
}
 
a = new A;
b = new B;
 
a.DoIt();
b.DoIt();
document.write(a.x + ', ' + b.x);

.blind

     
     
     

.blind handles event(s)

 

 

$('#foo').bind('mouseenter mouseleave', function() {
  $(this).toggleClass('entered');
});

$('#foo').bind('EVENT1 EVENT2', function() {
//what it will happens
}); 

 

OR

$('#foo').bind({
  click: function() {
    // do something on click
  },
  mouseenter: function() {
    // do something on mouseenter
  }
});

$('#foo').bind('click', function() {
  alert($(this).text());
}); 

 

 

passing data

var message = 'Spoon!';
$('#foo').bind('click', {msg: message}, function(event) {
  alert(event.data.msg);
});
message = 'Not in the face!';
$('#bar').bind('click', {msg: message}, function(event) {
  alert(event.data.msg);
}); 

 

 

 

function foo(e) {

 console.log(e.type);

};

$('li').bind({

  'click': foo,

  'mouseover': foo,

  'mouseout': foo

});

 

 

 

Load example with images

    
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<title>Getting pictures!</title>
<style>
* {
  margin: 0;
  padding: 0;
}

body {
  font-family: 'helvetica neue', arial, helvetica;
}

a img {
  border: 0;
}

img {
/*  border: 5px solid #000;*/
/*  margin: 10px;*/
}

ul {
  width: 315px;
  height: 100%;
  overflow-y: auto;
  white-space: nowrap;
  list-style: none;
}

li {
  display: block;
  float: left;
  height: 75px;
  cursor: pointer;
}

#loadingStatus {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  padding: 5px 10px;
  background: #c00;
  color: #fff;
}

#main {
  position: fixed;
  left: 360px;
  top: 50px;
}

#main div {
  border: 10px solid #000;
  height: 400px;
  width: 400px;
  font-family: georgia;
  color: #fff;
  text-shadow: 1px 1px 0 #000;
  background: rgba(0,0,0,.3);
  font-size: 38px;
  text-align: center;
  line-height: 400px;
}

#main img {
  border: 10px solid #000;
  position: absolute;
  top: 0;
  left: 0;
  width: 400px;
}

#next { margin: 20px; }

/* via https://github.com/ubuwaits/css3-buttons */
button.cupid-blue {
  background: #d7e5f5;
  background: -moz-linear-gradient(top, #d7e5f5 0%, #cbe0f5 100%);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#d7e5f5), to(#cbe0f5));
  border-top: 1px solid #abbbcc;
  border-left: 1px solid #a7b6c7;
  border-bottom: 1px solid #a1afbf;
  border-right: 1px solid #a7b6c7;
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  -moz-box-shadow: inset 0 1px 0 0 #fff;
  -webkit-box-shadow: inset 0 1px 0 0 #fff;
  box-shadow: inset 0 1px 0 0 #fff;
  color: #1a3e66;
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  font-size: 11px;
  font-weight: normal;
  line-height: 1;
  padding: 6px 0 7px 0;
  text-align: center;
  text-shadow: 0 1px 1px #fff;
  width: 150px;
}

button.cupid-blue:hover {
  background: #ccd9e8;
  background: -moz-linear-gradient(top, #ccd9e8 0%, #c1d4e8 100%);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ccd9e8), to(#c1d4e8));
  border-top: 1px solid #a1afbf;
  border-left: 1px solid #9caaba;
  border-bottom: 1px solid #96a3b3;
  border-right: 1px solid #9caaba;
  -moz-box-shadow: inset 0 1px 0 0 #f2f2f2;
  -webkit-box-shadow: inset 0 1px 0 0 #f2f2f2;
  box-shadow: inset 0 1px 0 0 #f2f2f2;
  color: #163659;
  cursor: pointer;
}

button.cupid-blue:active {
  border: 1px solid #8c98a7;
  -moz-box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eee;
  -webkit-box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eee;
  box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eee;
}


</style>
</head>
<body>
<div id="loadingStatus">Loading</div>
<p><button id="next" class="cupid-blue">Next group</button></p>
<ul id="pictures">
  <li><img src="http://farm5.static.flickr.com/4132/5176187907_25d26f48f0_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4133/5176793736_d071069871_s.jpg"></li>

<li><img src="http://farm5.static.flickr.com/4148/5176790372_c5a6a3cc7a_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4103/5176188725_397e641c7f_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4110/5176791934_bb21e4b523_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4130/5176184917_92e4b89148_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4083/5176794362_c7543d2e29_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4128/5176189635_4030795e8d_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4129/5176789954_4f4e5edd2f_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4132/5176187515_27853af67d_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4128/5176792872_c146b28478_s.jpg"></li>

<li><img src="http://farm5.static.flickr.com/4107/5176790750_8c1471a753_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4110/5176789130_0d876b8489_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4132/5176788284_a98e4e92a0_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4147/5176789562_ed5e339f57_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4145/5176786398_d8fef3b0e1_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4147/5176181843_8c58178ea9_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4106/5176184049_bc11cbb7a9_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4126/5176767160_27d7c6346b_s.jpg"></li>
  <li><img src="http://farm5.static.flickr.com/4107/5176784060_3a55131a91_s.jpg"></li>

</ul>
<div id="main">
  <div>Click on a picture</div>
</div>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
var flickrURL = 'http://api.flickr.com/services/rest/?method=flickr.photos.search&page=%page%&per_page=20&api_key=18702ea1538bc199e2c7e1d57270cd37&user_id=38257258%40N00&tags=fullfrontalconf&format=json&jsoncallback=?';

var $pictures = $('#pictures'),
    $main = $('#main'),
    $next = $('#next'),
    html = [],
    page = 1;

// $pictures.find('img').click(function () {
$pictures.delegate('img', 'click', function () {
  $('#loadingStatus').fadeIn();
  var src = this.src.replace(/_s/, '');
  $('<img>').attr('src', src).load(function () {
    $main.empty().append(this);
    $('#loadingStatus').stop(true, true).fadeOut();
  });
});

function getPage(page) {
  $.getJSON(flickrURL.replace(/%page%/, page), function (data) {
    html = [];
    $.each(data.photos.photo, function (i, photo) {
      html.push('<li><img src="http://farm' + photo.farm + '.static.flickr.com/' + photo.server + '/' + photo.id + '_' + photo.secret + '_s.jpg" /></li>');
    });

    $pictures.empty().append(html.join(''));
    $('#loadingStatus').hide();  
  });
}

$next.click(function () {
  getPage(++page);
});

</script>
</body>
</html>

Load example

 

$(function () {
  

//Textfield's event

$('#name').keyup(function () {

 

//where to store      --Load from the server   --where to store again --params 

$('#results ul').load('load-example.php #results ul li', { name : this.value });
//Load load-example.php from the server and store it in #results ul with this params 

//{name:this.value} with is this inputs value  

 

 });
});

 

 

 

 

 

http://www.yensdesign.com/tutorials/contentajax/

 

parse and load html :)

</fieldset>
    </form>
    <div id="results">
        <h2>Results</h2>
<ul>
            <li>Nothing found for "tahoma"</li>
        </ul>
    </div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
   $('#name').keyup(function () {
       $('#results ul').load('load-example.php #results li', { name : this.value });
   });
});
</script>
</body>
</html
 
 
 
 
 
 
 
 
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>jQuery load example</title>
<style type="text/css" media="screen">
<!--
body { font: 1em "Trebuchet MS", verdana, arial, sans-serif; font-size: 100%; color: #000; padding: 20px;}
input, textarea { font-family: Arial; font-size: 100%; padding: 3px; margin-left: 10px; }
#wrapper { width: 600px; margin: 0 auto; }
</style>
</head>
<body>
<div id="wrapper">
    <h1>Font Finder</h1>
    <form action="load-example.php" method="post" accept-charset="utf-8">
        <fieldset>
            <legend>Find a font</legend>
            <label for="name">Name</label><input type="text" name="name" value="tahoma" id="name" />
            <input type="submit" value="Search &rarr;" />
        </fieldset>
    </form>
    <div id="results">
        <h2>Results</h2>
        <ul>
            <li>Nothing found for "tahoma"</li>
        </ul>
    </div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
   $('#name').keyup(function () {
       $('#results ul').load('load-example.php #results li', { name : this.value });
   });
});
</script>
</body>
</html>
 

jQuery Clone








jQuery After and before

<!DOCTYPE html>
<html>
<head>
<style>
p { background:yellow; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
</head>
<body>
<p>I would like to say: </p>
<script>
$("p").after("<b>Hello</b>");
</script>
</body>
</html>
 
 
 
 
 
 
 
 
 
<!DOCTYPE html>
<html>
<head>
<style>
p { background:yellow; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
</head>
<body>
<b>Hello</b><p>I would like to say: </p>
<script>
$("p").after( $("b") );
</script>
</body>
</html> 
BEFORE
<!DOCTYPE html>
<html>
<head>
<style>
p { background:yellow; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
</head>
<body>
<p> is what I said...</p>
<script>
$("p").before("<b>Hello</b>");
</script>
</body>
</html>

jQuery Serialize

jQuery Serialize



[{name:"first",value:"Rick"},
{name:"last",value:"Astley"},
{name:"job",value:"Rock Star"}]
 
 
 
Note: Because some frameworks have limited ability to parse serialized arrays, we should exercise caution when passing an obj argument that contains objects or arrays nested within another array.
In jQuery 1.4 HTML5 input elements are serialized, as well.
We can display a query string representation of an object and a URI-decoded version of the same as follows:
var myObject = {
  a: {
    one: 1, 
    two: 2, 
    three: 3
  }, 
  b: [1,2,3]
};
var recursiveEncoded = $.param(myObject);
var recursiveDecoded = decodeURIComponent($.param(myObject));

alert(recursiveEncoded);
alert(recursiveDecoded);
The values of recursiveEncoded and recursiveDecoded are alerted as follows:
a%5Bone%5D=1&a%5Btwo%5D=2&a%5Bthree%5D=3&b%5B%5D=1&b%5B%5D=2&b%5B%5D=3
a[one]=1&a[two]=2&a[three]=3&b[]=1&b[]=2&b[]=3









Example : Serialize a key/value object.

<!DOCTYPE html>
<html>
<head>
<style>
div { color:red; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
</head>
<body>
<div id="results"></div>
<script>
var params = { width:1680, height:1050 };
    var str = jQuery.param(params);
    $("#results").text(str);
</script>
</body>
</html>
 
 
 
 
 
 
 
 
 
=========================================================================
 
 
 
 
 
 
 
 
 
 
<!DOCTYPE html>
<html>
<head>
<style>
body, select { font-size:12px; }
  form { margin:5px; }
  p { color:red; margin:5px; font-size:14px; }
  b { color:blue; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
</head>
<body>
<form>
    <select name="single">
      <option>Single</option>
      <option>Single2</option>
    </select>

<br />
    <select name="multiple" multiple="multiple">
      <option selected="selected">Multiple</option>
      <option>Multiple2</option>

      <option selected="selected">Multiple3</option>
    </select>
<br/>
    <input type="checkbox" name="check" value="check1" id="ch1"/>

    <label for="ch1">check1</label>

    <input type="checkbox" name="check" value="check2" checked="checked" id="ch2"/>

    <label for="ch2">check2</label>
<br />
    <input type="radio" name="radio" value="radio1" checked="checked" id="r1"/>

    <label for="r1">radio1</label>
    <input type="radio" name="radio" value="radio2" id="r2"/>

    <label for="r2">radio2</label>
  </form>
  <p><tt id="results"></tt></p>
<script>
function showValues() {
      var str = $("form").serialize();
      $("#results").text(str);
    }
    $(":checkbox, :radio").click(showValues);
    $("select").change(showValues);
    showValues();
</script>
</body>
</html>
 

Wednesday 16 November 2011

TextMate Bundle for Ruby on Rails Development

TextMate Bundle for Ruby on Rails Development

 

mkdir -p ~/Library/Application\ Support/TextMate/Bundles
cd ~/Library/Application\ Support/TextMate/Bundles
git clone git://github.com/drnic/ruby-on-rails-tmbundle.git "Ruby on Rails.tmbundle"
osascript -e 'tell app "TextMate" to reload bundles'

 

 

 

Last login: Wed Nov 16 22:18:21 on console
You have new mail.
ioannis-kolovos:~ ioannis$ mkdir -p ~/Library/Application\ Support/TextMate/Bundles
ioannis-kolovos:~ ioannis$ cd ~/Library/Application\ Support/TextMate/Bundles
ioannis-kolovos:Bundles ioannis$ pwd
/Users/ioannis/Library/Application Support/TextMate/Bundles
ioannis-kolovos:Bundles ioannis$ git clone git://github.com/drnic/ruby-on-rails-tmbundle.git "Ruby on Rails.tmbundle"
Cloning into Ruby on Rails.tmbundle...
remote: Counting objects: 1961, done.
remote: Compressing objects: 100% (664/664), done.
remote: Total 1961 (delta 1426), reused 1748 (delta 1250)
Receiving objects: 100% (1961/1961), 1.21 MiB | 395 KiB/s, done.
Resolving deltas: 100% (1426/1426), done.
ioannis-kolovos:Bundles ioannis$ osascript -e 'tell app "TextMate" to reload bundles'
ioannis-kolovos:Bundles ioannis$







UPDATE
  1. Get with GitHub for Mac

  2. Clone it to your ~/Library/Application Support/TextMate/Pristine Copy/Bundles
  3. In TextMate choose the menu item… Bundles / Bundle Editor / Reload Bundles
  4. If node is not installed in your PATH, go to TextMate → Preferences → Advanced → Shell Variables and add /usr/local/bin, basically the path to where node lives on your machine (which node).







UPDATE

defaults write com.macromates.textmate OakShellVariables -array-add "{ enabled = 1; variable = PATH; value = '$PATH'; }" && open "/Applications/TextMate.app"
ioannis-kolovos:~ ioannis$ defaults write com.macromates.textmate OakShellVariables -array-add "{ enabled = 1; variable = PATH; value = '$PATH'; }" && open "/Applications/TextMate.app"
ioannis-kolovos:~ ioannis$ echo $PATH
/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin:/usr/X11/bin:/usr/local/git/bin/
ioannis-kolovos:~ ioannis$

    Tuesday 15 November 2011

    Management

    http://adam.heroku.com/past/2011/4/28/scaling_a_development_team/

    Big pipe

    http://www.juhonkoti.net/bigpipe/example.php






     https://github.com/msroot/bigpipe

    Tuesday 8 November 2011

    window host

    var script = document.createElement('script');
    script.setAttribute('type', 'text/javascript');script.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');
    document.getElementsByTagName('head')[0].appendChild(script);




    $(function() {


        var host =$(location).attr('host');

        var json = {
            "bwired": {
                "sites": [{
                    "domain": "http://jsfiddle.net",
                    "server": "blah"},

                    {
                        "domain": "http://johnkolovos.blogspot.com",
                        "server": "sleeps.on.my.server",
                        }]
                    }
                };





                $.each(json.bwired.sites, function(i, v) {
                    if (v.domain == "http://"+host) {
                        alert(host + " lives on: "+ v.server);
                        return;
                    }

                });
            });

    Sunday 18 September 2011

    Vic's mate paste

    open a new file in TextMate and write this 3 lines:

    tomato
    basil
    garlic


    now do:

     select: tomato and press: command + c
     select: basil and press: command + c
     select: garlic and press: command + c

    one command + c for each line ok?

    now do:

     command + v
     command + shift + v
     command + shift + v

    :)

    Monday 12 September 2011

    ah ?

    if google, apple, twitter and facebook joined forces and went non profit


    Could you imagine?
    That would save the world.

    Goal Settings


    Here are the twelve steps in goal setting.
    The first step is desire
    The second step is belief
    The third step is to write the complete goal in detail
    The fourth step is to determine how you will benefit from accomplishing your goal
    The fifth step is to analyze your current status
    The sixth step is to set a deadline
    The seventh step is to identify the obstacles you will have to overcome to achieve your goal
    The eight step is to clearly identify the knowledge you will require in order to accomplish your goal
    The ninth step is to identify the people, groups and organizations whose cooperation and assistance you will need to attain your goal
    The tenth step is to take all the details you have identified in the last three steps and make a plan
    The eleventh step is to get a clear mental image of your goal as already attained
    The twelfth step is to back your plan with determination, persistence and resolve to never give up

    Tuesday 30 August 2011

    5 Black and White Photography Tips

    http://best-photoshop-tutorials.blogspot.com/2008/12/create-professional-black-and-white.html

    http://www.digital-photography-school.com/5-black-and-white-photography-tips

    Mr. Data Converter

    http://www.shancarter.com/data_converter/index.html

    Saturday 27 August 2011

    Bash Array

    An array is a variable containing multiple values may be of same type or of different type.  There is no maximum limit to the size of an array, nor any requirement that member variables be indexed or assigned contiguously. Array index starts with zero.
    In this article, let us review 15 various array operations in bash.

    This article is part of the on-going Bash Tutorial series. For those who are new to bash scripting, get a jump-start from the Bash Scripting Introduction tutorial.

    1. Declaring an Array and Assigning values

    In bash, array is created automatically when a variable is used in the format like,
    name[index]=value
    • name is any name for an array
    • index could be any number or expression that must evaluate to a number greater than or equal to zero.You can declare an explicit array using declare -a arrayname.
    $ cat arraymanip.sh
    #! /bin/bash
    Unix[0]='Debian'
    Unix[1]='Red hat'
    Unix[2]='Ubuntu'
    Unix[3]='Suse'
    
    echo ${Unix[1]}
    
    $./arraymanip.sh
    Red hat
    To access an element from an array use curly brackets like ${name[index]}.

    2. Initializing an array during declaration

    Instead of initializing an each element of an array separately, you can declare and initialize an array by specifying the list of elements (separated by white space) with in a curly braces.
    Syntax:
    declare -a arrayname=(element1 element2 element3)
    If the elements has the white space character, enclose it with in a quotes.
    #! /bin/bash
    $cat arraymanip.sh
    declare -a Unix=('Debian' 'Red hat' 'Red hat' 'Suse' 'Fedora');
    declare -a declares an array and all the elements in the parentheses are the elements of an a


    3. Print the Whole Bash Array
    There are different ways to print the whole elements of the array. If the index number is @ or *, all members of an array are referenced. You can traverse through the array elements and print it, using looping statements in bash.
    echo ${Unix[@]}
    
    # Add the above echo statement into the arraymanip.sh
    #./t.sh
    Debian Red hat Ubuntu Suse
    Referring to the content of a member variable of an array without providing an index number is the same as referring to the content of the first element, the one referenced with index number zero.

    4. Length of the Bash Array

    We can get the length of an array using the special parameter called $#.
    ${#arrayname[@]} gives you the length of the array.
    $ cat arraymanip.sh
    declare -a Unix=('Debian' 'Red hat' 'Suse' 'Fedora');
    echo ${#Unix[@]} #Number of elements in the array
    echo ${#Unix}  #Number of characters in the first element of the array.i.e Debian
    $./arraymanip.sh
    4
    6

    5. Length of the nth Element in an Array

    ${#arrayname[n]} should give the length of the nth element in an array.
    $cat arraymanip.sh
    #! /bin/bash
    
    Unix[0]='Debian'
    Unix[1]='Red hat'
    Unix[2]='Ubuntu'
    Unix[3]='Suse'
    
    echo ${#Unix[3]} # length of the element located at index 3 i.e Suse
    
    $./arraymanip.sh
    4

    6. Extraction by offset and length for an array

    The following example shows the way to extract 2 elements starting from the position 3 from an array called Unix.
    $cat arraymanip.sh
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    echo ${Unix[@]:3:2}
    
    $./arraymanip.sh
    Suse Fedora
    The above example returns the elements in the 3rd index and fourth index. Index always starts with zero.

    7. Extraction with offset and length, for a particular element of an array

    To extract only first four elements from an array element . For example, Ubuntu which is located at the second index of an array, you can use offset and length for a particular element of an array.
    $cat arraymanip.sh
    #! /bin/bash
    
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    echo ${Unix[2]:0:4}
    
    ./arraymanip.sh
    Ubun
    The above example extracts the first four characters from the 2nd indexed element of an array.

    8. Search and Replace in an array elements

    The following example, searches for Ubuntu in an array elements, and replace the same with the word ‘SCO Unix’.
    $cat arraymanip.sh
    #!/bin/bash
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    
    echo ${Unix[@]/Ubuntu/SCO Unix}
    
    $./arraymanip.sh
    Debian Red hat SCO Unix Suse Fedora UTS OpenLinux
    In this example, it replaces the element in the 2nd index ‘Ubuntu’ with ‘SCO Unix’. But this example will not permanently replace the array content.

    9. Add an element to an existing Bash Array

    The following example shows the way to add an element to the existing array.
    $cat arraymanip.sh
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    Unix=("${Unix[@]}" "AIX" "HP-UX")
    echo ${Unix[7]}
    
    $./arraymanip.sh
    AIX
    In the array called Unix, the elements ‘AIX’ and ‘HP-UX’ are added in 7th and 8th index respectively.

    10. Remove an Element from an Array

    unset is used to remove an element from an array.unset will have the same effect as assigning null to an element.
    $cat arraymanip.sh
    #!/bin/bash
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    
    unset Unix[3]
    echo ${Unix[3]}
    The above script will just print null which is the value available in the 3rd index. The following example shows one of the way to remove an element completely from an array.
    $ cat arraymanip.sh
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    pos=3
    Unix=(${Unix[@]:0:$pos} ${Unix[@]:$(($pos + 1))})
    echo ${Unix[@]}
    
    $./arraymanip.sh
    Debian Red hat Ubuntu Fedora UTS OpenLinux
    In this example, ${Unix[@]:0:$pos} will give you 3 elements starting from 0th index i.e 0,1,2 and ${Unix[@]:4} will give the elements from 4th index to the last index. And merge both the above output. This is one of the workaround to remove an element from an array.

    11. Remove Bash Array Elements using Patterns

    In the search condition you can give the patterns, and stores the remaining element to an another array as shown below.
    $ cat arraymanip.sh
    #!/bin/bash
    declare -a Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora');
    declare -a patter=( ${Unix[@]/Red*/} )
    echo ${patter[@]}
    
    $ ./arraymanip.sh
    Debian Ubuntu Suse Fedora
    The above example removes the elements which has the patter Red*.

    12. Copying an Array

    Expand the array elements and store that into a new array as shown below.
    #!/bin/bash
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    Linux=("${Unix[@]}")
    echo ${Linux[@]}
    
    $ ./arraymanip.sh
    Debian Red hat Ubuntu Fedora UTS OpenLinux

    13. Concatenation of two Bash Arrays

    Expand the elements of the two arrays and assign it to the new array.
    $cat arraymanip.sh
    #!/bin/bash
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    Shell=('bash' 'csh' 'jsh' 'rsh' 'ksh' 'rc' 'tcsh');
    
    UnixShell=("${Unix[@]}" "${Shell[@]}")
    echo ${UnixShell[@]}
    echo ${#UnixShell[@]}
    
    $ ./arraymanip.sh
    Debian Red hat Ubuntu Suse Fedora UTS OpenLinux bash csh jsh rsh ksh rc tcsh
    14
    It prints the array which has the elements of the both the array ‘Unix’ and ‘Shell’, and number of elements of the new array is 14.

    14. Deleting an Entire Array

    unset is used to delete an entire array.
    $cat arraymanip.sh
    #!/bin/bash
    Unix=('Debian' 'Red hat' 'Ubuntu' 'Suse' 'Fedora' 'UTS' 'OpenLinux');
    Shell=('bash' 'csh' 'jsh' 'rsh' 'ksh' 'rc' 'tcsh');
    
    UnixShell=("${Unix[@]}" "${Shell[@]}")
    unset UnixShell
    echo ${#UnixShell[@]}
    
    $ ./arraymanip.sh
    0
    After unset an array, its length would be zero as shown above.

    15. Load Content of a File into an Array

    You can load the content of the file line by line into an array.
    #Example file
    $ cat logfile
    Welcome
    to
    thegeekstuff
    Linux
    Unix
    
    $ cat loadcontent.sh
    #!/bin/bash
    filecontent=( `cat "logfile" `)
    
    for t in "${filecontent[@]}"
    do
    echo $t
    done
    echo "Read file content!"
    
    $ ./loadcontent.sh
    Welcome
    to
    thegeekstuff
    Linux
    Unix
    Read file content!
    In the above example, each index of an array element has printed through for loop.





    http://www.thegeekstuff.com/2010/06/bash-array-tutorial/

    wget

    1. Download Single File with wget

    The following example downloads a single file from internet and stores in the current directory.
    $ wget http://www.openss7.org/repos/tarballs/strx25-0.9.2.1.tar.bz2
    While downloading it will show a progress bar with the following information:
    • %age of download completion (for e.g. 31% as shown below)
    • Total amount of bytes downloaded so far (for e.g. 1,213,592 bytes as shown below)
    • Current download speed (for e.g. 68.2K/s as shown below)
    • Remaining time to download (for e.g. eta 34 seconds as shown below)
    Download in progress:
    $ wget http://www.openss7.org/repos/tarballs/strx25-0.9.2.1.tar.bz2
    Saving to: `strx25-0.9.2.1.tar.bz2.1'
    
    31% [=================> 1,213,592   68.2K/s  eta 34s
    Download completed:
    $ wget http://www.openss7.org/repos/tarballs/strx25-0.9.2.1.tar.bz2
    Saving to: `strx25-0.9.2.1.tar.bz2'
    
    100%[======================>] 3,852,374   76.8K/s   in 55s    
    
    2009-09-25 11:15:30 (68.7 KB/s) - `strx25-0.9.2.1.tar.bz2' saved [3852374/3852374]

    2. Download and Store With a Different File name Using wget -O

    By default wget will pick the filename from the last word after last forward slash, which may not be appropriate always.
    Wrong: Following example will download and store the file with name: download_script.php?src_id=7701
    $ wget http://www.vim.org/scripts/download_script.php?src_id=7701
    Even though the downloaded file is in zip format, it will get stored in the file as shown below.
    $ ls
    download_script.php?src_id=7701
    Correct: To correct this issue, we can specify the output file name using the -O option as:
    $ wget -O taglist.zip http://www.vim.org/scripts/download_script.php?src_id=7701

    3. Specify Download Speed / Download Rate Using wget –limit-rate

    While executing the wget, by default it will try to occupy full possible bandwidth. This might not be acceptable when you are downloading huge files on production servers. So, to avoid that we can limit the download speed using the –limit-rate as shown below.
    In the following example, the download speed is limited to 200k
    $ wget --limit-rate=200k http://www.openss7.org/repos/tarballs/strx25-0.9.2.1.tar.bz2

    4. Continue the Incomplete Download Using wget -c

    Restart a download which got stopped in the middle using wget -c option as shown below.
    $ wget -c http://www.openss7.org/repos/tarballs/strx25-0.9.2.1.tar.bz2
    This is very helpful when you have initiated a very big file download which got interrupted in the middle. Instead of starting the whole download again, you can start the download from where it got interrupted using option -c
    Note: If a download is stopped in middle, when you restart the download again without the option -c, wget will append .1 to the filename automatically as a file with the previous name already exist. If a file with .1 already exist, it will download the file with .2 at the end.

    5. Download in the Background Using wget -b

    For a huge download, put the download in background using wget option -b as shown below.
    $ wget -b http://www.openss7.org/repos/tarballs/strx25-0.9.2.1.tar.bz2
    Continuing in background, pid 1984.
    Output will be written to `wget-log'.
    It will initiate the download and gives back the shell prompt to you. You can always check the status of the download using tail -f as shown below.
    $ tail -f wget-log
    Saving to: `strx25-0.9.2.1.tar.bz2.4'
    
         0K .......... .......... .......... .......... ..........  1% 65.5K 57s
        50K .......... .......... .......... .......... ..........  2% 85.9K 49s
       100K .......... .......... .......... .......... ..........  3% 83.3K 47s
       150K .......... .......... .......... .......... ..........  5% 86.6K 45s
       200K .......... .......... .......... .......... ..........  6% 33.9K 56s
       250K .......... .......... .......... .......... ..........  7%  182M 46s
       300K .......... .......... .......... .......... ..........  9% 57.9K 47s
    Also, make sure to review our previous multitail article on how to use tail command effectively to view multiple files.

    6. Mask User Agent and Display wget like Browser Using wget –user-agent

    Some websites can disallow you to download its page by identifying that the user agent is not a browser. So you can mask the user agent by using –user-agent options and show wget like a browser as shown below.
    $ wget --user-agent="Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.3) Gecko/2008092416 Firefox/3.0.3" URL-TO-DOWNLOAD

    7. Test Download URL Using wget –spider

    When you are going to do scheduled download, you should check whether download will happen fine or not at scheduled time. To do so, copy the line exactly from the schedule, and then add –spider option to check.
    $ wget --spider DOWNLOAD-URL
    If the URL given is correct, it will say
    $ wget --spider download-url
    Spider mode enabled. Check if remote file exists.
    HTTP request sent, awaiting response... 200 OK
    Length: unspecified [text/html]
    Remote file exists and could contain further links,
    but recursion is disabled -- not retrieving.
    This ensures that the downloading will get success at the scheduled time. But when you had give a wrong URL, you will get the following error.
    $ wget --spider download-url
    Spider mode enabled. Check if remote file exists.
    HTTP request sent, awaiting response... 404 Not Found
    Remote file does not exist -- broken link!!!
    You can use the spider option under following scenarios:
    • Check before scheduling a download.
    • Monitoring whether a website is available or not at certain intervals.
    • Check a list of pages from your bookmark, and find out which pages are still exists.

    8. Increase Total Number of Retry Attempts Using wget –tries

    If the internet connection has problem, and if the download file is large there is a chance of failures in the download. By default wget retries 20 times to make the download successful.
    If needed, you can increase retry attempts using –tries option as shown below.
    $ wget --tries=75 DOWNLOAD-URL

    9. Download Multiple Files / URLs Using Wget -i

    First, store all the download files or URLs in a text file as:
    $ cat > download-file-list.txt
    URL1
    URL2
    URL3
    URL4
    Next, give the download-file-list.txt as argument to wget using -i option as shown below.
    $ wget -i download-file-list.txt

    10. Download a Full Website Using wget –mirror

    Following is the command line which you want to execute when you want to download a full website and made available for local viewing.
    $ wget --mirror -p --convert-links -P ./LOCAL-DIR WEBSITE-URL
    • –mirror : turn on options suitable for mirroring.
    • -p : download all files that are necessary to properly display a given HTML page.
    • –convert-links : after the download, convert the links in document for local viewing.
    • -P ./LOCAL-DIR : save all the files and directories to the specified directory.

    11. Reject Certain File Types while Downloading Using wget –reject

    You have found a website which is useful, but don’t want to download the images you can specify the following.
    $ wget --reject=gif WEBSITE-TO-BE-DOWNLOADED

    12. Log messages to a log file instead of stderr Using wget -o

    When you wanted the log to be redirected to a log file instead of the terminal.
    $ wget -o download.log DOWNLOAD-URL

    13. Quit Downloading When it Exceeds Certain Size Using wget -Q

    When you want to stop download when it crosses 5 MB you can use the following wget command line.
    $ wget -Q5m -i FILE-WHICH-HAS-URLS
    Note: This quota will not get effect when you do a download a single URL. That is irrespective of the quota size everything will get downloaded when you specify a single file. This quota is applicable only for recursive downloads.

    14. Download Only Certain File Types Using wget -r -A

    You can use this under following situations:
    • Download all images from a website
    • Download all videos from a website
    • Download all PDF files from a website
    $ wget -r -A.pdf http://url-to-webpage-with-pdfs/

    15. FTP Download With wget

    You can use wget to perform FTP download as shown below.
    Anonymous FTP download using Wget
    $ wget ftp-url
    FTP download using wget with username and password authentication.
    $ wget --ftp-user=USERNAME --ftp-password=PASSWORD DOWNLOAD-URL
    If you liked this article, please bookmark it with delicious or Stumble.


    http://www.thegeekstuff.com/2009/09/the-ultimate-wget-download-guide-with-15-awesome-examples/