Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Added Float property to Insert Media / Image dialog.

  • Loading branch information...
commit e0a52a88c19b23035098b063ffe7be10598a69ac 1 parent 481bc5e
@tylergannon tylergannon authored
View
2  app/assets/javascripts/mercury/modals/insertmedia.js.coffee
@@ -27,6 +27,7 @@
if image = selection.is?('img')
@element.find('#media_image_url').val(image.attr('src'))
@element.find('#media_image_alignment').val(image.attr('align'))
+ @element.find('#media_image_float').val(if image.attr('style')? then image.css('float') else '')
@focus('#media_image_url')
# if we're editing an iframe (assume it's a video for now)
@@ -98,6 +99,7 @@
when 'image_url'
attrs = {src: @element.find('#media_image_url').val()}
attrs['align'] = alignment if alignment = @element.find('#media_image_alignment').val()
+ attrs['style'] = 'float: ' + float + ';' if float = @element.find('#media_image_float').val()
Mercury.trigger('action', {action: 'insertImage', value: attrs})
when 'youtube_url'
View
10 app/views/mercury/modals/media.html
@@ -51,6 +51,16 @@
<option value="absbottom">Absolute Bottom</option>
</select>
</div>
+ <label class="select optional control-label" for="media_image_float">Float</label>
+ <div class="controls">
+ <select class="select optional" id="media_image_float" name="media[image_float]">
+ <option value="">None</option>
+ <option value="left">Left</option>
+ <option value="right">Right</option>
+ <option value="none">None</option>
+ <option value="inherit">Inherit</option>
+ </select>
+ </div>
</div>
</div>
<div class="media-options" id="youtube_url_options" style="display:none">
View
18 features/regions/full/inserting_media.feature
@@ -49,6 +49,24 @@ Feature:
And press "Insert Media"
Then the contents of the full region should be "this is <img src='/assets/mercury/temp-logo.png' align='absmiddle'> <b>content</b>"
+# Scenario: A user can insert and edit an image with an explicit float setting
+ Given the content of the full region is simple content
+ And I make a selection
+
+ When I click on the "Insert Media" button
+ When I fill in "media_image_url" with "/assets/mercury/temp-logo.png"
+ And select "Right" from "Float"
+ And press "Insert Media"
+ Then the contents of the full region should be "this is <img style='float: right;' src='/assets/mercury/temp-logo.png'> <b>content</b>"
+
+ When I make a selection for "img"
+ And click on the "Insert Media" button
+ And select "Absolute Middle" from "Alignment"
+ And select "None" from "Float"
+ And press "Insert Media"
+ Then the contents of the full region should be "this is <img src='/assets/mercury/temp-logo.png' align='absmiddle'> <b>content</b>"
+
+
Scenario: A user can edit an image by double clicking it
Given the content of the full region has an image
View
8 spec/javascripts/mercury/modals/insertmedia_spec.js.coffee
@@ -53,7 +53,7 @@ describe "Mercury.modalHandlers.insertMedia", ->
beforeEach ->
@focusSpy = spyOn($.fn, 'focus').andCallThrough()
- @selection = {is: -> $('<img>', {src: '/foo.gif', align: 'right'})}
+ @selection = {is: -> $('<img>', {src: '/foo.gif', align: 'right', style: 'float: left;'})}
Mercury.region = selection: => @selection
@insertMedia.initialize()
@@ -67,6 +67,9 @@ describe "Mercury.modalHandlers.insertMedia", ->
it "sets the image alignment option", ->
expect($('#media_image_alignment').val()).toEqual('right')
+ it "sets the image float option", ->
+ expect($('#media_image_float').val()).toEqual('left')
+
describe "an existing youtube video", ->
beforeEach ->
@@ -176,13 +179,14 @@ describe "Mercury.modalHandlers.insertMedia", ->
beforeEach ->
$('#media_image_url').val('http://domain/foo.gif')
$('#media_image_alignment').val('right')
+ $('#media_image_float').val('left')
it "triggers an action with the proper values", ->
jasmine.simulate.click($('input[type=submit]').get(0))
expect(@triggerSpy.callCount).toEqual(1)
expect(@triggerSpy.argsForCall[0][0]).toEqual('action')
expect(@triggerSpy.argsForCall[0][1]['action']).toEqual('insertImage')
- expect(@triggerSpy.argsForCall[0][1]['value']).toEqual({src: 'http://domain/foo.gif', align: 'right'})
+ expect(@triggerSpy.argsForCall[0][1]['value']).toEqual({src: 'http://domain/foo.gif', align: 'right', style: 'float: left;'})
describe "a youtube video", ->
View
10 spec/javascripts/templates/mercury/modals/insertmedia.html
@@ -41,6 +41,16 @@
<option value="absbottom">Absolute Bottom</option>
</select>
</div>
+ <label class="select optional control-label" for="media_image_float">Float</label>
+ <div class="controls">
+ <select class="select optional" id="media_image_float" name="media[image_float]">
+ <option value="">None</option>
+ <option value="left">Left</option>
+ <option value="right">Right</option>
+ <option value="none">None</option>
+ <option value="inherit">Inherit</option>
+ </select>
+ </div>
</div>
</div>
<div class="media-options" id="youtube_url_options" style="display:none">
Please sign in to comment.
Something went wrong with that request. Please try again.