Maribol Labs

Add error image when a image is not found

Samuel Marian — Thu, 24 Nov 2011 12:18:35 +0000

When creating a website, a priority is to make your website load faster. That’s good!
But what are you doing if your website is embeding some images who doesn’t exist?

Example:

View Code HTML

If the image (my-image.jpg in our example) doesn’t exist, your website will get loaded more slowly but if you user the .error event from jQuery you can solve this problem easily.

Example:

View Code JAVASCRIPT

$(document).ready(function() {
	$('img').error(function(){
		$(this).attr('src', 'http://example.com/image-not-found.jpg);
	});
});

So this script changes the image source to the error image (image-not-found.jpg) in our example) and your should not have any problem visiting your website.

First post in “A day in the life of a developer”

Samuel Marian — Mon, 21 Nov 2011 08:34:19 +0000

Lately i started to write more in English and Romanian and i just tinked that i should write something about how i spend my days as a web developer.
If you would like to know that someone reads my articles and it will be a pleasure for me to write.

I also write in Romanian sometimes on my other blog Maribol.ro – Blog & Photo.

Anyway this is my first personal blog post here so i’d like to know that somebody reads what i write and tell me their opinion.

I’m that guy from the right side of this post so that you know who do you read.

How to create a Move Up and Move Down button using jQuery

Samuel Marian — Fri, 11 Nov 2011 11:44:22 +0000

I’m sorry i haven’t posted new tutorials for a long time.
And very soon i’ll update the wordpress plugin Maribol IMDB.

So what i would like to teach you today is how to move an element using the powerfull jQuery.

Let’s asume that you want to order the order for some text inputs

HTML structure:

View Code HTML

Javascript:

View Code JAVASCRIPT

    $(document).ready(function() {
        $('.moveUp').click(function(){
            var current = $(this).parent();
            current.prev().before(current);
        });
        $('.moveDown').click(function(){
            var current = $(this).parent();
            current.next().after(current);
        });
    });

View demo here

If you have any question please leave them in the comments section.

Using AJAX and PHP together

Samuel Marian — Sun, 14 Aug 2011 18:21:58 +0000

In this tutorial i’ll show you how to use PHP and AJAX together and get the results that you need.

Here’s an example of a function that executes a ajax request

View Code JAVASCRIPT

