newscoop/JS-Scoopwriter

<div ng-controller="SfPanesCtrl">
    <div class="tablist left-tablist">
        <ul class="navigation-tabs">
            <li ng-repeat="pane in panes|filter:{position:'left', selected:true}" ng-class="{'active':pane.visible}" ng-click="flipVisible(pane)" tabname="{{pane.id}}">
                <a draggable="true" control="tab" rel="tooltip" data-placement="{{pane.position}}" data-original-title="{{pane.id}}">
                    <i class="big-icon-{{pane.icon}}"></i><span class="badge badge-inverse hide notifications"></span><span class="badge badge-info hide config-notif">!</span>
                </a>
            </li>
        </ul>
    </div>
    <div class="tablist right-tablist">
        <ul class="navigation-tabs">
            <li ng-repeat="pane in panes|filter:{position:'right', selected:true}" ng-class="{'active':pane.visible}" ng-click="flipVisible(pane)" tabname="{{pane.id}}">
                <a draggable="true" control="tab" rel="tooltip" data-placement="{{pane.position}}" data-original-title="{{pane.id}}">
                    <i class="big-icon-{{pane.icon}}"></i><span class="badge badge-inverse hide notifications"></span><span class="badge badge-info hide config-notif">!</span>
                </a>
            </li>
        </ul>
    </div>
    <div class="tabpane left-tabpane"  ng-class="{'open-tabpane':tabpaneIsOpen('left')}">
        <section
           ng-repeat="pane in panes|filter:{position:'left', selected:true}"
           ng-show="pane.visible"
           ng-include="pane.active ? pane.template : null"
           class="pane {{pane.id}}"
           ></section>
    </div>
    <div class="tabpane right-tabpane" ng-class="{'open-tabpane':tabpaneIsOpen('right')}">
        <section
           ng-repeat="pane in panes|filter:{position:'right', selected:true}"
           ng-show="pane.visible"
           ng-include="pane.active ? pane.template : null"
           class="pane {{pane.id}}"
           ></section>
    </div>
</div>