Archive for Aralık, 2010

Get Top Weekly Artist Chart to your Web site with PHP


I enjoy to play with json and xml files but did not use simplexml before. Dean Harris has a great script that pulls top tracks from I needed one that is gonna pull the weekly chart. Changed his script a bit and here is the result.


Source Code

// Set up the required variables first
$method = "user.getweeklyartistchart"; //Enter method. Visit for more methods
$username = "username"; // Enter your username here
$apikey = "api key"; // Enter your API Key here. Visit if you dont have one
$limit = 5; //Enter the number of artist will be displayed

// Construct the URL, and feed it through SimpleXML
$feed = simplexml_load_file("".$method."&user=".$username."&api_key=".$apikey);

//Get Artists
$artist = $feed->weeklyartistchart->artist;

//Print Chart
	$a = $artist[$i];
	echo "#".($i+1)." - url."'>".$a->name." - ".$a->playcount." plays 
"; }

You can also visit, generate your chart style and get the list to your website.



17,12,2010 at 12:19 1 yorum

Hosting Git on GitHub and Dreamhost (Mac OS X & Windows)


Installing Git on Mac OS X

Installing the latest version of Git on OS X is pretty easy.

  1. Go to and download/install the suitable version for your system (I downloaded git-

Setup GitHub Repository

	Username: "goksel"
	E-mail : ""
	Project Name: "project"
	Remote Project Url : ""
	Local Project Folder : "/Library/WebServer/Documents/project"

We are ready to setup our Repo:

  1. 			git config --global "Goksel Eryigit"
    			git config --global ""
    			ssh-keygen -t rsa -C ""
  2. 			cat ~/.ssh/ | pbcopy
  3. Go to GitHub Account Settings > SSH Public Keys > Add another public key and paste the key you copied to key field.
  4. 			cd /Library/WebServer/Documents
    			git clone

Setup Dreamhost Git Repository

	SSH User: "goksel"
	Host: ""
	Project Name : "project"
	Remote Repo Location : "/~/git/project.git" (means "/home/goksel/git/project.git")"
	Local Repo Location : "/Library/WebServer/Documents/project"

We are ready to setup our Dreamhost Repo:

  1. 			git config --global "Goksel Eryigit"
    			git config --global ""
    			ssh-keygen -t rsa
  2. 			scp ~/.ssh/
  3. 			ssh
  4. 			mkdir .ssh
    			cat >> .ssh/authorized_keys
    			chmod go-w ~
    			chmod 700 ~/.ssh
    			chmod 600 ~/.ssh/authorized_keys
    			eval `ssh-agent`
  5. 			mkdir git
    			mkdir git/project.git
    			cd git/project.git
    			git --bare init
  6. 			cd /Library/WebServer/Documents
    			git clone ssh://

Installing Git on Windows

We will install 3 software to run Git; Msysgit (Basic Git Tool), TortoiseGit (Git Client for Windows) and Putty (Helps us to SSH to Remote)
  1. Download and install Msysgit.

  2. Download and install TortoiseGit.

  3. Download and install Putty (Find Installer Version)

  4. Run Git Bash

  5. Run these commands:

    			git config --global "Your Name"
    			git config --global

    Now your Git username and email is created on your local.

  6. Now run Pageant and Puttygen, generate keys, copy Public Key, save Private Key in Putty Format (ppk) to a safe place and add to Pageant.


  1. Go to GitHub, create a project, go to Account Settings > SSH Public Keys > Add another public key and paste key into key field and hit Add Key.

  2. Go to, get your github remote git url and clone your repo (by right click on local) to your local server with tortoisegit

Git on Dreamhost

There are two connection ways that you can setup your repository on Dreamhost: Html (WebDav) and SSH


Webdav allows more then one user to push to the same repo but also slow.

There are two great posts that will help you to setup your repo: and


I give the commands that will help you a lot. My SSH username is “goksel”, Remote Host is “” and I will run my Remote Repo at “~/git/project.git” so I SSH with Git Bash (or Terminal) and :

	ssh-keygen -t rsa
	scp ~/.ssh/
	mkdir .ssh
	cat >> .ssh/authorized_keys
	chmod go-w ~
	chmod 700 ~/.ssh
	chmod 600 ~/.ssh/authorized_keys
	eval `ssh-agent`
	mkdir git
	mkdir git/project.git
	cd git/project.git
	git --bare init
	git clone ssh://

You must see a project folder on your local server after clone command.

If you want your changes to be deployed on a live site you should play with hook files (On remote, under project.git/hooks)

Some very helpful posts

If you want to run an SVN Repo on Dreamhost please visit


11,12,2010 at 20:20 Yorum bırakın

Pure CSS3 box-shadow page curl effect


<ul class="box">
</ul> {
margin: 0;
padding: 0; } li {
list-style-type: none;
margin: 0 30px 30px 0;
padding: 0;
width: 250px;
height: 150px;
border: 1px solid #efefef;
position: relative;
float: left;
background: #ffffff; /* old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* ie */
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3); } li:after {
z-index: -1;
position: absolute;
background: transparent;
width: 70%;
height: 55%;
content: '';
right: 10px;
bottom: 10px;
-webkit-transform: skew(15deg) rotate(5deg);
-webkit-box-shadow: 8px 12px 10px rgba(0, 0, 0, 0.3);
-moz-transform: skew(15deg) rotate(5deg);
-moz-box-shadow: 8px 12px 10px rgba(0, 0, 0, 0.3); } li:before {
z-index: -2;
position: absolute;
background: transparent;
width: 70%;
height: 55%;
content: '';
left: 10px;
bottom: 10px;
-webkit-transform: skew(-15deg) rotate(-5deg);
-webkit-box-shadow: -8px 12px 10px rgba(0, 0, 0, 0.3);
-moz-transform: skew(-15deg) rotate(-5deg);
-moz-box-shadow: -8px 12px 10px rgba(0, 0, 0, 0.3); }

