Category Archives: Programming
Hi,
recently i was needed to add some like and tweet button to a site. i supposed will be a 5 minuted task, but i discovered something really weird, that for some reason, the button not only was screwing up the load of the adsense ads, but also, sometimes the ads appeared inside the iframe of the buttons. looking for a solution on the web, i found something for the facebook like button and i applied something seamless for the twitter button.
Facebook Like Button
the steps to solve this are the following:
1)go to this page and create an application: https://developers.facebook.com/setup/
2) paste this code where you want the like button and edit with the correct paths and the appID you generated before
<!-- like button -->
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="button_count" width="100"></fb:like>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXXXXXXXXXX', // ID generated for WEBSITE provided above.
xfbml : true, // parse XFBML
channelUrl : 'http://www.YOUR_SITE_NAME.com/facebook/channel.html' // new file custom channel
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!-- like button -->
3)create the channel.html file on the path of your server and paste this only line:
<script src="http://connect.facebook.net/en_US/all.js"></script>
and that’s it, now you have a like button and will not screw up your adsense ads
Tweet Button
for the tweet button, the solution is more simple, i basically pasted the code inside a file and called it from a iframe. is not the most cleanest way, i know, but is the only thing i figured out to solve it.
i hope this help you in some way 
Regards,
Shadow.
![[Digg]](http://cdn1.diggstatic.com/img/favicon.a015f25c.ico){kind=small}
![[del.icio.us]](http://images.del.icio.us/static/img/delicious.small.gif){kind=small}
Related Post
Hi,
maybe this could sound obvious but is something that i didn’t know till a few days ago when i was making some changes on a js code i made. like the title says, the each() function used in mootools to apply a code to each element in the array, do not work with associative arrays.
so basically if you have this code:
var myArray=new Array();
myArray["key1"]="value1";
myArray["key2"]="value2";
myArray.each(function (item, index){
//do stuff
});
will not work, simply will not execute the loop on each array element. to fix this, you need to use the for loop like this:
var myArray=new Array();
myArray["key1"]="value1";
myArray["key2"]="value2";
for(key in myArray){
//do stuff
}
dunno if this is a mootools bug or was designed to work like this, but i hope this help you and save you time in debugging when you are using associative arrays.
update: from the comments below, let’s clarify some things:
*there is no associative arrays in javascript, they are objects, and i was wrong, indeed you can process it using the solution that Dimitar Christoff posted
var myArray= {};
myArray["key1"]="value1";
myArray["key2"]="value2";
Object.each(myArray, function (item, key){
console.log(item, key);
});
*when you process the object like this, you need to check that you are not processing the js methods that mootools define, personally i stop processing the object after i found the “$family” key, in the comments recommend to use the hasOwnProperty() function but i don’t see why is better or different than mine, if you know it, post it
thanks for the comments, i recognize when i’m wrong, for your collaboration, i’m a bit a better dev 
Regards,
Shadow.
Related Post
Hi,
months ago i wrote this post where i commented about a tool that adobe was developing that convert any fla into html5. on the same post i also talk about the eternal fight of flash vs html5 and the “end of flash”, i recommend you to give it a quick read. today adobe have released this tool to the public, you can download it from here
of course that the app is on a test phase, is not even a beta version, but i hope flash will continue the development converting it into a real product.
Regards,
Shadow.
Related Post
Hi,
i just saw this on my twitter TL and i think it worth a mini-post. All those who develop some application that require user authentication, deal with the password problem. is not only a problem to store passwords (BTW, i wrote another post about it recently) but also the problem is the user, trying to encourage him to use stronger ones, using uppercase, lowercase letters, number and symbols is not easy. usually most of the app’s have a bar that measure the strength of the password. is nice and useful, but most of the users just don’t pay attention to it. in this cases is where naked password take action and i will not say anything else, just go to the site and try it, is a twist in usability to say it in some way 
Regards,
Shadow.
Related Post
Hi,
weeks ago i posted this function that basically let you serialize object and arrays in javascript and is compatible with the unserialize funcion in php. recently i discovered a problem in this function related with the management of the weird, other language characters. the problem is that when you save a word with, let say, russian characters, the count of the chars is different as how php do it, so when you try to unserialize the string you get a offset errors. to solve this, you need to convert the string into unicode, serialize it and then send it to the php.
the function to convert any string into unicode with javascript is the following:
function convertToEntities(tstr) {
var bstr = '';
for(i=0; i127)
{
bstr += '&#' + tstr.charCodeAt(i) + ';';
}
else
{
bstr += tstr.charAt(i);
}
}
return bstr;
}
and in the php, you process the string like this:
$unserliazed= html_entityt_decode(unserialize($string),ENT_NOQUOTES, "UTF-8");
is very important that you set the UTF-8 charset to the decode function, so you get the original string.
also, remember that the database need to be support unicode-utf8, here you will find a quick guide for it
Regards,
Shadow.
Related Post
Hi,
recently, i have a problem with the flash content in a page that is customized by the user. the problem was that i popup a div with a higher z-index to show some info, this popup was not showing it in front of flash or youtube embed videos. and to make it more difficult, this content was load using ajax and even that i could filter the information or the html code, i prefered to make it using javascript.
here i will share with you the function that process all the objects, embed and youtube iframe tags and set the wmode that you want to them.
function setWmode(mode,reinsert,youtube){
if(youtube==true){
var allIframes=$(document.body).getElements('iframe');
allIframes.each( function (item, index){
if(item.get('src').test('http:\/\/www.youtube.com\/embed\/')){
item.set('wmode',mode);
item.set('src',item.get('src')+"?wmode="+mode);
if(reinsert==true){
var newElem= item.clone(true,true);
var parentElem= item.getParent();
item.destroy();
parentElem.grab(newElem);
}
}
});
}
var allObjects=$(document.body).getElements('object');
allObjects.each(function (item, index){
var allParams=item.getChildren('param');
var WmodeExist=false;
allParams.each(function (item2, index2){
if(item2.get('name')=='wmode'){
item2.set('value',mode);
WmodeExist=true;
}
});
if(WmodeExist==false){
item.grab(new Element('param', {name: 'wmode',value: mode}));
}
if(reinsert==true){
var newElem= item.clone(true,true);
var parentElem= item.getParent();
item.destroy();
parentElem.grab(newElem);
}
});
var allEmbed=$(document.body).getElements('embed');
allEmbed.each(function (item, index){
item.set('wmode',mode);
if(reinsert==true){
var newElem= item.clone(true,true);
var parentElem= item.getParent();
item.destroy();
parentElem.grab(newElem);
}
});
}
this function requires of 3 paramenters:
mode: the value of wmode to set
reinsert: what this make is, clone the iframe/object/embed, erase the original and insert it again on the same location. this is made when you load the content before you set the wmode, so you can restart the load of the flash object and the wmode will have effect.
youtube: process or not youtube videos
i hope it help you in some way and save you maybe some time
Regards,
Shadow.
Related Post
Hi,
a few days ago i started to make a paypal express checkout integration at the project i’m working on. i started to look at the developer documents to know how it works. all the most valuable info is here, here here and the samples of code for several languages are here.
How express checkout works?
EC works in this way: in your website you have a shopping cart or a buy now button. with the api signature or certificate that grant you access to the paypal API, you make a call to the NVP service SetExpressCheckout. this service will register the order at the paypal server. to this service you send all the order data, as the price of each item, the taxes, if need to be shipped or not etc.. paypal will return to you a access token, that you will use to redirect the user to the paypal website to authorize the payment. when the user authorize the payment, ger redirected to the returnurl you defined at the SetExpressCheckout call. in that moment you will ask the user any necessary data that you may need (as the shipping address or any other personal data) and put a button to confirm the order. when the user press the button, you call to the DoExpressCheckout service at paypal, sending the same parameters like the last call adding the toke and payerid that paypal give to you. and that’s it, the order has been processed, paypal with return to you if the order has been processed or not and the transaction id that you should keep in a safe place
now i will give you some tips that could help you at the moment of the integration:
Get test account from the sandbox environments
one of the docs i linked here, give you some api username, password and signature ready to use, but i tested it with them and i just got the general error of the timeout, so basically they are not valid. so go to developer site and sign up for a account. remember to put a email and user names for the test account that will not have numbers, if not you will get a error at creating the test accounts.
3dr party billing
one of the best features of EC is the 3dr party billing. with this you can use your own account api access to make the order but will be credited to someone else. this is useful when you have a project that offers the users a way to charge for the service or something like that. the money charges goes directly to the specified account. to make this you need to add a SUBJECT parameter to the call, with the client paypal email and also the client need to add your API username in the list of their api access. there is no fees and don’t have any cost for your account to do this.
Timeout error
this is a general error that you can get trying to make the calls at paypal, most of the errors are descriptive in their problem, just print the return of paypal to figure it out. if you get this error could be for several reasons, like a really timeout why the paypal server are down or your connection have some problem. or the api credentials are wrong, or you miss or have some parameter wrong in the call. unfortunately is a try and error task to solve this.
i hope it help you in some way to get working your EC integration easy and fast
Regards,
Shadow.
Related Post
Hi,
today i wanted to give some common and not so common ideas of how to improve the performance of your web app. as you know, when you have a busy website, the performance (and along with the stability) is a key factor to have your project up and running, in this cases, you need to try to improve every aspect of your app, that is the idea, to help you to identify what can be or not be done in your case.
Database Optimization
Build a efficient database schema is not something easy, it cost time, study and testing to do it. at the time to build a efficient DB schema you need to take in consideration the following:
*Use the minimum columns as possible, and choose wisely the type of data that the database will store (if you will store number of 3 digit max, set a int(3) and not a varchar, text or a int(20))
*use the relational model, for dynamic or multiple values, use a index pattern where you have the definition of the data in 1 table and the data itself inserted by the user in other. do not create tons of columns as value_1, value_2 etc..
*add indexes to your tables
*use the primary key and unique key for columns that should have unique values to avoid data corruption or misbehavior.
in cases of the query, try to group the query’s in the less quantity of calls, use JOIN’s, select only the columns that you will really going to use, don’t make generals select’s. in case you need to return the number of something, use functions as SUM() and not mysql_num_rows().
Clean and re-usable code
you need to be careful at coding too, even that php bring a big liberty whiteout having to worry about types and variable types, you need to be responsible for what you write. the php code get messy when you do messy stuff. organize variables, functions and classes as much as you can. i’ll recommend to use a MVC model if is possible (even that before i rejected it) and a framework will also make you life easier when you learn how to use it.
there is always a good practice separate the logic from the view (i mean the main php code from the design), for this you can grab any framework, most of them already support this or get a template engine. i have always used smarty, and is very flexible and you can extend it with custom functions and modifiers, also it support time cache and others types too. even that i’m happy with it, and i’ll recommend to you, i have realized with the time that is a waste if time. it will never be faster than the normal php code, so if you want to go really well, i’ll recommend you to get a or build a class that will just load the php script as templates and that’s it. you will save time from learning a template script and save process in the meantime
cache everything
this is one of the most important thing of all. the cache is the base of any optimization. let say true, most of the pages of any app doesn’t change and if they change dynamically, is usually for a user action. if this happen you can use a selective caching, where you cache at the event if a action. make this type of cache is not a easy task, takes time and testing, but really it make great results on the practice and worth the time invested on it. the cache of css and js files is also a good technique, as well the compress of them.
use the power of javascript
i learning caching a lot of stuff to use the power of javascript. i have cached pages that needed to be refreshed each 20 seconds. surely you are asking how i made it, so basically i just cached them once and filtered the results with javascript after the ajax load of the filter using JSON and the html code from other call. if you are wondering if this is really a performance advantage, well yes, you will see a 50% of difference from a normal php processing. anyway, be careful with this type of technique, remember that javascript run on the client side, so the information passed there can be manipulated in evil ways. is a powerful tool that need to be used very careful. also, i will recommend you to use a javascript framework, they are cross browser compatible for almost all their functions, with a big community and plugins available, and heavily optimized.
i hope this help you in some way at the moment to optimize your web app’s
Regards,
Shadow.
Related Post
Hi,
in any web app (or desktop app) the security and store of password is a critical subject. there is a lot of solution out there for desktop and if you are around in the web development you will know the usual solutions as well. the hashing of the password is *usually* the most popular option (is discarded any attempt to store the password in plain text of course) and even that mysql have in-built functions as AES_ENCRYPT and AES_DECRYPT, i still think is insecure have any option to get the encrypted password in some way.
for the hash of the password, there are lot of popular functions, as md5(), sha1() etc.. and the big problem with all this functions is the advance of the processing units of our computers have made easier for the cracker to figure out the real password behind the hash.
recently, with the attacks that pletyoffish.com and other important webs have suffered i started looking for the strongest hash encryption i could find (in the past i used a combination of sha2 with a unique salt and a second pass of sha2). in this search, i realized that bcrypt was the best option here. knowing that, i looked for a class that could wrap that process and make it easier. then is when i found phpass.
phpass is a wrapper, that will use the strongest hash function available (in this case bcrypt) and if not, will go down with a combination of functions. is really easy to use, as you will see in the following examples:
Encrypt password:
$hasher = new PasswordHash(8, FALSE); $hash = $hasher->HashPassword($pass);
Check password at login
if ($hasher->CheckPassword($pass, $hash))
in this example, you need to provide the plain password and the hashed password that is keep on the DB.
if you have already a hashed password system for login, the transition should be painless, if not, i recommend you do it as soon as possible. this is better to any system you could make, really will make you sleep better at night and don’t wake up at night with the notice that your site has been hacked.
you will find more info in their tutorials and in their home page
i hope it help you in some way
Regards,
Shadow.
Related Post
Hi,
for the past days i have been playing with selenium, coding test’s for the application we are developing. in my journey with this great tool i have found some interesting tips that could be handy to you in my own situation.
Handle ajax calls
there are 2 ways to handle ajax calls, one is making the actions that will trigger the ajax call (like a click or something) and set a pause for XXXX quantity of miliseconds and then check that the actions has been made. the other is the waitForCondition command, that will execute the script till the condition is true. the second is the best,you can check a condition by setting up a variable or checking for some stat on the page after the ajax call is made. be sure to measure how much time the ajax call take action on a normal environment so you can set up a correct timeout.
Access to content in the page for a conditional or a script
there are commands that require you write some conditional sentence or minimal script to verify an action. in some of this cases is probably you need to get some value for a element in the page. in this case you can use this function:
this.page().findElement('locator');
this will return you the object like a getElementById will, and support the use of locators.
Store the result of a script
maybe you need to save the result of a script for later, so, you can use storeEval for that purpose. will store the result of the last line of the script on a variable you define.
later you can access to it like this:
storedVars['foo'];
i hope it help you in some way
Regards,
Shadow.
