Tuesday, May 14, 2013

Animated Counter Plugin for WordPress


Simple, animated counter, which will allow You to present rapidly increased or decreased integer and decimal values, such as number of registered users, total income etc. But that’s not all... It can be also used as a countdown, to show time left for the beginning of a product release campaign or a sale start. Animated Counter Plugin for WordPress only on CodeCanyon.net

Tuesday, April 26, 2011

JavaScript Animated Counter


Simple, animated JavaScript counter, which will allow You to present rapidly increased or decreased values, such as number of registered users, total income etc. But that’s not all... this counter can be also used as a text or date & time displayer or as a clock. It can be also used as a countdown, to show time left for the beginning of a product release campaign or a sale start.

Features:
  • Counter is fully-customizable.
  • Counter can be also used as an any text, date, time or any symbol displayer.
  • Animated, smoothed scroll
  • 3 scroll directions, upwards, downwards and mixed
  • Custom events, e.g. called when counter is loaded or it’s current value has changed
  • Easy coding and configuring thanks to implemented, descriptive enumerations

If You want such a counter on Your website, visit CodeCanyon, because it's available only there, as I'm an exclusive CodeCanyon author.

Saturday, April 9, 2011

How to create thumbnails in PHP

This is my proposition for creating a thumbnails using GD in PHP. Below, You can find a definition of a function named create_thumbnail. All You have to do is pass as a parameter:
  • source file path where the image is located
  • destination path, where the thumbnail will be saved
  • thumbnail width
  • thumbnail height
There is also some other useful function named get_image_type, which purpose is to return a valid image file type, in case when we cannot rely on file extension.

function create_thumbnail($src_filename, $dst_filename, $dst_width, $dst_height){
    
    $temp_size = getimagesize($src_filename);
    $src_width = $temp_size[0];
    $src_height = $temp_size[1];
    
    $src_ima = @imagecreatefromstring(file_get_contents($src_filename));

    if ($src_ima !== false){

        $dst_ima = imagecreatetruecolor($dst_width, $dst_height);
        
        $background = imagecolorallocate($dst_ima, 255, 255, 255);
        imagefill($dst_ima, 0, 0, $background);
        imagecolortransparent($dst_ima, $background);
        
        imageantialias($src_ima, true);
        imageantialias($dst_ima, true);
        
        $x = 0; $y = 0; $w = 0; $h = 0;
        
        if ($src_width > $dst_width || $src_height > $dst_height){
            if ($src_width - $dst_width > $src_height - $dst_height){
                $w = $dst_width;
                $h = $src_height * ($dst_width / $src_width);
            } else {
                $w = $src_width * ($dst_height / $src_height);
                $h = $dst_height;
            }
        } else {
            $w = $src_width;
            $h = $src_height;
        }
        
        $x = ($dst_width / 2) - ($w / 2);
        $y = ($dst_height / 2) - ($h / 2);
        

        imagecopyresized($dst_ima, $src_ima, $x, $y, 0, 0, $w, $h, $src_width, $src_height);
        
        $file_type = get_image_type($src_filename);
        if ($file_type == 'gif')
            return imagegif($dst_ima, $dst_filename);
        else if ($file_type == 'jpeg')
            return imagejpeg($dst_ima, $dst_filename, 100);
        else if ($file_type == 'png')
            return imagepng($dst_ima, $dst_filename, 0);
        else if ($file_type == 'bmp'){
            $white = imagecolorallocate($dst_ima, 255,255,255);
            return imagewbmp($dst_ima, $dst_filename, $white);
        }
        else 
            return false;
    } else {
        copy($src_filename, $dst_filename);
        return false;
    }
}

function get_image_type($filename) {
    $handle = @fopen($filename, 'r');
    if (!$handle)
        throw new Exception('File Open Error');

    $types = array('jpeg' => "\xFF\xD8\xFF", 'gif' => 'GIF', 'png' => "\x89\x50\x4e\x47\x0d\x0a", 'bmp' => 'BM', 'psd' => '8BPS', 'swf' => 'FWS');
    $bytes = fgets($handle, 8);
    $found = 'other';

    foreach ($types as $type => $header) {
        if (strpos($bytes, $header) === 0) {
            $found = $type;
            break;
        }
    }
    fclose($handle);
    return $found;
}

