the_storages 0.0.1 → 0.0.2

data/app/assets/javascripts/the_storages/image_crop.js.coffee

@@ -0,0 +1,69 @@
+class @ImageCrop
+  @setCoords = (coords, img) ->
+    $('#x').val  coords.x
+    $('#y').val  coords.y
+    $('#w').val  coords.w
+    $('#h').val  coords.h
+    $('#img_w').val img.width()
+
+  @hideCropWindow = ->
+    croppped_preview = $('#cropped_main_image_preview')
+    preview_holder   = croppped_preview.parent()
+    $('#main_image_cropping_save').hide()
+    $('#x, #y, #w, #h, #img_w').val('')
+    preview_holder.hide()
+
+  @showPreview = (coords, img) ->
+    if parseInt(coords.w) > 0
+      croppped_preview = $('#cropped_main_image_preview')
+      cropped_save     = $('#main_image_cropping_save')
+      preview_holder   = croppped_preview.parent()
+
+      rx = preview_holder.width()  / coords.w
+      ry = preview_holder.height() / coords.h
+
+      iw = $(img).width()
+      ih = $(img).height()
+
+      croppped_preview.css
+        width:       Math.round(rx * iw) + 'px'
+        height:      Math.round(ry * ih) + 'px'
+        marginLeft:  '-' + Math.round(rx * coords.x) + 'px'
+        marginTop:   '-' + Math.round(ry * coords.y) + 'px'
+
+      cropped_save.show()
+      preview_holder.show()
+
+  @init = ->
+    rlink  = $ '.jcrop_run'
+    slink  = $ '.jcrop_stop'
+    holder = rlink.parents('.image_toolbar')
+
+    $('.cropped_preview_holder').on 'click', '#main_image_cropping_save', (e) ->
+      $('#main_image_cropping').submit()
+      false
+
+    rlink.click ->
+      $('.base_view', holder).hide()
+      $('.crop_view', holder).show()
+      false
+
+    slink.click ->
+      $('.base_view', holder).show()
+      $('.crop_view', holder).hide()
+      false
+
+    img_selector = '#main_image_jcrop'
+    img = $ img_selector
+
+    img.load ->
+      window.main_image_jcrop = $.Jcrop img_selector,
+        aspectRatio: 8/6
+        onChange: (coords) ->
+          ImageCrop.setCoords(coords, img)
+          ImageCrop.showPreview(coords, img)
+        onSelect: (coords) ->
+          ImageCrop.showPreview(coords, img)
+
+        onRelease: ->
+          ImageCrop.hideCropWindow()

data/app/assets/javascripts/the_storages/water_mark_switcher.js.coffee

@@ -0,0 +1,17 @@
+class @WaterMarkSwitcher
+  @init = ->
+    $('.watermark_switcher').on 'click', '.wm_on, .wm_off', ->
+      link = $ @
+      id   = link.parents('li').data('node-id')
+
+      if link.toggleClass('wm_on wm_off').hasClass('wm_on')
+        link.html 'Вкл.'
+      else
+        link.html 'Выкл.'
+
+      $.ajax
+        type: 'POST'
+        url: '/attached_files/watermark_switch'
+        data:
+          id: id
+          _method: 'patch'

data/app/assets/stylesheets/the_storages.css.scss

@@ -0,0 +1,117 @@
+$file_types: (docx 3gp 7z jpg bin ps rmvb vob ses indd mp2 mp4 ram mid html txt torrent jpeg hqx sit mcd rb dat pub png tgz wav bat m4v cdl mpg divx htm default dmg doc pdf dll eps ogg vcd ifo cda dwg aif cab gif wps bup m4b qxd asf jar ttf asx wma rtf dvf amr xls m4a aiff pps tif dss tmp eml log bmp cdr iso sea rar psd ai m4p mpeg wmv qbb mdb zip gz ace  mswmm flv swf ss pst lnk fla cbr xpi exe mov ptb qbw php msi rm chm thm sitx);
+
+.attached_files_list{
+  li{
+    margin-bottom: 15px;
+  }
+  .item{
+    overflow: hidden; zoom: 1;
+  }
+  
+  .file_block{
+    margin: 0 35px 0 130px;
+
+    h4{
+      margin-left: 0;
+      margin-bottom: 5px;
+      a{
+        margin: 0;
+        font-weight: bold;
+      }
+    }
+  }
+
+  .rotate{
+    position: absolute;
+    top:65px; left:6px;
+    width: 16px;
+    
+    a{
+      margin: 0;      
+      display: inline-block;
+      height: 16px; width: 16px;
+      background-color: transparent;
+      background-repeat: no-repeat;
+      background-position: center center;
+
+      &.left{
+        background-image: image-url("rotate_left.png");
+      }
+      &.right{
+        background-image: image-url("rotate_right.png");
+      }
+    }
+  }
+
+  .preview_pic{
+    float: left;
+    background: white;
+    border: 1px solid gray;
+    overflow: hidden; zoom: 1;
+    height: 90px; width: 90px;
+    position: relative;
+    /*border-radius: 45px;*/
+    a{
+      margin: 0px;
+      color: #000000;
+      display: inline;
+      font-size: 10pt;
+      font-weight: normal;
+      line-height: 100%;
+      text-decoration: none;
+    }
+
+    i{
+      display: block;
+      height: 90px; width: 90px;
+      background-color: transparent;
+      background-repeat: no-repeat;
+      background-position: center center;
+      background-image:  image-url("content_types/default.jpg");
+
+
+      @each $file_type in $file_types{
+        &.f_#{$file_type} {
+          background-image: image-url("content_types/file_extension_#{$file_type}.png");
+        }
+      }
+    }
+  }
+
+  h4{
+    margin-left: 135px;
+  }
+
+  .url_input{
+    margin-bottom:10px;
+
+    input{
+      border: 1px solid lightgray;
+      padding: 4px;
+      width: 90%;
+      font-size: 1.2em;
+    }
+  }
+
+  .watermark_switcher{
+    margin-bottom:10px;
+    font-size: 1.2em;
+    color: #333;
+    .wm_off{
+      color: gray;
+      padding: 3px;
+      cursor: pointer;
+      background: lightgray;
+    }
+    .wm_on{
+      color: #00561f;
+      padding: 3px;
+      cursor: pointer;
+      background: #bdd3b2;
+    }
+  }
+
+  .fsize{
+    font-size:0.9em;
+  }
+}