{namespace JIRA.Templates.project.ChangeType}

/**
* Render the change project type dialog
*
* @param projectId the id of the project we're changing
*/
{template .changeProjectTypeDialog}
<section role="dialog" id="change-project-type-dialog-{$projectId}" class="aui-layer aui-dialog2 aui-dialog2-medium" hidden>
    <header class="aui-dialog2-header">
        <h2 class="aui-dialog2-header-main">{getText('admin.projects.change.project.type.title')}</h2>
    </header>
    <div class="aui-dialog2-content">
    </div>
    <footer class="aui-dialog2-footer">
        <div class="aui-dialog2-footer-actions form-footer">
            <div class="icon throbber"></div>
            <button class="aui-button aui-button-primary dialog-change-button hidden">{getText('common.words.change')}</button>
            <button class="aui-button aui-button-link dialog-close-button">{getText('common.forms.cancel')}</button>
        </div>
    </footer>
</section>
{/template}

/**
* Render the change project type dialog
*
* @param project the id of the project we're changing
* @param helpLink
* @param projectTypes
*/
{template .changeProjectTypeForm}
    <form class="aui change-project-type-form">
        <div class="form-body">
            <div class="aui-group project-type-change-group">
                <div class="aui-item">
                    {call .projectAvatar}
                        {param project: $project /}
                    {/call}
                </div>
                <div class="aui-item project-type-select-group">
                    {call .projectTypeDropdown}
                        {param projectTypeKey: $project.projectTypeKey /}
                        {param projectTypes: $projectTypes /}
                    {/call}
                </div>
            </div>
        </div>
    </form>
    <p>
      {let $helpLinkAnchor}<a href={$helpLink} target="_blank">{/let}
      {getText('admin.projects.change.project.type.help', $helpLinkAnchor, '</a>')|noAutoescape}
    </p>
{/template}


/**
* Render the project types dropdown
*
* @param projectTypeKey project current project type key
* @param projectTypes
*/
{template .projectTypeDropdown}
   <select class="project-type-select select" name="project-type">
       {foreach $projectType in $projectTypes}
           <option class="imagebacked" data-icon="data:image/svg+xml;base64, {$projectType.icon}" value="{$projectType.key}" {if $projectType.key == $projectTypeKey} selected {/if}>
               {$projectType.formattedKey}
           </option>
       {/foreach}
   </select>
{/template}


/**
* Change the content of the target element.
*
* @param icon the project type icon
* @param formattedKey the project type formatted key
*/
{template .updateTargetElement}
   <img src="data:image/svg+xml;base64,{$icon}" class="project-type-icon" />
   <span>{$formattedKey}</span>
{/template}

/**
* Renders a project avatar and title
* @param project the project to render
*/
{template .projectAvatar}
<div class="project-avatar-header">
    <span class="aui-avatar aui-avatar-large aui-avatar-project">
        <span class="aui-avatar-inner">
            <img src="{$project.avatarUrls['48x48']}" alt="{$project.name}">
        </span>
    </span>
    <div class="project-header" title="{$project.name}">{$project.name}</div>
</div>
{/template}

/**
* Renders div for the AUI spinner
*/
{template .dialogSpinner}
    <div class="dialog-spinner"></div>
{/template}

/**
* Renders success message
* @param projectName
* @param projectTypeName
*/
{template .successMsg}
    {getText('admin.projects.change.project.type.success', $projectName, $projectTypeName)}
{/template}