Revision 2a3b0c8e
Added by Andreas Kohlbecker about 7 years ago
modules/cdm_dataportal/includes/media.inc | ||
---|---|---|
216 | 216 |
// Returned value. |
217 | 217 |
return $metadata_caption; |
218 | 218 |
} |
219 |
|
|
220 |
|
|
221 |
/** |
|
222 |
* Return HTML for a media gallery |
|
223 |
* |
|
224 |
* @param array $configuration |
|
225 |
* An associative array containing: |
|
226 |
* - mediaList: An array of Media entities. |
|
227 |
* - maxExtend |
|
228 |
* - cols |
|
229 |
* - maxRows |
|
230 |
* - showCaption: boolean value, whether to show captions or not. |
|
231 |
* - captionElements: An array of caption elements to be shown. In case the array |
|
232 |
* is empty of NULL all available caption elements will be show. In order to |
|
233 |
* supress all captions set 'showCaption' to FALSE |
|
234 |
* example: |
|
235 |
* 1) Show 'title', 'description', 'file', 'filename' in the caption: |
|
236 |
* array('title', 'description', 'file', 'filename'), |
|
237 |
* 2) To add an addtional link at the bottom of the caption: |
|
238 |
* array('titlecache', '#uri'=>t('Open Image')) this will cause a link |
|
239 |
* to be rendered with label 'Open image' which will open the according |
|
240 |
* media object. |
|
241 |
* - mediaLinkType: Valid values: |
|
242 |
* - "NONE": do not link the images, |
|
243 |
* - "LIGHTBOX": open the link in a light box, |
|
244 |
* - "NORMAL": link to the image page or to the $alternativeMediaUri if |
|
245 |
* it is defined. |
|
246 |
* - alternativeMediaUri: A fix string or an array of alternative URIs to link the images |
|
247 |
* which will overwrite the URIs of the media parts. |
|
248 |
* The order of URI in this array must correspond with the order of |
|
249 |
* images in $mediaList. |
|
250 |
* - galleryLinkUri: An URI to link the the hint on more images to; |
|
251 |
* if NULL no link is created. |
|
252 |
* |
|
253 |
* @return array |
|
254 |
* A render array for the image gallery |
|
255 |
* @ingroup: compose |
|
256 |
*/ |
|
257 |
function compose_cdm_media_gallerie($configuration) { |
|
258 |
|
|
259 |
$mediaList = $configuration['mediaList']; |
|
260 |
|
|
261 |
// Do not show an empty gallery. |
|
262 |
if (count($mediaList) == 0) { |
|
263 |
return ''; |
|
264 |
} |
|
265 |
|
|
266 |
// merge with default |
|
267 |
$configuration = array_merge( |
|
268 |
array( |
|
269 |
'mediaList' => NULL, |
|
270 |
'galleryName' => NULL, |
|
271 |
'maxExtend' => 150, |
|
272 |
'cols' => 4, |
|
273 |
'maxRows' => FALSE, |
|
274 |
'captionElements' => array('title'), |
|
275 |
'mediaLinkType' => 'LIGHTBOX', |
|
276 |
'alternativeMediaUri' => NULL, |
|
277 |
'galleryLinkUri' => NULL, |
|
278 |
'showCaption' => TRUE, |
|
279 |
), |
|
280 |
$configuration); |
|
281 |
|
|
282 |
$galleryName = $configuration['galleryName']; |
|
283 |
$maxExtend = $configuration['maxExtend']; |
|
284 |
$cols = $configuration['cols']; |
|
285 |
$maxRows = $configuration['maxRows']; |
|
286 |
$captionElements = $configuration['captionElements']; |
|
287 |
$mediaLinkType = $configuration['mediaLinkType']; |
|
288 |
$alternativeMediaUri = $configuration['alternativeMediaUri']; |
|
289 |
$galleryLinkUri = $configuration['galleryLinkUri']; |
|
290 |
$showCaption = $configuration['showCaption']; |
|
291 |
|
|
292 |
$caption_link_uri = ''; |
|
293 |
if(isset($captionElements['#uri'])){ |
|
294 |
$caption_link_uri = $captionElements['#uri']; |
|
295 |
unset($captionElements['#uri']); |
|
296 |
} |
|
297 |
if (!is_array($captionElements) || count($captionElements) == 0) { |
|
298 |
$captionElements = NULL; |
|
299 |
} |
|
300 |
|
|
301 |
// TODO correctly handle multiple media representation parts |
|
302 |
$_SESSION['cdm']['last_gallery'] = current_path(); |
|
303 |
// Prevent from errors. |
|
304 |
if (!isset($mediaList[0])) { |
|
305 |
// return; |
|
306 |
} |
|
307 |
|
|
308 |
// --- Duplicate supression: media can be reused but should only be shown |
|
309 |
// once. |
|
310 |
$tempMediaList = array(); |
|
311 |
$tempMediaUuids = array(); |
|
312 |
foreach ($mediaList as $media) { |
|
313 |
if (!in_array($media->uuid, $tempMediaUuids)) { |
|
314 |
$tempMediaList[] = $media; |
|
315 |
$tempMediaUuids[] = $media->uuid; |
|
316 |
} |
|
317 |
} |
|
318 |
$mediaList = $tempMediaList; |
|
319 |
|
|
320 |
// --- |
|
321 |
$galleryID = "media_gallery_" . $galleryName; |
|
322 |
|
|
323 |
$mediaPartLinkAttributes = array(); |
|
324 |
$openMediaLinkAttributes = array(); |
|
325 |
|
|
326 |
// Prepare media links. |
|
327 |
$doLink = FALSE; |
|
328 |
if ($mediaLinkType != 'NONE') { |
|
329 |
$doLink = TRUE; |
|
330 |
} |
|
331 |
if ($mediaLinkType == 'LIGHTBOX') { |
|
332 |
$doLink = TRUE; |
|
333 |
_add_js_lightbox($galleryID); |
|
334 |
} |
|
335 |
|
|
336 |
// Render the media gallery grid. |
|
337 |
$out = '<table id="' . $galleryID . '" class="media_gallery">'; |
|
338 |
$out .= '<colgroup>'; |
|
339 |
for ($c = 0; $c < $cols; $c++) { |
|
340 |
$out .= '<col style="width:' . (100 / $cols) . '%;">'; |
|
341 |
} |
|
342 |
$out .= '</colgroup>'; |
|
343 |
|
|
344 |
for ($r = 0; ($r < $maxRows || !$maxRows) && count($mediaList) > 0; $r++) { |
|
345 |
$captionParts = array(); |
|
346 |
$mediaIndex = 0; |
|
347 |
$out .= '<tr>'; |
|
348 |
for ($c = 0; $c < $cols; $c++) { |
|
349 |
$media = array_shift($mediaList); |
|
350 |
|
|
351 |
if (isset($media->representations[0]->parts[0])) { |
|
352 |
|
|
353 |
// |
|
354 |
// Find preferred representation. |
|
355 |
// |
|
356 |
$preferred_media_representations_list = cdm_preferred_media_representations($media, array( |
|
357 |
'image/jpg', |
|
358 |
'image/jpeg', |
|
359 |
'image/png', |
|
360 |
'image/gif', |
|
361 |
), $maxExtend, $maxExtend); |
|
362 |
if (count($preferred_media_representations_list) == 0) { |
|
363 |
// Fallback to using the first one in the list. |
|
364 |
$preferred_media_representations_list = $media->representations; |
|
365 |
} |
|
366 |
$preferred_media_representation = array_shift($preferred_media_representations_list); |
|
367 |
|
|
368 |
// $preferred_media_representation->parts[0]->uri = |
|
369 |
// "http://127.0.0.1/images/palmae/palm_tc_14415_1.jpg"; |
|
370 |
$contentTypeDirectory = media_content_type_dir($preferred_media_representation, 'application'); |
|
371 |
|
|
372 |
$mediaPartHtml = call_user_func_array( |
|
373 |
'cdm_media_gallerie_' . $contentTypeDirectory, |
|
374 |
array( $preferred_media_representation->parts[0], $maxExtend, TRUE) |
|
375 |
); |
|
376 |
// --- Compose Media Link. |
|
377 |
$mediaLinkUri = FALSE; |
|
378 |
if ($alternativeMediaUri) { |
|
379 |
if (isset($alternativeMediaUri[$mediaIndex])) { |
|
380 |
$mediaLinkUri = $alternativeMediaUri[$mediaIndex]; |
|
381 |
} |
|
382 |
if (is_string($alternativeMediaUri)) { |
|
383 |
$mediaLinkUri = $alternativeMediaUri; |
|
384 |
} |
|
385 |
} |
|
386 |
else { |
|
387 |
$mediaLinkUri = $preferred_media_representation->parts[0]->uri; |
|
388 |
} |
|
389 |
$mediaIndex++; |
|
390 |
|
|
391 |
// media captions will be loaded via AHAH |
|
392 |
_add_js_ahah(); |
|
393 |
$content_url = cdm_compose_url(CDM_WS_PORTAL_MEDIA, $media->uuid); |
|
394 |
$cdm_proxy_url_caption = url('cdm_api/proxy/' . urlencode($content_url) . "/cdm_media_caption/" . serialize($captionElements)); |
|
395 |
$ahah_media_caption = '<div class="ahah-content" data-cdm-ahah-url="' . $cdm_proxy_url_caption . '">' |
|
396 |
. '<span class="loading" style="display: none;">' . loading_image_html() . '</span></div>'; |
|
397 |
|
|
398 |
// preparing the part link (= click on image iteself) which can be handled in two ways |
|
399 |
// |
|
400 |
// 1. open image in lightbox, the captions in the lighhtbox will be loaded via AHAH |
|
401 |
// 2. open the media in a new window with target 'specimen' |
|
402 |
if ($mediaLinkType == 'LIGHTBOX' && $contentTypeDirectory == 'image') { |
|
403 |
$mediaPartLinkAttributes['class'] = array('lightbox'); |
|
404 |
} |
|
405 |
else { |
|
406 |
$mediaPartLinkAttributes['target'] = "specimen"; |
|
407 |
$openMediaLinkAttributes['target'] = "specimen"; |
|
408 |
} |
|
409 |
$mediaPartLinkAttributes['alt'] = htmlentities($ahah_media_caption); |
|
410 |
|
|
411 |
// --- preparing the media caption |
|
412 |
|
|
413 |
/* old comment: "no caption elements to show up here except the $caption_link_uri, if at all" |
|
414 |
* |
|
415 |
* a.kohlbecker 2013-03-14 : |
|
416 |
* It is unclear why no caption elements should be shown, Was it a technical reason? |
|
417 |
* see commit r16723 740177eb-a1d8-4ec3-a630-accd905eb3da |
|
418 |
* If not problems arise with this remove it after some weeks |
|
419 |
*/ |
|
420 |
$captionPartHtml = $ahah_media_caption; |
|
421 |
|
|
422 |
if ($caption_link_uri) { |
|
423 |
if ($contentTypeDirectory == 'image') { |
|
424 |
// it is an image, so open it in the media page |
|
425 |
$captionPartHtml .= '<div class="media-caption-link">' . l($caption_link_uri, path_to_media($media->uuid), array( |
|
426 |
'attributes' => array(), 'html' => TRUE, |
|
427 |
)) . '</div>'; |
|
428 |
} |
|
429 |
else { |
|
430 |
// otherwise open it directly and let the the browser handle the media type |
|
431 |
$openMediaLinkAttributes['absolute'] = TRUE; |
|
432 |
$captionPartHtml .= '<div class="media-caption-link">' . l($caption_link_uri, $mediaLinkUri, array( |
|
433 |
'attributes' => $openMediaLinkAttributes, 'html' => TRUE, |
|
434 |
)) . '</div>'; |
|
435 |
} |
|
436 |
} |
|
437 |
|
|
438 |
$captionParts[] = $captionPartHtml; |
|
439 |
|
|
440 |
// --- Surround imagePart with link, this . |
|
441 |
if ($doLink) { |
|
442 |
$mediaPartHtml = l($mediaPartHtml, $mediaLinkUri, array( |
|
443 |
'attributes' => $mediaPartLinkAttributes, 'html' => TRUE, |
|
444 |
)); |
|
445 |
} |
|
446 |
} |
|
447 |
else { |
|
448 |
$mediaPartHtml = ''; |
|
449 |
$captionParts[] = ''; |
|
450 |
} |
|
451 |
$out .= '<td class="media">' . $mediaPartHtml . '</td>'; |
|
452 |
} |
|
453 |
$out .= '</tr>'; // End of media parts. |
|
454 |
if ($showCaption) { |
|
455 |
if ( (is_array($captionElements) && count($captionElements) > 0) || $caption_link_uri) { |
|
456 |
$out .= '<tr>'; |
|
457 |
// Add caption row. |
|
458 |
foreach ($captionParts as $captionPartHtml) { |
|
459 |
$out .= '<td class="caption">' . $captionPartHtml . '</td>'; |
|
460 |
} |
|
461 |
$out .= '</tr>'; |
|
462 |
} |
|
463 |
} |
|
464 |
} |
|
465 |
|
|
466 |
if ($galleryLinkUri) { |
|
467 |
if (count($mediaList) > 0) { |
|
468 |
$moreHtml = count($mediaList) . ' ' . t('more in gallery'); |
|
469 |
} |
|
470 |
else { |
|
471 |
$moreHtml = t('open gallery'); |
|
472 |
} |
|
473 |
$moreHtml = l($moreHtml, $galleryLinkUri); |
|
474 |
$out .= '<tr><td colspan="' . $cols . '">' . $moreHtml . '</td></tr>'; |
|
475 |
} |
|
476 |
$out .= '</table>'; |
|
477 |
return $out; |
|
478 |
} |
|
479 |
|
|
480 |
/** |
|
481 |
* Creates markup for a CDM MediaRepresentation which is referencing an image. |
|
482 |
* |
|
483 |
* @param $mediaRepresentationPart |
|
484 |
* @param $maxExtend |
|
485 |
* @param $addPassePartout |
|
486 |
* @param $attributes |
|
487 |
* @return string |
|
488 |
* The markup for the media representation |
|
489 |
*/ |
|
490 |
function cdm_media_gallerie_image($mediaRepresentationPart, $maxExtend, $addPassePartout, $attributes = array()) { |
|
491 |
|
|
492 |
$out = ''; |
|
493 |
|
|
494 |
// TODO merge with theme_cdm_media_mime_image? |
|
495 |
if (isset($mediaRepresentationPart)) { |
|
496 |
|
|
497 |
$h = $mediaRepresentationPart->height; |
|
498 |
$w = $mediaRepresentationPart->width; |
|
499 |
if ($w == 0 || $h == 0) { |
|
500 |
// Take url and replace spaces. |
|
501 |
$image_uri = str_replace(' ', '%20', $mediaRepresentationPart->uri); |
|
502 |
$imageDimensions = getimagesize_remote($image_uri); |
|
503 |
if (!$imageDimensions) { |
|
504 |
return '<div>' . t('Image unavailable, uri: ') . $mediaRepresentationPart->uri . '</div>'; |
|
505 |
} |
|
506 |
$w = $imageDimensions[0]; |
|
507 |
$h = $imageDimensions[1]; |
|
508 |
} |
|
509 |
|
|
510 |
$ratio = $w / $h; |
|
511 |
if ($ratio > 1) { |
|
512 |
$displayHeight = round($maxExtend / $ratio); |
|
513 |
$displayWidth = $maxExtend; |
|
514 |
$m = round(($maxExtend - $displayHeight) / 2); |
|
515 |
$margins = 'margin:' . $m . 'px 0 ' . $m . 'px 0;'; |
|
516 |
} |
|
517 |
else { |
|
518 |
$displayHeight = $maxExtend; |
|
519 |
$displayWidth = round($maxExtend * $ratio); |
|
520 |
$m = round(($maxExtend - $displayWidth) / 2); |
|
521 |
$margins = 'margin:0 ' . $m . 'px 0 ' . $m . 'px;'; |
|
522 |
} |
|
523 |
|
|
524 |
// Turn attributes array into string. |
|
525 |
if(!is_array($attributes)){ |
|
526 |
$attributes = array(); |
|
527 |
} |
|
528 |
if(!isset($attributes['alt'])){ |
|
529 |
$attributes['alt'] = check_plain($mediaRepresentationPart->uri); |
|
530 |
} |
|
531 |
$attrStr = ' '; |
|
532 |
// $attributes['title'] = 'h:'.$h.', w:'.$w.',ratio:'.$ratio; |
|
533 |
if (is_array($attributes)) { |
|
534 |
foreach ($attributes as $name => $value) { |
|
535 |
$attrStr .= $name . '="' . $value . '" '; |
|
536 |
} |
|
537 |
} |
|
538 |
|
|
539 |
if ($addPassePartout) { |
|
540 |
$out .= '<div class="image-passe-partout" style="width:' . $maxExtend . 'px; height:' . $maxExtend . 'px;">'; |
|
541 |
} |
|
542 |
else { |
|
543 |
// Do not add margins if no pass partout is shown. |
|
544 |
$margins = ''; |
|
545 |
} |
|
546 |
$out .= '<img src="' . $mediaRepresentationPart->uri . '" width="' . $displayWidth . '" height="' . $displayHeight . '" style="' . $margins . '"' . $attrStr . ' />'; |
|
547 |
|
|
548 |
if ($addPassePartout) { |
|
549 |
$out .= '</div>'; |
|
550 |
} |
|
551 |
} |
|
552 |
|
|
553 |
return $out; |
|
554 |
} |
|
555 |
|
|
556 |
/** |
|
557 |
* Creates markup for a CDM MediaRepresentation which is referencing an web application. |
|
558 |
* |
|
559 |
* @param $mediaRepresentationPart |
|
560 |
* @param $maxExtend |
|
561 |
* @param $addPassePartout |
|
562 |
* @param $attributes |
|
563 |
* @return string |
|
564 |
* The markup for the media representation |
|
565 |
*/ |
|
566 |
function cdm_media_gallerie_application($mediaRepresentationPart, $maxExtend, $addPassePartout, $attributes = array()) { |
|
567 |
|
|
568 |
$out = ''; |
|
569 |
|
|
570 |
if (isset($mediaRepresentationPart)) { |
|
571 |
|
|
572 |
if ($addPassePartout) { |
|
573 |
$out .= '<div class="image-passe-partout" style="width:' . $maxExtend . 'px; height:' . $maxExtend . 'px;">'; |
|
574 |
} |
|
575 |
$out .= '<div class="application">Web Application</div>'; |
|
576 |
|
|
577 |
if ($addPassePartout) { |
|
578 |
$out .= '</div>'; |
|
579 |
} |
|
580 |
} |
|
581 |
|
|
582 |
return $out; |
|
583 |
} |
|
584 |
|
|
585 |
/** |
|
586 |
* Creates markup for a CDM MediaRepresentation which is referencing an web application. |
|
587 |
* |
|
588 |
* @param $mediaRepresentationPart |
|
589 |
* @param $maxExtend |
|
590 |
* @param $addPassePartout |
|
591 |
* @param $attributes |
|
592 |
* @return string |
|
593 |
* The markup for the media representation |
|
594 |
*/ |
|
595 |
function cdm_media_gallerie_text($mediaRepresentationPart, $maxExtend, $addPassePartout, $attributes = array()) { |
|
596 |
|
|
597 |
$out = ''; |
|
598 |
|
|
599 |
if (isset($mediaRepresentationPart)) { |
|
600 |
if ($addPassePartout) { |
|
601 |
$out .= '<div class="image-passe-partout" style="width:' . $maxExtend . 'px; height:' . $maxExtend . 'px;">'; |
|
602 |
} |
|
603 |
|
|
604 |
$out .= '<div class="application">Web Application</div>'; |
|
605 |
|
|
606 |
if ($addPassePartout) { |
|
607 |
$out .= '</div>'; |
|
608 |
} |
|
609 |
} |
|
610 |
|
|
611 |
return $out; |
|
612 |
} |
|
613 |
|
|
614 |
/** |
|
615 |
* Adds the OpenLayers based image viewer to the page. |
|
616 |
* |
|
617 |
* The OpenLayers based image viewer allows to zoom and pan the displayed image. |
|
618 |
* |
|
619 |
* Documentation related to using Openlayers in order to view images is found here: |
|
620 |
* - @see http://trac.openlayers.org/wiki/UsingCustomTiles#UsingTilesWithoutaProjection |
|
621 |
* - @see http://trac.openlayers.org/wiki/SettingZoomLevels |
|
622 |
* |
|
623 |
* @param array $variables |
|
624 |
* An associative array of theme variables: |
|
625 |
* - mediaRepresentationPart: The CDM MediaRepresentationPart instance to be displayed. |
|
626 |
* - maxExtend: The maximum extend of the image viewer view port. |
|
627 |
*/ |
|
628 |
function cdm_openlayers_image($mediaRepresentationPart, $maxExtend) { |
|
629 |
|
|
630 |
_add_js_openlayers(); |
|
631 |
|
|
632 |
// TODO merge code below with code from theme_cdm_media_gallerie_image |
|
633 |
// var_dump("MEDIA URI: " . $mediaRepresentationPart->uri); |
|
634 |
// TODO merge code below with code from theme_cdm_media_gallerie_image |
|
635 |
$w = $mediaRepresentationPart->width; |
|
636 |
$h = $mediaRepresentationPart->height; |
|
637 |
|
|
638 |
if ($w == 0 || $h == 0) { |
|
639 |
// Take url and replace spaces. |
|
640 |
$image_uri = str_replace(' ', '%20', $mediaRepresentationPart->uri); |
|
641 |
$imageDimensions = getimagesize_remote($image_uri); |
|
642 |
if (!$imageDimensions) { |
|
643 |
return '<div>' . t('Image unavailable, uri:') . $mediaRepresentationPart->uri . '</div>'; |
|
644 |
} |
|
645 |
$w = $imageDimensions[0]; |
|
646 |
$h = $imageDimensions[1]; |
|
647 |
} |
|
648 |
|
|
649 |
// Calculate maxResolution |
|
650 |
if ($w > $h) { |
|
651 |
$maxRes = $w / $maxExtend; |
|
652 |
} |
|
653 |
else { |
|
654 |
$maxRes = $h / $maxExtend; |
|
655 |
} |
|
656 |
|
|
657 |
$maxRes *= 1; |
|
658 |
|
|
659 |
drupal_add_js(' |
|
660 |
var map; |
|
661 |
|
|
662 |
var imageLayerOptions={ |
|
663 |
maxResolution: ' . $maxRes . ', |
|
664 |
maxExtent: new OpenLayers.Bounds(0, 0, ' . $w . ', ' . $h . ') |
|
665 |
}; |
|
666 |
var mapOptions={ |
|
667 |
controls: |
|
668 |
[ |
|
669 |
new OpenLayers.Control.PanZoom(), |
|
670 |
new OpenLayers.Control.Navigation({zoomWheelEnabled: false, handleRightClicks:true, zoomBoxKeyMask: OpenLayers.Handler.MOD_CTRL}) |
|
671 |
], |
|
672 |
restrictedExtent: new OpenLayers.Bounds(0, 0, ' . $w . ', ' . $h . ') |
|
673 |
}; |
|
674 |
|
|
675 |
var graphic = new OpenLayers.Layer.Image( |
|
676 |
\'Image Title\', |
|
677 |
\'' . $mediaRepresentationPart->uri . '\', |
|
678 |
new OpenLayers.Bounds(0, 0, ' . $w . ', ' . $h . '), |
|
679 |
new OpenLayers.Size(' . $w . ', ' . $h . '), |
|
680 |
imageLayerOptions |
|
681 |
); |
|
682 |
|
|
683 |
function init() { |
|
684 |
map = new OpenLayers.Map(\'openlayers_image\', mapOptions); |
|
685 |
map.addLayers([graphic]); |
|
686 |
map.setCenter(new OpenLayers.LonLat(0, 0), 1); |
|
687 |
map.zoomToMaxExtent(); |
|
688 |
} |
|
689 |
|
|
690 |
jQuery(document).ready(function(){ |
|
691 |
init(); |
|
692 |
});', array('type' => 'inline')); |
|
693 |
$out = '<div id="openlayers_image" class="image_viewer" style="width: ' . $maxExtend . 'px; height:' . ($maxExtend) . 'px"></div>'; |
|
694 |
return $out; |
|
695 |
} |
modules/cdm_dataportal/theme/cdm_dataportal.media.theme | ||
---|---|---|
271 | 271 |
return $out; |
272 | 272 |
} |
273 | 273 |
|
274 |
/** |
|
275 |
* Return HTML for a media gallery |
|
276 |
* |
|
277 |
* @param array $configuration |
|
278 |
* An associative array containing: |
|
279 |
* - mediaList: An array of Media entities. |
|
280 |
* - maxExtend |
|
281 |
* - cols |
|
282 |
* - maxRows |
|
283 |
* - showCaption: boolean value, whether to show captions or not. |
|
284 |
* - captionElements: An array of caption elements to be shown. In case the array |
|
285 |
* is empty of NULL all available caption elements will be show. In order to |
|
286 |
* supress all captions set 'showCaption' to FALSE |
|
287 |
* example: |
|
288 |
* 1) Show 'title', 'description', 'file', 'filename' in the caption: |
|
289 |
* array('title', 'description', 'file', 'filename'), |
|
290 |
* 2) To add an addtional link at the bottom of the caption: |
|
291 |
* array('titlecache', '#uri'=>t('Open Image')) this will cause a link |
|
292 |
* to be rendered with label 'Open image' which will open the according |
|
293 |
* media object. |
|
294 |
* - mediaLinkType: Valid values: |
|
295 |
* - "NONE": do not link the images, |
|
296 |
* - "LIGHTBOX": open the link in a light box, |
|
297 |
* - "NORMAL": link to the image page or to the $alternativeMediaUri if |
|
298 |
* it is defined. |
|
299 |
* - alternativeMediaUri: A fix string or an array of alternative URIs to link the images |
|
300 |
* which will overwrite the URIs of the media parts. |
|
301 |
* The order of URI in this array must correspond with the order of |
|
302 |
* images in $mediaList. |
|
303 |
* - galleryLinkUri: An URI to link the the hint on more images to; |
|
304 |
* if NULL no link is created. |
|
305 |
* |
|
306 |
* @return array |
|
307 |
* A render array for the image gallery |
|
308 |
* @ingroup: compose |
|
309 |
*/ |
|
310 |
function compose_cdm_media_gallerie($configuration) { |
|
311 |
|
|
312 |
$mediaList = $configuration['mediaList']; |
|
313 |
|
|
314 |
// Do not show an empty gallery. |
|
315 |
if (count($mediaList) == 0) { |
|
316 |
return ''; |
|
317 |
} |
|
318 |
|
|
319 |
// merge with default |
|
320 |
$configuration = array_merge( |
|
321 |
array( |
|
322 |
'mediaList' => NULL, |
|
323 |
'galleryName' => NULL, |
|
324 |
'maxExtend' => 150, |
|
325 |
'cols' => 4, |
|
326 |
'maxRows' => FALSE, |
|
327 |
'captionElements' => array('title'), |
|
328 |
'mediaLinkType' => 'LIGHTBOX', |
|
329 |
'alternativeMediaUri' => NULL, |
|
330 |
'galleryLinkUri' => NULL, |
|
331 |
'showCaption' => TRUE, |
|
332 |
), |
|
333 |
$configuration); |
|
334 |
|
|
335 |
$galleryName = $configuration['galleryName']; |
|
336 |
$maxExtend = $configuration['maxExtend']; |
|
337 |
$cols = $configuration['cols']; |
|
338 |
$maxRows = $configuration['maxRows']; |
|
339 |
$captionElements = $configuration['captionElements']; |
|
340 |
$mediaLinkType = $configuration['mediaLinkType']; |
|
341 |
$alternativeMediaUri = $configuration['alternativeMediaUri']; |
|
342 |
$galleryLinkUri = $configuration['galleryLinkUri']; |
|
343 |
$showCaption = $configuration['showCaption']; |
|
344 |
|
|
345 |
$caption_link_uri = ''; |
|
346 |
if(isset($captionElements['#uri'])){ |
|
347 |
$caption_link_uri = $captionElements['#uri']; |
|
348 |
unset($captionElements['#uri']); |
|
349 |
} |
|
350 |
if (!is_array($captionElements) || count($captionElements) == 0) { |
|
351 |
$captionElements = NULL; |
|
352 |
} |
|
353 |
|
|
354 |
// TODO correctly handle multiple media representation parts |
|
355 |
$_SESSION['cdm']['last_gallery'] = current_path(); |
|
356 |
// Prevent from errors. |
|
357 |
if (!isset($mediaList[0])) { |
|
358 |
// return; |
|
359 |
} |
|
360 |
|
|
361 |
// --- Duplicate supression: media can be reused but should only be shown |
|
362 |
// once. |
|
363 |
$tempMediaList = array(); |
|
364 |
$tempMediaUuids = array(); |
|
365 |
foreach ($mediaList as $media) { |
|
366 |
if (!in_array($media->uuid, $tempMediaUuids)) { |
|
367 |
$tempMediaList[] = $media; |
|
368 |
$tempMediaUuids[] = $media->uuid; |
|
369 |
} |
|
370 |
} |
|
371 |
$mediaList = $tempMediaList; |
|
372 |
|
|
373 |
// --- |
|
374 |
$galleryID = "media_gallery_" . $galleryName; |
|
375 |
|
|
376 |
$mediaPartLinkAttributes = array(); |
|
377 |
$openMediaLinkAttributes = array(); |
|
378 |
|
|
379 |
// Prepare media links. |
|
380 |
$doLink = FALSE; |
|
381 |
if ($mediaLinkType != 'NONE') { |
|
382 |
$doLink = TRUE; |
|
383 |
} |
|
384 |
if ($mediaLinkType == 'LIGHTBOX') { |
|
385 |
$doLink = TRUE; |
|
386 |
_add_js_lightbox($galleryID); |
|
387 |
} |
|
388 |
|
|
389 |
// Render the media gallery grid. |
|
390 |
$out = '<table id="' . $galleryID . '" class="media_gallery">'; |
|
391 |
$out .= '<colgroup>'; |
|
392 |
for ($c = 0; $c < $cols; $c++) { |
|
393 |
$out .= '<col style="width:' . (100 / $cols) . '%;">'; |
|
394 |
} |
|
395 |
$out .= '</colgroup>'; |
|
396 |
|
|
397 |
for ($r = 0; ($r < $maxRows || !$maxRows) && count($mediaList) > 0; $r++) { |
|
398 |
$captionParts = array(); |
|
399 |
$mediaIndex = 0; |
|
400 |
$out .= '<tr>'; |
|
401 |
for ($c = 0; $c < $cols; $c++) { |
|
402 |
$media = array_shift($mediaList); |
|
403 |
|
|
404 |
if (isset($media->representations[0]->parts[0])) { |
|
405 |
|
|
406 |
// |
|
407 |
// Find preferred representation. |
|
408 |
// |
|
409 |
$preferred_media_representations_list = cdm_preferred_media_representations($media, array( |
|
410 |
'image/jpg', |
|
411 |
'image/jpeg', |
|
412 |
'image/png', |
|
413 |
'image/gif', |
|
414 |
), $maxExtend, $maxExtend); |
|
415 |
if (count($preferred_media_representations_list) == 0) { |
|
416 |
// Fallback to using the first one in the list. |
|
417 |
$preferred_media_representations_list = $media->representations; |
|
418 |
} |
|
419 |
$preferred_media_representation = array_shift($preferred_media_representations_list); |
|
420 |
|
|
421 |
// $preferred_media_representation->parts[0]->uri = |
|
422 |
// "http://127.0.0.1/images/palmae/palm_tc_14415_1.jpg"; |
|
423 |
$contentTypeDirectory = media_content_type_dir($preferred_media_representation, 'application'); |
|
424 |
|
|
425 |
$mediaPartHtml = call_user_func_array( |
|
426 |
'cdm_media_gallerie_' . $contentTypeDirectory, |
|
427 |
array( $preferred_media_representation->parts[0], $maxExtend, TRUE) |
|
428 |
); |
|
429 |
// --- Compose Media Link. |
|
430 |
$mediaLinkUri = FALSE; |
|
431 |
if ($alternativeMediaUri) { |
|
432 |
if (isset($alternativeMediaUri[$mediaIndex])) { |
|
433 |
$mediaLinkUri = $alternativeMediaUri[$mediaIndex]; |
|
434 |
} |
|
435 |
if (is_string($alternativeMediaUri)) { |
|
436 |
$mediaLinkUri = $alternativeMediaUri; |
|
437 |
} |
|
438 |
} |
|
439 |
else { |
|
440 |
$mediaLinkUri = $preferred_media_representation->parts[0]->uri; |
|
441 |
} |
|
442 |
$mediaIndex++; |
|
443 |
|
|
444 |
// media captions will be loaded via AHAH |
|
445 |
_add_js_ahah(); |
|
446 |
$content_url = cdm_compose_url(CDM_WS_PORTAL_MEDIA, $media->uuid); |
|
447 |
$cdm_proxy_url_caption = url('cdm_api/proxy/' . urlencode($content_url) . "/cdm_media_caption/" . serialize($captionElements)); |
|
448 |
$ahah_media_caption = '<div class="ahah-content" data-cdm-ahah-url="' . $cdm_proxy_url_caption . '">' |
|
449 |
. '<span class="loading" style="display: none;">' . loading_image_html() . '</span></div>'; |
|
450 |
|
|
451 |
// preparing the part link (= click on image iteself) which can be handled in two ways |
|
452 |
// |
|
453 |
// 1. open image in lightbox, the captions in the lighhtbox will be loaded via AHAH |
|
454 |
// 2. open the media in a new window with target 'specimen' |
|
455 |
if ($mediaLinkType == 'LIGHTBOX' && $contentTypeDirectory == 'image') { |
|
456 |
$mediaPartLinkAttributes['class'] = array('lightbox'); |
|
457 |
} |
|
458 |
else { |
|
459 |
$mediaPartLinkAttributes['target'] = "specimen"; |
|
460 |
$openMediaLinkAttributes['target'] = "specimen"; |
|
461 |
} |
|
462 |
$mediaPartLinkAttributes['alt'] = htmlentities($ahah_media_caption); |
|
463 |
|
|
464 |
// --- preparing the media caption |
|
465 |
|
|
466 |
/* old comment: "no caption elements to show up here except the $caption_link_uri, if at all" |
|
467 |
* |
|
468 |
* a.kohlbecker 2013-03-14 : |
|
469 |
* It is unclear why no caption elements should be shown, Was it a technical reason? |
|
470 |
* see commit r16723 740177eb-a1d8-4ec3-a630-accd905eb3da |
|
471 |
* If not problems arise with this remove it after some weeks |
|
472 |
*/ |
|
473 |
$captionPartHtml = $ahah_media_caption; |
|
474 |
|
|
475 |
if ($caption_link_uri) { |
|
476 |
if ($contentTypeDirectory == 'image') { |
|
477 |
// it is an image, so open it in the media page |
|
478 |
$captionPartHtml .= '<div class="media-caption-link">' . l($caption_link_uri, path_to_media($media->uuid), array( |
|
479 |
'attributes' => array(), 'html' => TRUE, |
|
480 |
)) . '</div>'; |
|
481 |
} |
|
482 |
else { |
|
483 |
// otherwise open it directly and let the the browser handle the media type |
|
484 |
$openMediaLinkAttributes['absolute'] = TRUE; |
|
485 |
$captionPartHtml .= '<div class="media-caption-link">' . l($caption_link_uri, $mediaLinkUri, array( |
|
486 |
'attributes' => $openMediaLinkAttributes, 'html' => TRUE, |
|
487 |
)) . '</div>'; |
|
488 |
} |
|
489 |
} |
|
490 |
|
|
491 |
$captionParts[] = $captionPartHtml; |
|
492 |
|
|
493 |
// --- Surround imagePart with link, this . |
|
494 |
if ($doLink) { |
|
495 |
$mediaPartHtml = l($mediaPartHtml, $mediaLinkUri, array( |
|
496 |
'attributes' => $mediaPartLinkAttributes, 'html' => TRUE, |
|
497 |
)); |
|
498 |
} |
|
499 |
} |
|
500 |
else { |
|
501 |
$mediaPartHtml = ''; |
|
502 |
$captionParts[] = ''; |
|
503 |
} |
|
504 |
$out .= '<td class="media">' . $mediaPartHtml . '</td>'; |
|
505 |
} |
|
506 |
$out .= '</tr>'; // End of media parts. |
|
507 |
if ($showCaption) { |
|
508 |
if ( (is_array($captionElements) && count($captionElements) > 0) || $caption_link_uri) { |
|
509 |
$out .= '<tr>'; |
|
510 |
// Add caption row. |
|
511 |
foreach ($captionParts as $captionPartHtml) { |
|
512 |
$out .= '<td class="caption">' . $captionPartHtml . '</td>'; |
|
513 |
} |
|
514 |
$out .= '</tr>'; |
|
515 |
} |
|
516 |
} |
|
517 |
} |
|
518 |
|
|
519 |
if ($galleryLinkUri) { |
|
520 |
if (count($mediaList) > 0) { |
|
521 |
$moreHtml = count($mediaList) . ' ' . t('more in gallery'); |
|
522 |
} |
|
523 |
else { |
|
524 |
$moreHtml = t('open gallery'); |
|
525 |
} |
|
526 |
$moreHtml = l($moreHtml, $galleryLinkUri); |
|
527 |
$out .= '<tr><td colspan="' . $cols . '">' . $moreHtml . '</td></tr>'; |
|
528 |
} |
|
529 |
$out .= '</table>'; |
|
530 |
return $out; |
|
531 |
} |
|
532 |
|
|
533 |
/** |
|
534 |
* Creates markup for a CDM MediaRepresentation which is referencing an image. |
|
535 |
* |
|
536 |
* @param $mediaRepresentationPart |
|
537 |
* @param $maxExtend |
|
538 |
* @param $addPassePartout |
|
539 |
* @param $attributes |
|
540 |
* @return string |
|
541 |
* The markup for the media representation |
|
542 |
*/ |
|
543 |
function cdm_media_gallerie_image($mediaRepresentationPart, $maxExtend, $addPassePartout, $attributes = array()) { |
|
544 |
|
|
545 |
$out = ''; |
|
546 |
|
|
547 |
// TODO merge with theme_cdm_media_mime_image? |
|
548 |
if (isset($mediaRepresentationPart)) { |
|
549 |
|
|
550 |
$h = $mediaRepresentationPart->height; |
|
551 |
$w = $mediaRepresentationPart->width; |
|
552 |
if ($w == 0 || $h == 0) { |
|
553 |
// Take url and replace spaces. |
|
554 |
$image_uri = str_replace(' ', '%20', $mediaRepresentationPart->uri); |
|
555 |
$imageDimensions = getimagesize_remote($image_uri); |
|
556 |
if (!$imageDimensions) { |
|
557 |
return '<div>' . t('Image unavailable, uri: ') . $mediaRepresentationPart->uri . '</div>'; |
|
558 |
} |
|
559 |
$w = $imageDimensions[0]; |
|
560 |
$h = $imageDimensions[1]; |
|
561 |
} |
|
562 |
|
|
563 |
$ratio = $w / $h; |
|
564 |
if ($ratio > 1) { |
|
565 |
$displayHeight = round($maxExtend / $ratio); |
|
566 |
$displayWidth = $maxExtend; |
|
567 |
$m = round(($maxExtend - $displayHeight) / 2); |
|
568 |
$margins = 'margin:' . $m . 'px 0 ' . $m . 'px 0;'; |
|
569 |
} |
|
570 |
else { |
|
571 |
$displayHeight = $maxExtend; |
|
572 |
$displayWidth = round($maxExtend * $ratio); |
|
573 |
$m = round(($maxExtend - $displayWidth) / 2); |
|
574 |
$margins = 'margin:0 ' . $m . 'px 0 ' . $m . 'px;'; |
|
575 |
} |
|
576 |
|
|
577 |
// Turn attributes array into string. |
|
578 |
if(!is_array($attributes)){ |
|
579 |
$attributes = array(); |
|
580 |
} |
|
581 |
if(!isset($attributes['alt'])){ |
|
582 |
$attributes['alt'] = check_plain($mediaRepresentationPart->uri); |
|
583 |
} |
|
584 |
$attrStr = ' '; |
|
585 |
// $attributes['title'] = 'h:'.$h.', w:'.$w.',ratio:'.$ratio; |
|
586 |
if (is_array($attributes)) { |
|
587 |
foreach ($attributes as $name => $value) { |
|
588 |
$attrStr .= $name . '="' . $value . '" '; |
|
589 |
} |
|
590 |
} |
|
591 |
|
|
592 |
if ($addPassePartout) { |
|
593 |
$out .= '<div class="image-passe-partout" style="width:' . $maxExtend . 'px; height:' . $maxExtend . 'px;">'; |
|
594 |
} |
|
595 |
else { |
|
596 |
// Do not add margins if no pass partout is shown. |
|
597 |
$margins = ''; |
|
598 |
} |
|
599 |
$out .= '<img src="' . $mediaRepresentationPart->uri . '" width="' . $displayWidth . '" height="' . $displayHeight . '" style="' . $margins . '"' . $attrStr . ' />'; |
|
600 |
|
|
601 |
if ($addPassePartout) { |
|
602 |
$out .= '</div>'; |
|
603 |
} |
|
604 |
} |
|
605 |
|
|
606 |
return $out; |
|
607 |
} |
|
608 |
|
|
609 |
/** |
|
610 |
* Creates markup for a CDM MediaRepresentation which is referencing an web application. |
|
611 |
* |
|
612 |
* @param $mediaRepresentationPart |
|
613 |
* @param $maxExtend |
|
614 |
* @param $addPassePartout |
|
615 |
* @param $attributes |
|
616 |
* @return string |
|
617 |
* The markup for the media representation |
|
618 |
*/ |
|
619 |
function cdm_media_gallerie_application($mediaRepresentationPart, $maxExtend, $addPassePartout, $attributes = array()) { |
|
620 |
|
|
621 |
$out = ''; |
|
622 |
|
|
623 |
if (isset($mediaRepresentationPart)) { |
|
624 |
|
|
625 |
if ($addPassePartout) { |
|
626 |
$out .= '<div class="image-passe-partout" style="width:' . $maxExtend . 'px; height:' . $maxExtend . 'px;">'; |
|
627 |
} |
|
628 |
$out .= '<div class="application">Web Application</div>'; |
|
629 |
|
|
630 |
if ($addPassePartout) { |
|
631 |
$out .= '</div>'; |
|
632 |
} |
|
633 |
} |
|
634 |
|
|
635 |
return $out; |
|
636 |
} |
|
637 |
|
|
638 |
/** |
|
639 |
* Creates markup for a CDM MediaRepresentation which is referencing an web application. |
|
640 |
* |
|
641 |
* @param $mediaRepresentationPart |
|
642 |
* @param $maxExtend |
|
643 |
* @param $addPassePartout |
|
644 |
* @param $attributes |
|
645 |
* @return string |
|
646 |
* The markup for the media representation |
|
647 |
*/ |
|
648 |
function cdm_media_gallerie_text($mediaRepresentationPart, $maxExtend, $addPassePartout, $attributes = array()) { |
|
649 |
|
|
650 |
$out = ''; |
|
651 |
|
|
652 |
if (isset($mediaRepresentationPart)) { |
|
653 |
if ($addPassePartout) { |
|
654 |
$out .= '<div class="image-passe-partout" style="width:' . $maxExtend . 'px; height:' . $maxExtend . 'px;">'; |
|
655 |
} |
|
656 |
|
|
657 |
$out .= '<div class="application">Web Application</div>'; |
|
658 |
|
|
659 |
if ($addPassePartout) { |
|
660 |
$out .= '</div>'; |
|
661 |
} |
|
662 |
} |
|
663 |
|
|
664 |
return $out; |
|
665 |
} |
|
666 |
|
|
667 |
/** |
|
668 |
* Adds the OpenLayers based image viewer to the page. |
|
669 |
* |
|
670 |
* The OpenLayers based image viewer allows to zoom and pan the displayed image. |
|
671 |
* |
|
672 |
* Documentation related to using Openlayers in order to view images is found here: |
|
673 |
* - @see http://trac.openlayers.org/wiki/UsingCustomTiles#UsingTilesWithoutaProjection |
|
674 |
* - @see http://trac.openlayers.org/wiki/SettingZoomLevels |
|
675 |
* |
|
676 |
* @param array $variables |
|
677 |
* An associative array of theme variables: |
|
678 |
* - mediaRepresentationPart: The CDM MediaRepresentationPart instance to be displayed. |
|
679 |
* - maxExtend: The maximum extend of the image viewer view port. |
|
680 |
*/ |
|
681 |
function cdm_openlayers_image($mediaRepresentationPart, $maxExtend) { |
|
682 |
|
|
683 |
_add_js_openlayers(); |
|
684 |
|
|
685 |
// TODO merge code below with code from theme_cdm_media_gallerie_image |
|
686 |
// var_dump("MEDIA URI: " . $mediaRepresentationPart->uri); |
|
687 |
// TODO merge code below with code from theme_cdm_media_gallerie_image |
|
688 |
$w = $mediaRepresentationPart->width; |
|
689 |
$h = $mediaRepresentationPart->height; |
|
690 |
|
|
691 |
if ($w == 0 || $h == 0) { |
|
692 |
// Take url and replace spaces. |
|
693 |
$image_uri = str_replace(' ', '%20', $mediaRepresentationPart->uri); |
|
694 |
$imageDimensions = getimagesize_remote($image_uri); |
|
695 |
if (!$imageDimensions) { |
|
696 |
return '<div>' . t('Image unavailable, uri:') . $mediaRepresentationPart->uri . '</div>'; |
|
697 |
} |
|
698 |
$w = $imageDimensions[0]; |
|
699 |
$h = $imageDimensions[1]; |
|
700 |
} |
|
701 |
|
|
702 |
// Calculate maxResolution |
|
703 |
if ($w > $h) { |
|
704 |
$maxRes = $w / $maxExtend; |
|
705 |
} |
|
706 |
else { |
|
707 |
$maxRes = $h / $maxExtend; |
|
708 |
} |
|
709 |
|
|
710 |
$maxRes *= 1; |
|
711 |
|
|
712 |
drupal_add_js(' |
|
713 |
var map; |
|
714 |
|
|
715 |
var imageLayerOptions={ |
|
716 |
maxResolution: ' . $maxRes . ', |
|
717 |
maxExtent: new OpenLayers.Bounds(0, 0, ' . $w . ', ' . $h . ') |
|
718 |
}; |
|
719 |
var mapOptions={ |
|
720 |
controls: |
|
721 |
[ |
|
722 |
new OpenLayers.Control.PanZoom(), |
|
723 |
new OpenLayers.Control.Navigation({zoomWheelEnabled: false, handleRightClicks:true, zoomBoxKeyMask: OpenLayers.Handler.MOD_CTRL}) |
|
724 |
], |
|
725 |
restrictedExtent: new OpenLayers.Bounds(0, 0, ' . $w . ', ' . $h . ') |
|
726 |
}; |
|
727 |
|
|
728 |
var graphic = new OpenLayers.Layer.Image( |
|
729 |
\'Image Title\', |
|
730 |
\'' . $mediaRepresentationPart->uri . '\', |
|
731 |
new OpenLayers.Bounds(0, 0, ' . $w . ', ' . $h . '), |
|
732 |
new OpenLayers.Size(' . $w . ', ' . $h . '), |
|
733 |
imageLayerOptions |
|
734 |
); |
|
735 |
|
|
736 |
function init() { |
|
737 |
map = new OpenLayers.Map(\'openlayers_image\', mapOptions); |
|
738 |
map.addLayers([graphic]); |
|
739 |
map.setCenter(new OpenLayers.LonLat(0, 0), 1); |
|
740 |
map.zoomToMaxExtent(); |
|
741 |
} |
|
742 |
|
|
743 |
jQuery(document).ready(function(){ |
|
744 |
init(); |
|
745 |
});', array('type' => 'inline')); |
|
746 |
$out = '<div id="openlayers_image" class="image_viewer" style="width: ' . $maxExtend . 'px; height:' . ($maxExtend) . 'px"></div>'; |
|
747 |
return $out; |
|
748 |
} |
|
749 |
|
Also available in: Unified diff
turning useless media related theme-functions into compose or plain markup functions - step 2:
moving functions to includes file