1 (edited by Tobi 2005-10-28 12:56)

Topic: Live Check of Username/Email in Registration

This is a mod that is - so I hope - a nice example of how useful AJAX can be.
What it does is:
Upon registration, when the user enters a username and email address the AJAX interface checks immediately if the name is already taken and if the email address is free/semantically OK/not blocked.
If verification is enabled it also compares the two entered addresses.
Note that all this is done before the form is submitted.
When there is an error the user gets notified.
This saves new users of frequented boards from a lot of entering , waiting, reading "Sorry, this name is already taken" and so on... hope the point is clear.
The whole thing requires the xajax libraries which are included, and on the client side JavaScript must be enabled.
Well, doesn't hurt without.

You can get it at Punres or here
mod_registerPrecheck-1.0.tgz
mod_registerPrecheck-1.0.zip

Note for developers:
Yes, I had to reuse a lot of Rickards register functionality, no way round it smile

note for designers/CSS experts:
The notification is currently producing red bold text. I am aware that some of you would like to change that.
However, I'm not the big CSS expert so whoever is interested leave me a clue here. Thanks. smile

The German PunBB Site:
PunBB-forum.de

Re: Live Check of Username/Email in Registration

Cool smile

"Programming is like sex: one mistake and you have to support it for the rest of your life."

3

Re: Live Check of Username/Email in Registration

Could something like that be used to give instant error messages/preview on entering post text? Or even do an instant search when you enter a new topic subject?

4 (edited by Tobi 2005-10-28 13:03)

Re: Live Check of Username/Email in Registration

Sure it could.
The instant preview, however, would put some load on the whole thing, all this constant parsing/sending of data...
I guess that would be a bit big.

The search function, however, is more or less what google did with google suggest if I'm getting you right.
You get some search words that other people had typed while you type, or you get potential hits.
Edit: You could use the PREFIXsearch_words table for that.

The German PunBB Site:
PunBB-forum.de

Re: Live Check of Username/Email in Registration

hey a demo page would be nice

6 (edited by Jansson 2005-10-28 14:50)

Re: Live Check of Username/Email in Registration

Tobi wrote:

Sure it could.
The instant preview, however, would put some load on the whole thing, all this constant parsing/sending of data...
I guess that would be a bit big.

Instant preview can be done with javascript only. I made a live preview mod for PunBB 1.0.* once.

7 (edited by Tobi 2005-10-28 14:57)

Re: Live Check of Username/Email in Registration

piniyini wrote:

hey a demo page would be nice

Here you go:

http://www.script.gr/board/register.php

It doesn't have the email verification field because it has the beautiful captcha mod installed but you'll get the idea.

The German PunBB Site:
PunBB-forum.de

8

Re: Live Check of Username/Email in Registration

Jansson wrote:
Tobi wrote:

Sure it could.
The instant preview, however, would put some load on the whole thing, all this constant parsing/sending of data...
I guess that would be a bit big.

Instant preview can be done with javascript only. I made a live preview mod for PunBB 1.0.* once.

What I meant with "instant" was something like "Preview while you type".
I am just sitting on that anyway, I think it is better to do it with ajax because then you can use the punBB parser and you don't have to write one in JavaScript.

The German PunBB Site:
PunBB-forum.de

Re: Live Check of Username/Email in Registration

It's not letting me go to the next input box

Re: Live Check of Username/Email in Registration

Tobi wrote:
Jansson wrote:
Tobi wrote:

Sure it could.
The instant preview, however, would put some load on the whole thing, all this constant parsing/sending of data...
I guess that would be a bit big.

Instant preview can be done with javascript only. I made a live preview mod for PunBB 1.0.* once.

What I meant with "instant" was something like "Preview while you type".
I am just sitting on that anyway, I think it is better to do it with ajax because then you can use the punBB parser and you don't have to write one in JavaScript.

I already made one in javascript, only i couldn't make all of punbbs code and quote box stuff as javascript since i was just editing examples lol, not sure where i put it though.

Re: Live Check of Username/Email in Registration

