<?php
/*===================================================+ 
|| # HoloCMS - Website and Content Management System
|+===================================================+ 
|| # Copyright © 2012 DnT [Tutti i diritti riservati]
|| # http://dnt.webnet32.com/
|+===================================================+ 
|| # DnT HoloCMS v2 - Created By Donatello (DnT)
|| # http://code.google.com/p/dnt-project/downloads/list
|+===================================================*/ 

ini_set ('default_charset', 'iso-8859-15');
    /* requirements */
	require_once 'core.php';
	
	/* check if avatar session exists */
	if(!isset($_SESSION["AS"]) || empty($_SESSION["AS"])){
	}
	?><?php
if($_SESSION["AG"] == ''){
	header("LOCATION: ../register.php");
	}
	
	/* require templates */
	require_once 'static/templates/header.php';
	
	/* actions */
	if($_SERVER['REQUEST_METHOD'] == "POST"){
		if($_POST["avatar_complete"]){
			/* avatar is complete */
			$_SESSION["AC"] = true;
			/* redirect to invitations */
			header("Location: ../security_check.php");
		}
	}
	
?>
    
<script type="text/javascript" src="static/js/jquery.scrollTo-1.4.2-min.js"></script>
<script type="text/javascript" >
    UPDATE_FIGURE_URL = 'ajax/update.php';
    ASSETS_URL = 'ajax/assets.php';

    REQUIRED_PARTS = ['ch', 'hd', 'lg'];
    
     $(document).ready(function(){
        /* avatar tab navigations */
        $(".editor-navi-item").click(function(event) {
            event.preventDefault();
    
            avatarManager.tab(this);
        });
    
        $(".editor-group-navi-item").click(function(event) {
            event.preventDefault();
    
            avatarManager.subTab(this);
        });
    
        /* rotate avatar */
        $("#rotate-cw").click(function(event) {
            event.preventDefault();
    
            avatarManager.rotateFigure(+1);
        });
    
        $("#rotate-ccw").click(function(event) {
            event.preventDefault();
    
            avatarManager.rotateFigure(-1);
        });
        
        /* change gender */
        $("#set-male").click(function(event) {
            event.preventDefault();
    
            $('.gender-link').removeClass('active');
            $('#set-male').addClass('active');
    
            avatarManager.setGender('M');
        });
        $("#set-female").click(function(event) {
            event.preventDefault();
    
            $('.gender-link').removeClass('active');
            $('#set-female').addClass('active');
    
            avatarManager.setGender('F');
        });
    
        /* select asset */
        $(".handle-asset").live('click', function(event) {
            event.preventDefault();
    
            avatarManager.handleAsset(this);
        });
    
        /* change asset color */
        $(".handle-colour").live('click', function(event) {
            event.preventDefault();
    
            avatarManager.handleColour(this);
        });
    
        /* empty asset */
        $(".fake-asset").live('click', function(event) {
            event.preventDefault();
        });
        
        /* submit avatar */
        $("#submit_avatar").click(function(event) {
            event.preventDefault();
    
            $('#avatar_form').submit();
        });
        
        var defaultState = {'hr': '3163-39', 'lg': '285-77', 'ch': '3111-63-62', 'hd': '3103-1', 'sh': '305-78'};
        defaultState['gender'] = '<?php echo $_SESSION["AG"]; ?>';
        avatarManager.init(defaultState);
    });
</script>

    
    <script type="text/javascript" >
        ASSET_URL = 'static/assets';
        staticUrl = 'static/';
        
        defaultError = 'Something went wrong, please try again.';
        
        $(document).ready(function() {
        	/* input info texts */
        
        	$("#id_email, .email_invitation").click(function() {
                if($(this).val() == emailInitialTxt) {
                    $(this).val('');
                }
                $(this).removeClass('input-error');
            });
            $('#id_email, .email_invitation').blur(function() {
                if($(this).val() == ''){
                    $(this).val(emailInitialTxt);
                }
            });
        
            /* fade errors */
            $('.error-container').live("hover", function(){
                $(this).fadeOut();
            });
        
        });
    </script>
    
    
    <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', '']); </script>
    
