Posted by & filed under Uncategorized.

I’ve been learning AngularJS and one of the greatest things I found it was the argument injection on Controllers which made me wonder how can that be achieved , so I give it a try and came with this snippet. As you can see in the code I’m converting the function to a string and parsing the argument names , so I first define a set of references like jQuery, Underscore and inject them into the function.

Posted by & filed under Uncategorized.

Tableless design is one of the good practices to follow , using tables in forms might not be so harmful for CSS redesign sometimes, but you rather change the CSS styles instead of the structure.

VIEW:

HTML:

CSS:

Posted by & filed under javascript, Uncategorized.

Posted by & filed under Uncategorized.

Finding a fast way to create elements, every browser works differently and this can make some simple tasks fast or slow, I find sometimes a hard dilema using innerHTML I know is easy and lazy for programmers in the other hand the DOM methods such a createElement, appendChild, createTextNode are elegant, understandable but is just to much code for a small piece of HTML maybe templating your HTML would be better.

Anyway I did some speed tests with the following code (you should try it).

//Chrome
690 ms //Dom Methods
1577 ms //innerHTML

//Opera
1930 ms //Dom Methods
1819 ms //innerHTML

//Firefox
538 ms //Dom Methods
3300 ms //innerHTML

//Safari
782 ms //DOM Methods
722 ms //innerHTML

JSPERF TESTS
http://jsperf.com/innerhtml-vs-createelement-appendchild

After few days testing DOM Methods speed WINS, but the code is just to big so we need to use a js minifier like
http://www.crockford.com/javascript/jsmin.html
http://jscompress.com/
to reduce your script size and speed up the download.

I’m currently working in a simple tool that converts your HTML string to DOM Methods but it just work in the browser I’m taking advantage of the browser DOM parser, I guess I’ll require a DOM Parser if I want to run it in another environment, you can check it here.
http://labs.ramonlechuga.com/DOMMethodfy/
Source:
https://github.com/alejandrolechuga/DOMMethodfy

Posted by & filed under javascript.

When I’m working with an object and I need to check a property, I cannot go straight up I always first check if this one exists, but we have different ways to check them, before I used to do this.

It works when the property is undefined, but if the property has false ,zero(0), or empty string (“”) it wont work as we wanted.

Other way is checking if it has its own property by using

But here you are just checking the properties that come with the object, not the ones that are inherited by the prototype chain. So in case you want to check all the properties use this code.

It’s really annoying checking long objects structures

Try this snippet:

Posted by & filed under javascript.

Here we have a good article about keeping private properties in your JavaScript kinda Java , well we know that JavaScript is not enough good for Object Orientation but it has a lot good parts :) is very flexible.

Here we have the normal way for making “Classes”

[cc lang="javascript"]
var myClass = function () {
//this is like the constructor
};
myClass.prototype.myMethod = function () {
//wow a method :D
};
var myClassInstance = new myClass();
[/cc]

Well we know that everybody who use firebug or javascript pretty often could have access to this objects, so a good way for keep this objects not accesible to the window parent object.. is doing this

[cc lang="javascript"]
(function(){
var myClass = function () {
//this is like the constructor
};
myClass.prototype.myMethod = function () {
//wow a method :D
};
var myClassInstance = new myClass();
});
[/cc]
And this way is to keep your properties private even from your own objects (I took this method from the Douglas Crockford website), the problem here is that you just access from public to private properties, and private don’t have access to public.
[cc lang="javascript"]
var myClass = (function () {
function privateMethod() {
alert(“Hello I’m the private method”);
}
return {
variable:1,
method: function () {
alert(this.variable); // shows 1
},
methodCallPrivate: function () {
privateMethod();
}
}
});
var myClassInstance = new myClass();
myClassInstance.method(); // shows 1
myClassInstance.methodCallPrivate(); //shows “Hello I’m the private method”
[/cc]
But I found this way if you want both have access to each other
[cc lang="javascript"]

var myClass = (function () {
var _public = {};
var _private = {};
_public.pubVariable = “Hello World from _public.pubVariable”;
_private.priVariable = “Hello World from _private.priVariable”;
_public.pubMethod= function() {
alert(_private.priVariable);
};
_private.priMethod = function() {
alert(_public.pubVariable);
};
_public.callpriMethod = function() {
_private.priMethod();
};
return _public;
});
var myClassInstance = new myClass();
myClassInstance.pubMethod(); // shows “Hello World from _private.priVariable”
myClassInstance.callpriMethod(); // shows “Hello World from _private.priVariable”
myClassInstance.priMethod(); //Throws an Error
[/cc]

