MCPcopy
hub / github.com/Dynalon/mdwiki / replaceImageParagraphs

Function replaceImageParagraphs

js/bootstrap.js:402–470  ·  view source on GitHub ↗
()

Source from the content-addressed store, hash-verified

400
401 // replace all <p> around images with a <div class="thumbnail" >
402 function replaceImageParagraphs() {
403 // only select those paragraphs that have images in them
404 var $pars = $("p img").parents("p");
405 $pars.each(function () {
406 var $p = $(this);
407 var $images = $(this)
408 .find("img")
409 .filter(function () {
410 // only select those images that have no parent anchor
411 return $(this).parents("a").length === 0;
412 })
413 // add those anchors including images
414 .add($(this).find("img"))
415 .addClass("img-responsive")
416 .addClass("img-thumbnail");
417
418 // create a new url group at the fron of the paragraph
419 //$p.prepend($('<ul class="thumbnails" />'));
420 // move the images to the newly created ul
421 //$p.find('ul').eq(0).append($images);
422
423 // wrap each image with a <li> that limits their space
424 // the number of images in a paragraphs determines thei width / span
425
426 // if the image is a link, wrap around the link to avoid
427 function wrapImage($imgages, wrapElement) {
428 return $images.each(function (i, img) {
429 var $img = $(img);
430 var $parent_img = $img.parent("a");
431 if ($parent_img.length > 0) $parent_img.wrap(wrapElement);
432 else $img.wrap(wrapElement);
433 });
434 }
435
436 if ($p.hasClass("md-floatenv")) {
437 if ($images.length === 1) {
438 wrapImage($images, '<div class="col-sm-8" />');
439 } else if ($images.length === 2) {
440 wrapImage($images, '<div class="col-sm-4" />');
441 } else {
442 wrapImage($images, '<div class="col-sm-2" />');
443 }
444 } else {
445 // non-float => images are on their own single paragraph, make em larger
446 // but remember, our image resizing will make them only as large as they are
447 // but do no upscaling
448 // TODO replace by calculation
449
450 if ($images.length === 1) {
451 wrapImage($images, '<div class="col-sm-12" />');
452 } else if ($images.length === 2) {
453 wrapImage($images, '<div class="col-sm-6" />');
454 } else if ($images.length === 3) {
455 wrapImage($images, '<div class="col-sm-4" />');
456 } else if ($images.length === 4) {
457 wrapImage($images, '<div class="col-sm-3" />');
458 } else {
459 wrapImage($images, '<div class="col-sm-2" />');

Callers 1

bootstrap.jsFile · 0.85

Calls 2

$Function · 0.85
wrapImageFunction · 0.85

Tested by

no test coverage detected