$query = $db->query("SELECT id, tag, COUNT( imagesrc.id ) AS quant FROM tags
                              LEFT JOIN taglink ON ( tags.id = taglink.tid )
                              LEFT JOIN imagesrc ON ( taglink.iid = imagesrc.id )
                              GROUP BY tag") or $db->raise_error();

Then we need to change the while loop to this:

while($row = $db->fetch_array($query)) :
  $tags[$row['tag']] = array('id' => $row['id'], 'quant' => $row['quant']);
endif;

Then we need to change the foreach loop to this:

 
foreach($tags as $key => $value) :
$size = $min_size + (($value['quant'] - $min_qty) * $step);
$red = $min_r + (($value['quant'] - $min_qty) * $step_r);
$green = $min_g + (($value['quant'] - $min_qty) * $step_g);
$blue = $min_b + (($value['quant'] - $min_qty) * $step_b);
 
$size = ceil($size);
$red = ceil($red);
$green = ceil($green);
$blue = ceil($blue);
 
echo '<a href="#" style="font-size: '.$size.'; color: rgb('.$red.', '.$green.', '.$blue.');" title="'.strtolower($key).'" rel="nofollow">'.strtolower($key).'</a> ';
// The space must be there to seperate tags. You could surround each one with a div and float them.
endforeach;

To echo out the id use $value['id'] at any point during the foreach loop.

Good luck. Just ask if you need any more help.

To see if you have FreeType just run phpinfo() on a blank php file and look for FreeType.

If it’s not there then sorry. You could ty to use the one on Marcofolio.net as I don’t think that one requires FreeType.

If you do have FreeType then I always find it helps to look at stupid things first. Like is the path to your PNG background image correct, so for instance does it load if you link directly to the image instead of the php file.

Is the file a valid PNG, I once had a problem with GD loading an image because it thought the file was corrupt?

Finally is the path to the ttf file correct. No way to check this one really just check it over again and again.

I hope one of those fixes your problem. I’d be suprised if you don’t have both GD & FreeType though as they have been relatively common on the servers I have used.

Good luck. Feel free to ask again if you’re still having the problem.

However my best guess is that you would need to have another ajax function something like ajaxAddPreview() which calls over to the php file again and runs another action. It’s pretty much exactly the same as how you added in the creation of the preview.

Although now I think about it, if you just want to add it to the main tiamot table then my ajaxAdd() is already built to do that. All you would need to do is call ajaxAdd from a button on the preview table and pass the id of the row you want to add… I think that should work.

I hope that helps. I’ll take a more detailed look a bit later when I’m not so busy. I just thought you’d prefer a quick answer now rather than none until later.

Basically, the source code of my site header shows the img tag pointing to the php file…which is basically the same as yours with exception of the changes to the feedburner url and the font which I’ve uploaded and pointed to.

Any suggestions?

Do I need to create another function and call it from ajaxPreview()? Or can I use an existing. I attempted to use the createTable() but it did not work.

Thanks again… i think this is almost over(Thank God)

jQuery’s animation queue does not queue the fadeOut and fadeIn commands. For example:

$('#animateit').animate({'top': 200}, 1000);
$('#animateit').fadeOut('fast');

When ran you would think that it would move the div animateit 200px from the top and then fadeOut fast. Unfortunately not, because fadeOut is unqueueable animate will start to run but it will immediately fade out before that animation finishes.

The reason you never see the loader depends on your internet connection speed and the size of the images you’re using. If they are small and you have a high speed connection the image will have loaded near to instantly so there is no need to show the loader. Plus I have tested it on extremely large images (jpegs of 4000 x 4000px) in IETester and I see the loader fine.

There could be another reason the loader gif doesn’t show which is the fact it is the class that shows it is removed after the first image is loaded. To show the loader again you need to reattach the .loading class again on the click event that loads the next picture. For example:

$("div.controls a.next").click(function() {
                $('#loader').addClass('loading');
		if (picPosition  0) {
			picPosition--;
			preloadImage(picsArray[picPosition]);
		}
		return false;
});

That will then show the loading class, which shows the loader, again each time a new image is shown until the preload is complete and then the preload function removes the class again as the image is finished loading.

I hope that makes sense. The fadeOut problem should only occur if the next image loads quick enough for it to interupt the previous image. There isn’t really anyway to stop that problem though. Although you could try swapping the two fades. That’s the fadeIn in the preloadImage function and the fadeOut your using with this animate({'opacity': 1}, 500) for fadeIn and change 1 to 0 for fadeOut.

I hope that helps you some more. Just shout if you have any more questions.

EDIT: Here is a better example of the need to put back the .loading class. This is the code that loads the new image when a thumbnail is clicked on my example:

function changeImage(a) {
	img = $(a).children();
	imgThmb = img.attr('src');
	imgPath = imgThmb.replace(/-\d+x\d+/gi, '');
	$('.fullSizeImage').fadeOut();
	$('#loader').addClass('loading'); // The line required...
	preloadImage(imgPath);
}

As you can see each time a new image is loaded the loading class is added back to the loader div. preloadImage holds the other part which removes the loader before fading the image in.

<div class="edit" id="field_name id">content</div>

It would have to be done Inside your createPreview() function as the createTable() function does the same for TIAMOT when a field is added. It would probably be something like:

$o .= '<div id="'.$key.'" "'.$id.'" class="edit">'.$row.'"</div>';

The code in the php file needs the field name which is held in the key and the id which is held in id.

You will also need to call the javascript function init() after the adding of your preview table or the edit function won’t know to make it editable.

Add it to just above the setTimeout() in your ajaxPreview() function but only inside the if(msg.indexOf(\"false\") == -1) of the if.

I hope that makes sense.

And I believe that Peter is onto something. When I go back in my array of pictures, the old picture does not fade out. It disappears immediately and the new one fades in. And the .loading class is never loaded either - so the Ajax loader .gif never displays. I haven’t had too much time to investigate it, but I think it may have to do with loading the image from the cache.

	function createPreview($rows, $id) {
		global $field_list, $edit_list;
		$o .= "";
		$o .= '';
		foreach($rows as $key => $row) {
			if(!in_array($key, $field_list)) {
				continue;
			} else {
				if(in_array($key, $edit_list)) {
					if($key == "promo_title") {
    					$o .= ''.$row.'';
  					}elseif($key == "promo_desc") {
    					$o .= ''.$row.'';
  					}
				}
			}
		}
		$o .= '';
		return $o;
	}

when i inspect the elements with fireBug, I see that the ID and class is consistent with that of a cell in Tiamot table, the only difference is that intiamot table there is a title attribute that I am assuming is dynamically inserted based ont he class=”edit”

The only other difference here is that this table gets inserted into a div called “preview”….

It looks as if it should work, the cursor changes on hover and etc., but it does not allow for edit. So all the attributes are there just no go.

Can you provide some suggestions?