Scope bar and interaction from preview 

This adds a scope bar at the bottom of the preview.

The bar shows current scope of the current language and also currently hovered element. User can also interact with  the element straight from the preview by double-clicking it. This will bring up the scope colour popover for the corresponding scope.

![scope-bar](https://f.cloud.github.com/assets/203886/665636/13e25580-d7a5-11e2-9b50-493b9601cf3b.png)