Merge pull request #270 from simi/trim-image-modal

Trim status image modal.

assets/scripts/app/helpers.coffee

@@ -1,3 +1,4 @@
 require 'helpers/handlebars'
 require 'helpers/helpers'
 require 'helpers/urls'
+require 'helpers/status_image_formatter'

assets/scripts/app/helpers/status_image_formatter.coffee

@@ -0,0 +1,55 @@
+@Travis.StatusImageFormatter =
+  slug: null
+  url: null
+  branch: null
+
+  format: (version, slug, branch) ->
+    @slug = slug
+    @branch = branch
+    @url = @urlRepo()
+
+    switch version
+      when 'Image URL' then @statusImageUrl()
+      when 'Markdown' then @markdownStatusImage()
+      when 'Textile' then @textileStatusImage()
+      when 'RDOC' then @rdocStatusImage()
+      when 'AsciiDoc' then @asciidocStatusImage()
+      when 'Rst' then @rstStatusImage()
+      when 'POD' then @podStatusImage()
+      when 'cc.xml' then @ccxmlStatusUrl()
+
+  urlRepo: (->
+    "https://#{location.host}/#{@slug}"
+  )
+
+  statusImageUrl: (->
+    Travis.Urls.statusImage(@slug, @branch)
+  )
+
+  markdownStatusImage: (->
+    "[![Build Status](#{@statusImageUrl()})](#{@url})"
+  )
+
+  textileStatusImage: (->
+    "!#{@statusImageUrl()}!:#{@url}"
+  )
+
+  rdocStatusImage: (->
+    "{<img src=\"#{@statusImageUrl()}\" alt=\"Build Status\" />}[#{@url}]"
+  )
+
+  asciidocStatusImage: (->
+    "image:#{@statusImageUrl()}[\"Build Status\", link=\"#{@url}\"]"
+  )
+
+  rstStatusImage: (->
+    ".. image:: #{@statusImageUrl()}\n    :target: #{@url}"
+  )
+
+  podStatusImage: (->
+    "=for HTML <a href=\"#{@url}\"><img src=\"#{@statusImageUrl()}\"></a>"
+  )
+
+  ccxmlStatusUrl: (->
+    "#{Travis.config.api_endpoint}/repos/#{@slug}/cc.xml"
+  )

assets/scripts/app/templates/status_images.hbs

@@ -7,31 +7,8 @@
     <span class="loading"></span>
   {{/if}}
 </p>
+
 <p>
-  <label>Image URL:</label>
+  <label>{{view Ember.Select contentBinding="view.formats" selectionBinding="view.statusImageFormat"}}</label>
-  <input type="text" class="url" {{bind-attr value="view.statusImageUrl"}}></input>
+  {{view Travis.StatusImageInput valueBinding="view.statusString" class="url" rows=3}}
-</p>
-<p>
-  <label>Markdown:</label>
-  <input type="text" class="markdown" {{bind-attr value="view.markdownStatusImage"}}></input>
-</p>
-<p>
-  <label>Textile:</label>
-  <input type="text" class="textile" {{bind-attr value="view.textileStatusImage"}}></input>
-</p>
-<p>
-  <label>RDOC:</label>
-  <input type="text" class="rdoc" {{bind-attr value="view.rdocStatusImage"}}></input>
-</p>
-<p>
-  <label>AsciiDoc:</label>
-  <input type="text" class="asciidoc" {{bind-attr value="view.asciidocStatusImage"}}></input>
-</p>
-<p>
-  <label>Rst:</label>
-  <input type="text" class="rst" {{bind-attr value="view.rstStatusImage"}}></input>
-</p>
-<p>
-  <label>POD:</label>
-  <input type="text" class="pod" {{bind-attr value="view.podStatusImage"}}></input>
 </p>

assets/scripts/app/views.coffee

@@ -60,3 +60,4 @@ require 'views/stats'
 require 'views/signin'
 require 'views/top'
 require 'views/status_images'
+require 'views/status_image_input'

assets/scripts/app/views/status_image_input.coffee

@@ -0,0 +1,3 @@
+Travis.StatusImageInput = Em.TextArea.extend
+  click: ->
+    @get('element').select()

assets/scripts/app/views/status_images.coffee

@@ -9,10 +9,22 @@ Travis.StatusImagesView = Em.View.extend
   jobBinding:   'toolsView.job'
   branchesBinding: 'repo.branches'
 
+  formats: [
+    'Image URL',
+    'Markdown',
+    'Textile',
+    'RDOC',
+    'AsciiDoc',
+    'Rst',
+    'POD',
+    'cc.xml'
+  ]
+
   didInsertElement: ->
     @_super.apply(this, arguments)
 
     @setStatusImageBranch()
+    @setStatusImageFormat()
     @show()
 
   show: ->
@@ -21,9 +33,9 @@ Travis.StatusImagesView = Em.View.extend
   close: ->
     @destroy()
 
-  urlRepo: (->
+  setStatusImageFormat: (->
-    "https://#{location.host}/#{@get('repo.slug')}"
+    @set('statusImageFormat', @formats[0])
-  ).property('repo.slug')
+  )
 
   setStatusImageBranch: (->
     if @get('repo.branches.isLoaded')
@@ -32,30 +44,7 @@ Travis.StatusImagesView = Em.View.extend
       @set('statusImageBranch', null)
   ).observes('repo.branches', 'repo.branches.isLoaded', 'build.commit.branch')
 
-  statusImageUrl: (->
+  statusString: (->
-    Travis.Urls.statusImage(@get('repo.slug'), @get('statusImageBranch.commit.branch'))
+    Travis.StatusImageFormatter.format(@get('statusImageFormat'), @get('repo.slug'), @get('statusImageBranch.commit.branch'))
-  ).property('repo.slug', 'statusImageBranch')
+  ).property('statusImageFormat', 'repo.slug', 'statusImageBranch.commit.branch')
 
-  markdownStatusImage: (->
-    "[![Build Status](#{@get('statusImageUrl')})](#{@get('urlRepo')})"
-  ).property('statusImageUrl')
-
-  textileStatusImage: (->
-    "!#{@get('statusImageUrl')}!:#{@get('urlRepo')}"
-  ).property('statusImageUrl')
-
-  rdocStatusImage: (->
-    "{<img src=\"#{@get('statusImageUrl')}\" alt=\"Build Status\" />}[#{@get('urlRepo')}]"
-  ).property('statusImageUrl')
-
-  asciidocStatusImage: (->
-    "image:#{@get('statusImageUrl')}[\"Build Status\", link=\"#{@get('urlRepo')}\"]"
-  ).property('statusImageUrl')
-
-  rstStatusImage: (->
-    ".. image:: #{@get('statusImageUrl')}   :target: #{@get('urlRepo')}"
-  ).property('statusImageUrl')
-
-  podStatusImage: (->
-    "=for HTML <a href=\"#{@get('urlRepo')}\"><img src=\"#{@get('statusImageUrl')}\"></a>"
-  ).property('statusImageUrl')

assets/styles/app/popup.sass

@@ -49,12 +49,14 @@
   p
     margin: 10px 0
     label
-      width: 80px
+      width: 100px
       display: inline-block
-    input
+      vertical-align: top
+    textarea
       border: 1px solid $color-border-light
-      width: 505px
+      width: 485px
       padding: 4px
+      resize: vertical
       @include border-radius(3px)
 
 #regenerate-key