filesize-bar moved to own function

digineo · Dec 25, 2014 · 0354a58 · 0354a58
1 parent b9edbeb
commit 0354a58
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 10 deletions.
diff --git a/app/assets/javascripts/application/files.js.coffee b/app/assets/javascripts/application/files.js.coffee
@@ -38,9 +38,7 @@ updateTable = ->
  $modified.text modified
 
  sizeCell = (size)->
- width = Math.round(Math.log(size) * 5)
- r = (40 + Math.round(Math.log(size) * 10)) % 255
- $("<td></td>").append("<div class='bar' style='width:#{width}px;background:hsla(#{r},100%,70%,0.5)'><span>#{filesize size*1024}</span></div>")
+ $("<td></td>").append filesizeBar(size)
 
  # Clear table
  tbody.html("")

diff --git a/app/assets/javascripts/application/filesize-bar.js.coffee b/app/assets/javascripts/application/filesize-bar.js.coffee
@@ -0,0 +1,16 @@
+
+window.filesizeBar = (size) ->
+ width = Math.round(Math.log(size) * 4)
+ r = (40 + Math.round(Math.log(size) * 10)) % 255
+ "<div class='filesize'><div class='bar' style='width:#{width}%;background:hsla(#{r},100%,70%,0.5)'><span>#{filesize size*1024}</span></div></div>"
+
+
+jQuery.fn.showFilesize = ->
+ @each ()->
+ e = $(this)
+ e.html filesizeBar(parseInt(e.text()))
+
+
+$(document).on 'ready page:load', ->
+ $(".filesize").showFilesize()
+ return
diff --git a/app/assets/stylesheets/_files.sass b/app/assets/stylesheets/_files.sass
@@ -2,10 +2,12 @@
  tr
  td:first-child
  width: 150px
- .bar
- background: #6e6
- span
- color: black
- margin-left: 3px
- white-space: nowrap
- text-shadow: 1px 1px 2px rgba(255, 255, 255, 1)
+
+.filesize
+ display: inline-block
+ width: 120px
+ span
+ color: black
+ margin-left: 3px !important
+ white-space: nowrap
+ text-shadow: 1px 1px 2px rgba(255, 255, 255, 1)