Archive

Archive for the ‘Development’ Category

CakePHP ajaxed pagination and sort

May 16th, 2009

Here I will describe how I did an Ajaxed pagination for one of my projects using jQuery and Livequery Plugin. Currently I am working on a huge project which, hopefully, will feed me with some ideas for blog posts and this is one of them :) . So:

1. Loading the javascript libs

Loading the jQuery and Livequery was done by Autoloader helper, but if you don’t use it just include jQuery and Livequery in your layout with following code

<?php
echo $javascript->link('jquery.min');
echo $javascript->link('plugins/jquery.livequery');
?>

Read more…

CakePHP, Development, General, JavaScript, Labs , , ,

Passing variables to all Models from the Controller – strict MVC way

April 21st, 2009

It’s really easy to find inspiration when you developing on CakePHP. For the current project I need to create global (for all models) behavior which stores creator and modifier as well as deleter and deleted (for soft-delete).

What are the requirements

1. For every table (or at least the most of them) there are fields 6 fields:

  • creator (int) – user who create the the record
  • created (datetime) – date when the record was created
  • modifier (int) – user who modified the the record
  • modified (datetime) – date when the record was modified
  • deleter (int) – user who delete the the record
  • deleted (datetime) – date when the record was modified

2. Some tables doesn’t have such fields (like aros, acos, settings etc), so it should update tables which has such fields.

I’ve seen Soft Deletable Behavior as well as recently added WhoDidIt behavior, but I don’t like the approach of using _SESSION. I’ve also decided to use datetime field to determine if the record is active (field deleted is NULL) or deleted (if the field is set with date).

So the result was – I’ve write my own behavior who serves this.
Read more…

CakePHP, Development, Frameworks, Labs, PHP , ,

Creating Wholesale Solution with Magento Commerce

April 17th, 2009

osCommerce to Magento migrationMy first approach for this post was to explain my first impressions from Magento Commerce, but I decided to explain how I managed to create a Retail/Wholesale solution required for a current project.

The requirement (so far, because it’s an ongoing project):

The client want to have a shop where regular customers to be able to see products with their retail price, while Wholesale partners to see the prices with ? discount. The extra condition: retail and wholesale prices hasn’t mathematical dependency. So, a product could be $100 for retail and $50 for whole sale and another one could be $60 retail and $50 wholesale. And of course retail users should not be able to see wholesale prices at all.

Basically, I will explain what I did step-by-step, but in order to understand what I mean, you should be familiar with the basics of Magento.

1. Creating two magento websites, stores and views
(Magento meaning of website of course) It’s done from from System->Manage Stores. The result is:
Website | Store | View
————————————————
Retail->Retail->Default
Wholesale->Wholesale->Default

Both sites using the same category/product tree

2. Setting the price scope
in System->Configuration->Catalog->Catalog->Price set drop-down to Website. Now you could enter prices per store/website and they could be totally different.

3. Get some plugins
Get following plugins from Magento Connect and install them from admin: System->Magento Connect->Magento Connect Manager:
Netzarbeiter_LoginCatalog – User need to login in order to see the store (it will be used for Wholesale site)
Netzarbeiter_CustomerActivation – User need to be approved from site admins in order to be able to login to the site. (again it will be used for wholesale site)

Both plugins need to be activated for wholesale only. Because they are activated when they are installed, you need to disable them for Default/Retail website and to leave enabled to Wholesale. You should know that distinction between sites in System->Configuration is done from top left corner of the config window.

First plugin is enabled/disabled from: System > Configuration > Catalog > Login only catalog
Second one: System > Configuration > Customer > Customer Activation.

4. Setting separate url for Wholesale
Now wholesales need to have separate urls, so regular users will access http://domain.com/, while wholesale will access http://domain.com/wholesale/. I found this solution in the Magento Forum: Thread.

