Problem:

This works in PHP 5.3+:

$CLASS_NAME = 'TheName';

$class_instance = new $CLASS_NAME;

This doesn’t

define('CLASS_NAME', 'TheName');

$class_instance = new CLASS_NAME;

 

Workaround:

Use the way that works.  There are other limitations with using a variable to create a class.  Another way to create a class from a variable is by using:

$test = call_user_func(array($className, 'getInstance'));

 

Tagged with:

I recently was asked the age old question “what CMS is the best?”.  So I asked back “What will the CMS be used for?”, and of course that wasn’t specifically known.  This post is not a complete post.  It is here to jot down findings and notes about CMS’s.  Wordpress and Exponent CMS are the only two CMS’ I have tried for more than 5 minutes.  I tried Exponent and WordPress in 2007 and have not given Exponent another chance.  Since then Joomla and Drupal have become the clear competition (in terms of popularity) for WordPress.  So these three will be reviewed.  At the time of this post creation, WordPress is beating both in terms of Google Searches.

Wordpress, Drupal, Joomla search trends

WordPress (blue), Drupal (red), Joomla (yellow)

In the following lists, “Users” are people who use the CMS to put out content.  “Developers” are people who set up and/or customize the CMS for someone else to use.   And if you haven’t noticed, these are only comparing PHP open source CMS’.

WordPress

[list style=”check”]

  • Very easy to pick up and learn for new users.

[/list] [list style=”cross”]

  • Forums have many complaints from developers.

[/list]

Drupal

[list style=”check”]

  • Easy for developers to pick up and learn

[/list] [list style=”cross”]

  • Not user friendly.  Difficult for new users to pick up and learn.
  • No WYSIWYG editor.

[/list]

Joomla

[list style=”check”]

  • Easy to use for Developers, Designers, and Users

[/list] [list style=”cross”]

  • Not as User-Friendly as WordPress.
  • Not as powerful as Drupal.

[/list]

Conclusion

In conclusion from the web, it seems that WordPress is best for clients you want to impress, Drupal is best if you have a website with many features, Joomla is best if … you need something easier to use than Drupal, but more customizable than WordPress? In my own narrow opinion, WordPress has a large community creating plugins to keep you from straying to Drupal.   These plugins offer calendars, embedded video, columns, galleries, etc.  One thing that I think I’ve seen in Drupal that WordPress does not natively support (and did not find a plugin yet) is to edit different parts of a page.  For example if you wanted to have a template where you needed to edit some text on the left sidebar, the top section, and the main content, you would have trouble doing this in WordPress. I’m still doing research on how easy it would be in Drupal or Joomla.  The problem for me is that the user interface of Joomla and Drupal looks like it’s meant for IT personnel.  However, the people I’m creating a CMS for are business and secretarial personnel.  Decide for yourself and try a demo of each one and more at opensourcecms.com.

Update

Below are the up-to-date trends… Joomla and Drupal?  what’s that?

Tagged with: , , ,

I don’t know how I used to develop web pages before Firebug.  It is the single best tool you can have when debugging a webpage.  If something doesn’t look right I open Firebug and find out what styles are being inherited.  If some javascript functionality is not working I open Firebug and enter debug statements.   If some ajax call is messing up and the page isn’t showing the response correctly, I open Firebug.

Installation

The best thing about Firebug is how much time it saves you on debugging.  Even better than it being free.  That’s a lot considering how I watch my money.   I only use Firebug with Firefox.  It can be downloaded at https://addons.mozilla.org/en-us/firefox/addon/firebug/.  What’s good is that it’s available on both Mac and PC.   Just click on the Add to Firefox button and it’s mostly done for you.  That easy.  A firebug was also developed for IE but I haven’t tried it recently.  I tried it a couple years ago and it didn’t help me very much so I stuck with just using the Firefox one.

CSS

