Update click-to-play UI and strings.

http://imgur.com/gkbct.png (normal)
http://imgur.com/ue6ao.png (hover)

BUG=51906
TEST=none

Review URL: http://codereview.chromium.org/3218006

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@57971 0039d316-1c4b-4281-b951-d872f2087c98

3 files changed, 42 insertions, 39 deletions

diff --git a/chrome/app/generated_resources.grd b/chrome/app/generated_resources.grd
index 8b0c862..5c0a8992 100644
--- a/chrome/app/generated_resources.grd
+++ b/chrome/app/generated_resources.grd
@@ -2401,7 +2401,7 @@ each locale. -->
         Run all plug-ins this time
       </message>
       <message name="IDS_BLOCKED_PLUGINS_UNBLOCK_SHORT" desc="Button to unblock nonsandboxed plug-ins on a site">
-        Always allow
+        Always on this site
       </message>
 
       <!-- SSL error strings -->
@@ -3830,14 +3830,14 @@ Keep your key file in a safe place. You will need it to create new versions of y
       </message>
 
       <!-- Click-to-load -->
-      <message name="IDS_PLUGIN_LOAD" desc="The link for loading a blocked plug-in.">
-        Run plug-in this time
+      <message name="IDS_PLUGIN_LOAD" desc="The link for loading a blocked plug-in, displayed in the click-to-play UI.">
+        Click to run this blocked plug-in
       </message>
-      <message name="IDS_PLUGIN_LOAD_SHORT" desc="The link for loading a blocked plug-in.">
-        Run this time
+      <message name="IDS_PLUGIN_LOAD_SHORT" desc="The link for loading all blocked plug-ins, displayed in the infobar.">
+        Allow
       </message>
       <message name="IDS_PLUGIN_UPDATE" desc="The link for updating an outdated plug-in.">
-        Update plug-in
+        Update plug-in...
       </message>
 
       <!-- Session Crashed Info Bar-->
@@ -6766,13 +6766,13 @@ Keep your key file in a safe place. You will need it to create new versions of y
         Problems installing?
       </message>
       <message name="IDS_PLUGIN_BLOCKED_PROMPT" desc="Info Bar message when a non-sandboxed plugin was blocked">
-        The <ph name="PLUGIN_NAME">$1<ex>Flash</ex></ph> plug-in was blocked on this site because it could access your computer directly.
+        This website uses the <ph name="PLUGIN_NAME">$1<ex>Flash</ex></ph> plug-in; allow this plug-in to run?
       </message>
       <message name="IDS_PLUGIN_OUTDATED_PROMPT" desc="Info Bar message when an outdated plugin was disabled">
-        The <ph name="PLUGIN_NAME">$1<ex>Flash</ex></ph> plug-in was disabled on this site because it is outdated and could access your computer directly.
+        The <ph name="PLUGIN_NAME">$1<ex>Flash</ex></ph> plug-in was disabled because it is out of date.
       </message>
       <message name="IDS_PLUGIN_ENABLE_TEMPORARILY" desc="Info Bar button to temporarily re-enable a disabled plugin">
-        Re-enable for this session
+        Re-enable...
       </message>
       <message name="IDS_PLUGIN_CRASHED_PROMPT" desc="Info Bar message to notify about a crashed plugin">
         The following plug-in has crashed: <ph name="PLUGIN_NAME">$1<ex>Shockwave</ex></ph>
diff --git a/chrome/renderer/resources/blocked_plugin.html b/chrome/renderer/resources/blocked_plugin.html
index b643b4d..ceb08ad 100644
--- a/chrome/renderer/resources/blocked_plugin.html
+++ b/chrome/renderer/resources/blocked_plugin.html
@@ -17,20 +17,37 @@ function bodyClicked() {
 </script>
 <style>
 body {
-  background-color: rgb(252, 235, 162);
+  background-color: rgb(128, 128, 128);
   margin: 0;
   text-align: center;
   font-family: sans-serif;
 }
 
+body #outer:hover {
+  background: -webkit-gradient(linear, left top, left bottom, from(#d2d2d2), to(#a5a5a5));
+}
+
+body #outer:active {
+  background: -webkit-gradient(linear, left top, left bottom, from(#b9b9b9), to(#d2d2d2));
+}
+
 h1 {
-  padding: 0pt 14pt;
-  font-size: 14pt;
-  color: blue;
+  padding: 0pt 10pt;
+  font-size: 10pt;
+  font-weight: normal;
+  visibility: hidden;
 }
 
 #outer:hover h1 {
-  text-decoration: underline;
+  visibility: visible;
+}
+
+#plugin_icon {
+  opacity: .4;
+}
+
+#outer:hover #plugin_icon {
+  opacity: 1.0;
 }
 
 p {
@@ -43,45 +60,31 @@ p {
   height: 100%;
   cursor: pointer;
   position: absolute;
+  border: 1px black solid;
+  -webkit-box-sizing: border-box;
+}
+
+/*
+FIXME: This causes flickering on hover.
+#outer:hover {
+  -webkit-box-shadow: rgb(229,229,229) 1px 1px inset;
 }
+*/
 
 #inner {
   position: relative;
   top: 50%;
   margin-top: -50px;
 }
-
-#top, #bottom, #left, #right {
-  background: black;
-  position: fixed;
-}
-#left, #right {
-  top: 0; bottom: 0;
-  width: 1px;
-}
-#left { left: 0; }
-#right { right: 0; }
-
-#top, #bottom {
-  left: 0; right: 0;
-  height: 1px;
-}
-#top { top: 0; }
-#bottom { bottom: 0; }
 </style>
 </head>
 
-<body id="t">
+<body id="t" onSelectStart="return false;">
 <div id="outer" onclick="bodyClicked()">
-<div id="left"></div>
-<div id="right"></div>
-<div id="top"></div>
-<div id="bottom"></div>
 <div id="inner">
-<div><img src="../../app/theme/extensions_section.png" /></div>
+<div><img id="plugin_icon" src="plugin_blocked.png" /></div>
 <h1 jsdisplay="!hasOwnProperty('pluginGroup') || !pluginGroup.critical"  i18n-content="loadPlugin">PLUGIN_LOAD</h1>
 <h1 jsdisplay="hasOwnProperty('pluginGroup')" i18n-content="updatePlugin">UPDATE_PLUGIN</h1>
-<p><span class="help" i18n-content="message">BLOCKED_PLUGINS_TITLE</span></p>
 <p id="debug"> </p>
 </div>
 </div>
diff --git a/chrome/renderer/resources/plugin_blocked.png b/chrome/renderer/resources/plugin_blocked.png
new file mode 100644
index 0000000..0657031
--- /dev/null
+++ b/chrome/renderer/resources/plugin_blocked.png