Rework Code Climate integration for action icon bar.

assets/scripts/app/templates/repos/show/actions.hbs

@@ -1,14 +1,5 @@
 <div id="actions">
   <ul>
-    {{#if view.displayCodeClimate}}
-      <li>
-        <a href="#" name="code-climate"
-          {{action "codeClimatePopup" target="view"}}
-          {{bindAttr class=":open-popup"}}>
-          Test Coverage
-        </a>
-      </li>
-    {{/if}}
     {{#if view.displayStatusImages}}
     <li id="status-image-popup">
       <a href="#" name="status-images" class="open-popup" {{action "statusImages" target="view"}} style="margin-top: 0px;">
@@ -48,5 +39,15 @@
         <a class="download-log" {{bindAttr href="view.plainTextLogUrl"}}><img class="icon" src="/images/icons/align-justify.png" width="20" title="Download Log"/></a>
       </li>
     {{/if}}
+    {{#if view.displayCodeClimate}}
+      <li class="icon">
+        <a href="#" name="code-climate"
+          {{action "codeClimatePopup" target="view"}}
+          {{bindAttr class=":open-popup"}}>
+          <img src="/images/icons/code-climate-icon.png" title="Test Coverage with Code Climate"/>
+        </a>
+      </li>
+    {{/if}}
+
   </ul>
 </div>

assets/scripts/app/templates/repos/show/tools.hbs

@@ -43,9 +43,20 @@
 </div>
 
 <div id="code-climate" class="popup">
+  <img src="/images/icons/code-climate-logo.png" id="code-climate-logo"/>
+  <a href="#" class="close" {{action "popupClose" target="view"}}></a>
   <p>
-    Integrating <a href="https://codeclimate.com">Code Climate</a>'s code coverage reporting with your test
+    <b>Want test coverage for your tests?</b>
-    suite on Travis CI allows to track changes in coverage over time. It only takes a few steps, once you've set up your project:
+  </p>
+  <p>
+    Integrating <a href="https://codeclimate.com">Code Climate's test coverage</a> reporting with your test
+    suite on Travis CI allows to track changes in coverage over time. If you haven't tried it out already, <a
+    href="" target="_blank">sign
+    up today</a> for to improve your code's quality. New customers get 20% off for the first three months!
+  </p> 
+
+  <p>
+    It only takes a few steps, once you've set up your project:
   </p>
 
   <ol>
@@ -68,9 +79,9 @@ CodeClimate::TestReporter.start
       Add the Code Climate token to your .travis.yml:
 
 <pre>
-env:
+addons:
-  global:
+  code_climate:
-    - CODECLIMATE_REPO_TOKEN=adf08323...
+    token: adf08323...
 </pre>
     </li>
 </div>

assets/scripts/app/views/repo/show.coffee

@@ -222,9 +222,15 @@ Travis.reopen
     ).property('tab')
 
     displayCodeClimate: (->
+      console.log @get('repo.githubLanguage')
       Travis.config.code_climate == "true" and @get('repo.githubLanguage') == 'Ruby'
     ).property('repo.githubLanguage')
 
+    codeClimatePopup: ->
+      @popupCloseAll()
+      @popup('code-climate')
+      event.stopPropagation()
+
     requeueBuild: ->
       if @get('canRequeueBuild')
         @get('build').requeue()

assets/scripts/travis.coffee

@@ -75,6 +75,7 @@ $.extend Travis,
     pusher_key:   $('meta[name="travis.pusher_key"]').attr('value')
     ga_code:      $('meta[name="travis.ga_code"]').attr('value')
     code_climate: $('meta[name="travis.code_climate"]').attr('value')
+    code_climate_url: $('meta[name="travis.code_climate_url"]').attr('value')
 
   CONFIG_KEYS: ['go', 'rvm', 'gemfile', 'env', 'jdk', 'otp_release', 'php', 'node_js', 'perl', 'python', 'scala', 'compiler']
 

assets/styles/main/tools.sass

@@ -36,6 +36,18 @@
         cursor: default
         color: $color-link-disabled
 
+#code-climate
+  a
+    text-decoration: underline
+    font-weight: bold
+
+  img
+    &#code-climate-logo
+      float: right
+      width: 150px
+      margin-top: 5px
+      margin-right: 10px
+
 #actions
   float: right
   text-align: right

public/index.html

@@ -5,7 +5,6 @@
     <meta rel="travis.api_endpoint" href="https://api.travis-ci.org">
     <meta name="travis.pusher_key" value="5df8ac576dcccf4fd076">
     <meta name="travis.ga_code" value="UA-24868285-1">
-    <meta name="travis.code_climate" value="true">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Travis CI - Free Hosted Continuous Integration Platform for the Open Source Community</title>
     <link rel="dns-prefetch" href="//api.travis-ci.org">