ambari-web/app/templates/common/modal_popups/widget_browser_popup.hbs

{{!
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you 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.
}}

<div id="widget-browser-popup">
  {{#if view.isLoaded}}
    <div class="widget-browser-content">
      {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}}
      <!--Create new widget button-->
        <div class="btn-group pull-right" id="create-widget-button">
          <button type="button" class="btn btn-primary" {{action "createWidget" target="view"}} >
            <i class="icon-plus"></i> &nbsp; {{t dashboard.widgets.create}}
          </button>
        </div>
      {{/isAuthorized}}

      <!--Filters bar: service name filter, status filter here-->
      <ul id="services-filter-bar" class="nav nav-tabs">
        {{#each service in view.services}}
          <li {{bindAttr class="service.isActive:active"}}>
            <a {{action "filterByService" service.value target="view"}}>{{service.label}}</a></li>
        {{/each}}
      </ul>

      <!--Widgets table two column-->
      <div id="widgets-info">
        {{#if view.isWidgetEmptyList}}
           <div class="no-widgets-text">{{t dashboard.widgets.browser.noWidgets}}</div>
        {{else}}
          <div class="widgets-info-container row-fluid">
            {{#each widget in view.filteredContent}}
              <div class="span6 row-fluid widget-info-section">
                <div class="icon span4">
                  <a class="widget-icon-image" target="_blank"><img {{bindAttr src="widget.iconPath"}}></a>
                </div>
                <div class="label-description span8">
                  <p class="label-text">{{widget.widgetName}}</p>
                  <p class="is-shared-icon pull-right">
                    {{#if widget.isShared}}
                        <i class="icon-group" rel="shared-icon-tooltip"
                          {{translateAttr data-original-title="dashboard.widgets.browser.shareIcon.tooltip"}}></i>
                    {{/if}}
                  </p>
                  <p class="description-text">{{widget.description}}</p>
                </div>

                <div class="widget-section-actions btn-group pull-right">
                  {{#if widget.added}}
                    <button type="button" class="btn added-btn" {{action "hideWidget" widget target="controller"}} >
                        <i class="icon-ok"></i> &nbsp; {{t dashboard.widgets.browser.action.added}}
                    </button>
                  {{else}}
                      <button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                        {{t common.more}}<span class="caret"></span>
                      </button>
                      <ul class="dropdown-menu">
                        <li>
                          <a href="#" {{action "deleteWidget" widget target="controller"}}>
                            {{t dashboard.widgets.browser.action.delete}}
                          </a>
                        </li>
                        <li>
                          {{#unless widget.isShared}}
                            <a href="#" {{action "shareWidget" widget target="controller"}}>
                              {{t dashboard.widgets.browser.action.share}}
                            </a>
                          {{/unless}}
                        </li>
                      </ul>
                    <button type="button" class="btn btn-default" {{action "addWidget" widget target="controller"}} >
                      {{t dashboard.widgets.browser.action.add}}
                    </button>
                  {{/if}}
                </div>
              </div>
            {{/each}}
          </div>
        {{/if}}
      </div>
    </div>

    <div class="table-overlay">
       {{view App.SpinnerView}}
    </div>
  {{else}}
      {{view App.SpinnerView}}
  {{/if}}
</div>