Media settings

[isaackeyet]

Media settings should be added for uploaded content and should mimic the Android app in layout, wording, and features (where it makes sense).

New view should replace or build upon the image detail view in the attachments section of the Post Editor and retain current functionality.

Proposed content:

• Image thumbnail (tap to enlarge would be a bonus). Should mimic the layout of Featured Images in the Post Editor / Settings section.
• Caption field
• Link to... setting (mimic core). To start with the only options could be "No linking" and "Media File" but in the future we may want to do "Custom URL" and "Attachment Page" as well.
• Alignment section with 4 settings: None (default), Left, Center, Right.
• Positioning: Above Content, Below Content (retaining current functionality but with an improved UI).
• Width: a regular input field coupled with a slider to change the px value (see the Android app for a good implementation of the slider). We may also want to show a greyed out height value somewhere in the UI but not necessary. See Android app for implementation details.
• Large, red Remove Image button with actionSheet to confirm the action towards the bottom (retaining current functionality).

All new features would be reflected in the markup for the image embedded in the post editor and we also need to make sure it works well with images embedded by other apps and by WP itself.

See attached wireframe for a rough idea of what the view could look like.

[jkv1]

iPad media settings UI

[jkv1]

iPad media settings option selection UI

[jkv1]

iPhone media settings UI

[jkv1]

Attached a file: 1515-media-settings-for-images.diff

For images uploaded from the application there is a new screen shown that allows the user to set the caption, alignment, positioning, custom width and remove the image. A sample of the HTML generated is:

[caption align="aligncenter" width="250"]<a href="http://someurl.com/image.jpg"><img src="http://someurl.com/image.jpg" width="250" /></a>My caption[/caption]

If the user does not have a caption set the HTML would be:

<a href="http://someurl.com/image.jpg"><img src="http://someurl.com/image.jpg" width="250" class="aligncenter"/></a>	

The post HTML manipulation is still very poor in that it is just doing a string replace for the old HTML to the new media settings so the same problems exist where if a user makes any changes to the image HTML then the media settings changes will end up creating duplicate image HTML.

The core data version was increased so that the media table would contain caption, alignment, and custom width and height.

The "Image thumbnail (tap to enlarge would be a bonus)" will be trivial to add once #1515 is merged into SVN

[koke]

I'm getting an error:

patching file WordPress.xcodeproj/project.pbxproj
patching file button_red.png
patch: **** malformed patch at line 112: \ No newline at end of file

Can you try attaching binary files separate, or maybe a pull request on github?

[jkv1]

I don't think I should have closed this issue until after the patch is accepted on github. I'm going to assign to koke since I think he is the one reviewing it.

​https://github.com/wordpress-mobile/WordPress-iOS/pull/10