Sorry to double post wink

Paul wrote:

Or even do an instant search when you enter a new topic subject?

I like the idea of this, i've just been playing with some ajax stuff i had smile
add this to header.php

<script type="text/javascript">
    var ajax=false;
    /*@cc_on @*/
    /*@if (@_jscript_version >= 5)
    try {
    ajax = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    ajax = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
    ajax = false;
    }
    }
    @end @*/
    if (!ajax && typeof XMLHttpRequest!='undefined') {
    ajax = new XMLHttpRequest();
    }
    function getMyHTML(serverPage, objID) {
        var obj = document.getElementById(objID);
        ajax.open("GET", serverPage);
        ajax.onreadystatechange = function() {
            if (ajax.readyState == 4 && ajax.status == 200) {
                obj.innerHTML = ajax.responseText;
            }
        }
        ajax.send(null);
    }
</script>

and replace this in post.php

if ($fid): ?>
                        <label><strong><?php echo $lang_common['Subject'] ?></strong><br /><input class="longinput" type="text" OnBlur="getMyHTML('test.php?value=' + document.getElementById('post').req_subject.value,'ajaxwrapper')" name="req_subject" value="<?php if (isset($_POST['req_subject'])) echo pun_htmlspecialchars($subject); ?>" size="80" maxlength="70" tabindex="<?php echo $cur_index++ ?>" /><br /></label>
<div id="ajaxwrapper">
</div>                        
<?php endif; ?>

and the div <div id="ajaxwrapper"> will get filled with the text from test.php?value=(the value of the subject will be put here) every time the subject field loses focus.

Would just take a little script in test.php (can be renamed of course) to perform a search using the topic title

Re: Live Check of Username/Email in Registration

Tobi wrote:
Jansson wrote:
Tobi wrote:

Sure it could.
The instant preview, however, would put some load on the whole thing, all this constant parsing/sending of data...
I guess that would be a bit big.

Instant preview can be done with javascript only. I made a live preview mod for PunBB 1.0.* once.

What I meant with "instant" was something like "Preview while you type".
I am just sitting on that anyway, I think it is better to do it with ajax because then you can use the punBB parser and you don't have to write one in JavaScript.

That's exactly what it did. And it didn't put any load on the server.

13

Re: Live Check of Username/Email in Registration

Ajax is the FUTURE. REALLY.

It would be NICE to see how we can see PUNBB and AJAX TOGETHER ... without problem of compatibility (for example : you search a username, and beneath the form, you see all usernames in a list which begins with the letters you type, or when you have put a word or sentence in search form, the SAME thing than the usernames)

AJAX permits MIRACLES. Since my Coppermine Gallery is in AJAX mode, I have gained ... 100% of visitors !

In admin mode, in the left imagine without going in the profile mode, changing directly the username, its status ... and of course, if JS is disable, bah .... the link to PROFILE will work smile

By working on all ideas with AJAX, punBB will gain in server load, even if it's already the fastest forum app' on the web.

Very good job TOBI : you have opened the way smile

14

Re: Live Check of Username/Email in Registration

The only nut to be cracked now is the accesibility issues which AJAX poses. Most assistive devices have problems with it because they are not aware of content changes produced by javascript though I think there are ways around it.

15

Re: Live Check of Username/Email in Registration

Jansson wrote:

That's exactly what it did. And it didn't put any load on the server.

When you do it in JavaScript only it won't, that's right. What I meant was doing it with ajax=using the punBb parser engine.

Connorhd wrote:

I already made one in javascript, only i couldn't make all of punbbs code and quote box stuff as javascript since i was just editing examples lol, not sure where i put it though.

So you both have done a live preview?
That's great. Can't you make it available somehow? I would definitely like to have it....
How did you deal with bbcode? Isn't it difficult to preview text inside an open bbcode tag?
Really, I'd like to have that thing...

The German PunBB Site:
PunBB-forum.de

16 (edited by Tobi 2005-10-28 16:14)

Re: Live Check of Username/Email in Registration

Paul wrote:

