maestrano/mno-enterprise-angular

<div id="dashboard-apps-list">
  <h2 class="section-title">
    {{'mno_enterprise.templates.dashboard.apps_list.title' | translate}}
  </h2>

  <!-- Loader -->
  <mno-loader ng-show="isLoading" class="top-buffer-4"></mno-loader>

  <div ng-show="!isLoading" class="top-buffer-4">
    <div class='row'>
      <div ng-repeat="app in apps" class="col-sm-6 col-md-3">
        <div class='app-dashboard'>

          <!-- Backface -->
          <div ng-switch="displayOptions[app.id]">

            <div ng-switch-when="true">
              <a ng-click="displayOptions[app.id] = !displayOptions[app.id]" ng-show="helper.displayCogwheel()" class="options" href=""><i class="fa fa-times"></i></a>

              <!-- Data Sync Button -->
              <div ng-show="helper.isDataSyncShown(app)">
                <br>
                <a class="btn btn-info" ng-href="{{helper.dataSyncPath(app)}}" uib-tooltip="{{ 'mno_enterprise.templates.dashboard.apps_list.manual_data_sync_tooltip' | translate:{ appname: app.app_name } }}">{{ 'mno_enterprise.templates.dashboard.apps_list.manual_data_sync' | translate }}</a>
              </div>

              <!-- Data Disconnect Button -->
              <div ng-show="helper.isDataDisconnectShown(app)">
                <br>
                <a class="btn btn-danger" ng-click="helper.dataDisconnectClick(app)" href="" uib-tooltip="{{ 'mno_enterprise.templates.dashboard.apps_list.disconnect_link_tooltip' | translate:{ appname: app.app_name } }}">
                  {{ 'mno_enterprise.templates.dashboard.apps_list.disconnect_link' | translate }}
                </a>
              </div>
              <br>
              <!-- App Deletion Button -->
              <div>
                <br>
                <button ng-click="openAppDeletionModal(app)" ng-show="helper.canDeleteApp()" class="btn btn-danger">{{'mno_enterprise.templates.dashboard.apps_list.delete' | translate}}</button>
              </div>
            </div>

            <!-- Frontface -->
            <div ng-switch-default>
              <a ng-click="displayOptions[app.id] = !displayOptions[app.id]" ng-show="helper.displayCogwheel()" class="options" href=""><i class="fa fa-cog"></i></a>
              <br>
              <a ng-href="{{ helper.appActionUrl(app) }}" target="_blank">
                <img class="app-logo" ng-src="{{app.logo}}">
              </a>
              <div class='title'>{{::app.name}}</div>

              <!-- Connected company name -->
              <div ng-show="helper.companyName(app)">
                <div class='app-line' style="border:0px;" uib-tooltip="{{helper.companyName(app)}}">
                  {{ 'mno_enterprise.templates.dashboard.apps_list.linked_to' | translate }}: {{ helper.companyName(app) | truncate:25 }}
                </div>
              </div>

              <!-- Connector Version -->
              <div ng-show="helper.connectorVersion(app)">
                <div class='app-line' style="border:0px;">MYOB Version: {{helper.connectorVersion(app)}}</div>
              </div>

              <!-- OAuth Connect Button -->
              <div ng-show="helper.isOauthConnectBtnShown(app) && helper.canConnectApp()">
                <a class="btn btn-warning" href="" ng-click="helper.oAuthConnectPath(app)">
                  {{ 'mno_enterprise.templates.dashboard.apps_list.connect' | translate }}
                </a>
              </div>

              <!-- Launch App Button -->
              <a ng-href="{{helper.appActionUrl(app)}}" target="_blank" ng-hide="helper.isLaunchHidden(app)" class="btn btn-warning">
                {{'mno_enterprise.templates.dashboard.apps_list.launch_app' | translate}}
              </a>

              <span ng-show="app.status == 'terminating' || app.status == 'terminated'">
                ({{ 'mno_enterprise.templates.dashboard.apps_list.deleted' | translate }})
              </span>
              <br>
              <a ng-show="app.tutorial" ng-href="{{app.tutorial}}" class='tutorial' target="_blank">
                {{ 'mno_enterprise.templates.dashboard.apps_list.tutorial' | translate }}
              </a>
            </div>
          </div>
        </div>
      </div>
      <div ng-if="isMarketplaceEnabled" class='col-sm-6 col-md-3'>
        <div class='app-dashboard add-app'>
          <a ui-sref="home.marketplace">
            <div class="fa fa-plus-circle"></div>
          </a>
        </div>
      </div>
    </div>
  </div>
</div>