https://www.mediawiki.org/wiki/Special:Code/MediaWiki/112201
Revision: 112201
Author: jeroendedauw
Date: 2012-02-23 13:16:05 +0000 (Thu, 23 Feb 2012)
Log Message:
-----------
slightly modified patch by MWJames from bug 34411
Modified Paths:
--------------
trunk/extensions/SemanticResultFormats/Gallery/SRF_Gallery.php
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.css
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.js
Modified: trunk/extensions/SemanticResultFormats/Gallery/SRF_Gallery.php
===================================================================
--- trunk/extensions/SemanticResultFormats/Gallery/SRF_Gallery.php
2012-02-23 13:14:48 UTC (rev 112200)
+++ trunk/extensions/SemanticResultFormats/Gallery/SRF_Gallery.php
2012-02-23 13:16:05 UTC (rev 112201)
@@ -1,4 +1,4 @@
-<?php
+<?php
/**
* Result printer that prints query results as a gallery.
@@ -7,7 +7,8 @@
* @ingroup SemanticResultFormats
*
* @author Rowan Rodrik van der Molen
- * @author Jeroen De Dauw, mwjames
+ * @author Jeroen De Dauw
+ * @author mwjames
*/
class SRFGallery extends SMWResultPrinter {
@@ -29,18 +30,35 @@
$ig->setShowFilename( false );
$ig->setParser( $wgParser );
$ig->setCaption( $this->mIntro ); // set caption to IQ header
-
+
if ( $this->m_params['galleryformat'] == 'carousel' ) {
// Set attributes for jcarousel
- $mAttribs['id'] = 'carousel';
+ $mAttribs['id'] = 'carousel';
$mAttribs['class'] = 'jcarousel-skin-smw';
+
+ // Aoid js loading issues by not displaying anything
until js is able to do so
$mAttribs['style'] = 'display:none;';
+
+ // Horizontal or vertical orientation
+ $mAttribs['orientation'] = 'horizontal';
+
+ // Whether to wrap at the first/last item (or both) and
jump back to the start/end
+ $mAttribs['wrap'] = 'both';
+
+ // Use perrow parameter to determine the scroll
sequence
+ if( empty($this->m_params['perrow']) ){
+ $mAttribs['scroll'] = 1; // default 1
+ }else{
+ $mAttribs['scroll'] = $this->m_params['perrow'];
+ $mAttribs['visible'] =
$this->m_params['perrow'];
+ }
+
$ig->setAttributes( $mAttribs );
-
- // Require the javascript
+
+ // Load javascript module
SMWOutputs::requireResource( 'ext.srf.jcarousel' );
}
-
+
// In case galleryformat = carousel, perrow should not be set
if ( $this->m_params['perrow'] !== '' &&
$this->m_params['galleryformat'] !== 'carousel' ) {
$ig->setPerRow( $this->m_params['perrow'] );
@@ -177,7 +195,7 @@
$ig->add( $imgTitle, $imgCaption );
// Only add real images (bug #5586)
- if ( $imgTitle->getNamespace() == NS_IMAGE &&
!$imgTitle->getDBkey() == null ) {
+ if ( $imgTitle->getNamespace() == NS_IMAGE &&
!is_null($imgTitle->getDBkey()) ) {
$wgParser->mOutput->addImage( $imgTitle->getDBkey() );
}
}
@@ -193,6 +211,7 @@
$params = parent::getParameters();
if ( defined( 'MW_SUPPORTS_RESOURCE_MODULES' ) ) {
+ // Since 1.7.1
$params['galleryformat'] = new Parameter(
'galleryformat', Parameter::TYPE_STRING, '' );
$params['galleryformat']->setMessage(
'srf_paramdesc_galleryformat' );
$params['galleryformat']->addCriteria( new
CriterionInArray( 'carousel' ) );
Modified:
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.css
===================================================================
---
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.css
2012-02-23 13:14:48 UTC (rev 112200)
+++
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.css
2012-02-23 13:16:05 UTC (rev 112201)
@@ -1,228 +1,268 @@
-/**
+/**
* Adopted .jcarousel-skin-tango css for SRF Gallery Carousel module
*
* @licence: GNU GPL v3 or later
* @author: mwjames and others
*
- * @release: 0.1
+ * @release: 0.1.2
*/
.jcarousel-skin-smw .jcarousel-container {
- background: #ffffff;
- border: 1px solid #eee;
+ background: #ffffff;
}
.jcarousel-skin-smw .jcarousel-direction-rtl {
direction: rtl;
}
+.jcarousel-list .jcarousel-list-horizontal {
+ margin-left:20px;
+}
+
.jcarousel-skin-smw .jcarousel-container-horizontal {
- width: 99.6%;
- padding: 0px 1px;
+ width: 99.6%;
+ padding: 0px 1px;
+ margin-bottom:10px;
+ border: 1px solid #eee;
+
}
.jcarousel-skin-smw .jcarousel-container-vertical {
- width: 175px;
- height: 345px;
- padding: 40px 20px;
+ width: 155px;
+ height: 365px;
+ padding: 23px 15px;
+ margin-left:10px;
+ margin-bottom:10px;
+ border: 1px solid #eee;
+ float:right;
}
.jcarousel-skin-smw .jcarousel-clip {
- overflow: hidden;
+ overflow: hidden;
}
.jcarousel-skin-smw .jcarousel-clip-horizontal {
- width: 97%;
- height: auto;
+ width: 97%;
+ height: auto;
}
.jcarousel-skin-smw .jcarousel-clip-vertical {
- width: 175px;
- height: 345px;
+ width: 160px;
+ height: 355px;
}
.jcarousel-skin-smw .jcarousel-item {
- width: auto;
- height: auto;
+ width: auto;
+ height: auto;
}
.jcarousel-skin-smw .jcarousel-item-horizontal {
margin-left: 23px;
- margin-right: 0px;
+ margin-right: 0px;
+ margin-top: 4px;
}
.jcarousel-skin-smw .jcarousel-direction-rtl .jcarousel-item-horizontal {
- margin-left: 10px;
- margin-right: 0;
+ margin-left: 0px;
+ margin-right: 23px;
}
.jcarousel-skin-smw .jcarousel-item-vertical {
- margin-bottom: 10px;
+ margin-bottom: 10px;
}
.jcarousel-skin-smw .jcarousel-item-placeholder {
- background: #fff;
- color: #000;
+ background: #fff;
+ color: #000;
}
/**
* Horizontal Buttons
*/
.jcarousel-skin-smw .jcarousel-next-horizontal {
- position: absolute;
- top: -1px;
- right: -1px;
- width: 32px;
- height: 32px;
- cursor: pointer;
- background: transparent url(images/next-horizontal.png) no-repeat 0 0;
- background-size:7px 11px;
+ position: absolute;
+ top: -1px;
+ right: -1px;
+ width: 32px;
+ height: 32px;
+ cursor: pointer;
+ background: transparent url(images/next-horizontal.png) no-repeat 0 0;
+ background-size:7px 11px;
}
.jcarousel-skin-smw .jcarousel-direction-rtl .jcarousel-next-horizontal {
- left: 5px;
- right: auto;
- background-image: url(images/next-horizontal.png);
+ left: -1px;
+ right: auto;
+ background-image: url(images/next-horizontal.png);
}
.jcarousel-skin-smw .jcarousel-next-horizontal:hover,
.jcarousel-skin-smw .jcarousel-next-horizontal:focus {
- background-position: -32px 0;
+ background-position: -32px 0;
}
.jcarousel-skin-smw .jcarousel-next-horizontal:active {
- background-position: -64px 0;
+ background-position: -64px 0;
}
.jcarousel-skin-smw .jcarousel-next-disabled-horizontal,
.jcarousel-skin-smw .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-smw .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-smw .jcarousel-next-disabled-horizontal:active {
- cursor: default;
- background-position: -96px 0;
+ cursor: default;
+ background-position: -96px 0;
}
.jcarousel-skin-smw .jcarousel-prev-horizontal {
- position: absolute;
- top: -1px;
- left: -1px;
- width: 32px;
- height: 32px;
- cursor: pointer;
- background: transparent url(images/prev-horizontal.png) no-repeat 0 0;
- background-size:7px 11px;
+ position: absolute;
+ top: -1px;
+ left: -1px;
+ width: 32px;
+ height: 32px;
+ cursor: pointer;
+ background: transparent url(images/prev-horizontal.png) no-repeat 0 0;
+ background-size:7px 11px;
}
.jcarousel-skin-smw .jcarousel-direction-rtl .jcarousel-prev-horizontal {
- left: auto;
- right: 5px;
- background-image: url(images/prev-horizontal.png);
+ left: auto;
+ right: -1px;
+ background-image: url(images/prev-horizontal.png);
}
.jcarousel-skin-smw .jcarousel-prev-horizontal:hover,
.jcarousel-skin-smw .jcarousel-prev-horizontal:focus {
- background-position: -32px 0;
+ background-position: -32px 0;
}
.jcarousel-skin-smw .jcarousel-prev-horizontal:active {
- background-position: -64px 0;
+ background-position: -64px 0;
}
.jcarousel-skin-smw .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-smw .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-smw .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-smw .jcarousel-prev-disabled-horizontal:active {
- cursor: default;
- background-position: -96px 0;
+ cursor: default;
+ background-position: -96px 0;
}
-.jcarousel-skin-smw .jcarousel-next-horizontal, .jcarousel-skin-smw
.jcarousel-prev-horizontal {
- background-color: whiteSmoke;
- background-position: center;
- background-repeat: no-repeat;
- border: 1px solid gainsboro;
- color: #7B7B7B;
- cursor: pointer;
- font-size: 24px;
- font-weight: bold;
- height: 100%;
- line-height: 216px;
- text-align: center;
- text-decoration: none;
- position: absolute;
- width: 23px;
-
- border-radius: 2px 0 0 2px;
- -moz-border-radius: 2px 0 0 2px;
- -webkit-border-radius: 2px 0 0 2px;
-
+.jcarousel-skin-smw .jcarousel-next-horizontal,
+.jcarousel-skin-smw .jcarousel-prev-horizontal {
+ background-color: whiteSmoke;
+ background-position: center;
+ background-repeat: no-repeat;
+ border: 1px solid gainsboro;
+ color: #7B7B7B;
+ cursor: pointer;
+ font-size: 24px;
+ font-weight: bold;
+ height: 100%;
+ line-height: 216px;
+ text-align: center;
+ text-decoration: none;
+ position: absolute;
+ width: 23px;
+ border-radius: 2px 0 0 2px;
+ -moz-border-radius: 2px 0 0 2px;
+ -webkit-border-radius: 2px 0 0 2px;
}
-.jcarousel-skin-smw .jcarousel-next-horizontal:hover, .jcarousel-skin-smw
.jcarousel-prev-horizontal:hover {
- background-color: #F8F8F8;
- border-color: #D6D6D6;
- box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.1);
- color: #4B4B4B;
- text-decoration: none;
+.jcarousel-skin-smw .jcarousel-next-horizontal:hover,
+.jcarousel-skin-smw .jcarousel-prev-horizontal:hover {
+ background-color: #F8F8F8;
+ border-color: #D6D6D6;
+ box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.1);
+ color: #4B4B4B;
+ text-decoration: none;
}
/**
* Vertical Buttons
*/
.jcarousel-skin-smw .jcarousel-next-vertical {
- position: absolute;
- bottom: 5px;
- left: 43px;
- width: 32px;
- height: 32px;
- cursor: pointer;
- background: transparent url(images/next-vertical.png) no-repeat 0 0;
+ position: absolute;
+ bottom: -1px;
+ left: -1px;
+ width: 32px;
+ height: 32px;
+ cursor: pointer;
+ background: transparent url(images/next-vertical.png) no-repeat 0 0;
+ background-size:11px 7px;
+
}
.jcarousel-skin-smw .jcarousel-next-vertical:hover,
.jcarousel-skin-smw .jcarousel-next-vertical:focus {
- background-position: 0 -32px;
+ background-position: 0 -32px;
}
.jcarousel-skin-smw .jcarousel-next-vertical:active {
- background-position: 0 -64px;
+ background-position: 0 -64px;
}
.jcarousel-skin-smw .jcarousel-next-disabled-vertical,
.jcarousel-skin-smw .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-smw .jcarousel-next-disabled-vertical:focus,
.jcarousel-skin-smw .jcarousel-next-disabled-vertical:active {
- cursor: default;
- background-position: 0 -96px;
+ cursor: default;
+ background-position: 0 -96px;
}
.jcarousel-skin-smw .jcarousel-prev-vertical {
- position: absolute;
- top: 5px;
- left: 43px;
- width: 32px;
- height: 32px;
- cursor: pointer;
- background: transparent url(images/prev-vertical.png) no-repeat 0 0;
+ position: absolute;
+ top: -1px;
+ left: -1px;
+ width: 32px;
+ height: 32px;
+ cursor: pointer;
+ background: transparent url(images/prev-vertical.png) no-repeat 0 0;
+ background-size:11px 7px;
}
.jcarousel-skin-smw .jcarousel-prev-vertical:hover,
.jcarousel-skin-smw .jcarousel-prev-vertical:focus {
- background-position: 0 -32px;
+ background-position: 0 -32px;
}
.jcarousel-skin-smw .jcarousel-prev-vertical:active {
- background-position: 0 -64px;
+ background-position: 0 -64px;
}
.jcarousel-skin-smw .jcarousel-prev-disabled-vertical,
.jcarousel-skin-smw .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-smw .jcarousel-prev-disabled-vertical:focus,
.jcarousel-skin-smw .jcarousel-prev-disabled-vertical:active {
- cursor: default;
- background-position: 0 -96px;
+ cursor: default;
+ background-position: 0 -96px;
}
-.jcarousel-list .jcarousel-list-horizontal {
- margin-left:20px;
-}
+.jcarousel-skin-smw .jcarousel-next-vertical,
+.jcarousel-skin-smw .jcarousel-prev-vertical {
+ background-color: whiteSmoke;
+ background-position: center;
+ background-repeat: no-repeat;
+ border: 1px solid gainsboro;
+ color: #7B7B7B;
+ cursor: pointer;
+ font-size: 24px;
+ font-weight: bold;
+ width: 100%;
+ line-height: 216px;
+ text-align: center;
+ text-decoration: none;
+ position: absolute;
+ height: 23px;
+ border-radius: 2px 0 0 2px;
+ -moz-border-radius: 2px 0 0 2px;
+ -webkit-border-radius: 2px 0 0 2px;
+}
+
+.jcarousel-skin-smw .jcarousel-next-vertical:hover,
+.jcarousel-skin-smw .jcarousel-prev-vertical:hover {
+ background-color: #F8F8F8;
+ border-color: #D6D6D6;
+ box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.1);
+ color: #4B4B4B;
+ text-decoration: none;
+}
\ No newline at end of file
Modified:
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.js
===================================================================
---
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.js
2012-02-23 13:14:48 UTC (rev 112200)
+++
trunk/extensions/SemanticResultFormats/Gallery/resources/ext.srf.jcarousel.js
2012-02-23 13:16:05 UTC (rev 112201)
@@ -11,12 +11,24 @@
$( document ).ready( function() {
+ var v_visible = parseInt($( '#carousel' ).attr( 'visible' ) ),
+ v_scroll = parseInt($( '#carousel' ).attr( 'scroll' ) ),
+ v_directionality = $( '#carousel' ).attr( 'directionality' ),
+ v_orientation = $( '#carousel' ).attr( 'orientation' ),
+ v_wrap = $( '#carousel' ).attr( 'wrap' ),
+ v_vertical = v_orientation === 'vertical',
+ v_rtl = v_directionality === 'rtl';
+
// Display carousel only after js is loaded and ready otherwise
display=none
$( '#carousel').show();
// Call the jcarousel plug-in
$( '#carousel' ).jcarousel( {
- wrap: 'circular'
+ scroll: v_scroll, // Number of items to be scrolled
+ visible: v_visible, // calculated and set visible
elements
+ wrap: 'circular', // Whether to wrap at the first/last item
(Options are "first", "last", "both" or "circular")
+ vertical: v_vertical, // Whether the carousel appears in
horizontal or vertical orientation
+ rtl: v_rtl // Directionality
} );
} );
_______________________________________________
MediaWiki-CVS mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-cvs