function execAjax(type){
   $.ajax({
      url: 'ajax.php?type='+type,
      dataType: 'json',
      success: function( data ) {
         var items = [];
 
         $.each(data, function(key, val) {
            items.push('+ key + '">' + val + '
');
         });
 
         $('#results').html(
            $('', {
               'class': 'results-list',
               html: items.join('')
            })
         );
      }
   });
}

This function should add a list with all the items resulted from the request.

Example of use:

View Code HTML

fruits
vegetables
furniture

And the ajax.php return an array encoded in json.

View Code PHP

$results = array(
   'fruits' => array(
      'apple',
      'bannana',
      'orange'
   ),
   'vegetables' => array(
      'potato',
      'carrot',
      'onion'
   ),
   'furniture' => array(
      'chair',
      'desk'
   )
);
 
$type = $_GET['type'];
 
echo json_encode($results[$type]);

If we’ve clicked on the “fruits” link, will get a result like:

View Code JSON

["apple","bannana","orange"]

This encoded array will be transformed in list with the “each” function from jquery and the result that you should see is:

View Code HTML


   
      apple
      bannana
      orange

Security Tutorial #2: Are you protected against sql injections?

Samuel Marian — Sat, 16 Jul 2011 12:34:42 +0000

There are alot of websites that are vulnerable to sql injections.
In this tutorial i’ll give you some examples with methods to protect you website.

Make your id from url (int)

Let’s assume that you get the id like this:

View Code PHP

   $id = $_GET['id'];

Well with this, your site may be vulnerable.

But if you use like this it will never be vulerable from this variable:

View Code PHP

   $id = (int)$_GET['id'];

Basically this will make your id an id, i mean the value returned is always numeric.

Use the mysql_real_escape_string function
This function may help you alot!

View Code PHP

$city = $_GET['city'];
$sql = mysql_query('SELECT firstname, lastname FROM people WHERE city="'.mysql_real_escape_string($city).'" ');

Note: if magic_quotes_gpc is enabled you should use:

View Code PHP

$city = stripslashes($_GET['city']);
$sql = mysql_query('SELECT firstname, lastname FROM people WHERE city="'.mysql_real_escape_string($city).'" ');

Maribol Personal – WordPress Theme

Samuel Marian — Fri, 15 Jul 2011 22:16:09 +0000

Maribol Personal is a free wordpress theme with a very simple design but it looks pretty.

Demo: here

Download: here

Security Tutorial #1: Password hashing

Samuel Marian — Thu, 14 Jul 2011 15:10:23 +0000

In the past two years i’ve used many methods to hash a password. The best method i used is by adding a salt and then encrypting with md5.

If you encrypt a password without a salt is more easily (but almost impossible) to find the password.

It’s important to know that if you want to make a login system you have to chose a salt and never change it.

An example how to encrypt:

View Code PHP

$string = 'password';
$salt = '!@#$%^&*()_+';
echo md5($string.$salt)

This code should result and md5 string like:
bbadaec5c53ce3065d14cbe938640088

This is the first tutorial in a series of tutorials dedicated to your site security

Maribol IMDB – WordPress Plugin

Samuel Marian — Tue, 12 Jul 2011 20:21:24 +0000

Maribol IMDB is a wordpress plugin that helps you show info about a movie in your blog posts.

Example of usage:

View Code BBCODE

[imdb]tt1399103[/imdb]
Title: [imdb:title] ([imdb:year])
Duration: [imdb:duration]
Director: [imdb:director]

And the result should be:

View Code HTML

Title: Transformers: Dark of the Moon (2011)
Duration: USA: 157 min
Director: Michael Bay

Available Fields

View Code BBCODE

[imdb:title]
[imdb:year]
[imdb:description]
[imdb:short_description] // since 0.2 version
[imdb:poster]
[imdb:poster_small] // since 0.3 version
[imdb:duration]
[imdb:categories]
[imdb:director]
[imdb:cast]
[imdb:writers]
[imdb:language]
[imdb:release_date]
[imdb:filming_locations]
[imdb:rating] // since 0.3 version

Download this plugin at WordPress.org

Transform image to Base64

Samuel Marian — Thu, 23 Jun 2011 18:36:57 +0000

Lately i’ve seen very often in email newsletters images embed with base64.
If you send email newsletters containing image, this is the best way to send.

First we try to open the file.

View Code PHP

   $file_path = 'my-image.jpg';
   if($fp = fopen($file,"rb", 0)){
   }else{
      echo 'Can\'t open file';
   }

If the file exist and we have all the rights we need to open it, we read the binary data.

View Code PHP

   $picture = fread($fp,filesize($file));
   fclose($fp);

After we have the binary data of the image wi’ll encode it to base64 and then break it into chunks according to RFC 2045 semantics and we display the html code in a textarea.

View Code PHP

   $base64 = chunk_split(base64_encode($picture));
   $tag = '<span style="color: #339933;">.</span><span style="color: #000088;">$base64</span><span style="color: #339933;">.</span><span style="color: #0000ff;">'"  />';
   echo $tag;

..and the final code:

View Code PHP

   $file_path = 'my-image.jpg';
   if($fp = fopen($file,"rb", 0)){
      $picture = fread($fp,filesize($file));
      fclose($fp);
      $base64 = chunk_split(base64_encode($picture));
      $tag = '<span style="color: #339933;">.</span><span style="color: #000088;">$base64</span><span style="color: #339933;">.</span><span style="color: #0000ff;">'"  />';
      echo $tag;
   }else{
      echo 'Can\'t open file';
   }

How to make a search engine on your site. The good method.

Samuel Marian — Tue, 31 May 2011 18:35:58 +0000

Okay, so many people think that if you make a search engine on your site with query like the one below, it’s okay.

View Code SQL

SELECT id,name,post FROM posts WHERE name LIKE '%my key%'

But it’s not!

Because:
Let’s assume that you have a post called: My little post name

If you make a search in your database like:

View Code SQL

SELECT id,name,post FROM posts WHERE name LIKE '%little post%'

you will get a result.

But if you make a search in your database like:

View Code SQL

SELECT id,name,post FROM posts WHERE name LIKE '%my post%'

you will not get any result.

Okay so the method i use is like this:

View Code SQL

SELECT id,name,post FROM posts WHERE (name LIKE '%my%' AND name LIKE '%post%')

and this query will get a result.

How to do:

First we split the string by space with the explode() function and the result is an array with two items.

View Code PHP

$query = 'my post';
$query_items = explode(' ', trim($string))

After that, we use the implode() function to create the condition

View Code PHP

$addToQuery = '';
foreach($query_items as $item){
	$addToQuery .= ' AND name LIKE "%'.$item.'%"';
}
$addToQuery .= '';

The above code should result something like:

View Code SQL

 AND name LIKE "%my%" AND name LIKE "%post%"

Now we have to add this string to SQL Query:

View Code PHP

$sql = 'SELECT id,name,post FROM posts WHERE 1 '.$addToQuery.' ORDER BY id DESC';