Php, Zend Framework, Jquery, Css3, Phonegap: October 2011

Wednesday, October 26, 2011

jQuery Password Strength Meter

Download link: http://plugins.jquery.com/project/pass_strength
Usage: http://mypocket-technologies.com/jquery/password_strength/

Javascript Random String Generator

function random_string() { return String((new Date()).getTime()).replace(/\D/gi, '') }

Tuesday, October 25, 2011

HTML5 - code example of drag and drop on a web page

The key methods to implement d&d are basic and easily implemented as follows:

function dragIt(target, e) {
e.dataTransfer.setData('SpanImg', target.id);
}
function dropIt(target, e) {
var id = e.dataTransfer.getData('SpanImg');
target.appendChild(document.getElementById(id));
e.preventDefault();
}

I used table elements to provide both layout structure and as a target for ondrop events:

<td align="center" width="100" id="blue" ondrop="dropIt(this, event)" ondragenter="return false" ondragover="return false"> .... </td>

I chose the span element (wrapping an image) as my draggable object:

<span draggable="true" id="t_1" ondragstart="dragIt(this, event)"><img src="https://www.ibm.com/developerworks/mydeveloperworks/blogs/bobleah/resource/tower.jpg"></span>

Original post: https://www.ibm.com/developerworks/mydeveloperworks/blogs/bobleah/entry/html5_an_example_of_drag_and_drop26?lang=en
Download exapme: https://www.ibm.com/developerworks/mydeveloperworks/files/app?lang=en#/person/270000CN12/file/ca25c6eb-f34a-437c-85da-5b3b24b3b9bb

HTML5 - code example of ContentEditable and LocalStorage - create a web sticky note!

Script:

<script>
function storeUserScribble(id) {
var scribble = document.getElementById('scribble').innerHTML;
localStorage.setItem('userScribble',scribble);
}
function getUserScribble() {
if ( localStorage.getItem('userScribble')) {
var scribble = localStorage.getItem('userScribble');
}
else {
var scribble = 'You can scribble directly on this sticky... and I will also remember your message the next time you visit my blog!';
}
document.getElementById('scribble').innerHTML = scribble;
}
function clearLocal() {
clear: localStorage.clear();
return false;
}
</script>

Html:

<pre id="scribble" contenteditable="true" onkeyup="storeUserScribble(this.id);"></pre>

Original post: https://www.ibm.com/developerworks/mydeveloperworks/blogs/bobleah/entry/html5_code_example_of_contenteditable_and_localstorage_create_a_web_sticky_note?lang=en

Download example: https://www.ibm.com/developerworks/mydeveloperworks/files/app?lang=en#/person/270000CN12/file/e27c84f2-8a08-4e33-b447-8ffa620c4ada

Monday, October 24, 2011

Get domain name from email address

    public function getDomainNameFromEmailAddress($email){

        $ar = split("@",$email);
        if(!empty($ar[1])){
            return $ar[1];
        }else{
            return "";
        }
    }

Wednesday, October 19, 2011

Create a Typing Text Effect using jQuery

For long now flash has been dominating the interactive web animation, using JavaScript was a daunting task. But introduction of frameworks like jQuery, MooTools, Scriptaculous, etc have made animating web component much easier. Another advantage of using these frameworks over flash is that they are search engine friendly. Though search engine do not index JavaScript, actual content is present in html or other SEO friendly code.

You must have seen this text effect on many flash websites. jTicker is a jQuery plugin that can be used for creating such effect without the use of flash. This effect comes in handy when you want to force the visitor to read the text. But should be used wherever necessary, as the usability suffers. jTicker can be declared on any element and can be stylized using CSS. You can also use event buttons to play, stop and control the speed of the effect.

HTML

Let us start with html markup. Make sure that you have linked the .js files correctly.

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

02<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

03<head>

04<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

05<title>jticker | Demo</title>

06<script type="text/javascript" SRC="js/jquery-1.3.2.min.js"></script>

07<script type="text/javascript" SRC="js/jquery.jticker.js"></script>

08</head>

09<body>

10<div id="content">

11  <h2>jTicker Demo  </h2>

12  <div id="ticker">

13    <div>

14      <h3>What does jTicker do?</h3>