</head>
<body>
    <div id="black-bg"></div>
    
    <div id="page">
        <div id="main">
            <div id="main-wrap">
                <div id="top">
                    <div class="main-top">
                        <header>
                            <h1><?php echo $shortname ?>: Scegli il tuo Avatar</h1>
                            <div id="main-logo">
                                <a href="/" ><img src="static/images/logo.png" alt="Retro logo" /></a>
                            </div>
                        </header>
                        <div id="social">
                            <div>                               
                            </div>
                        </div>
                    </div>
                    
<div class="secondary-top avatar">
    <div id="content-top">
    </div>
</div>

                </div>
                
                <div id="primary">
                    
    <div class="container float avatar-editor">
        <section>
            <div id="content">
                <header>  
                    <h1>Crea il tuo Avatar</h1>
                    <p>Crea il tuo look entra in Hotel e Divertiti.</p>
                </header>
                
                <div id="avatar-editor">
                    <div class="top"></div>
                    <section class="content clear">
                        <div id="editor-navi" class="float">
                            <nav>
                                <ul>
                                    <li>
                                        <a href="" id="hd-navi" class="editor-navi-item">
                                            <div class="navi-img-container">
                                                <div class="navi-img"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="" id="hr-navi" class="editor-navi-item">
                                            <div class="navi-img-container">
                                                <div class="navi-img"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="" id="ch-navi" class="editor-navi-item">
                                            <div class="navi-img-container">
                                                <div class="navi-img"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="" id="lg-navi" class="editor-navi-item">
                                            <div class="navi-img-container">
                                                <div class="navi-img"></div>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </nav>
                        </div>
                        <div id="editor-content" class="float">
                            <div id="hd-content" class="editor-content-area">
                                <div class="header"><h4 class="no-extra-margin">Sesso</h4></div>
                                <div id="gender-container">
                                    <nav>
                                        <ul>
                                            <li>
                                                <a href="" id="set-male" class="gender-link<?php if($_SESSION["AG"] == "M") { echo ' active'; }?>">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="set-female" class="gender-link<?php if($_SESSION["AG"] == "F") { echo ' active'; }?>">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                        </ul>
                                    </nav>
                                </div>
                                <div class="header"><h4 class="no-extra-margin">SCEGLI LA TUA FACCIA</h4></div>
                                <div id="hd-container"><div class="asset-container"></div></div>
                                <div class="palette-header"><h4>SCEGLI UN COLORE</h4></div>
                                <div id="hd-palette" class="palette-container"></div>
                            </div>
                            <div id="hr-content" class="editor-content-area">
                                <div class="group-navi">
                                    <nav>
                                        <ul>
                                            <li>
                                                <a href="" id="hr-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="ha-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="he-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="ea-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="fa-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                        </ul>
                                    </nav>
                                </div>
                                <div class="group-content">
                                    <div id="hr-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI IL TUO STILE DI CAPELLI</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="ha-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI UN CAPPELLO</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="he-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI GLI ACCESSORI PER I CAPELLI</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="ea-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI GLI OCCHIALI</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="fa-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI GLI ACCESSORI PER LA FACCIA</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                </div>
                                <div class="palette-header"><h4>SCEGLI UN COLORE</h4></div>
                                <div class="palette-container"></div>
                            </div>
                            <div id="ch-content" class="editor-content-area">
                                <div class="group-navi">
                                    <nav>
                                        <ul>
                                            <li>
                                                <a href="" id="ch-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="cp-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="cc-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="ca-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                        </ul>
                                    </nav>
                                </div>
                                <div class="group-content">
                                    <div id="ch-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI LA TUA MAGLIETTA</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="cp-container" class="editor-sub-content-area">
                                        <div class="header"><h4>DECORAZIONE MAGLIETTA</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="cc-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI UNA GIACCA</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="ca-container" class="editor-sub-content-area">
                                        <div class="header"><h4>ACCESSORI</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                </div>
                                <div class="palette-header"><h4>SCEGLI UN COLORE</h4></div>
                                <div class="palette-container"></div>
                            </div>
                            <div id="lg-content" class="editor-content-area">
                                <div class="group-navi">
                                    <nav>
                                        <ul>
                                            <li>
                                                <a href="" id="lg-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="sh-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="" id="wa-subnavi" class="editor-group-navi-item">
                                                    <div class="navi-img-container">
                                                        <div class="navi-img"></div>
                                                    </div>
                                                </a>
                                            </li>
                                        </ul>
                                    </nav>
                                </div>
                                <div class="group-content">
                                    <div id="lg-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI I PANTALONI</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="sh-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI LE SCARPE</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                    <div id="wa-container" class="editor-sub-content-area">
                                        <div class="header"><h4>SCEGLI UN ACCESSORIO PER I PANTALONI</h4></div>
                                        <div class="asset-container"></div>
                                    </div>
                                </div>
                                <div class="palette-header"><h4>SCEGLI UN COLORE</h4></div>
                                <div class="palette-container"></div>
                            </div>
                        </div>
                        <div id="avatar-content" class="float">
                            <div class="balloon">
                                 <p>Sono il tuo avatar.<br />Che figo/a!</p>
                            </div>
                            <div id="avatar-image-container" class="clear">
                                <div class="avatar-rotate float"><a id="rotate-cw" href=""></a></div>
                                <div id="avatar-image" class="float">
                                    <img src="http://habbo.it/habbo-imaging/avatarimage?figure=<?php if(empty($_SESSION["IMG"]) || !isset($_SESSION["IMG"])){ echo $config["defaultAvatar"]; } else { echo $_SESSION["IMG"]; } ?>&direction=4&head_direction=4" alt="Avatar" />
                                </div>
                                <div class="avatar-rotate float"><a id="rotate-ccw" href=""></a></div>
                            </div>
                            <div class="avatar-bottom">
                               <p>