The only nut to be cracked now is the accesibility issues which AJAX poses.

Do you have more information on that?
I have no idea f.e. about the way these braille and reader tools work, but it would definitely a good idea to have them working as well.

Btw: The registration functions like before without JavaScript. You;ll get the same error messages from the server, it's just that you'd have to wait for it.

In general you have a point tere I think. Apps that rely 100% on Ajax are not (yet) a good idea I guess.

The German PunBB Site:
PunBB-forum.de

Re: Live Check of Username/Email in Registration

just an addition to my earlier code an example test.php

<?php
define('PUN_ROOT', './');
require PUN_ROOT.'include/common.php';
require PUN_ROOT.'include/parser.php';
$result = $db->query('SELECT t.subject, p.id, p.topic_id, p.message FROM '.$db->prefix.'posts AS p LEFT JOIN '.$db->prefix.'topics AS t ON p.topic_id=t.id INNER JOIN '.$db->prefix.'forums AS f ON f.id=t.forum_id LEFT JOIN '.$db->prefix.'forum_perms AS fp ON (fp.forum_id=f.id AND fp.group_id='.$pun_user['g_id'].') WHERE (fp.read_forum IS NULL OR fp.read_forum=1) AND MATCH (p.message) AGAINST (\''.$_GET['value'].'\') limit 0,5') or error('Unable to fetch topic list', __FILE__, __LINE__, $db->error());
if ($db->num_rows($result) != 0)
{
    while ($row = $db->fetch_assoc($result))
    {
        echo $row['subject'] . ' - ' . parse_message($row['message'],0);
    }
}
else 
{
    echo "No similar topics";
}

using fulltext search (sorry too lazy to work out search.php wink)

Needs tidying up and stuff, if i get chance i'll release it properly

Tobi wrote:
Connorhd wrote:

I already made one in javascript, only i couldn't make all of punbbs code and quote box stuff as javascript since i was just editing examples lol, not sure where i put it though.

So you both have done a live preview?
That's great. Can't you make it available somehow? I would definitely like to have it....
How did you deal with bbcode? Isn't it difficult to preview text inside an open bbcode tag?
Really, I'd like to have that thing...

I'll look for it, i was just doing it for fun and i have no idea where it is now, the bbcode tags were easy all i did was convert punbbs regexes to javascript ones (i'm sure someone with more javascript experience could convert the whole parser to javascript) then parsed the content on every update, so
test[/b would appear as it is in the preview but as soon as they pressed ] it would turn to [b]test quote and code tags are trickier, but you could even make it show a warning message when tags are open big_smile unlimited possiblities.

18

Re: Live Check of Username/Email in Registration

Connorhd wrote:

I'll look for it, i was just doing it for fun and i have no idea where it is now, the bbcode tags were easy all i did was convert punbbs regexes to javascript ones

Yes, please look for it.
Sounds good...

The German PunBB Site:
PunBB-forum.de

19 (edited by reckless 2006-05-28 21:37)

Re: Live Check of Username/Email in Registration

i installed this, works fine on the register page.
but after the user clicks submit it produces a error where the code has been added to the header.

does it not work properly with 1.2.12?

edit - my bad. got it fixed now.
script is spot on. great stuff.

Re: Live Check of Username/Email in Registration

Tobi wrote:
piniyini wrote:

hey a demo page would be nice

Here you go:

http://www.script.gr/board/register.php

It doesn't have the email verification field because it has the beautiful captcha mod installed but you'll get the idea.

i got an error
Fatal error: Call to a member function on a non-object in /usr/home/script/public_html/board/header.php on line 68

http://www.dharmil.info/ - My site

http://www.yourarcadesite.1.vg/ - My Arcade, Play 250 games online for free and Save your high score!

http://www.forums.dharmil.info/ - My forums i created using php/mysql still working on them about 15% or more done

21

Re: Live Check of Username/Email in Registration

I haven't...
anyway, the thread is a bit outdated, I upgraded several times in between, so don't count on it to work properly anymore... smile

The German PunBB Site:
PunBB-forum.de