So, following the instructions I created directory wholesale/ and copied .htaccess and index.php files from the root directory. Modifications in the index.php are the same as in the Forum:
Mage::run(); become Mage::run(’wholesale’);
and
$mageFilename = ‘app/Mage.php’; become $mageFilename = ‘../app/Mage.php’;

5. Change the wholesale paths from the admin
From System->Configuration (select Wholesale website)->General->Web and change the paths by adding wholesale/ (it’s also mentioned in the forum thread).

6. Adding products to both websites
When adding products, you should mark them visible for both sites. This is done from Product page->Websites tab.

That’s it! Now on http://domain.com/ users will see full catalog, they can login without Admin approval and prices will be retail, while on http://domain.com/wholesale only users registered as wholesale and activated from admin will be able to see catalog with wholesale prices.

What’s left…

And this was the easiest part … the rest is to import about 2000 products from the current osCommerce store, and to add another 4000 from the client’s ERP system. After this on regular basis to update prices and quantities from ERP system. :)

Hopefully this will help someone.

Development, General , , ,

Strange issue with captcha field

January 24th, 2009

Captcha caseWell, it’s more an observation than a real problem.

For my current CakePHP project I had to set a captcha field to a user registration form. I decided to be “creative” and I set the captcha image as background of the input field. In fact the graphical representation wasn’t bad at all. Unfortunately when it’s used, the captcha word shows wrong image and of course the result was wrong. To be correct the first attempt was always ok, but the second one (let’s say if the user decided to register again) the captcha was always wrong.

I checked everything especially after the image in Javascript library case and I couldn’t find anything suspicious.

The solution came when I removed the image from the background of the field and call it with an <img> tag. This time everything went just fine. This make me think that it’s a cache problem. I didn’t dig it deeply, because for now it’s working and as you can see it’s looking better.

So, an advise from me – never put your captcha image as background of your field, or call through css. Just use good old <img> tag instead.

Development, General, PHP , , , , ,

Autoload your javascript and css in CakePHP

December 20th, 2008

Have you ever wanted to have all your css or javascripts files loaded automatically once they are on place under /webroot/js and webroot/css folders? Well this is the solution.

What is all about

I’ve build a quick helper which will include all files under the js/ and css/ directories. So once the javascripts and css are there, they will be loaded automatically.

How to use it?

Using it is really easy. It’s like a normal helper:
1. add the file autoload.php under your /app/views/helpers
2. add it in the $helpers var in the controller
3. add the following snippet in your layout file. It should be under /app/views/layouts:

<?php echo $autoload->javascript();?>

This will include all files under /webroot/js

<?php echo $autoload->css();?>

This will include all files under /webroot/css

<?php echo $autoload->all();?>

This will include all files under /webroot/js and /webroot/css

Key features:

1. The helper includes all files recursively.
2. The helper includes also files under /root/vendors/js and /root/app/vendors/js too (same apply to css). Vendors are loaded first. (Thanks to suggestion from Juan Basso)
3. The order of the files in one directory is based on the name, so now you can control the order as well. (Thanks to suggestion from Juan Basso)
4. Files starting with . (dot) are not included, files under directories starting with . are not included as well, so you can exclude some files
5. if you want to load some files after other use directories. For example if you want to include plugins after the main lib (jQuery), place them in plugins directory like:
js/plugins/plugin_one.js
js/plugins/plugin_another.js
js/.hidden/plugin_third.js
js/jquery.js
the result will be:

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/plugins/plugin_one.js"></script>
<script type="text/javascript" src="js/plugins/plugin_another.js"></script>

(same apply to css as well)

Warning: I’ve noticed that this helper doesn’t work properly with scriptaculous, because the script tries to load the additional plugins and they fail, but for jQuery there is not a problem at all.

Finally here is the code of the helper:
Read more…

CakePHP, Development, Labs, PHP , , ,

Careful with JavaScript includes

December 11th, 2008