Suggerimento: Clicca le frecce per girare il tuo personaggio</p>

                                <div id="save-avatar">
                                    <form id="avatar_form" action="avatar.php" method="POST">
                                        <div style='display:none'><input type='hidden' name='csrfmiddlewaretoken' value='<?php echo $_SESSION["AS"]; ?>' /></div>
                                        <input type="hidden" name="avatar_complete" value="true" id="id_avatar_complete" />
                                    </form>
                                    <h3>Sei soddisfatto?</h3>
                                    <a id="submit_avatar" href="" class="button-link" >
                                        <div class="button-container">
                                            <div class="button-left"></div>
                                            <div class="button-content">Salva e continua</div>
                                            <div class="button-right"></div>
                                        </div>
                                    </a>
                                    <p>Non preoccuparti, potrai cambiare il tuo look in Hotel.</p>
                                </div>
                            </div>
                        </div>
                    </section>
                    <div class="bottom"></div>
                </div>
            </div>
        </section>
    </div>
    <div class="cache">
        <img src="static/images/editor-navi-sprite.png" alt="" />
        <img src="static/images/slab.png" alt="" />
    </div>

                        
                    
<aside id="vip" class="float round">
<div id="vip-top"></div>
    <div class="round-content">
        <img src="static/images/vip.png" alt="vip" />
       <p class="bold">Registrati in <?php echo $shortname ?> ed avrai: </p>
                            <div>
                             <ul class="smaller">
                                <li>- Catalogo con molti Rari.</li>
                                <li>- 15 Bolts.</li>
                                <li>- Nuovi comandi.</li>
        </ul>
        </div>
    </div>
<div id="vip-bottom"></div>
</aside>

                    
                    <div class="clear-float"></div>
                </div>
            </div>
            

            <div id="bg">
                <div class="container">
                    <div class="bg-item left"></div>
                    <div class="bg-item right"></div>
                </div>
            </div>
        </div>
        <footer>
            <div id="footer_container" class="clear">
                
                <div class="float-r">
                    <div class="small-logo">
                        <img src="static/images/logo-small.png" alt="Retro logo small" />
                    </div>
                </div>
                <div class="float-r text">
                <?php require_once 'static/templates/footer.php'; ?>
                </div>
                
            </div>
        </footer>
    </div>
    
    <div class="cache">
        <img src="static/images/bg_left.png" alt="" />
        <img src="static/images/bg_right.png" alt="" />

        <img src="static/images/counter.png" alt="" />
        <img src="static/images/line.png" alt="" />

        <img src="static/images/main-sprite.png" alt="" >
        <img src="static/images/btn-content-sprite.png" alt="" />
        <img src="static/images/connect_sprite.png" alt="" />
    </div>    
</body>
</html>
