ep_profile_modal/templates/profileModal.html

profile modal for Etherpad

<script id="ep_profile_modal_script" type="text/html">

    <div class='ep_profile_modal' id='ep_profile_modal'>
        <div class='ep_profile_modal_container'>

            <div class="ep_profile_modal_pm_header">
                <div class="ep_profile_modal_pm_header_title">Edit profile</div>
                <div id='ep_profile_modal_close'></div>

            </div>

            <div class="ep_profile_modal_section_image">
    
                <label class="lable_ep_profile_modal_section_image_big" for="profile_file">
                    <div class='ep_profile_modal_section_image_big' style="background: url(/static/getUserProfileImage/${clientVars.userId}/${clientVars.padId}?t=${clientVars.serverTimestamp}) no-repeat 50% 50%;background-size:72px"  ></div>
    
                </label>  
                <label class="lable_ep_profile_modal_section_text" for="profile_file">
                    Select new photo
                </label>  
                <form  method="post" action="" enctype="multipart/form-data" >
                    <input accept="image/*" type="file" id="profile_file" class="ep_profile_modal_file" name="profile_file" /> 
                </form>
                
    
            </div>
        <form  method="post" action="" enctype="multipart/form-data"  id="ep_profile_modal_one">
    
            <div class="ep_profile_modal_section_info_modal">
    
                <div class="ep_profile_modal-form-lable-section">
                    <p class="ep_profile_modal-form-lable" >Name</p>
                    <input id="ep_profile_modal-username"  name="ep_profile_modalForm_name" type="text" value="${(ep_profile_modal.userName) ?  ep_profile_modal.userName : ''}" id="ep_profile_modal-username" placeholder="" class="ep_profile_modal-content">
    
                </div>
                <div class="ep_profile_modal-form-lable-section">
                    <p class="ep_profile_modal-form-lable">Bio</p>
                    <input id="ep_profile_modal-about" type="text"  name="ep_profile_modalForm_about_yourself" value="${(ep_profile_modal.about) ?  ep_profile_modal.about : ''}" id="ep_profile_modal-about" placeholder="" class="ep_profile_modal-content">
    
                </div>
                <div class="ep_profile_modal-form-lable-section">
                    <p class="ep_profile_modal-form-lable" >Homepage</p>
                    <input id="ep_profile_modal-homepage" type="text" name="ep_profile_modalForm_homepage"  value="${(ep_profile_modal.homepage !=='#' && ep_profile_modal.homepage !==undefined) ?  ep_profile_modal.homepage : ''}" id="ep_profile_modal-homepage" placeholder="" class="ep_profile_modal-content">
    
                </div>
                <div class="ep_profile_modal-form-lable-section">
                    <p class="ep_profile_modal-form-lable" >Email</p>
                    <input  id="ep_profile_modal-email"  name="ep_profile_modalForm_email" type="text"  value="${(ep_profile_modal.user_email) ?  ep_profile_modal.user_email : ''}" id="ep_profile_modal-email" placeholder="" class="ep_profile_modal-content">
    
                </div>
                <!-- <div class="ep_profile_modal-form-lable-section-left">
                    <a href="#" id="ep_profile_modal_verification" data-verification-status="${ep_profile_modal.verified}" class="ep_profile_modal_verification"> ${(ep_profile_modal.verified) ?  `Verified` : `Send verification email`}</a>
                </div> -->
    
                <!-- <div class="ep_profile_modal-form-lable-section-left">
                    <input type="checkbox" id="ep_profile_modal_push_notification" name="ep_profile_formModal_push_notification" checked="${(ep_profile_modal.push_notification) ?  ep_profile_modal.push_notification : true }">
                    <label for="ep_profile_modal_push_notification">Push notification</label><br>            
                </div> -->
    
    
            </div>
        </form>
            <div id="online_ep_profile_modal_status">
                <input type="hidden" id="ep_profile_hidden_email" value="${ep_profile_modal.user_email}" />
                <input  value="Sign Out" id="ep_profile_modal_signout" type="button" class="ep_profile_modal_signout" /> 
                <input  value="Done"  id="ep_profile_modal_save" type="button" class="ep_profile_modal_save"> 
        
            </div>
            <div class="ep_profile_modal-form-lable-section" id="offline_ep_profile_modal_status">
    
                <input  value="Login"  id="ep_profile_modal_login" type="button" class="ep_profile_modal_save"> 
        
            </div>
    
    
    
        </div>
       
    </div>
</script>