{"action":"created","issue":{"url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/issues/244","labels_url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/issues/244/labels{/name}","comments_url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/issues/244/comments","events_url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/issues/244/events","html_url":"https://github.com/wordpress-mobile/WordPress-Editor-Android/pull/244","id":105565844,"number":244,"title":"Feature #13: Edit images","user":{"login":"aforcier","id":9613966,"avatar_url":"https://avatars.githubusercontent.com/u/9613966?v=3","gravatar_id":"","url":"https://api.github.com/users/aforcier","html_url":"https://github.com/aforcier","followers_url":"https://api.github.com/users/aforcier/followers","following_url":"https://api.github.com/users/aforcier/following{/other_user}","gists_url":"https://api.github.com/users/aforcier/gists{/gist_id}","starred_url":"https://api.github.com/users/aforcier/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/aforcier/subscriptions","organizations_url":"https://api.github.com/users/aforcier/orgs","repos_url":"https://api.github.com/users/aforcier/repos","events_url":"https://api.github.com/users/aforcier/events{/privacy}","received_events_url":"https://api.github.com/users/aforcier/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/labels/media","name":"media","color":"0052cc"}],"state":"open","locked":false,"assignee":{"login":"bummytime","id":154014,"avatar_url":"https://avatars.githubusercontent.com/u/154014?v=3","gravatar_id":"","url":"https://api.github.com/users/bummytime","html_url":"https://github.com/bummytime","followers_url":"https://api.github.com/users/bummytime/followers","following_url":"https://api.github.com/users/bummytime/following{/other_user}","gists_url":"https://api.github.com/users/bummytime/gists{/gist_id}","starred_url":"https://api.github.com/users/bummytime/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bummytime/subscriptions","organizations_url":"https://api.github.com/users/bummytime/orgs","repos_url":"https://api.github.com/users/bummytime/repos","events_url":"https://api.github.com/users/bummytime/events{/privacy}","received_events_url":"https://api.github.com/users/bummytime/received_events","type":"User","site_admin":false},"milestone":{"url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/milestones/5","html_url":"https://github.com/wordpress-mobile/WordPress-Editor-Android/milestones/0.4","labels_url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/milestones/5/labels","id":1211571,"number":5,"title":"0.4","description":"","creator":{"login":"bummytime","id":154014,"avatar_url":"https://avatars.githubusercontent.com/u/154014?v=3","gravatar_id":"","url":"https://api.github.com/users/bummytime","html_url":"https://github.com/bummytime","followers_url":"https://api.github.com/users/bummytime/followers","following_url":"https://api.github.com/users/bummytime/following{/other_user}","gists_url":"https://api.github.com/users/bummytime/gists{/gist_id}","starred_url":"https://api.github.com/users/bummytime/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bummytime/subscriptions","organizations_url":"https://api.github.com/users/bummytime/orgs","repos_url":"https://api.github.com/users/bummytime/repos","events_url":"https://api.github.com/users/bummytime/events{/privacy}","received_events_url":"https://api.github.com/users/bummytime/received_events","type":"User","site_admin":false},"open_issues":19,"closed_issues":13,"state":"open","created_at":"2015-07-16T17:12:50Z","updated_at":"2015-09-11T00:24:11Z","due_on":"2015-09-10T21:00:00Z","closed_at":null},"comments":11,"created_at":"2015-09-09T10:08:30Z","updated_at":"2015-09-11T15:34:55Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/pulls/244","html_url":"https://github.com/wordpress-mobile/WordPress-Editor-Android/pull/244","diff_url":"https://github.com/wordpress-mobile/WordPress-Editor-Android/pull/244.diff","patch_url":"https://github.com/wordpress-mobile/WordPress-Editor-Android/pull/244.patch"},"body":"Addresses #13. Adds support for editing existing images to the editor.\r\n\r\nTapping an image shows an overlay:\r\n\r\n![13-edit-image-overlay](https://cloud.githubusercontent.com/assets/9613966/9758978/a1a993b4-56f2-11e5-92bc-55b3dfd084c9.png)\r\n\r\nTapping the overlay displays a modal dialog with image options:\r\n\r\n![13-edit-image-settings-pr](https://cloud.githubusercontent.com/assets/9613966/9758933/5b0f6280-56f2-11e5-913b-7be217f11bbe.png)\r\n\r\n![13-edit-image-settings-pr-2](https://cloud.githubusercontent.com/assets/9613966/9758935/5f1beb0a-56f2-11e5-946a-8e6b63c1d4ee.png)\r\n\r\n<h3>Notes</h3>\r\n\r\n<h4>1. Color scheme update</h4>\r\n\r\nWith this PR I also brought in the `colorControlActivated` color scheme from WPAndroid for the example app, to make them more similar visually. This changes the color of active EditTexts (see e.g. the title field in the image settings dialog above) and the cursor tab color from the default green to WP Light Blue:\r\n\r\n![editor-tab-color-update](https://cloud.githubusercontent.com/assets/9613966/9758943/6cd8eca2-56f2-11e5-9cfc-b1ee88869546.png)\r\n\r\n<h4>2. No featured image support yet</h4>\r\n\r\nFor now, the two featured image checkboxes at the bottom don't do anything - featured image support will be added separately (#16)\r\n\r\n<h4>3. Predef image sizes vs slider</h4>\r\n\r\nEventually we'll probably want to use predefined image sizes (Thumbnail, Medium, Large, Full, Custom?), for parity with wp-admin and the iOS editor. Since WPAndroid doesn't currently retrieve and store that information, I'm deferring it to be handled separately (pre-existing issue, imported from WPAndroid repo: #112).\r\n\r\nInstead, I imported the legacy editor's image width slider:\r\n\r\n![13-edit-image-settings-slider](https://cloud.githubusercontent.com/assets/9613966/9759088/5af9157e-56f3-11e5-8d2e-c4e5d880a4cd.png)\r\n\r\nThe maximum width (for all images uploaded to that WP site) is set by the user in the WPAndroid settings (in the example app, it's hardcoded to `600px` for now).\r\n\r\nMore details and screenshots here: https://github.com/wordpress-mobile/WordPress-Editor-Android/issues/13#issuecomment-138339101\r\n\r\n<h4>4. Known issue: missing blur effect on API<19</h4>\r\n\r\nThe blurring effect for the edit image overlay doesn't work on API<19:\r\n\r\n![13-edit-images-overlay-blur-comparison](https://cloud.githubusercontent.com/assets/9613966/9758949/7cb4a418-56f2-11e5-8fa9-37bba9a567bd.png)\r\n\r\nThis is because the Android WebKit (which powers the WebView pre-API 19) doesn't support CSS filter effects (applied with `-webkit-filter`):\r\n\r\nhttp://caniuse.com/#feat=css-filters\r\n\r\n(this also happens to the failed upload overlay on those versions)"},"comment":{"url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/issues/comments/139577565","html_url":"https://github.com/wordpress-mobile/WordPress-Editor-Android/pull/244#issuecomment-139577565","issue_url":"https://api.github.com/repos/wordpress-mobile/WordPress-Editor-Android/issues/244","id":139577565,"user":{"login":"bummytime","id":154014,"avatar_url":"https://avatars.githubusercontent.com/u/154014?v=3","gravatar_id":"","url":"https://api.github.com/users/bummytime","html_url":"https://github.com/bummytime","followers_url":"https://api.github.com/users/bummytime/followers","following_url":"https://api.github.com/users/bummytime/following{/other_user}","gists_url":"https://api.github.com/users/bummytime/gists{/gist_id}","starred_url":"https://api.github.com/users/bummytime/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bummytime/subscriptions","organizations_url":"https://api.github.com/users/bummytime/orgs","repos_url":"https://api.github.com/users/bummytime/repos","events_url":"https://api.github.com/users/bummytime/events{/privacy}","received_events_url":"https://api.github.com/users/bummytime/received_events","type":"User","site_admin":false},"created_at":"2015-09-11T15:34:55Z","updated_at":"2015-09-11T15:34:55Z","body":"@aforcier Ok. code looks good overall. \r\n\r\nI have one more general comment about the UX... and you or @thianhlu can tell me to take a long walk off a short pier if you want since you prolly had many discussions about this.\r\n\r\nI think the dialog seems a little unwieldy — lots of options and different controls in a narrow space where it may not be obvious the content in the dialog can scroll. Google mentions this in their [design guidelines](https://www.google.com/design/spec/components/dialogs.html#dialogs-content):\r\n\r\n> Avoid dialogs that:\r\n>\r\n> Contain scrolling content, particularly alerts. Instead, consider alternate containers or layouts that are optimized for reading or interacting with significant amounts of content.\r\n\r\nI am wondering if it would be a better approach to use a full screen dialog here:\r\n\r\n![scaled components_dialogs_fullscreen1](https://cloud.githubusercontent.com/assets/154014/9818808/f45d1148-586f-11e5-88d3-f99695ca7460.png)\r\n\r\nWe seem to meet most of the criteria that [Google provides](https://www.google.com/design/spec/components/dialogs.html#dialogs-full-screen-dialogs):\r\n\r\n> Consider using a full-screen dialog when the content or process meets any of the following criteria:\r\n>\r\n> * The dialog includes components like pickers or form fields requiring an input method editor (IME), such as a keyboard.\r\n* When changes are not saved in real time\r\n* When there is no draft capability in the app\r\n* When performing batch operations or queuing changes prior to submitting them\r\n\r\nand it would provide additional space vertically and horizontally for layout. This is one of the reasons we did a full screen modal in iOS.\r\n\r\nAgain, take it with a grain of salt...just my 2 pesos.\r\n"}}