<noscript><div class="pluginAlert" style="padding:10px;">{no_javascript_warning}</div></noscript>
<script type="text/JavaScript" src="{site_url}/javascript/profile_editor.js"></script>

<div id="pe_navbar" style="display:none">
{navbar}
</div>
<div class="clearboth" style="min-width:600px;">
<form action="{site_url}/usersettings.php" method="post" {enctype}>
    <div id="pe_preview" class="jsenabled_hide" style="display:none;">
        <fieldset style="margin-top:10px;">
            <legend>{lang_preview_title}</legend>
            {preview}
        </fieldset>
    </div>
    <div id="pe_namepass" class="jsenabled_show">
        <fieldset style="margin-top:10px;"><legend>{lang_name_legend}</legend>
            <table class="inputTable">
                {username_option}
                <tr>
                    <td style="width:150px;"><label for="fullname">{lang_fullname}:</label></td>
                    <td><input type="text" id="fullname" name="fullname" size="60" maxlength="80" value="{fullname_value}"{xhtml}></td>
                </tr>
            </table>
        </fieldset>
        <fieldset style="margin-top:10px;"><legend>{lang_password_email_legend}</legend>
            <div class="notes">
                <h4>{lang_password_help_title}</h4>
                <p class="last">
                    {lang_password_help}<br{xhtml}><br{xhtml}>
                    <span class="warningsmall">{lang_enter_current_password}</span>  
                </p>
            </div>
            <table class="inputTable" border="0">
                <tr>
                    <td style="width:150px;"><label for="passwd">{lang_password}:</label></td>
                    <td><input type="password" id="passwd" name="passwd" size="32" maxlength="32" value="{password_value}"{xhtml}></td>
                </tr>
                <tr>
                    <td><label for="passwd_conf">{lang_password_conf}:</label></td>
                    <td><input type="password" id="passwd_conf" name="passwd_conf" size="32" maxlength="32" value="{password_value}"{xhtml}></td>
                 </tr>
                <tr>
                    <td><label for="cooktime">{lang_cooktime}:</label></td>
                    <td>{cooktime_selector}</td>
                </tr>
                <tr>
                    <td><label for="email">{lang_email}:</label></td>
                    <td><input type="text" id="email" name="email" size="50" maxlength="96" value="{email_value}"{xhtml}></td>
                </tr>
                <tr>
                    <td><label for="email_conf">{lang_email_conf}:</label></td>
                    <td><input type="text" id="email_conf" name="email_conf" size="50" maxlength="96" value="{email_value}"{xhtml}></td>
                </tr>
                <tr>
                    <td><label for="old_passwd" class="warningsmall">{lang_old_password}:</label></td>
                    <td><input type="password" id="old_passwd" name="old_passwd" size="32" maxlength="32" value=""{xhtml}></td>
                </tr>
            </table>
            {delete_account_option}
        </fieldset>
    </div>
    <div id="pe_userinfo" class="jsenabled_hide">
        <fieldset style="margin-top:10px;"><legend>{lang_personal_info_legend}</legend>
            <div class="notes">
                <h4>{lang_userinfo_help_title}</h4>
                {lang_userinfo_help}
            </div>
            <table class="inputTable">
                <tr>
                    <td style="width:100px;"><label for="homepage">{lang_homepage}:</label></td>
                    <td><input type="text" id="homepage" name="homepage" size="55" maxlength="128" value="{homepage_value}"{xhtml}></td>
                </tr>
                <tr>
                    <td style="width:100px;"><label for="location">{lang_location}:</label></td>
                    <td><input type="text" id="location" name="location" size="55" maxlength="96" value="{location_value}"{xhtml}></td>
                </tr>
                {userphoto_option}
                <tr>
                    <td style="width:100px;"><label for="sig">{lang_signature}:</label></td>
                    <td><textarea id="sig" name="sig" style="width:100%" cols="20" rows="4">{signature_value}</textarea></td>
                </tr>
                <tr>
                    <td style="width:100px;"><label for="about">{lang_about}:</label></td>
                    <td><textarea id="about" name="about" style="width:100%" cols="20" rows="4">{about_value}</textarea></td>
                </tr>
                <tr>
                    <td style="width:100px;"><label for="pgpkey">{lang_pgpkey}:</label></td>
                    <td><textarea id="pgpkey" name="pgpkey" style="width:100%" cols="20" rows="4">{pgpkey_value}</textarea></td>
                </tr>
            </table>
        </fieldset>
    </div>

    {prefs}
    <p class="aligncenter" id="save_button">
        <input type="hidden" name="uid" value="{uid_value}"{xhtml}>
        <input type="hidden" name="mode" value="saveuser"{xhtml}>
        <input type="hidden" name="username" value="{username_value}"{xhtml}>
        <span style="padding-right:50px;"><input type="submit" name="btnsubmit" value="{lang_submit}"{xhtml}></span>
        <input type="submit" name="btncancel" value="{lang_cancel}"{xhtml}>
    </p>
</form>
</div>
<!-- JS Functions which will execute only if JS enabled will un-hide the special features that enhance the profile editor -->
<script type="text/JavaScript">
//<![CDATA[
    /* Initially the navbar is hidden - in case JS is disabled. Enable it now */
    document.getElementById('pe_navbar').style.display='';

    /* Now cycle through the profile tabs as the number in the template could have been modified (personalized)
       If you add custom panels, just ensure you use the class jsenabled_hide or jsenabled_show
       Build an object that can then be referenced in the functon showhideProfileEditorDiv
    */

    var profilepanels = new Object;
    var el;
    el=document.getElementsByTagName('div');
    for(i=0;i<el.length;i++) {
        var divname = el[i].id  
        if(el[i].className == 'jsenabled_show'){
            el[i].style.display = '';
            profilepanels[divname] = 'show';
        } else if(el[i].className == 'jsenabled_hide'){
            el[i].style.display = 'none';
            profilepanels[divname] = 'hidden';   
        }
    }
//]]>
</script>