When you need to see why an item on a webpage is not showing as its supposed to you can right click on it and select “Inspect Element”.  Doing this opens up the firebug window and it will tell you exactly what styles are being applied to it and what styles have been overwritten.  You can even change the values of anything you want to see the outcome in real-time.

Javascript

Browsers can tell you the last error code that happened, but firebug can let you watch expressions, look at the stack, insert breakpoints, and print out statements in the console.

Request / Response

Any and all requests to the server can be inspected on the Net tab.  You can see each javascript include file, each image, each ajax request.  This means that if an ajax call goes wrong, you can inspect the parameters that were sent and the response the page got back from that request.  It makes debugging a breeze.

Firebug can be downloaded here: http://getfirebug.com/

Tagged with: , , , ,

Internet Explorer, How do I loathe thee?
Let me count the ways.

As stated on the w3schools website,

[quote]The values “inline-table”, “run-in”, “table”, “table-caption”, “table-cell”, “table-column”, “table-column-group”, “table-row”, “table-row-group”, and “inherit” is not supported in IE7 and earlier. IE8 requires a !DOCTYPE. IE9 supports the values.[/quote]

I had a project where I needed to create a photo gallery.  The goal was to get the gallery to look like iStockPhoto with the images all bottom-aligned, evenly spaced, etc, etc.  Well in creating the gallery I had a hard time aligning the photos on the bottom, so I took a look at how istock did it.  They use “table-cell” display option and vertically align the image to the bottom.  So I tried it, but soon found that Internet Explorer does not support that option.  And then I found that istock was no exception.

iStock with Chrome

 

iStock with Internet Explorer
iStock with IE

 

Solution:

I did not personally do this solution as this was not too important.  However someone on Stack Overflow seems to have solved it with jQuery:

$(document).ready(function(){
  if ($.browser.msie && $.browser.version == 7)
  {
    $(".tablecell").wrap("<td />");
    $(".tablerow").wrap("<tr />");
    $(".table").wrapInner("<table />");
  }
});

the above script assumes you have divs using style such as:

<style>
.table     { display: table; }
.tablerow  { display: table-row; }
.tablecell { display: table-cell; }
</style>

 

Tagged with: ,

This is an easy way to get all rows from a SQL table into a string:

select stuff((
                  select ', ' + a_column
                      from [name_of_table]
                      order by table_id
                      for xml path('')
                  ), 1, 1, '')

Tagged with:

Problem:

I was given a project where the client switched from using http to https.  Everything worked fine except for their Google Maps page.  The page  had a warning in IE about unsecure mixed content.  This was because Google Maps was pulling from an http (unsecured) address.  It turns out that the Map was using version 2 of Google Maps API which does not support https.  Only version 3 does.

Solution:

Don’t be fooled into thinking this is a straight forward, simple upgrade.  It is not.  This solution is just a log of what I did to get the site from v2 up to v3.  It is in no way  a complete guide.  The site used EWindow instead of the infoWindow because of its customized look.  So I guess the following could be a rough step-by-step guide to converting the Ewindow script to v3.


In general you’ll need to replace all “G” prefixes like “GSize” with “google.maps” like “google.maps.Size”.

Replace GSize with google.maps.Size
Replace GLatLng with google.maps.LatLng
Replace GPoint with google.maps.Point
Replace GOverlay with google.maps.Overlay

Replace “new google.maps.Overlay” with “new google.maps.OverlayView()”

Take out or replace GBrowserIsCompatible. There is no equivalent function in v3.

Replace

map = new GMap2(document.getElementById("map_canvas"))

