gr-serviceuser/gr-serviceuser-detail_html.js

/**
 * @license
 * Copyright (C) 2019 The Android Open Source Project
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

export const htmlTemplate = Polymer.html`
    <style include="shared-styles"></style>
    <style include="gr-subpage-styles"></style>
    <style include="gr-form-styles"></style>
    <style>
      div.serviceuser-detail {
        margin: 2em auto;
        max-width: 50em;
      }

      h1#Title {
        margin-bottom: 1em;
      }

      p#ownerChangeWarning {
        margin-top: 1em;
        margin-bottom: 1em;
      }

      span#gr_serviceuser_activity {
        border-radius: 1em;
        width: 10em;
        padding: 0.3em;
        font-weight: bold;
        text-align: center;
      }

      span.value {
        width: 50%;
      }

      input.wide {
        width: 100%;
      }

      span.Active {
        background-color: #9fcc6b;
      }

      span.Inactive {
        background-color: #f7a1ad;
      }
    </style>
    <div class="serviceuser-detail">
      <main class="gr-form-styles read-only">
        <div id="loading"
             class$="[[_computeLoadingClass(_loading)]]">
          Loading...
        </div>
        <div id="loadedContent"
             class$="[[_computeLoadingClass(_loading)]]">
          <h1 id="Title" class="heading-1">Service User "[[_serviceUser.name]]"</h1>
          <div id="form">
            <fieldset>
              <fieldset>
                <h2 id="accountState" class="heading-2">Account State</h2>
                <section>
                  <span class="title">Current State</span>
                  <span id="gr_serviceuser_activity"
                        class$="value [[_active(_serviceUser)]]">
                    [[_active(_serviceUser)]]
                  </span>
                </section>
                <gr-button id="statusToggleButton" on-click="_toggleStatus" disabled="[[_loading]]">
                  [[_statusButtonText]]</gr-button>
              </fieldset>
              <fieldset>
                <h2 id="userDataHeader" class="heading-2">User Data</h2>
                <section>
                  <span class="title">Username</span>
                  <span class="value">[[_serviceUser.username]]</span>
                </section>
                <section>
                  <span class="title">Full Name</span>
                  <span class="value" hidden$="[[!_allowFullName]]">
                    <iron-input bind-value="{{_newFullName}}">
                      <input id="serviceUserFullNameInput" class="wide" value="{{_newFullName::input}}"
                             type="text" disabled$="[[_changingPrefs]]"
                             placeholder$="[[_serviceUser.name]]"
                             on-keyup="_computePrefsChanged">
                    </iron-input>
                  </span>
                </section>
                <section>
                  <span class="title">Email Address</span>
                  <span class="value" hidden$="[[!_allowEmail]]">
                    <iron-input bind-value="{{_newEmail}}">
                      <input id="serviceUserEmailInput" class="wide" value="{{_newEmail::input}}"
                            type="text" disabled$="[[_changingPrefs]]"
                            placeholder="[[_serviceUser.email]]" on-keyup="_computePrefsChanged"
                            hidden$="[[!_allowEmail]]">
                    </iron-input>
                  </span>
                  <span class="value" hidden$="[[_allowEmail]]">[[_serviceUser.email]]</span>
                </section>
                <section>
                  <span class="title">Owner Group</span>
                  <span class="value" hidden$="[[!_allowOwner]]">
                    <gr-autocomplete id="serviceUserOwnerInput" text="{{_getOwnerGroup(_serviceUser)}}"
                      value="{{_newOwner}}" query="[[_query]]" disabled="[[_changingPrefs]]"
                      on-commit="_computePrefsChanged" on-keyup="_computePrefsChanged">
                        [[_getOwnerGroup(_serviceUser)]]
                    </gr-autocomplete>
                  </span>
                  <span class="value" hidden$="[[_allowOwner]]">[[_getOwnerGroup(_serviceUser)]]</span>
                </section>
                <p id="ownerChangeWarning" class="style-scope gr-settings-view" hidden$="[[!_newOwner]]">
                  [[_ownerChangeWarning]]
                </p>
                <gr-button id="savePrefs" on-click="_handleSavePreferences" disabled="[[!_prefsChanged]]">
                  Save changes
                </gr-button>
              </fieldset>
              <fieldset>
                <h2 id="creationHeader" class="heading-2">Creation</h2>
                <section>
                  <span class="title">Created By</span>
                  <span class="value">[[_getCreator(_serviceUser)]]</span>
                </section>
                <section>
                  <span class="title">Created At</span>
                  <span class="value">[[_serviceUser.created_at]]</span>
                </section>
              </fieldset>
              <fieldset>
                <fieldset>
                  <h2 id="credentialsHeader" class="heading-2">Credentials</h2>
                </fieldset>
                <fieldset hidden$="[[!_allowHttpPassword]]">
                  <h3 id="HTTPCredentials">HTTP Credentials</h3>
                  <fieldset>
                    <gr-serviceuser-http-password id="httpPass">
                      </gr-http-password>
                  </fieldset>
                </fieldset>
                <fieldset>
                  <h3 id="SSHKeys">SSH keys</h3>
                  <gr-serviceuser-ssh-panel id="sshEditor"></gr-serviceuser-ssh-panel>
                </fieldset>
              </fieldset>
            </fieldset>
          </div>
        </div>
      </main>
    </div>
`;