<div class="row-fluid">
    <div class="btn-group">
            <fieldset>
                <div class="control-group inline-block">
                    <div class="btn-group">
                        <button class="btn" ng-click="resume()"><i class="icon-play-circle"></i> Resume
                        </button>
                        <button class="btn" ng-click="suspend()"><i class="icon-pause"></i> Suspend
                        </button>
                        <button class="btn" ng-click="reboot()"><i class="icon-reply"></i> Reboot
                        </button>
                        <button class="btn" ng-click="destroy()"><i class="icon-remove"></i> Destroy
                        </button>
                    </div>
                </div>
            </fieldset>
    </div>
</div>
<div>
    <table class="overviewSection">
        <tr>
            <td><strong>Id:</strong></td>
            <td class="less-big">{{row.id}}
            </td>
        </tr>
        <tr>
            <td><strong>Name:</strong></td>
            <td class="less-big">{{row.name}}
            </td>
        </tr>
        <tr>
            <td><strong>Status</strong></td>
            <td class="less-big">{{row.status}}
            </td>
        </tr>
        <tr>
            <td><strong>Image</strong></td>
            <td class="less-big"><a href="#/jclouds/compute/image/{{computeId}}/{{row.imageId}}{{hash}}">{{row.imageId}}</a>
            </td>
        </tr>
        <tr>
            <td><strong>Location</strong></td>
            <td class="less-big"><a href="#/jclouds/compute/location/{{computeId}}/{{row.locationId}}{{hash}}">{{row.locationId}}</a>
            </td>
        </tr>
        <tr>
            <td><strong>Hardware</strong></td>
            <td class="less-big"><a href="#/jclouds/compute/hardware/{{computeId}}/{{row.hardwareId}}{{hash}}">{{row.hardwareId}}</a>
            </td>
        </tr>
        <tr>
            <td><strong>Hostname</strong></td>
            <td class="less-big">{{row.hotname}}
            </td>
        </tr>
        <tr>
            <td><strong>Login Port</strong></td>
            <td class="less-big">{{row.loginPort}}
            </td>
        </tr>
        <tr>
            <td><strong>Operating System Family:</strong></td>
            <td class="less-big">{{row.operatingSystem.family}}
            </td>
        </tr>
        <tr>
            <td><strong>Operating System Version:</strong></td>
            <td class="less-big">{{row.operatingSystem.version}}
            </td>
        </tr>
        <tr>
            <td><strong>Operating System Name:</strong></td>
            <td class="less-big">{{row.operatingSystem.name}}
            </td>
        </tr>
        <tr>
            <td><strong>Operating System Architecture:</strong></td>
            <td class="less-big">{{row.operatingSystem.arch}}
            </td>
        </tr>
        <tr>
            <td><strong>Operating System Description:</strong></td>
            <td class="less-big">{{row.operatingSystem.arch}}
            </td>
        </tr>
        <tr>
            <td><strong>Default Username:</strong></td>
            <td class="less-big">{{row.defaultCredentials.username}}
            </td>
        </tr>
        <tr>
            <td><strong>Default Password:</strong></td>
            <td class="less-big">{{row.defaultCredentials.password}}
            </td>
        </tr>
        <tr>
            <td><strong>Default Sudo Access:</strong></td>
            <td class="less-big">{{row.defaultCredentials.authenticatedSudo}}
            </td>
        </tr>
        <tr ng-show="row.tags.length > 0">
            <td>
            </td>
            <td>
                <div class="accordion" id="accordionTags">
                    <div class="accordion-group">
                        <div class="accordion-heading">
                            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionTags"
                               href="#collapseTags">
                                Tags
                            </a>
                        </div>
                        <div id="collapseTags" class="accordion-body collapse out">
                            <ul class="accordion-inner">
                                <table class="accordion-inner">
                                    <tr ng-repeat="tag in row.tags">
                                        <td class="less-big">{{tag}}</td>
                                    </tr>
                                </table>
                            </ul>
                        </div>
                    </div>
                </div>
            </td>
        </tr>
        <tr ng-show="row.metadata.length > 0">
            <td>
            </td>
            <td>
                <div class="accordion" id="accordionMetadata">
                    <div class="accordion-group">
                        <div class="accordion-heading">
                            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionMetadata"
                               href="#collapseMetadata">
                                Metadata
                            </a>
                        </div>
                        <div id="collapseMetadata" class="accordion-body collapse out">
                            <ul class="accordion-inner">
                                <table class="accordion-inner">
                                    <tr ng-repeat="(key, value) in row.metadata">
                                        <td class="property-name">{{key}}</td>
                                        <td class="property-value">{{value}}</td>
                                    </tr>
                                </table>
                            </ul>
                        </div>
                    </div>
                </div>
            </td>
        </tr>
    </table>
</div>
