<link href="css/jquery-ui-timepicker.css" type="text/css" rel="stylesheet" /> 
<script src="js/jquery-ui-timepicker.js" type="text/javascript"></script>
<script src="js/image.js" type="text/javascript"></script>

<script type="text/javascript">
    var region='<TMPL_VAR loc.region>';
</script>

<h2><TMPL_VAR .loc.title></h2>

<TMPL_IF .allow.create_project>
<div style="clear:both" class="newproject">
    <button onclick="add_project('<TMPL_VAR name>')"><TMPL_VAR .loc.button_add_project></button><br/>

    <div id="edit_new" class="panel project editor" style="clear:both;display:none">
        <form method="post">
            <input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
            <input type="hidden" name="studio_id"  value="<TMPL_VAR .studio_id>">
            <table>
                <tr><td class="label"><TMPL_VAR .loc.label_name></td>         <td><input name="name">     </td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_title></td>         <td><input name="title">    </td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_subtitle></td>   <td><input name="subtitle"> </td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_start_date></td> <td><input name="start_date" class="date">    </td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_end_date></td>   <td><input name="end_date" class="date">      </td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_email></td>      <td><input name="email">     </td></tr>
                <tr>
                    <td></td>
                    <td class="buttons">
                        <button onclick="cancel_edit_project('new');return false;"><TMPL_VAR .loc.button_cancel></button>
                        <button type=submit name="action" value="save"><TMPL_VAR .loc.button_create></button>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>
</TMPL_IF>

<div style="clear:both" class="flex">
<TMPL_LOOP projects>

