function MapCtrl($scope) {

    if(navigator.onLine){
        $scope.online = true;
    } else {
        $scope.offline = true;
    }

    /* text */
    $scope.reloadText = "Reload";
    $scope.reloadingText = "Reload in progress";
    $scope.offlineText = "not online";


    $scope.reloadMap = function() {
        $scope.reload = true;
        $scope.online = false;
        $scope.offline = false;
    }
}

<section class="myPanel panel-padding" ng-controller="MapCtrl">

    <div id="myMap">
        <div class="alert alert-danger" ng-show="offline">{{offlineText}}</div>

        <p ng-show="reload"><i class="fa fa-refresh fa-spin"></i> <span>{{reloadingText}}</span></p>

        <div id="map" ng-show="online"></div>
        <div id="mapControls">
            <ul>
                <li ng-hide="reload">
                    <button type="button" ng-click="reloadMap()" class="btn btn-primary btn-xs">{{reloadText}}</button>
                </li>
            </ul>
        </div>
    </div>
</section>