Ok, this is not a code snippet article. It’s just an experience which you probably already met, but it was nightmare to find and it took me 1/2 a day to fix this “stupid” bug.

So what is the case?

Working on a project including some advanced JavaScript and Ajax techniques my coworker Milen noticed that the Session is not behaving as expected. In a simple function like:

function test($id = false){
  if ($id != false) {
    echo $id;
    echo $k = $this->Session->read('some_var');
    $this->Session->write('some_var', $id);
  }
  $this->set('tests', $this->paginate());
 }

The result should be quite easy to be predicted: if you pass for example 5 on the second reload the $k should be with the same value as $id. Unfortunately instead of 5 the $k was ‘images’. Yep, quite strange, isn’t it?

if you put die() at the end of the function, the result is as expected.

What was the problem

In our current project we are using jQuery and some of it’s plugins. So the problems was in the ThickBox plugin. If you remove it from the header everything works.

Digging into unpacked version of the plugin we’ve noticed that the loading picture is not where it should be. there is an variable

var tb_pathToImage = "images/loadingAnimation.gif"

and as you may notice the path is not compatible with Cake convention and obviously it’s not in the http://server/cakeapp/tests/test/images/.

In the example above we were writing id into the session. Yes but calling: http://server/cakeapp/tests/test/images/loadingAnimation.gif mean that $id take value of ‘images’.

It was quite tricky, because if you loading CSS or JavaScript and the file is not there, FireBug or even the html /if there is no correct CSS the styling will fail/ will warn the developer, but image loaded into the JS function is quite difficult to find.

Anyway, the conclusion is “Watch you JavaScript libs and what files they require”.

Ajax, CakePHP, Development, Frameworks, General, JavaScript, Labs, PHP , ,

My first Wordpress plugin

November 28th, 2008

Hey,

I am very proud to present you, my first plugin for Wordpress platform – Autocompleter.

The plugin adding autocomplete functionality for the search input field of your blog. The values are the tags and categories existing in the blog and this way you will help your visitors to find easily the proper information in your blog.

My first implementation was with Prototype and Script.aculo.us, but because I like very much jQuery library and I found a wonderful plugin for autocomplete, I build it with jQuery.

You can check the demo in this blog – top right – search box :)

Hope you will like it and you will vote for it :) Thanks

The official page is: wordpress.org/extend/plugins/autocompleter

Ajax, Development, General, JavaScript, Labs , , , ,

Translating plural and singular forms in CakePHP

November 20th, 2008

I don’t know how good you know the *.po translation file syntax, but for me it was a text file with “msgid” and “msgstr”, where msgid is the string, which could be found in a code of the app, wrapped with __() function and msgstr is the string which is the translation.

Following this convention in all of my projects I had not problems till now. But on this one I’ve noticed that the translation is not quite accurate especially when translating time. I am speaking about usage of timeAgoInWords() function from the TimeHelper.

I noticed that when there is a translation file for the specific language singular and plural words are not translated properly, I had results like “3 hour and 34 minute” instead of “3 hours and 34 minutes”.

I thought that I’ve found a bug, and I submitted a ticket in the trac, but I was wrong, because syntax of the PO files is a little bit extended than my understanding. :)

99% of the cases the standard approach could fit just fine, but when it’s used __n() function which is described as:

Returns correct plural form of message identified by $singular and $plural for count $count.

the translation file needed a specific syntax. Here is the example of it:

msgid "hour"
msgid_plural "hours"
msgstr[0] "hour"
msgstr[1] "hours"

As you can see instead of msgid<->msgstr pair, there is also msgid_plural and array of msgstr which holding the translations of singular and plural values. Note that in some languages plural could have 2 or more forms. In these cases the syntax will be (Czech):

msgid "%1 second"
msgid_plural "%1 seconds"
msgstr[0] "%1 sekunda"
msgstr[1] "%1 sekundy"
msgstr[2] "%1 sekund"