Handcoded in Coda with love by Matt Hamm
thanks to for the inspiration.


07,12,2010 at 17:10 1 yorum

Writing Efficient CSS for use in the Mozilla UI


Post Source

This document provides guidelines for optimizing CSS code for use in the Mozilla UI.

The first section is a general discussion of how the Mozilla style system categorizes rules. The following sections contain guidelines for writing rules that take advantage of Mozilla’s style system implementation.

How the style system breaks up rules

The style system breaks rules up into four primary categories:

  1. ID Rules
  2. Class Rules
  3. Tag Rules
  4. Universal Rules

It is critical to understand these categories, as they are the fundamental building blocks of rule matching.

I use the term key selector in the paragraphs that follow. The key selector is the last part of the selector (the part that matches the element being matched, rather than its ancestors).

For example, in the rule…

                a img, div > p, h1 + [title] {…}

…the key selectors are


, and


ID Rules

The first category consists of those rules that have an

selector as their key selector.

                        button#backButton {…} /* This is an ID-categorized rule */
                        #urlBar[type="autocomplete"] {…} /* This is an ID-categorized rule */
                        treeitem > treerow > treecell#myCell:active {…} /* This is an ID-categorized rule */

Class Rules

If a rule has a

specified as its key selector, then it falls into this category.

                        button.toolbarButton {…} /* A class-based rule */
                        .fancyText {…} /* A class-based rule */
                        menuitem > .menu-left[checked="true"] {…} /* A class-based rule */

Tag Rules

If no


is specified as the key selector, the next candidate is the tag category. If a rule has a tag specified as its key selector, then the rule falls into this category.

                        td {…} /* A tag-based rule */
                        treeitem > treerow {…} /* A tag-based rule */
                        input[type="checkbox"] {…} /* A tag-based rule */

Universal Rules

All other rules fall into this category.

                        [hidden="true"] {…} /* A universal rule */
                        * {…}    /* A universal rule */
                        tree > [collapsed="true"] {…} /* A universal rule */

How the Style System Matches Rules

The style system matches rules by starting with the key selector, then moving to the left (looking for any ancestors in the rule’s selector). As long as the selector’s subtree continues to check out, the style system continues moving to the left until it either matches the rule, or abandons because of a mismatch.

The most fundamental concept to learn is this rule filtering. The categories exist in order to filter out irrelevant rules (so the style system doesn’t waste time trying to match them).

This is the key to dramatically increasing performance. The fewer rules required to check for a given element, the faster style resolution will be.

For example, if an element has an ID, then only ID rules that match the element’s ID will be checked. Only Class Rules for a class found on the element will be checked. Only Tag Rules that match the tag will be checked. Universal Rules will always be checked.

Guidelines for Efficient CSS

Avoid Universal Rules

Make sure a rule doesn’t end up in the universal category!

Don’t qualify ID Rules with tag names or classes

