Change the view mode when switching between moles and toolstrips, and

chrome/test/data/extensions/samples/mappy/mappy_toolstrip.html

 <style>
+.chrome-toolstrip #map {
+  display: none;
+}
+
+.chrome-toolstrip #button {
+  display: block;
+}
+
+.chrome-mole #map {
+  display: block;
+}
+
+.chrome-mole #button {
+  display: none;
+}
+
 #map {
-  display: none;
   width: 512px;
   height: 512px;
 }
 </style>
 <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAATfHumDbW3OmRByfquHd3SRTRERdeAiwZ9EeJWta3L_JZVS0bOBRQeZgr4K0xyVKzUdnnuFl8X9PX0w&sensor=false"
         type="text/javascript"></script>
 <script>
 var maps_key = "ABQIAAAATfHumDbW3OmRByfquHd3SRTRERdeAiwZ9EeJWta3L_JZVS0bOBRQeZgr4K0xyVKzUdnnuFl8X9PX0w";
 
-chrome.toolstrip.onCollapsed.addListener(function() {
-  var map = document.getElementById("map");
-  map.src = "";
-  map.style.display = "none";
-  var button = document.getElementById("button");
-  button.style.display = "block";
-});
-
 function expand(url) {
-  var button = document.getElementById("button");
-  button.style.display = "none";
   var map = document.getElementById("map");
   map.src = url;
-  map.style.display = "block";
   chrome.toolstrip.expand({height:512}, function() {});
 }
 
 function collapse() {
   chrome.toolstrip.collapse({}, function() {});
 }
 
 function gclient_geocode(address) {
   var geocoder = new GClientGeocoder();
   geocoder.getLatLng(address, function(point) {
@@ skipping 21 matching lines @@
       });
       port.postMessage({message: "hello tab: " + tab.id});
     }
   });
 };
 </script>
 <div id="button" class="toolstrip-button" onclick="map()">
 <span>Mappy</span>
 </div>
 <img id="map" onclick="collapse()">