It’s good to set the plural forms definition in the project settings which are in the beggining of the file. This is very handy when you use PoEdit or similar translation tools, because if is your setting is correct, these tools will provide for each plural form separate tab.

The syntax of plural form definition is like:

"Plural-Forms: nplurals=1; plural=0;\n"

It hold 2 parameters the first one holding the number of plural forms in the specific language and the second one is an expression how to determine the plurals. If you don’t know how to set this correct for a specific language, check this good document of all available languages. :)

More information about the PO syntax I founded in that article. I’ve noticed in that the article there are shortcuts, which are not useful for me so far, but you never knows, in the future they could be handy.

Regarding to that I am wondering is there a POT file for the core lib translations which could be a big helper to anyone who need to translate the whole framework.

CakePHP, Development, Frameworks, PHP , , ,

Blast from the past

November 10th, 2008

Hey guys,

last week I’ve worked on a project which I finished somewhere in spring of 2007 and I decided to share my experience with this post. I don’t know did you had such experience, but for me it was interesting, because working on old code is always challenge.

Basically, the project was really small one, which uses 80% of scaffolding, so really nothing complicated. Now the client wanted some extensions to the core functionality /like adding few more look-up tables and some basic reports/ and because I was the only one developer who worked on it, they ask me to do this and I agreed.

My first thought was to upgrade the core CakePHP lib to the last version, but after thinking I decided not to, because if something goes wrong /like some deprecated functions/, I need to do more work in debugging rather than focusing on the real tasks.

What I noticed while I coded?

The major one – Improvement of the console script. In the past it was in the /cake/scripts/. In the folder there were acl.php, bake.php and bake2.php, extract.php for label extraction and master bake which I never used. Now, the console script is more advanced and provide more functions. Still I am not big expert on it and I still using it for basic operations :) .

Fully translated labels – it’s related to the previous one – when the code was generated with old bake script, some of the labels weren’t wrapped with __() function and especially for me it was biggest pain. Someone could tell me that there was ability to modify the templates, but I personally never did it.

The truth is that CakePHP in fact is improved a lot since then. Hopefully it will continue in this direction in the future as well.

Anyway, it was really interesting experience for me.

CakePHP, Development, Frameworks, PHP , , , ,

Fixing Dead Centre approach with jQuery

October 17th, 2008

I was worked on a centred project design of a website. When I met such requirement I’ve always used Dead Centre approach.

Unfortunately I’ve noticed that when the content is larger than the screen the top-left corner is not visible. In that current project the logo of the site was exactly on that place, so it’s really confusing.

I had to solve this issue in order to satisfy the clients requirements. So, I’ve used jQuery to sort this out.

You can see the difference in these 2 examples:

Resize your browser window in order to see the difference.
How it’s working?

First of all there are 2 javascript includes:

<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.dimensions.min.js"></script>

After this there is a function which track the size of the screen and the content.

<script type="text/javascript">
        /*Track height and width of the window and the content*/
        function resize(){
            if($(window).height() < $('#content').height()){
                $('#horizon').css('top', '0px');
                $('#content').css('top', '0px');
            } else {
                $('#horizon').css('top', '50%');
                $('#content').css('top', '-'+($('#content').height()/2)+'px');
            }
            if($(window).width() < $('#content').width()){
                $('#content').css('left', ($('#content').width()/2)+'px');
            } else {
                $('#content').css('left', '50%');
            }
        }
       
        //Bind events on resize
        $(document).ready(function(){
            resize();
        })
        $(window).bind("resize", function(){
            resize();
        });
    </script>

The explanation of the code:
I am using jQuery plugin named jQuery Dimensions Plugin 1.1 which extract the proper dimensions of the boxes.
The function checking if the content screen is bigger than the window size, if so it change the CSS in order to fit properly. I guess that you can see the logic easily. So, no more explanations here.

Hope this will help someone.

Development, Frameworks, JavaScript, Labs , , , , ,