15        <p>jTicker
 takes an elements' children and displays them one by one, in sequence, 
writing their text 'ticker tape' style. It is smart enough to ticker 
text from an element heirarchy, inserting elements back into the DOM 
tree as it needs them. That means almost any content can be 
'tickered'.</p>

16        <p>It can be controlled with jQuery events.</p>

17        <a class="next" href="#">next</a>

18    </div>

19    <div>

20      <h3>Not my cup of tea, really, ...</h3>

21        <p>annoying
 little blinky things trying to distract attention when you want to get 
on with the serious business of reading a website, but if it's your 
thing, here it is.</p>

22

23        <a class="next" href="#">next</a>

24    </div>

25    <div>

26        <h3>jTicker has some neat features:</h3>

27        <ul>

28            <li>jTicker
 can be declared on any element, and it respects that element's DOM 
tree, printing it back out with the same hierarchy.</li>

29            <li>jTicker handles any number of alternating cursors (or just one).</li>

30

31            <li>jTicker's cursor container is styleable using the class .cursor, or can be defined as your own jQuery object</li>

32            <li>jTicker reacts to jQuery events "play", "stop" and "control". You can try them out below.</li>

33        </ul>

34        <a class="next" href="#">next</a>

35    </div>

36

37    <div>

38        <h3>There is one caveat:</h3>

39

40        <ul>

41            <li><span>jTicker
 can't understand text and children at the same level (I don't know how 
to do that yet), so if you want some text and then a link, you have to 
wrap the text in, say, a span, like this:</span>

42                <code>|span| some text |/span| |a|and then a link|/a|</code>

43            </li>

44            <li>But
 obviously not with those brackets. That's another thing, jTicker is not
 good at handling html character entities. So make that two 
caveats.</li>

45        </ul>

46        <a class="next" href="#">next</a>

47    </div>

48  </div>

49</div>

50</body>

51</html>

CSS

Add this code to your CSS file or to the <style>

01#ticker

