removeHiddenElems.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. 'use strict';
  2. exports.type = 'perItem';
  3. exports.active = true;
  4. exports.description = 'removes hidden elements (zero sized, with absent attributes)';
  5. exports.params = {
  6. isHidden: true,
  7. displayNone: true,
  8. opacity0: true,
  9. circleR0: true,
  10. ellipseRX0: true,
  11. ellipseRY0: true,
  12. rectWidth0: true,
  13. rectHeight0: true,
  14. patternWidth0: true,
  15. patternHeight0: true,
  16. imageWidth0: true,
  17. imageHeight0: true,
  18. pathEmptyD: true,
  19. polylineEmptyPoints: true,
  20. polygonEmptyPoints: true
  21. };
  22. var regValidPath = /M\s*(?:[-+]?(?:\d*\.\d+|\d+(?:\.|(?!\.)))([eE][-+]?\d+)?(?!\d)\s*,?\s*){2}\D*\d/i;
  23. /**
  24. * Remove hidden elements with disabled rendering:
  25. * - display="none"
  26. * - opacity="0"
  27. * - circle with zero radius
  28. * - ellipse with zero x-axis or y-axis radius
  29. * - rectangle with zero width or height
  30. * - pattern with zero width or height
  31. * - image with zero width or height
  32. * - path with empty data
  33. * - polyline with empty points
  34. * - polygon with empty points
  35. *
  36. * @param {Object} item current iteration item
  37. * @param {Object} params plugin params
  38. * @return {Boolean} if false, item will be filtered out
  39. *
  40. * @author Kir Belevich
  41. */
  42. exports.fn = function (item, params) {
  43. if (item.elem) {
  44. // Removes hidden elements
  45. // https://www.w3schools.com/cssref/pr_class_visibility.asp
  46. if (
  47. params.isHidden &&
  48. item.hasAttr('visibility', 'hidden')
  49. ) return false;
  50. // display="none"
  51. //
  52. // http://www.w3.org/TR/SVG/painting.html#DisplayProperty
  53. // "A value of display: none indicates that the given element
  54. // and its children shall not be rendered directly"
  55. if (
  56. params.displayNone &&
  57. item.hasAttr('display', 'none')
  58. ) return false;
  59. // opacity="0"
  60. //
  61. // http://www.w3.org/TR/SVG/masking.html#ObjectAndGroupOpacityProperties
  62. if (
  63. params.opacity0 &&
  64. item.hasAttr('opacity', '0')
  65. ) return false;
  66. // Circles with zero radius
  67. //
  68. // http://www.w3.org/TR/SVG/shapes.html#CircleElementRAttribute
  69. // "A value of zero disables rendering of the element"
  70. //
  71. // <circle r="0">
  72. if (
  73. params.circleR0 &&
  74. item.isElem('circle') &&
  75. item.isEmpty() &&
  76. item.hasAttr('r', '0')
  77. ) return false;
  78. // Ellipse with zero x-axis radius
  79. //
  80. // http://www.w3.org/TR/SVG/shapes.html#EllipseElementRXAttribute
  81. // "A value of zero disables rendering of the element"
  82. //
  83. // <ellipse rx="0">
  84. if (
  85. params.ellipseRX0 &&
  86. item.isElem('ellipse') &&
  87. item.isEmpty() &&
  88. item.hasAttr('rx', '0')
  89. ) return false;
  90. // Ellipse with zero y-axis radius
  91. //
  92. // http://www.w3.org/TR/SVG/shapes.html#EllipseElementRYAttribute
  93. // "A value of zero disables rendering of the element"
  94. //
  95. // <ellipse ry="0">
  96. if (
  97. params.ellipseRY0 &&
  98. item.isElem('ellipse') &&
  99. item.isEmpty() &&
  100. item.hasAttr('ry', '0')
  101. ) return false;
  102. // Rectangle with zero width
  103. //
  104. // http://www.w3.org/TR/SVG/shapes.html#RectElementWidthAttribute
  105. // "A value of zero disables rendering of the element"
  106. //
  107. // <rect width="0">
  108. if (
  109. params.rectWidth0 &&
  110. item.isElem('rect') &&
  111. item.isEmpty() &&
  112. item.hasAttr('width', '0')
  113. ) return false;
  114. // Rectangle with zero height
  115. //
  116. // http://www.w3.org/TR/SVG/shapes.html#RectElementHeightAttribute
  117. // "A value of zero disables rendering of the element"
  118. //
  119. // <rect height="0">
  120. if (
  121. params.rectHeight0 &&
  122. params.rectWidth0 &&
  123. item.isElem('rect') &&
  124. item.isEmpty() &&
  125. item.hasAttr('height', '0')
  126. ) return false;
  127. // Pattern with zero width
  128. //
  129. // http://www.w3.org/TR/SVG/pservers.html#PatternElementWidthAttribute
  130. // "A value of zero disables rendering of the element (i.e., no paint is applied)"
  131. //
  132. // <pattern width="0">
  133. if (
  134. params.patternWidth0 &&
  135. item.isElem('pattern') &&
  136. item.hasAttr('width', '0')
  137. ) return false;
  138. // Pattern with zero height
  139. //
  140. // http://www.w3.org/TR/SVG/pservers.html#PatternElementHeightAttribute
  141. // "A value of zero disables rendering of the element (i.e., no paint is applied)"
  142. //
  143. // <pattern height="0">
  144. if (
  145. params.patternHeight0 &&
  146. item.isElem('pattern') &&
  147. item.hasAttr('height', '0')
  148. ) return false;
  149. // Image with zero width
  150. //
  151. // http://www.w3.org/TR/SVG/struct.html#ImageElementWidthAttribute
  152. // "A value of zero disables rendering of the element"
  153. //
  154. // <image width="0">
  155. if (
  156. params.imageWidth0 &&
  157. item.isElem('image') &&
  158. item.hasAttr('width', '0')
  159. ) return false;
  160. // Image with zero height
  161. //
  162. // http://www.w3.org/TR/SVG/struct.html#ImageElementHeightAttribute
  163. // "A value of zero disables rendering of the element"
  164. //
  165. // <image height="0">
  166. if (
  167. params.imageHeight0 &&
  168. item.isElem('image') &&
  169. item.hasAttr('height', '0')
  170. ) return false;
  171. // Path with empty data
  172. //
  173. // http://www.w3.org/TR/SVG/paths.html#DAttribute
  174. //
  175. // <path d=""/>
  176. if (
  177. params.pathEmptyD &&
  178. item.isElem('path') &&
  179. (!item.hasAttr('d') || !regValidPath.test(item.attr('d').value))
  180. ) return false;
  181. // Polyline with empty points
  182. //
  183. // http://www.w3.org/TR/SVG/shapes.html#PolylineElementPointsAttribute
  184. //
  185. // <polyline points="">
  186. if (
  187. params.polylineEmptyPoints &&
  188. item.isElem('polyline') &&
  189. !item.hasAttr('points')
  190. ) return false;
  191. // Polygon with empty points
  192. //
  193. // http://www.w3.org/TR/SVG/shapes.html#PolygonElementPointsAttribute
  194. //
  195. // <polygon points="">
  196. if (
  197. params.polygonEmptyPoints &&
  198. item.isElem('polygon') &&
  199. !item.hasAttr('points')
  200. ) return false;
  201. }
  202. };