moo ImageCrop - crop images with AJAX and PHP

February 7, 2008

mooImage crop - easy image cropping

Here it is, the worlds first easy-to-implement image cropper. This demo shows you how to use ajax and php functions to create cropped areas from images and return them directly.

This can be come in handy if you wish to let users create avatars from uploaded images with a certain with and height or any other process of cropping images.

Limitations

The demo doesn’t have things included like load image, or save image link generation. This is up to you, that demo should only show what can be archived using ajax and php.

The cropping area is actually hardcoded, but the next release will allow you to scale the box to your needs.

download

If you are interested into this script, then drop us a line!

Demo
AJAX image crop

XT::commerce search tag cloud

February 4, 2008

Add a tagcloud to your shop to display the most user searches - this module comes with all needed files to set up the tagCloud quickly and efficiently.

You can change the design of the CSS to your liking, define how many occurences of searches are needed to display the word in the cloud an a few other things.

The package comes with the following files:

  • Code to implement into advanced_search_result.php
  • box_tagcloud.html
  • boxes.php
  • searches.sql
  • tagcloud.css
  • tagcloud.php

An instruction file will lead you through the installation process; if any questions concerning the setup of the tag cloud arise, we provide help via email or phone.

Sample of the tagCloud can be seen on Buchwelt.de

You can order it directly via paypal here: Tag Cloud XT-Commerce

tagCloud generator revamped

January 31, 2008

It’s been about time, so the new tagCloud generator went online today.

We’ve upgraded the creation process, added some stop words, included the possibility to save the clouds and retrieve it later on again. The last 10 clouds are shown as a link on the main page, which are clickable to get the cloud back again.

Of course we’ve cheered up the whole design, as it was only a beta version before, in which we did not put much effort into the design process. Guess this one’s a lot better now, brighter colors, bigger fonts. Options for your convenience have been added:

  • Where to link the single tags
  • Define your own css style sheet
  • Define minimum amount of word occurence
  • Select the stopword language ( german / english )
  • Define the output size of the div

Of course you do not have to define all of that, if you are statisfied with the standard output, you can simply enter the domain which should be tagged and go.

If you feel there’s some options you’d like to have included, don’t wait and drop in a mail. We’re always open for suggestions.

Give it a try!

mootools autocompleter

December 7, 2007

Yes - another autocompleter for mootools. Difference: The used search engine/code as well as that the script itself consists only of 45 lines of javascript.

Features: start checking for words after the 3rd letter input, single words only, very fast search algorithm ( the example uses a DB with 300.000 words ), cross browser compatible.

To see it in action, go here: autocompleter mootools

You will find this script in the february edition of the PHP magazine “PHP Solutions Magazine” together with some more snippets, and on the CD.

ajax newsletter dropdown mootools

December 5, 2007

Another nice snippet to have a newsletter box on your site - coded as usual with mootools and mySQL / PHP.

The box sits on the top of a page, with a handle to be clicked. The box bumps down on click, revealing the signup form for the newsletter. Combined with some mySQL and PHP code, it then adds the user to the newsletter recipients. Simple, sleak and styleable the way you want.

Of course this thing is cross-browser compliant, working in IE6 / 7, FF, Opera.

Have a look at Newsletter AJAX on top of the page you can see it live in action. Check the CSS and the source code to see how it works, or simply drop us a line, so we can send it over :)

lightbox replacement - different approach

November 29, 2007

The mooSlideBox v3 is a small and slim ajax based extension or replacement of the common “lightbox” that can be found on nearly every page. This lightbox clone works in IE 6/7, Opera and Firefox.

To show the slider with an image, a heading and a sample text, you can call it this way:

Slide

To make the link a slideBox link, you need to add the tag rel=”designSlide” to it. The slide can contain a heading and some text. Define it in your title tag of the link, separate the heading from the main text with a “::”