02  {height: 12em; padding: 0.6em 0; margin: 0 0 1.8em 0; border-top:3px solid #efefef; border-bottom:3px solid #efefef; position: relative;}

03#ticker .cursor

04  {display: inline-block; background: #565c61; width: 0.6em; height: 1em; text-align: center;}

05#ticker p

06  {margin-bottom: 0.8em;}

07#ticker code

08  {margin: 0.4em 0.4em; display: block;}

09#ticker .next

10  {position: absolute; bottom: 1em;}

JavaScript

Now initialize jTicker by adding this JavaScript to <head> between <script type=”text/javascript”></script>

01<!--

02  jQuery(document).ready(function(){

03    // Instantiate jTicker

04    jQuery("#ticker").ticker({

05        cursorList:  " ",

06        rate:        10,

07        delay:       4000

08    }).trigger("play").trigger("stop");

09

10    // Trigger events

11    jQuery(".stop").click(function(){

12        jQuery("#ticker").trigger("stop");

13        return false;

14    });

15

16    jQuery(".play").click(function(){

17        jQuery("#ticker").trigger("play");

18        return false;

19    });

20

21    jQuery(".speedup").click(function(){

22        jQuery("#ticker")

23        .trigger({

24            type: "control",

25            item: 0,

26            rate: 10,

27            delay: 4000

28        })

29        return false;

30    });

31

32    jQuery(".slowdown").click(function(){

33        jQuery("#ticker")

34        .trigger({

35            type: "control",

36            item: 0,

37            rate: 90,

38            delay: 8000

39        })

40        return false;

41    });

42

43    jQuery(".next").live("click", function(){

44        jQuery("#ticker")

45        .trigger({type: "play"})

46        .trigger({type: "stop"});

47        return false;

48    });

49

50    jQuery(".style").click(function(){

51        jQuery("#ticker")

52        .trigger({

53            type: "control",

54            cursor: jQuery("#ticker").data("ticker").cursor.css({width: "4em", background: "#efefef", position: "relative", top: "1em", left: "-1em"})

55        })

56        return false;

57    });

58

59  });

60

61//-->

View Demo
Download Files
Visit Authors Website

Zend Framework 2.0.0beta1 Released!

The Zend Framework community is pleased to announce the immediate availability of Zend Framework 2.0.0beta1. Packages and installation instructions are available at:

http://packages.zendframework.com/

This is the first in a series of planned beta releases. The beta release cycle will follow the "gmail" style of betas, whereby new features will be added in each new release, and BC will not be guaranteed; beta releases will happen no less than every six weeks. The desire is for developers to adopt and work with new components as they are shipped, and provide feedback so we can polish the distribution.
Once all code in the proposed standard distribution has reached maturity and reasonable stability, we will freeze the API and prepare for Release Candidate status.
Featured components and functionality of 2.0.0beta1 include:

New and refactored autoloaders:
- Zend\Loader\StandardAutoloader
- Zend\Loader\ClassMapAutoloader
- Zend\Loader\AutoloaderFactory
New plugin broker strategy
- Zend\Loader\Broker and Zend\Loader\PluginBroker
Reworked Exception system
- Allow catching by specific Exception type
- Allow catching by component Exception type
- Allow catching by SPL Exception type
- Allow catching by base Exception type
Rewritten Session component
Refactored View component
- Split helpers into a PluginBroker
- Split variables into a Variables container
- Split script paths into a TemplateResolver
- Renamed base View class "PhpRenderer"
- Refactored helpers to utilize __invoke() when possible
Refactored HTTP component
New Zend\Cloud\Infrastructure component
New EventManager component
New Dependency Injection (Zend\Di) component
New Code component
- Incorporates refactored versions of former Reflection and CodeGenerator components.
- Introduces Scanner component.
- Introduces annotation system.

The above components provide a solid foundation for Zend Framework 2, and largely make up the framework "core". However, the cornerstone feature of beta1 is what they enable: the new MVC layer:

Zend\Module, for developing modular application architectures.
Zend\Mvc, a completely reworked MVC layer built on top of HTTP, EventManager, and Di.

We've built a skeleton application and a skeleton module to help get you started, as well as a quick start guide to the MVC; the new MVC is truly flexible, and moreover, simple and powerful.
Additionally, for those who haven't clicked on the packages link above, we are debuting our new distribution mechanisms for ZF2: the ability to use Pyrus to install individual components and/or groups of components.
Since mid-August, we've gone from a few dozen pull requests on the ZF2 git repository to over 500, originating from both long-time Zend Framework contributors as well as those brand-new to the project. I'd like to thank each and every one of them, but also call out several individuals who have made some outstanding and important contributions during that time frame:

Evan Coury, who prototyped and then implemented the new module system.
Rob Allen, who, because he was doing a tutorial at PHPNW on ZF2, provided a lot of early feedback, ideas, and advice on the direction of the MVC.
Ben Scholzen, who wrote a new router system, in spite of a massive injury from a cycling accident.
Ralph Schindler, who has had to put up with my daily "devil's advocate" and "think of the user!" rants for the past several months, and still managed to provide comprehensive code manipulation tools, a Dependency Injection framework, and major contributions to the HTTP component.
Enrico Zimuel, who got tossed requirements for the cloud infrastructure component, and then had to rework most of it after rewriting the HTTP client from the ground up... and who still managed three back-to-back-to-back conferences as we prepared the release.
Artur Bodera, who often has played devil's advocate, and persisted pressing his opinions on the direction of the framework, often despite heavy opposition. We may not implement all (or many) of the features you want, but you've definitely influenced the direction of the MVC incredibly.
Pádraic Brady, who started the runaway train rolling with a rant, and helped make the project much more transparent, enabling the MVC development to occur in the first place.

Wtf is html5 and why we sould all care

Link

HTML5 & CSS3 Readiness

http://html5readiness.com/

Php empty() function in Javascript

function empty (mixed_var) {
    // http://kevin.vanzonneveld.net
    // +   original by: Philippe Baumann
    // +      input by: Onno Marsman
    // +   bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
    // +      input by: LH
    // +   improved by: Onno Marsman
    // +   improved by: Francesco
    // +   improved by: Marc Jansen
    // +   input by: Stoyan Kyosev (http://www.svest.org/)
    // *     example 1: empty(null);
    // *     returns 1: true
    // *     example 2: empty(undefined);
    // *     returns 2: true
    // *     example 3: empty([]);
    // *     returns 3: true
    // *     example 4: empty({});
    // *     returns 4: true
    // *     example 5: empty({'aFunc' : function () { alert('humpty'); } });
    // *     returns 5: false
    var key;

    if (mixed_var === "" || mixed_var === 0 || mixed_var === "0" || mixed_var === null || mixed_var === false || typeof mixed_var === 'undefined') {
        return true;
    }

    if (typeof mixed_var == 'object') {
        for (key in mixed_var) {
            return false;
        }
        return true;
    }

    return false;
}

Php uniqid() function in Javascript

function uniqid (prefix, more_entropy) {
    // +   original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
    // +    revised by: Kankrelune (http://www.webfaktory.info/)
    // %        note 1: Uses an internal counter (in php_js global) to avoid collision
    // *     example 1: uniqid();
    // *     returns 1: 'a30285b160c14'
    // *     example 2: uniqid('foo');
    // *     returns 2: 'fooa30285b1cd361'
    // *     example 3: uniqid('bar', true);
    // *     returns 3: 'bara20285b23dfd1.31879087'
    if (typeof prefix == 'undefined') {
        prefix = "";
    }

    var retId;
    var formatSeed = function (seed, reqWidth) {
        seed = parseInt(seed, 10).toString(16); // to hex str
        if (reqWidth < seed.length) { // so long we split
            return seed.slice(seed.length - reqWidth);
        }
        if (reqWidth > seed.length) { // so short we pad
            return Array(1 + (reqWidth - seed.length)).join('0') + seed;
        }
        return seed;
    };

    // BEGIN REDUNDANT
    if (!this.php_js) {
        this.php_js = {};
    }
    // END REDUNDANT
    if (!this.php_js.uniqidSeed) { // init seed with big random int
        this.php_js.uniqidSeed = Math.floor(Math.random() * 0x75bcd15);
    }
    this.php_js.uniqidSeed++;

    retId = prefix; // start with prefix, add current milliseconds hex string
    retId += formatSeed(parseInt(new Date().getTime() / 1000, 10), 8);
    retId += formatSeed(this.php_js.uniqidSeed, 5); // add seed hex string
    if (more_entropy) {
        // for more entropy we add a float lower to 10
        retId += (Math.random() * 10).toFixed(8).toString();
    }

    return retId;
}

Monday, October 17, 2011

Php random string generator

   public function generateRandomString() {
        $length = 20;
        $characters = "0123456789abcdefghijklmnopqrstuvwxyz";
        $string = "";

        for ($p = 0; $p < $length; $p++) {
            $string .= $characters[mt_rand(0, strlen($characters)-1)];
        }

        return $string;
    }

Friday, October 14, 2011

Top 15+ Best Practices for Writing Super Readable Code

1 - Commenting & Documentation

IDE’s (Integrated Development Environment) have come a long way in the past few years. This made commenting your code more useful than ever. Following certain standards in your comments allows IDE’s and other tools to utilize them in different ways.
Consider this example:

The comments I added at the function definition can be previewed whenever I use that function, even from other files.
Here is another example where I call a function from a third party library:

In these particular examples, the type of commenting (or documentation) used is based on PHPDoc, and the IDE is Aptana.

2 - Consistent Indentation

I assume you already know that you should indent your code. However, it’s also worth noting that it is a good idea to keep your indentation style consistent.
There are more than one way of indenting code.

Pages

Wednesday, October 26, 2011

Tuesday, October 25, 2011

Monday, October 24, 2011

Wednesday, October 19, 2011

Monday, October 17, 2011

Friday, October 14, 2011

1 - Commenting & Documentation

2 - Consistent Indentation

Style 1:

Style 2:

Style 3:

3 - Avoid Obvious Comments

4 - Code Grouping

5 - Consistent Naming Scheme

6 - DRY Principle

7 - Avoid Deep Nesting

8 - Limit Line Length

9 - File and Folder Organization

10 - Consistent Temporary Names

11 - Capitalize SQL Special Words

12 - Separation of Code and Data

13 - Alternate Syntax Inside Templates

14 - Object Oriented vs. Procedural

Object-Oriented Programming in PHP

15 - Read Open Source Code

16 - Code Refactoring