with something like:

    var myOptions = {
      zoom: 4,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

Replace a custom icon marker using the icon-complex example:
http://code.google.com/apis/maps/documentation/javascript/examples/icon-complex.html

Before the change:

var tinyIcon = new GIcon();
tinyIcon.image = "images/gmap/marker.gif";
tinyIcon.iconSize = new google.maps.Size(22, 22);
tinyIcon.iconAnchor = new google.maps.Point(11, 11);
tinyIcon.infoWindowAnchor = new google.maps.Point(0, 0);
var myLatLng = new google.maps.LatLng(loc['lat'], loc['lng']);
var marker = new GMarker(myLatLng, { icon:tinyIcon });
GEvent.addListener(marker, showWindow, mouseover);
map.addOverlay(marker);

After:

var image = new google.maps.MarkerImage('images/gmap/marker.gif',
  // This marker is 20 pixels wide by 32 pixels tall.
  new google.maps.Size(22, 22),
  // The origin for this image is 0,0.
  new google.maps.Point(0,0),
  // The anchor for this image is the base of the flagpole at 0,32.
  new google.maps.Point(11, 11));

var myLatLng = new google.maps.LatLng(loc['lat'], loc['lng']);
var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    shadow: shadow,
    icon: image
});
google.maps.event.addDomListener(marker,'mouseover', showWindow);

Replace getPoint to getPosition

var vx = marker.getIcon().iconAnchor.x - marker.getIcon().infoWindowAnchor.x;
var vy = marker.getIcon().iconAnchor.y - marker.getIcon().infoWindowAnchor.y;
this.openOnMap(marker.getPoint(), html, new google.maps.Point(vx,vy));

For infoWindowAnchor I could not find an equivalent so I scratched the whole calculation and just put in a hard coded value.

var vx = 10;
var vy = 10;
this.openOnMap(marker.getPosition(), html, new google.maps.Point(vx,vy));

Replace initialize:

EWindow.prototype.initialize = function(map) {

With onAdd:

EWindow.prototype.onAdd = function() {

Replace map.addOverlay(object) by moving a similar call to within the object.

map.addOverlay(ewindow)

To this within the object:

this.setMap(map)

Replace map.getPane()

map.getPane(G_MAP_FLOAT_SHADOW_PANE)

With this:

this.getPanes().mapPane

Replace this.redraw

this.redraw

with this.draw

this.draw

Replace Overlay.getZindex

var z = google.maps.Overlay.getZIndex(this.point.lat());

I could not find an equivalent to getZIndex so, again, it’s somewhat hard coded.

// you may need to work on this "hack" to replace V2 getZindex
// GOverlay.getZIndex(this.point.lat());
var z = 1000*(90-this.point.lat());
this.div_.style.zIndex = parseInt(z);

Replace this.map.fromLatLngToDivPixel

var p = this.map.fromLatLngToDivPixel(this.point);

With this:

var proj = this.getProjection();
var p = proj.fromLatLngToDivPixel(this.point);

Replace map.panBy(Size) to map.panBy(x:number, y:number)

map.panBy(new google.maps.Size(pan_right, pan_up));

With this:

map.panBy(-pan_right, -pan_up);

A very helpful site was one that made google maps compatible for both versions:
http://notebook.kulchenko.com/maps/google-maps-using-multiple-api-versions

And of course the Google Maps v3 Examples and API docs helped a great deal.  It may also help to look at version 2 of the API so that you can try and find something equivalent.

I uploaded a converted EWindow.js for whoever needs a google maps v3 version of EWindow.

Tagged with: ,

Demo: Resizing Background Image Demo

Problem:

I’ve been given a project to make a background image resize with the browser window size while retaining its ratio, not causing scrollbars, and always filling up the whole window.  It seems pretty easy until you actually see it.  Here’s a real life example of it:  http://ringvemedia.com/.  As you can see it pans as the browser is resized larger until a certain point and then it expands.  It never breaks its width to height ratio.

Solution:

The solution is quite simple.  It only involves using some CSS and a table.

First we need to make sure the image doesn’t overflow and cause scrollbars.

html,body,#bg,#bg table,#bg td {
    width:100%;
    height:100%;
    overflow:hidden
}

Then we need to center the div and make sure it’s not too small.

#bg {
    position:absolute;
    width:200%;
    height:200%;
    top:-50%;
    left:-50%;
}

