quay/static/partials/manage-application.html

<div class="resource-view" resource="appResource" error-message="'Application not found'">
</div>

<div ng-show="application">
  <div class="container manage-application">
    <!-- Header -->
    <div class="row">
      <div class="col-md-12">
        <div class="auth-header">          
          <h2><span class="avatar" size="48" email="application.avatar_email" name="application.name"></span>
              {{ application.name || '(Untitled)' }}</h2>
          <h4>
            <span class="avatar" size="24" hash="organization.avatar" style="vertical-align: middle; margin-right: 4px;"></span>
            <span style="vertical-align: middle"><a href="/organization/{{ organization.name }}/admin">{{ organization.name }}</a></span>
          </h4>
        </div>
      </div>
    </div>

    <div class="row" style="margin-top: 10px" ng-if="!application.redirect_uri">
      <div class="alert alert-warning">
        Warning: There is no OAuth Redirect setup for this application. Please enter it in the <strong>Settings</strong> tab.
      </div>
    </div>
    
    <!-- Content -->
    <div class="row" style="margin-top: 10px">
      <!-- Side tabs -->
      <div class="col-md-2">
        <ul class="nav nav-pills nav-stacked">
          <li class="active"><a href="javascript:void(0)" data-toggle="tab" data-target="#settings">Settings</a></li>         
          <li><a href="javascript:void(0)" data-toggle="tab" data-target="#oauth">OAuth Information</a></li>
          <li><a href="javascript:void(0)" data-toggle="tab" data-target="#gen-token">Generate Token</a></li>
          <li><a href="javascript:void(0)" data-toggle="tab" data-target="#delete">Delete Application</a></li>
        </ul>
      </div>

      <!-- Content -->
      <div class="col-md-10">
        <div class="tab-content">
          <!-- Settings tab -->
          <div id="settings" class="tab-pane active">
            <form method="put" name="applicationForm" id="applicationForm" ng-submit="updateApplication()">
              <div class="form-group nested">
                <label for="fieldAppName">Application Name</label>
                <input type="text" class="form-control" id="fieldAppName" placeholder="Application Name" required ng-model="application.name">
                <div class="description">The name of the application that is displayed to users</div>
              </div>

              <div class="form-group nested">
                <label for="fieldAppURI">Homepage URL</label>
                <input type="url" class="form-control" id="fieldAppURI" placeholder="Homepage URL" required ng-model="application.application_uri">
                <div class="description">The URL to which the application will link in the authorization view</div>
              </div>

              <div class="form-group nested">
                <label for="fieldAppDescription">Description (optional)</label>
                <input type="text" class="form-control" id="fieldAppURI" placeholder="Description" ng-model="application.description">
                <div class="description">The user friendly description of the application</div>
              </div>

              <div class="form-group nested">
                <label for="fieldAppAvatar">Avatar E-mail (optional)</label>
                <input type="email" class="form-control" id="fieldAppAvatar" placeholder="Avatar E-mail" ng-model="application.avatar_email">
                <div class="description">An e-mail address representing the  <a href="http://docs.quay.io/glossary/avatar" target="_blank">Avatar</a> for the application. See above for the icon.</div>
              </div>

              <div class="form-group nested" style="margin-top: 10px; padding-top: 10px; border-top: 1px solid #eee;">
                <label for="fieldAppRedirect">Redirect/Callback URL Prefix</label>
                <input type="url" class="form-control" id="fieldAppRedirect" placeholder="OAuth Redirect URL" ng-model="application.redirect_uri" required>
                <div class="description">Allowed prefix for the application's OAuth redirection/callback URLs</div>
              </div>

              <div class="button-bar">
                <button class="btn btn-success btn-large" type="submit" ng-disabled="applicationForm.$invalid || updating">
                  Update Application
                </button>
                <span class="quay-spinner" ng-show="updating"></span>
              </div>
            </form>
          </div>

          <!-- Delete tab -->
          <div id="delete" class="tab-pane">
            <div class="panel panel-default">
              <div class="panel-body">
                <div style="text-align: center">
                  <div class="alert alert-danger">Deleting an application <b>cannot be undone</b>. Any existing users of your application will <strong>break!</strong>. Here be dragons!</div>
                  <button class="btn btn-danger" ng-click="askDelete()">Delete Application</button>
                </div>
              </div>
            </div>
          </div>

          <!-- Generate Token tab -->
          <div id="gen-token" class="tab-pane">
            <div style="margin-bottom: 20px">
                Click the button below to generate a new <a href="http://tools.ietf.org/html/rfc6749#section-1.4" target="_new">OAuth 2 Access Token</a>.
            </div>

            <div style="margin-bottom: 20px">
              <strong>Note:</strong> The generated token will act on behalf of user <img src="//www.gravatar.com/avatar/{{ user.gravatar }}?s=16&d=identicon" style="margin-left: 6px; margin-right: 4px;">
              {{ user.username }}
            </div>

            <table>
              <tr ng-repeat="(scopeName, scopeInfo) in OAuthService.SCOPES">
                <td><label onclick="event.stopPropagation()"><input type="checkbox" value="scopeInfo[0]" ng-model="genScopes[scopeName]">{{ scopeInfo[3] }}</label></td>
              </tr>
            </table>

            <a class="btn btn-success"
               href="{{ Config.getUrl('/oauth/authorize?response_type=token&client_id=' + application.client_id + '&scope=' +  getScopes(genScopes).join(',') + '&redirect_uri=display') }}"
               ng-disabled="!getScopes(genScopes).length" target="_blank">
               Generate Access Token
            </a>
          </div>

          <!-- OAuth tab -->
          <div id="oauth" class="tab-pane">
            <table style="margin-top: 20px;">
              <thead>
                <th style="width: 150px"></th>
                <th style="width: 250px"></th>
                <th></th>
              </thead>
              <tr>
                <td>Client ID:</td>
                <td style="width: 250px">
                  <div class="copy-box" hovering-message="true" value="application.client_id"></div>
                </td>
              </tr>
              <tr>
                <td>Client Secret: <i class="fa fa-lock fa-lg" data-title="Keep this secret!" bs-tooltip style="margin-left: 10px"></i></td>
                <td>
                  {{ application.client_secret }}
                </td>
                <td style="padding-left: 10px">
                  <button class="btn btn-primary" ng-click="askResetClientSecret()">Reset Client Secret</button>
                </td>
              </tr>
            </table>
          </div>
        </div>

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

<!-- Modal message dialog -->
<div class="modal fade" id="resetSecretModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Reset Client Secret?</h4>
      </div>
      <div class="modal-body">
        <div class="alert alert-info">
          Note that resetting the Client Secret for this application will <strong>not</strong> invalidate any user tokens.
        </div>
        <div>Are you sure you want to reset your Client Secret? Any existing users of this Secret <strong>will break!</strong></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" ng-click="resetClientSecret()">Yes, I'm sure</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- Modal message dialog -->
<div class="modal fade" id="deleteAppModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Delete Application?</h4>
      </div>
      <div class="modal-body">
        Are you <b>absolutely, positively</b> sure you would like to delete this application? This <b>cannot be undone</b>.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" ng-click="deleteApplication()">Delete Application</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->