Tuesday, March 15, 2011

JavaScript Progress Bar


JavaScript Rich Progress Bar. The most common use of such a progress bar is to display level of completion of some kind of process, like loading, copying or installation, but it can also be used as a bar graph, equalizer, poll result etc.

Features
  • Progress bar is fully-customizable.
  • You can change it's appearance, shape, borders and text style programmatically or with CSS
  • Minimal and maximal value as a float or integer
  • Custom labels, with user format
  • You can specify, whether text on progress bar is shown or not
  • Progress bar can be horizontally or vertically oriented
  • Various progress direction - from left to right or from right to left for horizotnal orientation and from top to bottom or from bottom to top for vertical orientation.
  • Animated, smoothed progress move
  • Custom events, e.g. called when progress bar is loaded or it's current value has changed
  • Easy coding and cofiguring thanks to implemented, descriptive enumerations

Integration
Placing ProgressBar on Your website can be made in a 3 simple steps.
  1. Add JavaScript and CSS definitions.
  2. Define HTML element, which You want to set as a progress bar container.
  3. Add JavaScript code which will create Your progress bar.
<script type="text/javascript" src="progressbar.js"></script>
<link rel="stylesheet" type="text/css" href="progressbar.css" />

<div id="my_progress_bar"></div>

<script type="text/javascript">

 var config = {
  borderRadius: 10,
  width: 300,
  height: 20,
  imageUrl: 'images/h_fg2.png',
 };
 
 var myProgressBar = new ProgressBar("my_progress_bar", config);

</script>

Take a look at the Progress Bar live preview page.

Extending access control in Joomla



I've spent few hours finding the line of Joomla code where I could make some changes, to adapt access control to my needs, especially with the menu displayed to user.

If You ever face the same issue, this will probably help You. Just edit the code of those files:
modules/mod_mainmenu/legacy.php
    at line (about) 277
        if ($v->access <= $user->get('aid'))
    at line (about) 355
        if ($row->access <= $user->get('aid', 0)) {
modules/mod_mainmenu/tmpl/default.php
    at line (about) 30
        if ($child->attributes('access') > $user->get('aid', 0)) {
or if the templates override mod_mainmenu functionality, then try to search inside:
templates/TEMPLATE_NAME/html/mod_mainmenu/default.php

Thursday, March 10, 2011

AML - Any Markup Language DOM


AML stands for Any Markup Language – it’s purpose is to aggregate XML DOM and HTML DOM functionality, leaving XML restrictive document treatment and replacing it with smooth use of HTML . You can use AML with any website’s HTML or XML data – wheter it’s well formated or not. It could even fail validation at all and You’ll still have an access to document’s nodes in a way You’re already familiar with. You do not need to use .Net’s restrictive XmlDocument parser or WebBrowser user control anymore, which consumes a huge amount of memory. Instead of this You get an AML , a light, quick and convenient way to navigate through Your documents.

When would You need to use AML ?

1. If You are trying to retrieve some online content, eg. current weather from some weather forecast provider website and You need to do it programatically.

2. When you’re dealing with a really badly formatted XML and You’re unable to do anything about it’s source (because of buggy XML provider’s interface)

Check the preview screenshots or visit the AML item overview page!

Saturday, March 5, 2011

Standard Objects prototyping in JavaScript

JavaScript standard types (Objects), like Array, String, Date etc. are not perfect with theirs functionality. Fortunately, we are able to extend those types with our own methods, using prototyping. One example of such a extension:

Array.prototype.indexOf = function(value){
    var i = null;
    for (i in this)
        if (this[i] == value)
            return i;
    return -1;
}

This method will return index of an array element (or name of a property) that match the given value. It will return -1 if no match was found. The usage:

var myArray = ['abc','123','xyz',987];
alert(myArray.indexOf('xyz'));

The output is "2". Note that result is a string, not the integer, because the clause "for ([iterator] in [variable])" iterates every object properties, so it has to be a string.