Resizing <Table> with CSS. Staying within the wrapper

Having issues with keeping the table as the same size of the wrapper or parent? See code below.

<style>
    /*Center the content*/
    #wrapper {
        margin: 0px auto;
        width: 230px;
        height: 100px;
        background: grey; /*this is only to show how the table is within the wrapper*/
    }
    table {
        table-layout:fixed; /*makes the table to be a specific size*/
        width: inherit; /*need to be include to make the table specific size*/
    }
    input {
        width: 100%;/*size of the input box, keeps the table inside the wrapper*/
    }
    th{
       overflow: hidden; /* hides text overflowing the field*/
    }
</style>     

   
<div id="wrapper">
<table border="1">
    <tr>
        <th id="livesearch">Date</th>
        <th id="livesearch2">First_Name</th>
        <th id="livesearch3">Last_Name</th>
    </tr>
    <tr>
        <!--the onfocus and onblur what makes the <th> resize when selected, this is not necessary to make the table a fixed size-->
        <td ><input onfocus="document.getElementById('livesearch').style.width='100px';" onblur="document.getElementById('livesearch').style.width='auto';"class="date" type="text" /></td>
        <td> <input onfocus="document.getElementById('livesearch2').style.width='100px';" onblur="document.getElementById('livesearch2').style.width='auto';" class="type" type="text" /></td>
        <td> <input onfocus="document.getElementById('livesearch3').style.width='100px';" onblur="document.getElementById('livesearch3').style.width='auto';" class="type" type="text" /></td>
    </tr>
</table>
</div>

Notes: Overflow in table, wrap text in table, table width

DOMDocument, accessing other sites HTML. Bypassing the Same Origin Policy

Below is a code that retrieves <a> tags from a webpage outside the server using the DOMDocument. A built in PHP class that retrieves HTML and XML from a webpage. Bypassing the Same Origin Policy. This is an alternative to cURL which downloads the entire HTML page.

$keywords = array();
$domain = array('http://bing.com');//select website to extract

$doc = new DOMDocument;
$doc->preserveWhiteSpace = FALSE;

foreach ($domain as $key => $value) {
    @$doc->loadHTMLFile($value); //Load HTML from a file
    $anchor_tags = $doc->getElementsByTagName('a'); //get <a> tags by accessing the DOM
    foreach ($anchor_tags as $tag) {
        $keywords[] = strtolower($tag->nodeValue);
    }
}
echo '
';
print_r ($keywords);
echo '
';

Don't be specific

When coding, you should attempt to be the least specific as possible. One way to achieve this is by using more variables.

This is beneficial because if you ever need to update your code you only do it at one location, easy maintenance. I created an application that fetched data from a database. But coded using code specific to a table and database at multiple locations in the app. When I decided to change the table I would get an error because different parts of the code was requesting data from different tables. It took me hours to search through my code to match all these request.

Quote: Stand up

"It is the first responsibility of every citizen to question authority".
-Benjamin Franklin, one of the Founding Fathers of the United States

Setting the input className to the object value

The code below creates and set the value of the object when filling out a form. This can be used for POST or GET method request.

<input type="text" class="balls" />
<input type="text" class="bat" />
<script>
var stat = {
   data: {date: '2011-02-01', type: 'balls'},
   column: //sets the value to stat.data 
       function(){
           $('input').focusout(function () {
               var attr = $(this).attr("class");//get the attribute (className) of tag
               //create and set value for the object
               stat.data[attr] = $(this).val(); //set value to stat.data 
           });
       }() //this autostarts the function 
}
<script/>

From locahost/stats website

Optical character recognition (OCR)

Optical character recognition

I had a scanned document on my computer as an image and I didn't want to type the whole thing out nor did I have expensive software to covert the text on the image to "encoded text". I found a free software called onlineocr. It does exactly that, I wished I had something like this back in college.

Don't Think

Don't think. Want to get it done? Don't think. If you do think you will think about how long it will take, think about the chances of failing, think about another time to do it (procrastination), think yourself out of it. Don't Think, DO.

Chrome is Pissing me Off

I've been programming lately and this week I had Google Chrome web browser not work correctly. I was using jQuery JSON and AJAX, and tried to view a webpage source and these three instances didn't work in Chrome but worked perfectly in Firefox. I don't know if the issue is because I'm using it natively on my desktop to test, I hope it is. Chrome is a good browser to surf the internet but not the best to test your code. Imagine the frustration of coming to a conclusion that a code doesn't work but later finding out it works because chrome doesn't work when using local files. That's a bunch a BS.

I would say "I hope they fix that" but I'm going to do what I can control. I'm switching to Firefox.

Javascript Object Inheritance and Overwriting - Using Constructors

Read the comments(green text) in the code below

function shape(){ 
    this.name='shape';
    this.tostring = function() {return this.name;};
}

function TwoDshape(){ 
    this.name = '2D shape';
 }

function Triangle(side,height){
    this.name = 'Triangle';
    this.side = side;
    this.height = height; 
    this.getArea = function(){return this.side * this.height /2;}; 
}

//Inheritance 
//overwriting objects sort of. if you print the TwoDshape.constructor it will show the assigned object but all the properties from inside both functions are accessible unless one has the same name, the original is printed so below shape() properties is added to TwoDshape() and TwoDshape() is added to Triagle(). making Triangle() have itself and shape() and TwoDshape() propeties within 

TwoDshape.prototype = new shape(); 
Triangle.prototype = new TwoDshape(); 