Finally, center the image. I’m not exactly sure why a table is needed in the html, but it does work better in filling the window with it in.

#bg td {
    vertical-align:middle;
    text-align:center;
}

#bg img {
    min-height:50%;
    min-width:50%;
    margin:0 auto;
}

This is some pretty unique css coding and I’ve seen it in a couple places.  Surprisingly (not), it’s the same code at both sites!  I wonder who copied who?  Well, I can’t say I didn’t do that either.

 

Tagged with: ,

These are some notes on the hosts that I’ve tried.  As you can see, Bluehost offers the best combination of allowing port 2159 to be opened, allowing at least 128MB PHP memory, and having 64-bit servers.  I’ll be adding more here as I encounter the differences.

GoDaddy – http://godaddy.com

  • PHP can have an unlimited (at least 128 MB) memory
  • Servers are 32-bit  (as seen with this issue http://bugs.php.net/bug.php?id=53662)
  • Port 2159 outbound can NOT be opened on a shared hosting account even with a purchase of a dedicated IP.
  • Support on Godaddy is not the greatest.  They do respond but are not able to supply any coding or scripting assistance.
  • Prices start at $6.99 / month for the unlimited plan

 

BlueHost http://bluehost.com

  • PHP version: 5.2.17 (as of 5/2011)
  • PHP can have an unlimited (at least 128 MB) memory
  • Servers are 64-bit (as seen with this issue http://bugs.php.net/bug.php?id=53662)
  • Port 2159 outbound can be opened with purchase of dedicated IP.
  • Bluehost support is great.  Knowing it was some server configuration, I once asked them why a file download using PHP was not showing the file size.  They responded with some code and other suggestions I could try.
  • Pricing starts at $6.95 / month

HostGator http://hostgator.com

  • PHP version: 5.2.x OR 5.3.6 (as of 5/2011)
  • PHP can only have limited memory of 64 MB max.
  • Servers are 32-bit (as seen with this issue http://bugs.php.net/bug.php?id=53662)
  • Port 2159 outbound can be opened with purchase of dedicated IP.
  • Support on HostGator is decent.  All I can say is that they are pretty fast to respond.  I haven’t asked them any questions regarding coding or scripting yet though.
  • Pricing starts at about $3.71 / month with the code MYMONKEYDO

 

Tagged with:

EditPlus is a text editorHTML editorPHP editorJava editor and Hex Viewer for Windows. While it can serve as a good Notepad replacement, it also offers many powerful features for Web page authors and programmers.

http://www.editplus.com

I have been using this editor since starting to program back in 2001.  This editor has met all my needs and wants.  I have not found any other editor that has all of the following features:

  • Ctrl-click – highlights the whole word
  • Right click on a file and have the option of opening it in Edit Plus
  • Simple FTP setup and connection
  • Easy syntax highlighting plugins
  • Word/character change case/etc
  • Brace highlighting
  • Starts up in 1 second or less.
  • Efficient Find All in files.
  • Free*

[typography  size=”10″ size_format=”px”]*technically it is not a free editor, but the 30 day trial expiration does not prevent you from using it over 30 days.  I will pay them some day…. Note: newer versions may not allow this.[/typography]

One of the best features that is in Edit Plus is the Find All in files.  This feature is in many other editors, but the speed of this feature in Edit Plus stands out.  When tracing new code you want to be able to find specific words in many files as fast as possible.  Edit Plus allows you to do this without having to break your train of thought.

Another feature that stands out is the Ctrl-click feature.  This is also available in MS SQL Management Studio.  Holding down the control button while clicking on a word highlights the whole word.  When you need to copy paste a word, you simply hold down ctrl, click, click to your destination, press v (ctrl-v).  The alternative would be double-click, click to your destination, press ctrl-v.  Not very different, but if you copy-paste frequently, it makes a big difference.

 

Welcome to My Monkey Do.  This is gonna be interesting.

Top