<div class="panel project">
    <!-- buttons -->
    <div class="panel-header">
        <div class="title"><TMPL_VAR title></div>
        <TMPL_IF .allow.update_project>
            <button onclick="edit_project('<TMPL_VAR project_id>')"
            ><TMPL_VAR .loc.button_edit></button>
        </TMPL_IF>
    </div>

    <!-- view project -->
    <div id="view_<TMPL_VAR project_id>" class="panel-body">
        <table>
            <tr><td class="label"><TMPL_VAR .loc.label_image></td>      <td colspan="2"><img src="show-image.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=thumbs"> &nbsp;</td></tr>
            <tr><td class="label"><TMPL_VAR .loc.label_name></td>       <td colspan="2"><TMPL_VAR name> &nbsp;</td></tr>
            <tr><td class="label"><TMPL_VAR .loc.label_subtitle></td>   <td colspan="2"><TMPL_VAR subtitle> &nbsp;</td></tr>
            <tr><td class="label"><TMPL_VAR .loc.label_start_date></td> <td colspan="2"><TMPL_VAR start_date> &nbsp;</td></tr>
            <tr><td class="label"><TMPL_VAR .loc.label_end_date></td>   <td colspan="2"><TMPL_VAR end_date> &nbsp;</td></tr>
            <tr><td class="label"><TMPL_VAR .loc.label_email></td>      <td colspan="2"><TMPL_VAR email> &nbsp;</td></tr>
            <tr><td class="label"><TMPL_VAR .loc.label_studios></td>
                <td>
                <TMPL_LOOP assigned_studios>
                    <TMPL_VAR name><br/>
                </TMPL_LOOP><br/>
                </td><td>
                <TMPL_IF .allow.update_project>
                    <button onclick="edit_project_assignments('<TMPL_VAR project_id>')"
                        style="float:left"
                    ><TMPL_VAR .loc.button_change></button>
                </TMPL_IF>
                
            </td></tr>
        </table>
        <div>
        </div>
    </div>

    <TMPL_IF .allow.update_project>
    <!-- update project -->
    <div id="edit_<TMPL_VAR project_id>" class="panel-body"  style="display:none">
        <form method="post" action="projects.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>"
            id="project_<TMPL_VAR project_id>"
        >
            <input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
            <input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
            <input type="hidden" name="pid" value="<TMPL_VAR pid>">
            <table>
                <tr><td class="label"><TMPL_VAR .loc.label_title></td>     <td><input name="title" value="<TMPL_VAR title>"></td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_name></td>      <td><input name="name" value="<TMPL_VAR name>"></td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_subtitle></td>  <td><input name="subtitle" value="<TMPL_VAR subtitle>"></td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_start_date></td><td><input class="date" name="start_date" value="<TMPL_VAR start_date>"></td></tr>
                <tr><td class="label"><TMPL_VAR .loc.label_end_date></td>  <td><input class="date" name="end_date" value="<TMPL_VAR end_date>"></td></tr>        
                <tr><td class="label"><TMPL_VAR .loc.label_email></td>     <td><input name="email" value="<TMPL_VAR email>"></td></tr>        
                <tr><td class="label">
                    <TMPL_VAR .loc.label_image></td>      
                    <td>
                        <button 
                            class="selectImage"
                            onclick="selectImage('<TMPL_VAR name escape=HTML>', '<TMPL_VAR image ESCAPE=url>', 'projects', '<TMPL_VAR .project_id>','<TMPL_VAR .studio_id>', null, null, '<TMPL_VAR pid>'); return false;"
                        >
                            <img id="imagePreview" src="show-image.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=icon">
                        </button>
                        <input id="image_<TMPL_VAR pid>" name="image" value="<TMPL_VAR image>" class="image" placeholder="<TMPL_VAR .loc.template_image>">
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td class="buttons">
                        <button type=submit name="action" value="save"><TMPL_VAR .loc.button_save></button>
                    </td>
                    <TMPL_IF .allow.delete_project>
                    <td>
                        <div class="right">
                            <button type=submit name="action" value="delete"
                            onclick="commitForm('project_<TMPL_VAR project_id>','delete','<TMPL_VAR .loc.button_delete>');return false;"
                            ><TMPL_VAR .loc.button_delete></button>
                        </div>
                    </td>
                    </TMPL_IF>
                </tr>
            </table>
        </form>
    </div>
    </TMPL_IF>

    <TMPL_IF .allow.assign_project_studio>
    <div id="assign_<TMPL_VAR project_id>" class="editor"  style="display:none">

        <!-- assign studios -->        
        <div class="edit_series_members_<TMPL_VAR .series_id>" >
            <form method="post" action="projects.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>">
                <input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
                <input type="hidden" name="studio_id"  value="<TMPL_VAR .studio_id>">
                <input type="hidden" name="pid"        value="<TMPL_VAR pid>">
                <input type="hidden" name="action"     value="assign_studio">
                <select name="sid">
                    <option value=""><TMPL_VAR .loc.label_select_studio></option>
                    <TMPL_LOOP unassigned_studios>
                        <option value="<TMPL_VAR id>"><TMPL_VAR name></option>
                    </TMPL_LOOP>
                </select>
                <button type="submit"><TMPL_VAR .loc.button_assign_studio></button>
            </form>
        </div>

        <!-- unassign studios -->        
        <table>
        <TMPL_LOOP assigned_studios>
            <tr>
                <td><TMPL_VAR name></td> 
                <td>
                    <div class="edit_series_members_<TMPL_VAR .series_id>" >
                        <form method="post"
                            action="projects.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>" 
                        >
                            <input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
                            <input type="hidden" name="studio_id"  value="<TMPL_VAR .studio_id>">
                            <input type="hidden" name="pid"        value="<TMPL_VAR pid>">
                            <input type="hidden" name="sid"        value="<TMPL_VAR sid>">
                            <input type="hidden" name="action"     value="unassign_studio">
                            <button type="submit"
                                onclick="commitForm($(this).parent(),'unassign_studio','<TMPL_VAR .loc.button_unassign_studio>');return false;"
                            ><TMPL_VAR .loc.button_unassign_studio></button>
                        </form>
                    </div>
                </td>
            </tr>
        </TMPL_LOOP>
        </table>

    </div>
    </TMPL_IF>

</div>
</TMPL_LOOP>
</div>

</main>	    
</body>
</html>