//good idea to reset the constructor after inheriting, because overwrite the object has negative side effects 
TwoDshape.prototype.constructor = TwoDshape; 
Triangle.prototype.constructor = Triangle; http://www.blogger.com/img/blank.gif

var my = new Triangle(5,10);
document.write(my.getArea()); 
document.write(my.tostring()); 

The output is 25Triangle

Another example of javascript inheritance using the pure object

Special Thanks Object-Oriented Javascript

jQuery AJAX .load()

jQuery AJAX is wonderfully powerfull. The more I use it the more I like it. Its very simple compared to the pure AJAX javascript code. jQuery has a couple of different AJAX syntax but the simplest is the .load(). Choose which element you want to target and which location/file you want to pull content from. Barabam AJAX.

Example:
$('div').load('test.html');
Above changes the div tag in current page to the test.html

One cool feature is the ability to pull a selected portion of the location by having a space after the location name and specifying the part.

Example:
$('div').load('test.html #content');
Above changes the div tag in current page to the test.html where the id equals "content"

More information check .load() – jQuery API

MySQL Cheat Sheet

MySQL Commands

//select database
mysql> use [databasename]

//show all databases
mysql> show databases;

//show database tables
mysql> show tables;

//describe table, must have the database selected
mysql> show tables;

//a search query that allow regular expressions
SELECT * FROM customers WHERE city like 'Air%';

//create table, must have a type after the name. eg: name=customerid, type=text
create table books
(customerid text, name text);

//delete table
drop table balls;

//insert values
insert into customers values
(null,'blahblah', 3);

//connecting subqueries
select name from customers where customers.customerid = any (select orders.orderid from orders,order_items where orders.orderid = order_items.orderid);

//Update record
update books set price = price1.1;

//alter table, add columns. its like create table, name and type
alter table books
add (tax text);

alter table books
drop tax;

//delete record
delete from customers
where cus

Center HTML/Webpage

To center your webpage its simple. By setting the width and margin you can achieve this. However, depending on the browser (Internet Explorer) you must include the doctype or it will not work. See the code below

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<body>

<html>

<style>

#main { 

  width: 900px; 

  margin: 0 auto; 

}

</style>

</head>

<body>

<div id="main">



    



</div>

</body>

</html>

Quote: Stick to it

Steve Jobs stepped down as CEO at Apple today. He is an inspiration to me and many others through his products, life and beliefs.

The problem with the Internet startup craze isn’t that too many people are starting companies; it’s that too many people aren’t sticking with it. That’s somewhat understandable, because there are many moments that are filled with despair and agony, when you have to fire people and cancel things and deal with very difficult situations. That’s when you find out who you are and what your values are.
So when these people sell out, even though they get fabulously rich, they’re gypping themselves out of one of the potentially most rewarding experiences of their unfolding lives. Without it, they may never know their values or how to keep their newfound wealth in perspective. -Steve Jobs

Frameworks

Don't reinvent the wheel. Below are frameworks that allow you to code without having to start from scratch.

HTML - Boilerplate

PHP - CodeIgniter

CSS - Twitter Bootsrap

CSS structure - 960

Javascript - jQuery

Self-discipline

Simple definition to self-discipline

The ability to make yourself do, what you know you should do, when you should do it, when you feel like it or not. That's the difference between success and failer is whether you feel like it or not. -Brian Tracy

Giveaway

This is baligena first Giveaway. What better way to thank all you who been supporting the site. baligena will be giving an iPod shuffle. The giveaway starts today and ends on September 3rd 2011.




Now here is how to win

1. First you must subscribe to my feed by putting your email under "Follow by Email" on the left sidebar and click submit.

2. Leave a comment on any of my post saying "This is the first comment".

Just Try

"There is nothing impossible to him who will try." - Alexander The Great

Principle of Least Privilege

The principle of least privilege can be used to improve the security of any computer system. It's a basic but important principle that is often overlooked. The principle is as follows:

A user (or process) should have the lowest level of privilege required to perform his assigned task.

It applies in MySQL as it does elsewhere. For example, to run queries from the Web, a user does not need all the privileges to which "root" has access. You should therefore create another user who has only the necessary privileges to access the database you just created.

Excerpt from PHP and MySQL Web Development page 223

Quote: The climb is the best part

"To climb up the mountain is the best thing. you know preparing for it. Living every day in practice, working hard, talking about it, seeing the commitment out of the kids, everybody on the team is at practice, 100 percent all the time and just working hard every day. That’s where the comradely happens that’s where you bond and hopefully when you get the chance you'll be able to do it" -Russ Cozart Brandon High School Wrestling Coach

Cozart makes this statement in an interview about the next chance he gets at the National High School Dual Meet Wrestling Tournament after lost in the finals.

Watch the interview

Youtube Data API

Below is a PHP script that uses Youtube API through xml to show the comments on your personal website.

I didn't include any CSS.
Use this link a reference
http://code.google.com/intl/it-IT/apis/youtube/2.0/developers_guide_protocol.html

<?php

//// video id

$videoId='M1Wm9nGJcYo';



//echo the video

echo "";



// url where feed is located

$url="http://gdata.youtube.com/feeds/api/videos/$videoId/comments";



// get the feed

$comments=simplexml_load_file($url);



// parse the feed using a loop

foreach($comments->entry as $comment)

{

echo '
'. $comment->content .'

'. $comment->author->name  .'
';

}







?>