My static website generator using poole https://www.xythobuz.de
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

jquery.yoxthumbs.js 8.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232
  1. /*!
  2. * jquery.yoxthumbs
  3. * jQuery thumbnails plugin
  4. * http://yoxigen.com/
  5. *
  6. * Copyright (c) 2010 Yossi Kolesnicov
  7. *
  8. * Date: 13th November, 2010
  9. * Version : 0.95
  10. */
  11. (function($){
  12. $.fn.yoxthumbs = function(opt) {
  13. if (this.length == 0)
  14. return this;
  15. if (typeof(opt) != 'string')
  16. {
  17. var defaults = {
  18. target: null, // an yoxview instance
  19. selectedThumbnailClassName : "selected",
  20. thumbsOpacityFadeTime: 300,
  21. thumbsOpacity : undefined,
  22. prevBtn: undefined,
  23. nextBtn: undefined,
  24. onClick: undefined,
  25. images: undefined,
  26. enableOnlyMedia: false // If set to true, YoxThumbs is enabled only for links whose HREF is to an image or other supported media.
  27. };
  28. var options = $.extend(defaults, opt);
  29. var $this = $(this);
  30. $this.data("yoxthumbs", new YoxThumbs($this, options));
  31. return this;
  32. }
  33. else
  34. {
  35. var instance = $(this).data("yoxthumbs");
  36. if (instance)
  37. {
  38. if ($.isFunction(instance[opt]))
  39. instance[opt].apply(instance, Array.prototype.slice.call(arguments, 1));
  40. else
  41. return instance[opt];
  42. }
  43. return this;
  44. }
  45. };
  46. function YoxThumbs(container, options)
  47. {
  48. var self = this,
  49. prevBtn = options.prevBtn,
  50. nextBtn = options.nextBtn,
  51. viewIndex = container.data("yoxview") ? container.data("yoxview").viewIndex : undefined,
  52. $ = jQuery,
  53. containerIsAnchor = container[0].tagName == "A",
  54. shortenFunctions = {};
  55. this.thumbnails = [];
  56. (function setShortenFunctions(){
  57. $.each(["title", "description"], function(i, fieldName){
  58. var maxLength = options[fieldName + "MaxLength"];
  59. shortenFunctions[fieldName] = function(str){
  60. return !maxLength || str.length <= maxLength ? str : str.substr(0, maxLength) + (options.addEllipsis !== false ? "&hellip;" : "");
  61. };
  62. });
  63. })();
  64. // If images data has been specified, create the thumbnails:
  65. if (options.images)
  66. $.each(options.images, function(i, imageData){
  67. container.append(createThumbnail(imageData));
  68. });
  69. var currentImageIndex = 0,
  70. foundThumbnails = containerIsAnchor ? container : container.find("a:has(img)");
  71. $.each(foundThumbnails, function(i, thumbnail)
  72. {
  73. var $thumbnail = $(thumbnail);
  74. var addThumb = true;
  75. if (options.enableOnlyMedia)
  76. {
  77. if (!thumbnail.href.match(Yox.Regex.image))
  78. {
  79. var isData = false;
  80. for(dataProvider in Yox.Regex.data)
  81. {
  82. if (thumbnail.href.match(Yox.Regex.data[dataProvider]))
  83. {
  84. isData = true;
  85. break;
  86. }
  87. }
  88. if (!isData)
  89. {
  90. var isVideo = false;
  91. for(videoProvider in Yox.Regex.video)
  92. {
  93. if (thumbnail.href.match(Yox.Regex.video[videoProvider]))
  94. {
  95. isVideo = true;
  96. break;
  97. }
  98. }
  99. if (!isVideo)
  100. addThumb = false;
  101. }
  102. }
  103. }
  104. if (addThumb)
  105. {
  106. $thumbnail.data("yoxthumbs", $.extend({imageIndex: currentImageIndex++}, $thumbnail.data("yoxthumbs")));
  107. self.thumbnails.push($thumbnail);
  108. }
  109. });
  110. if (options.thumbsOpacity)
  111. {
  112. this.thumbnails.css("opacity", options.thumbsOpacity);
  113. container.delegate("a:has(img)", "mouseenter.yoxthumbs", function(e){
  114. if (self.currentSelectedIndex === undefined ||
  115. $(e.currentTarget).data("yoxthumbs").imageIndex != self.currentSelectedIndex){
  116. $(e.currentTarget).stop().animate({opacity: 1}, options.thumbsOpacityFadeTime);
  117. }
  118. })
  119. .delegate("a:has(img)", "mouseout.yoxthumbs", function(e){
  120. if (self.currentSelectedIndex === undefined ||
  121. $(e.currentTarget).data("yoxthumbs").imageIndex != self.currentSelectedIndex)
  122. $(e.currentTarget).stop().animate({opacity: options.thumbsOpacity}, options.thumbsOpacityFadeTime);
  123. });
  124. }
  125. if (options.onClick)
  126. {
  127. if (containerIsAnchor)
  128. container.bind("click.yoxthumbs", function(e){
  129. options.onClick(e);
  130. return false;
  131. });
  132. else
  133. container.delegate("a:has(img)", "click.yoxthumbs", function(e){
  134. if (!$(e.currentTarget).data("yoxthumbs"))
  135. return true;
  136. options.onClick(e);
  137. return false;
  138. });
  139. }
  140. function createThumbnail(imageData, viewIndex)
  141. {
  142. var thumbnail = $("<a>", {
  143. href: imageData.link,
  144. className: options.thumbnailsClass || "yoxthumbs_thumbnail"
  145. });
  146. var thumbImage = jQuery("<img>", {
  147. src : imageData.thumbnailSrc,
  148. alt : imageData.media.alt,
  149. title : imageData.media.title
  150. });
  151. if (imageData.data)
  152. thumbnail.data("yoxthumbs", imageData.data);
  153. if (imageData.thumbnailDimensions)
  154. thumbImage.css({
  155. "width": imageData.thumbnailDimensions.width,
  156. "height" : imageData.thumbnailDimensions.height
  157. });
  158. thumbImage.appendTo(thumbnail);
  159. if (options.setTitles && imageData.media.title){
  160. $(options.titlesElement || "<span>", {
  161. html: shortenFunctions.title(imageData.media.title),
  162. className: options.titlesClass
  163. }).appendTo(thumbnail);
  164. }
  165. if (options.setDescriptions && imageData.media.description){
  166. $(options.descriptionsElement || "<div>", {
  167. html: shortenFunctions.description(imageData.media.description),
  168. className: options.descriptionsClass
  169. }).appendTo(thumbnail);
  170. }
  171. return thumbnail;
  172. }
  173. // Selects a thumbnail
  174. this.select = function(thumbIndex)
  175. {
  176. if (this.currentSelectedIndex === undefined || this.currentSelectedIndex != thumbIndex)
  177. {
  178. var currentThumbnail = this.thumbnails.eq(thumbIndex);
  179. var yoxslider = container.data("yoxslide");
  180. if (yoxslider)
  181. yoxslider.show(currentThumbnail);
  182. // Remove selection from previous thumbnail:
  183. if (this.currentSelectedIndex !== undefined)
  184. {
  185. var previousSelectedThumbnail = this.thumbnails.eq(this.currentSelectedIndex);
  186. previousSelectedThumbnail.removeClass(options.selectedThumbnailClassName);
  187. if (options.thumbsOpacity)
  188. previousSelectedThumbnail.animate({opacity: options.thumbsOpacity}, options.thumbsOpacityFadeTime);
  189. }
  190. currentThumbnail.addClass(options.selectedThumbnailClassName);
  191. if (options.thumbsOpacity)
  192. currentThumbnail.animate({opacity: 1}, options.thumbsOpacityFadeTime);
  193. this.currentSelectedIndex = thumbIndex;
  194. }
  195. }
  196. this.unload = function(dataKey)
  197. {
  198. $.each(this.thumbnails, function(i, thumbnail)
  199. {
  200. $(thumbnail).removeData("yoxthumbs");
  201. if (dataKey)
  202. $(thumbnail).removeData(dataKey);
  203. });
  204. container.undelegate("a:has(img)", "click.yoxthumbs");
  205. container.find(".yoxthumbs_thumbnail").remove();
  206. if (containerIsAnchor)
  207. container.unbind(".yoxthumbs");
  208. }
  209. }
  210. })(jQuery);