[#7450] - Semantic image captions
- Closed
- 4 Dec 2015
- Medium
- Build: staging
- Easy Test
- # 7450
- Diff
- zero-24:Semantic-image-captions
- Success The Travis CI build passed Details
User tests: Successful: Unsuccessful:
Move the Pull Request by @nternetinspired here: #2657 to the staging branche.
@committer kudos goes to @nternetinspired
Overview
Following the Google Group discussion regarding jCaption https://groups.google.com/forum/#!topic/joomla-dev-general/vW--mTtuaaw this PR implements semantic figure and captioning elements.
Joomla ships with the html5 doctype, so it is my opinion that we should be using the correct elements wherever possible. Article images and their captions are what and are made for.
This change not only improves the document semantics, and therefore accessibility, it also removes the need for caption.js, which calls the entire Mootools stack whenever it is loaded.
Changes
This PR makes several changes, namely:
- Disabling calls to jCaption and marking as deprecated.
- Updating markup surrounding article intro and article full text images to implement html5s figure and figcaption elements.
- Updates the featured layout to use the JLayout intro image helper, as the category blog layout already does.
Testing
- Insert article images (intro and full-text) using the 'images and links' fields.
- Insert image captions using the 'images and links' Caption field, one for intro image, one for full-text.
- Set the article to 'featured' status.
- Check that the image caption appears in article, category blog and featured blog view.
- Check that the 'Image float' option is honored in these views.
- Check that caption.js is no longer loaded in these views.
@nternetinspired can your review and let us know if it still works as indent?
@Bakual @betweenbrain @designbengel can you test / review here again?
Additional to the code by @nternetinspired I have add the @deprecated tag to the behavior.php
| Status | New | ⇒ | Pending |
| Labels |
Added:
?
|
||
| Easy | No | ⇒ | Yes |
| Category | ⇒ | Front End JavaScript Libraries |
| Rel_Number | 0 | ⇒ | 2657 |
| Relation Type | ⇒ | Related to |
Apart from the noted issue, everything checks out fine :)
Looking good!
Tests: 
Displaying single article
( ! ) Notice: Undefined variable: imgfloat in /Applications/MAMP/htdocs/trunkgitnew/components/com_content/views/article/tmpl/default.php on line 97 Call Stack #TimeMemoryFunctionLocation 10.0009237536{main}( )../index.php:0 20.07303219512JApplicationCms->execute( )../index.php:45 30.07303219680JApplicationSite->doExecute( )../cms.php:252 40.36537625224JApplicationSite->dispatch( )../site.php:230 50.37957694560JComponentHelper::renderComponent( )../site.php:191 60.38297726360JComponentHelper::executeComponent( )../helper.php:372 70.38307747792require_once( '/Applications/MAMP/htdocs/trunkgitnew/components/com_content/content.php' )../helper.php:392 80.39148083544JControllerLegacy->execute( )../content.php:16 90.39148083768ContentController->display( )../legacy.php:728 100.39178086752JControllerLegacy->display( )../controller.php:104 110.40498654768ContentViewArticle->display( )../legacy.php:690 120.528510486264JViewLegacy->display( )../view.html.php:184 130.528510486304JViewLegacy->loadTemplate( )../legacy.php:209 140.530110582528include( '/Applications/MAMP/htdocs/trunkgitnew/components/com_content/views/article/tmpl/default.php' )../legacy.php:670 item-image">
Thanks @infograf768 fixed with: zero-24@f7b36bc It was a copy and paste issue 
@test Unsuccessful. code being displayed on frontend view. New PR being submitted.
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/7450.
@tessamero I don't understand you comment can you give us some more info what failed?
Tessa do you have any new infos?
Successfully tested:
Caption appears in article, category blog and featured blog view.
Float right & left is working.
No caption.js is show in sourcecode.
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/7450.
figcaption elements are showing in sourcecode.
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/7450.
But: In Blog View the caption text is no more linked to the articel. Is this intended?
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/7450.
But: In Blog View the caption text is no more linked to the articel. Is this intended?
Good spot @a-fusion no I don't think that is intentional, thanks for testing.
The current layout has linked images, but these were added after my original PR, so linked image should also be included here to maintain that fucntionality. Would you drop in the image linking from https://github.com/joomla/joomla-cms/blob/staging/layouts/joomla/content/intro_image.php please @zero-24 ?
Thanks 
This PR has received new commits.
CC: @tessamero
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/7450.
@a-fusion @nternetinspired with the last commit i have finaly add the image linking back to the layout (as well syncing to staging ;)) Can you retest?
| Status | Pending | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2015-12-04 22:38:36 |
| Closed_By | ⇒ | zero-24 |
Haven't tested yet this iteration (tested the orignal one). Still like it.