If you wish to have more content, or html tags like links in the displayed content area, you can specify another tag in your slideBox. SlideBox uses the “rev=” tag. Give your rev tag the name of the div that contains additional content. In this sample it’s called rev=”mycontent”. This is the additional content
div:

The div containing the additional content is automatically hidden when the page is loading.

Go here for a sample and to download the script

SEO - replacing headings with images but keep the text for spiders

November 26, 2007

Maybe you sometimes wanted to replace your headlines on a site with images, but didn’t dare, as these headings are still an important part for search engine optimization.

Now, if you’re favouring using ajax, you can simply replace your headings but still show the text to the search engine bots.
With a small snippet ajax code this can be done easily. Tests with search engine like bots or our own websitecheck proves, that the search engine still recognizes the h1 and h2 tags and their contents.

Want to see it in action? Here’s our next artViper website, still under development, but with even this effect implemented. Just switch off javascript for a moment and look at the page then - or run the websitecheck test over that page. SEO meets style.

PHP AJAX based instant star rating script

November 15, 2007

If you find it hard to add your own starrating script into your pages, then this is for you.

The starrater comes with everything you need to implement a star-rating element into your system in no time. It’s based on PHP and AJAX ( mootools ), so everything is automated for you. You only need to include one line of code per rater ( multiple on one page possible of course ).
Benefits:

Adds a lock on each IP for a certain rating element, so anyone with the same IP can only vote once.
Automatically inserts votes into the db, calculates the average and displays that on the starrater as initial value.
No need to program your own logic for the starrater
Tooltip with ajax effects

AJAX & PHP instant star rating script

Tell A Friend AJAX script for XT-Commerce

November 11, 2007

Having tried a tell-a-friend script for xt-commerce, we were disappointed what it offered - no subpage sending, just the domain name, utilizing a popup. Furthermore it doesn’t allow to use smtp authentication, only uses the mail() function of php.

So we thought, let’s do this better - said, done. Out came a nice mootools based tell-a-friend box, which fades smoothly into view, asks for user name, email and recipient’s mail. It then sends out a small mail with the page url, etc. A mySQL based date / time / IP check secures the server side, as it only allows a certain amount of mails per day from one IP.

See it live: Demo and click on “Demo”.

You can buy this script here: AJAX Tell A Friend - buy now!

mootools image gallery with xml parser

November 10, 2007

The original gallery has been taken from http://www.aaronbirchphotography.com and updated with an XML parser that automatically reads images from a folder, creates the according thumbnails, reads the EXIF informations of the JPG’s and writes all this to a XML file.

Then a gallery with all the thumbs ( and this nice image menu ) is sent to the website, giving you an easy and convenient way of displaying your work without the need to resize all the images by hand.Together with the slimbox extension, which opens the big images when clicking on the thumbnails, you’ll receive a nice to look at gallery.

How it works:

You’ll get three files:

* createList.php
* readList.php
* index.php

Place the createList.php into your image directory. Call it from your browser. It will automatically
create a thumbs.xml file. The directory must be named “images” or change it in the createList.php
and readList.php to your needs.

Place the readList.php into your image directory. Open up your index.php and change the following:

// your image container

< ?php include("images/readList.php"); // your image directory and the call to the readList.php
$x = htmlentities(parseme('thumbs2.xml')); // call the function to read the xml file
?>

EXIF DATA:

The exif data will be read from each file in the images directory. If you don’t have exif data in your images,
right click ( Windows ) on a image file, choose properties, and select “File info”. There you can insert a title.
The title will be the information displayed as image caption.

REQUIREMENTS:

You’ll need the mootools framework, PHP5 ( to read EXIF data ) and that’s it. Concerning the page height and
the displayed amount of thumbnails, go to images.js and change the following line, so it matches your needs:

DOWNLOAD:
ImageMenu

‘height’: [thumbs[selected].getStyle(’height’).toInt(), 275] // whereas the 275 represents the height of the image
container.

« Previous PageNext Page »