Posted by & filed under php.

There’s a way to hide those ugly error outputs from PHP, and not just that you can track them, log them and manage them.

We have different type of errors some of them are possible to catch and others aren’t, in this post you will learn how to build your own error tracker, but first lets learn something about PHP errors, check the different type of errors in the following list.

Value Constant Description PHP
1 E_ERROR Fatal run-time errors. Errors that cannot be recovered from. Execution of the script is halted
2 E_WARNING Non-fatal run-time errors. Execution of the script is not halted
4 E_PARSE Compile-time parse errors. Parse errors should only be generated by the parser
8 E_NOTICE Run-time notices. The script found something that might be an error, but could also happen when running a script normally
16 E_CORE_ERROR Fatal errors at PHP startup. This is like an E_ERROR in the PHP core 4
32 E_CORE_WARNING Non-fatal errors at PHP startup. This is like an E_WARNING in the PHP core 4
64 E_COMPILE_ERROR Fatal compile-time errors. This is like an E_ERROR generated by the Zend Scripting Engine 4
128 E_COMPILE_WARNING Non-fatal compile-time errors. This is like an E_WARNING generated by the Zend Scripting Engine 4
256 E_USER_ERROR Fatal user-generated error. This is like an E_ERROR set by the programmer using the PHP function trigger_error() 4
512 E_USER_WARNING Non-fatal user-generated warning. This is like an E_WARNING set by the programmer using the PHP function trigger_error() 4
1024 E_USER_NOTICE User-generated notice. This is like an E_NOTICE set by the programmer using the PHP function trigger_error() 4
2048 E_STRICT Run-time notices. PHP suggest changes to your code to help interoperability and compatibility of the code 5
4096 E_RECOVERABLE_ERROR Catchable fatal error. This is like an E_ERROR but can be caught by a user defined handle (see also set_error_handler()) 5
6143 E_ALL All errors and warnings, except of level E_STRICT 5

The error_reporting function has a parameter to set which type of error you want to show.

You can set to 0 if you don’t want to show nothing

To show the common errors

If you’re picky , this will help you to code better

This is the default set from php.ini

This show everything

I use this, I care more about these ones


You need to create a new PHP file that’s going to handle the errors and you have to load it in every PHP file that runs by itself  I mean that is not loaded in another PHP (but don’t worry using require_once it will be loaded just once)…but well this depends of the structure of your project .

There’s a function called set_error_handler with this one you can catch many errors but  there are some E_FATAL errors that are impossible to catch with this function, so theres a trick to catch them and show something else instead.

So in your function you should classified which kind of error you are receiving

With this code from above you can send emails or log errors in Data Base.

The second function you need is the one it takes the fatal errors from the tags, and we show a custom error html.

Well if you use this code I fully recommend you to take all the possible variables that might be part of the error.
There’s a function call debug_backtrace that returns you the array of all the trace you code did. so I recommend you log it too.

Update: If you are using the PHP version 5.3 or earlier, now comes with the new error levels E_DEPRECATED & E_USER_DEPRECATED

Posted by & filed under HTML, javascript, php.

I remember the first time I start using AJAX it was really really amazing :) till I found that I can’t send images just text, well I’ll show how to upload a file without refreshing the whole page.

Here is you html form code:

And you have add an Iframe element , doesn’t matter in which part of the document but I recommend you put it inside of the form like this, add the target attribute to the form element and put the iframe name attribute as a target, you can hide the iframe with the style display:none.

Ok the problem is that there’s no way to fire the onload event of the iframe (I already tried many ways, and asked many people if you know how please let me know) so you have to do a Script that notice you when the Iframe is ready and not just that, maybe you’ll need a response from the server.

So here we have to find a way to receive the data and call back a function when the iframe is loaded.

You can follow this way:

So you need to response something like this:

In this case I did it with PHP, this is going to be called within the iframe.

Posted by & filed under Off-Topic.

Hello readers, welcome to my new blog. The main reason I created because I want to share & save all the stuff I’ve learnt about building websites.

I’m going to post good tricks for the following languages:

JavaScript ( AJAX/DHTML)
PHP (OOP/MVC)
HTML/CSS
Flash & Flex

So welcome to anyone who comes along here. Please let me know if I have some mistakes on my posts

Thanks,
Ramon