wifi-pineapple-panel/src/pineapple/modules/ModuleManager/module.html

<div ng-controller="ModuleManagerController">
    <div class="row" ng-hide="linking">
        <div class="col-sm-12">

            <p class="alert well-sm alert-success" ng-show="installedModule">Successfully Installed Module</p>
            <p class="alert well-sm alert-success" ng-show="removedModule">Successfully Removed Module</p>

            <div ng-hide="gotAvailableModules">
                <button class="btn btn-default" ng-click="getAvailableModules()" ng-disabled="loading">Get Modules </button>
                <img src="img/throbber.gif" ng-show="loading">
                <br/><br/>
            </div>
            <div class="alert well-sm alert-danger" ng-show="connectionError">
                {{ connectionError }}
            </div>

            <div class="panel panel-default" ng-show="gotAvailableModules">
                <div class="panel-heading">
                    <h3 class="panel-title">Available Modules <button class="btn btn-default btn-xs btn-fixed-length pull-right" ng-click="getAvailableModules()">Refresh</button></h3>
                </div>
                <div class="table-responsive table-dropdown">
                    <table class="table module-table table-hover">
                        <thead>
                            <tr>
                                <th>Module</th>
                                <th>Version</th>
                                <th>Description</th>
                                <th>Author</th>
                                <th>Size</th>
                                <th>Type</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="(moduleName, module) in availableModules" ng-if="module.installed === undefined">
                                <td>
                                    {{ module['title'] }}
                                </td>
                                <td>
                                    {{ module['version'] }}
                                </td>
                                <td>
                                    {{ module['description'] }}
                                </td>
                                <td>
                                    {{ module['author'] }}
                                </td>
                                <td>
                                    {{ (module['size']/1024).toFixed(2) }}K
                                </td>
                                <td>
                                    {{ module['type'] }}
                                </td>
                                <td>
                                    <update-button ng-hide="module.installable" content="{name: moduleName, module: module, updating: true}"></update-button>
                                    <install-button ng-show="module.installable" content="{name: moduleName, module: module}"></install-button>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-12 text-center" ng-if="linking">
            <img src="img/throbber.gif">
        </div>
    </div>

    <div class="row" ng-hide="linking">
        <div class="col-sm-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">Installed Modules</h3>
                </div>
                <div class="table-responsive table-dropdown">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Module</th>
                                <th>Version</th>
                                <th>Description</th>
                                <th>Size</th>
                                <th>Author</th>
                                <th>Type</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="(moduleName, module) in installedModules" ng-hide="(module['type'] == 'System')">
                                <td>
                                    {{ module['title'] }}
                                </td>
                                <td>
                                    {{ module['version'] }}
                                </td>
                                <td>
                                    {{ module['description'] }}
                                </td>
                                <td>
                                    {{ module['size'] }}
                                </td>
                                <td>
                                    {{ module['author'] }}
                                </td>
                                <td>
                                    {{ module['type'] }}
                                </td>
                                <td>
                                <button type="button" class="btn btn-danger btn-xs btn-fixed-length" ng-hide="(module['type'] === 'System')" ng-click="removeModule(moduleName)">Remove</button>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>