Provide details of an item from within the item list page

***** 10/28/2016 [clu_]

We have toggle detail drawers for each table row in Angular tables. So this is implemented client-side.

===========================================
Provide details of an item from within the item list page
===========================================

To improve the usability of presenting addition information of a item such as an instance,
this blueprint suggest to provide additional information of item through a drop down tab.
(accordion)

Problem Description
================

When administering a system of instances, containers, networks or volumes, it is annoying to jump back
and forward from list to details and back to list. The user needs to see at a glance context sensitive
information of that item. In the example for the instance, the user wants to see the state of the instance,
the network information it sits on, the volume the instance is attached to.

Proposed Change
===============

By providing a drop down tab (accordion) for each item, the client can generate dynamically the tab
for each item.

Alternatives
------------

Is to present the information in a modal, but it limit the user to see information
of item at a item which does not improve the usability.

Implementation
==============

Client side:

    Add a drop down arrow next to each item in the list. When the arrow is clicked, the
    progress item will appear and send a request to the server for additional information for
    item #item_id. Once the server replies, render the contents in a tabbed drop down template.

Server side:

    The code for generating view for each item can be re-used to send a json reply. In the case
    for instances, the class openstack_dashboard.dashboard.project.instances.view.DetailView can
    be modified to return a json with no impact to the existing functionality.