Loading Indicators Demo

this fiddle allows you to play with directive

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.19/angular-sanitize.js"></script>
<script src="http://adaptv.github.io/adapt-strap/dist/adapt-strap.js"></script>
<script src="http://adaptv.github.io/adapt-strap/dist/adapt-strap.tpl.js"></script>
<link rel="stylesheet" href="http://adaptv.github.io/adapt-strap/dist/adapt-strap.css">
<div ng-app="adaptv.adaptStrapDocs" ng-controller="loadingIndicatorCtrl">
    <div class="panel panel-default">
       <div class="panel-heading">
           <h3 class="panel-title">
               This is the demo ffor ad-loading-overlay
               <button class="btn btn-default"
                       ng-click="showLoadingIcon = true">Show</button>
               <button class="btn btn-default"
                       ng-click="showLoadingIcon = false">Hide</button>
           </h3>
       </div>
       <div class="panel-body" style="position:relative;">
           <h1>Some Content <br/> Imagine this is the body of your page</h1>

           <!-- ========== Usage (overlay) ========== -->
           <ad-loading-overlay z-index="2000"
                               position="absolute"
                               loading-icon-size="2em"
                               loading="showLoadingIcon"
                               loading-icon-class="glyphicon glyphicon-refresh ad-spin"
                               container-classes="xyz">
           </ad-loading-overlay>

       </div>
   </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">
                Simple icon tag
                <button class="btn btn-default"
                        ng-click="showSimpleIcon = true">Show</button>
                <button class="btn btn-default"
                        ng-click="showSimpleIcon = false">Hide</button>
            </h3>
        </div>
        <div...

JavaScript

// ========== initialize documentation app module ========== //
angular.module('adaptv.adaptStrapDocs', [
  'ngSanitize',
  'adaptv.adaptStrap'
])

// ========== controllers ========== //
.controller('loadingIndicatorCtrl', ['$scope', function ($scope) {
  $scope.showLoadingIcon = false;
  $scope.showSimpleIcon = true;
}]);