If a rule has an ID selector as its key selector, don’t add the tag name to the rule. Since IDs are unique, adding a tag name would slow down the matching process needlessly.

Exception: When it’s desirable to change the

of an element dynamically in order to apply different styles in different situations, but the same

is going to be shared with other elements.

button#backButton {…}

.menu-left#newMenuIcon {…}

#backButton {…}

#newMenuIcon {…}

Don’t qualify Class Rules with tag names

The previous concept also applies here.  All class names are unique.

One convention you can use is to include the tag name in the class name.  However, this may cost some flexibility; if design changes are made to the tag, the class names must be changed as well.  (It’s best to choose strictly semantic names, as such flexibility is one of the aims of separate stylesheets.)


treecell.indented {…}

.treecell-indented {…}

.hierarchy-deep {…}

Use the most specific category possible

The single biggest cause of slowdown is too many rules in the Tag Category. By adding

es to our elements, we can further subdivide these rules into Class Categories, which eliminates time spent trying to match rules for a given tag.


treeitem[mailfolder="true"] > treerow > treecell {…}

.treecell-mailfolder {…}

Avoid the descendant selector

The descendant selector is the most expensive selector in CSS. It is dreadfully expensive—especially if the selector is in the Tag or Universal Category.

Frequently, what is really desired is the child selector.  Using the descendant selector is banned in User Interface CSS without the explicit approval of your skin’s module owner.


treehead treerow treecell {…}
BETTER, BUT STILL BAD (see next guideline)

treehead > treerow > treecell {…}

Tag Category rules should never contain a child selector

Avoid using the child selector with Tag Category rules. This will dramatically lengthen the match time (especially if the rule is likely to be matched) for all occurrences of that element.


treehead > treerow > treecell {…}

.treecell-header {…}

Question all usages of the child selector

Exercise caution when using the child selector. Avoid it if you can.

In particular, the child selector is frequently used with RDF trees and menus like so:


treeitem[IsImapServer="true"] > treerow > .tree-folderpane-icon {…}

Remember that REF attributes can be duplicated in a template! Take advantage of this.  Duplicate RDF properties on child XUL elements in order to change them based on the attribute.


.tree-folderpane-icon[IsImapServer="true"] {…}

Rely on inheritance

Learn which properties inherit, and allow them to do so!  

For example, XUL widgets are explicitly set up such that a parent’s 


rules will filter down to anonymous content. It’s not necessary to waste time on rules that talk directly to anonymous content.


#bookmarkMenuItem > .menu-left { list-style-image: url(blah) }

#bookmarkMenuItem { list-style-image: url(blah) }

In the above example, the desire to style anonymous content (without leveraging the inheritance of 

) resulted in a rule that was in the Class Category, when the rule should have ended up in the ID Category—the most specific category of all!

Remember: Elements all have the same classes—especially anonymous content!

The above “bad” rule forces every menu’s icons to be tested for containment within the bookmarks menu item. Since there are many menus, this is extraordinarily expensive.  Instead, the “good” rule limits the testing to the bookmarks menu.



Putting a bunch of images into a single image file and selecting them with


performs significantly better than putting each image into its own file.

Original Document Information


05,12,2010 at 19:59 Yorum bırakın

Web Designers vs Developers

<![CDATA[Like this comparison!]]>

03,12,2010 at 3:33 Yorum bırakın

Custom Snippets in Aptana 3


Aptana Snippets

There are some very useful snippets in Aptana like auto building Html tags (Type “div” and hit “Tab” then Aptana will generate “<div id=”name”></div>” for you) but most amazing thing is its very easy to create your own snippets.

If you are using “console.log()” function a lot like me then writing a snippet for this function will save a lot of time for you.

To add a “console.log()” shortcut key

  1. Create a new project and go to project folder (where your “.project” is found)
  2. Download
  3. Extract the zip content to the root of your project folder. The folder hierarchy :
  4. And restart Aptana 3.
  5. Now open an Html file, select a text and hit “Shift+Command+.”
require 'ruble'

with_defaults :scope => 'text.html,source.js,source.php source.php.embedded.block.html', :input => :none, :output => :insert_as_snippet do |bundle|
	command 'console.log()' do |cmd|
		cmd.key_binding = 'M1+M2+.'
		cmd.input = :selection
		cmd.invoke do |context|
		  selection = ENV['TM_SELECTED_TEXT'] || ''
		  if selection.length > 0

Visit and for more


01,12,2010 at 8:32 Yorum bırakın