├── .gitignore
├── LICENSE.md
├── Makefile
├── README.md
├── dist
    ├── fitvids.js
    └── fitvids.min.js
├── index.js
├── package-lock.json
├── package.json
├── test.js
└── yarn.lock


/.gitignore:
--------------------------------------------------------------------------------
1 | 
2 | # npm scraps
3 | node_modules/
4 | npm-debug.log
5 | 
6 | # OS X scraps
7 | .DS_Store
8 | 


--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
 1 | DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
 2 | 
 3 | Copyright (C) 2015 Ross Zurowski <ross@rosszurowski.com> 
 4 | 
 5 | Everyone is permitted to copy and distribute verbatim or modified
 6 | copies of this license document, and changing it is allowed as long
 7 | as the name is changed.
 8 | 
 9 | 		DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
10 | TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
11 | 
12 | 0. You just DO WHAT THE FUCK YOU WANT TO.
13 | 


--------------------------------------------------------------------------------
/Makefile:
--------------------------------------------------------------------------------
 1 | 
 2 | #
 3 | # Binaries
 4 | #
 5 | 
 6 | BIN := ./node_modules/.bin
 7 | 
 8 | #
 9 | # Variables
10 | #
11 | 
12 | DIST = dist
13 | 
14 | #
15 | # Tasks
16 | #
17 | 
18 | build: node_modules index.js
19 | 	@mkdir -p $(DIST)
20 | 	@browserify index.js --standalone fitvids -o $(DIST)/fitvids.js
21 | 	@uglifyjs $(DIST)/fitvids.js -o $(DIST)/fitvids.min.js
22 | 
23 | node_modules: package.json
24 | 	@npm install
25 | 	@touch node_modules
26 | 
27 | test:
28 | 	@hihat test.js
29 | 
30 | lint:
31 | 	@xo index.js test.js
32 | 
33 | size: build
34 | 	@cat $(DIST)/fitvids.js | gzip -9 | wc -c
35 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # fitvids
 2 | 
 3 | Lets your videos be responsive by wrapping them in an [aspect ratio container](http://alistapart.com/article/creating-intrinsic-ratios-for-video).
 4 | 
 5 | This module is based heavily off of Dave Rupert's [FitVids jQuery plugin](https://github.com/davatron5000/FitVids.js).
 6 | 
 7 | ## Install
 8 | 
 9 | ```bash
10 | npm install fitvids --save
11 | ```
12 | 
13 | You can also [download the files manually](https://raw.githubusercontent.com/rosszurowski/vanilla-fitvids/master/dist/fitvids.min.js) and include them via a `<script>` tag.
14 | 
15 | ## Usage
16 | 
17 | ```javascript
18 | fitvids() // Bam, done.
19 | ```
20 | 
21 | The module exports a single function. Just call it, and it'll wrap video embeds from Youtube, Vimeo, and Kickstarter in a responsive container. Other video players can be supported by passing a custom selector via [the options](#custom-players).
22 | 
23 | To wrap videos that have been added to the page dynamically, just call the function again. Fitvids is smart enough to only wrap the new videos.
24 | 
25 | ## Options
26 | 
27 | #### Container Selector
28 | 
29 | To only wrap videos that are a child of an element, you can provide an optional selector:
30 | 
31 | ```javascript
32 | fitvids('.video-container')
33 | ```
34 | 
35 | Only videos that are descendants of `.video-container` will be made responsive.
36 | 
37 | #### Custom Players
38 | 
39 | By default, fitvids automatically wraps Youtube, Vimeo, and Kickstarter players, but if you'd like it to wrap others too, you can pass them in as selectors via the `players` property.
40 | 
41 | ```javascript
42 | fitvids({
43 |   players: 'iframe[src*="example.com"]'
44 | })
45 | ```
46 | 
47 | Or several at once:
48 | 
49 | ```javascript
50 | fitvids('.video-container', {
51 |   players: ['iframe[src*="example1.com"]', 'iframe[src*="example2.com"]']
52 | })
53 | ```
54 | 
55 | #### Ignoring Selectors
56 | 
57 | If you'd like to ignore certain videos, you can pass a selector via the `ignore` option:
58 | 
59 | ```javascript
60 | fitvids({
61 |   ignore: ['object']
62 | })
63 | ```
64 | 
65 | ### Browser Support
66 | 
67 | This module supports every modern browser. It uses [ES5 Array methods](http://caniuse.com/#feat=es5) and [`querySelector`](http://caniuse.com/#feat=queryselector). If you need to use fitvids on a legacy browser, fitvids will work as long as these features are polyfilled.
68 | 
69 | ### Contributing
70 | 
71 | Feel free to make issues or pull requests with bug reports or suggestions.
72 | 
73 | When contributing code, you can run tests via:
74 | 
75 | ```
76 | make test
77 | ```
78 | 
79 | To build distributable versions of the script, run:
80 | 
81 | ```
82 | make build
83 | ```
84 | 
85 | ### License
86 | 
87 | [WTFPL](http://www.wtfpl.net)
88 | 


--------------------------------------------------------------------------------
/dist/fitvids.js:
--------------------------------------------------------------------------------
  1 | (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.fitvids = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
  2 | var selectors = [
  3 |   'iframe[src*="player.vimeo.com"]',
  4 |   'iframe[src*="youtube.com"]',
  5 |   'iframe[src*="youtube-nocookie.com"]',
  6 |   'iframe[src*="kickstarter.com"][src*="video.html"]',
  7 |   "object"
  8 | ];
  9 | 
 10 | var css =
 11 |   ".fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}";
 12 | 
 13 | module.exports = function(parentSelector, opts) {
 14 |   parentSelector = parentSelector || "body";
 15 |   opts = opts || {};
 16 | 
 17 |   if (isObject(parentSelector)) {
 18 |     opts = parentSelector;
 19 |     parentSelector = "body";
 20 |   }
 21 | 
 22 |   opts.ignore = opts.ignore || "";
 23 |   opts.players = opts.players || "";
 24 | 
 25 |   var containers = queryAll(parentSelector);
 26 |   if (!hasLength(containers)) return;
 27 | 
 28 |   if (!document.getElementById("fit-vids-style")) {
 29 |     var head = document.head || document.getElementsByTagName("head")[0];
 30 |     head.appendChild(styles());
 31 |   }
 32 | 
 33 |   var custom = toSelectorArray(opts.players);
 34 |   var ignored = toSelectorArray(opts.ignore);
 35 |   var ignoredSelector = ignored.length > 0 ? ignored.join() : null;
 36 |   var selector = selectors.concat(custom).join();
 37 | 
 38 |   if (!hasLength(selector)) {
 39 |     return;
 40 |   }
 41 | 
 42 |   containers.forEach(function(container) {
 43 |     var videos = queryAll(container, selector);
 44 | 
 45 |     videos.forEach(function(video) {
 46 |       if (ignoredSelector && video.matches(ignoredSelector)) {
 47 |         return;
 48 |       }
 49 |       wrap(video);
 50 |     });
 51 |   });
 52 | }
 53 | 
 54 | function queryAll(el, selector) {
 55 |   if (typeof el === "string") {
 56 |     selector = el;
 57 |     el = document;
 58 |   }
 59 |   return Array.prototype.slice.call(el.querySelectorAll(selector));
 60 | }
 61 | 
 62 | function toSelectorArray(input) {
 63 |   if (typeof input === "string") {
 64 |     return input
 65 |       .split(",")
 66 |       .map(trim)
 67 |       .filter(hasLength);
 68 |   } else if (isArray(input)) {
 69 |     return flatten(input.map(toSelectorArray).filter(hasLength));
 70 |   }
 71 |   return input || [];
 72 | }
 73 | 
 74 | function wrap(el) {
 75 |   if (/fluid-width-video-wrapper/.test(el.parentNode.className)) {
 76 |     return;
 77 |   }
 78 | 
 79 |   var widthAttr = parseInt(el.getAttribute("width"), 10);
 80 |   var heightAttr = parseInt(el.getAttribute("height"), 10);
 81 | 
 82 |   var width = !isNaN(widthAttr) ? widthAttr : el.clientWidth;
 83 |   var height = !isNaN(heightAttr) ? heightAttr : el.clientHeight;
 84 |   var aspect = height / width;
 85 | 
 86 |   el.removeAttribute("width");
 87 |   el.removeAttribute("height");
 88 | 
 89 |   var wrapper = document.createElement("div");
 90 |   el.parentNode.insertBefore(wrapper, el);
 91 |   wrapper.className = "fluid-width-video-wrapper";
 92 |   wrapper.style.paddingTop = aspect * 100 + "%";
 93 |   wrapper.appendChild(el);
 94 | }
 95 | 
 96 | function styles() {
 97 |   var div = document.createElement("div");
 98 |   div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + "</style>";
 99 |   return div.childNodes[1];
100 | }
101 | 
102 | function hasLength(input) {
103 |   return input.length > 0;
104 | }
105 | 
106 | function trim(str) {
107 |   return str.replace(/^\s+|\s+$/g, "");
108 | }
109 | 
110 | function flatten(input) {
111 |   return [].concat.apply([], input);
112 | }
113 | 
114 | function isObject(input) {
115 |   return Object.prototype.toString.call(input) === "[object Object]";
116 | }
117 | 
118 | function isArray(input) {
119 |   return Object.prototype.toString.call(input) === "[object Array]";
120 | }
121 | 
122 | },{}]},{},[1])(1)
123 | });
124 | 


--------------------------------------------------------------------------------
/dist/fitvids.min.js:
--------------------------------------------------------------------------------
1 | (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.fitvids=f()}})(function(){var define,module,exports;return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){var selectors=['iframe[src*="player.vimeo.com"]','iframe[src*="youtube.com"]','iframe[src*="youtube-nocookie.com"]','iframe[src*="kickstarter.com"][src*="video.html"]',"object"];var css=".fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}";module.exports=function(parentSelector,opts){parentSelector=parentSelector||"body";opts=opts||{};if(isObject(parentSelector)){opts=parentSelector;parentSelector="body"}opts.ignore=opts.ignore||"";opts.players=opts.players||"";var containers=queryAll(parentSelector);if(!hasLength(containers))return;if(!document.getElementById("fit-vids-style")){var head=document.head||document.getElementsByTagName("head")[0];head.appendChild(styles())}var custom=toSelectorArray(opts.players);var ignored=toSelectorArray(opts.ignore);var ignoredSelector=ignored.length>0?ignored.join():null;var selector=selectors.concat(custom).join();if(!hasLength(selector)){return}containers.forEach(function(container){var videos=queryAll(container,selector);videos.forEach(function(video){if(ignoredSelector&&video.matches(ignoredSelector)){return}wrap(video)})})};function queryAll(el,selector){if(typeof el==="string"){selector=el;el=document}return Array.prototype.slice.call(el.querySelectorAll(selector))}function toSelectorArray(input){if(typeof input==="string"){return input.split(",").map(trim).filter(hasLength)}else if(isArray(input)){return flatten(input.map(toSelectorArray).filter(hasLength))}return input||[]}function wrap(el){if(/fluid-width-video-wrapper/.test(el.parentNode.className)){return}var widthAttr=parseInt(el.getAttribute("width"),10);var heightAttr=parseInt(el.getAttribute("height"),10);var width=!isNaN(widthAttr)?widthAttr:el.clientWidth;var height=!isNaN(heightAttr)?heightAttr:el.clientHeight;var aspect=height/width;el.removeAttribute("width");el.removeAttribute("height");var wrapper=document.createElement("div");el.parentNode.insertBefore(wrapper,el);wrapper.className="fluid-width-video-wrapper";wrapper.style.paddingTop=aspect*100+"%";wrapper.appendChild(el)}function styles(){var div=document.createElement("div");div.innerHTML='<p>x</p><style id="fit-vids-style">'+css+"</style>";return div.childNodes[1]}function hasLength(input){return input.length>0}function trim(str){return str.replace(/^\s+|\s+$/g,"")}function flatten(input){return[].concat.apply([],input)}function isObject(input){return Object.prototype.toString.call(input)==="[object Object]"}function isArray(input){return Object.prototype.toString.call(input)==="[object Array]"}},{}]},{},[1])(1)});


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
  1 | var selectors = [
  2 |   'iframe[src*="player.vimeo.com"]',
  3 |   'iframe[src*="youtube.com"]',
  4 |   'iframe[src*="youtube-nocookie.com"]',
  5 |   'iframe[src*="kickstarter.com"][src*="video.html"]',
  6 |   "object"
  7 | ];
  8 | 
  9 | var css =
 10 |   ".fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}";
 11 | 
 12 | module.exports = function(parentSelector, opts) {
 13 |   parentSelector = parentSelector || "body";
 14 |   opts = opts || {};
 15 | 
 16 |   if (isObject(parentSelector)) {
 17 |     opts = parentSelector;
 18 |     parentSelector = "body";
 19 |   }
 20 | 
 21 |   opts.ignore = opts.ignore || "";
 22 |   opts.players = opts.players || "";
 23 | 
 24 |   var containers = queryAll(parentSelector);
 25 |   if (!hasLength(containers)) return;
 26 | 
 27 |   if (!document.getElementById("fit-vids-style")) {
 28 |     var head = document.head || document.getElementsByTagName("head")[0];
 29 |     head.appendChild(styles());
 30 |   }
 31 | 
 32 |   var custom = toSelectorArray(opts.players);
 33 |   var ignored = toSelectorArray(opts.ignore);
 34 |   var ignoredSelector = ignored.length > 0 ? ignored.join() : null;
 35 |   var selector = selectors.concat(custom).join();
 36 | 
 37 |   if (!hasLength(selector)) {
 38 |     return;
 39 |   }
 40 | 
 41 |   containers.forEach(function(container) {
 42 |     var videos = queryAll(container, selector);
 43 | 
 44 |     videos.forEach(function(video) {
 45 |       if (ignoredSelector && video.matches(ignoredSelector)) {
 46 |         return;
 47 |       }
 48 |       wrap(video);
 49 |     });
 50 |   });
 51 | }
 52 | 
 53 | function queryAll(el, selector) {
 54 |   if (typeof el === "string") {
 55 |     selector = el;
 56 |     el = document;
 57 |   }
 58 |   return Array.prototype.slice.call(el.querySelectorAll(selector));
 59 | }
 60 | 
 61 | function toSelectorArray(input) {
 62 |   if (typeof input === "string") {
 63 |     return input
 64 |       .split(",")
 65 |       .map(trim)
 66 |       .filter(hasLength);
 67 |   } else if (isArray(input)) {
 68 |     return flatten(input.map(toSelectorArray).filter(hasLength));
 69 |   }
 70 |   return input || [];
 71 | }
 72 | 
 73 | function wrap(el) {
 74 |   if (/fluid-width-video-wrapper/.test(el.parentNode.className)) {
 75 |     return;
 76 |   }
 77 | 
 78 |   var widthAttr = parseInt(el.getAttribute("width"), 10);
 79 |   var heightAttr = parseInt(el.getAttribute("height"), 10);
 80 | 
 81 |   var width = !isNaN(widthAttr) ? widthAttr : el.clientWidth;
 82 |   var height = !isNaN(heightAttr) ? heightAttr : el.clientHeight;
 83 |   var aspect = height / width;
 84 | 
 85 |   el.removeAttribute("width");
 86 |   el.removeAttribute("height");
 87 | 
 88 |   var wrapper = document.createElement("div");
 89 |   el.parentNode.insertBefore(wrapper, el);
 90 |   wrapper.className = "fluid-width-video-wrapper";
 91 |   wrapper.style.paddingTop = aspect * 100 + "%";
 92 |   wrapper.appendChild(el);
 93 | }
 94 | 
 95 | function styles() {
 96 |   var div = document.createElement("div");
 97 |   div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + "</style>";
 98 |   return div.childNodes[1];
 99 | }
100 | 
101 | function hasLength(input) {
102 |   return input.length > 0;
103 | }
104 | 
105 | function trim(str) {
106 |   return str.replace(/^\s+|\s+$/g, "");
107 | }
108 | 
109 | function flatten(input) {
110 |   return [].concat.apply([], input);
111 | }
112 | 
113 | function isObject(input) {
114 |   return Object.prototype.toString.call(input) === "[object Object]";
115 | }
116 | 
117 | function isArray(input) {
118 |   return Object.prototype.toString.call(input) === "[object Array]";
119 | }
120 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "fitvids",
 3 |   "version": "2.1.1",
 4 |   "description": "Makes your videos fluid-width.",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "build": "make build",
 8 |     "test": "make test"
 9 |   },
10 |   "devDependencies": {
11 |     "hihat": "^2.6.4",
12 |     "tap-dev-tool": "^1.3.0",
13 |     "tape": "^4.2.0",
14 |     "uglify-js": "^2.4.24",
15 |     "xo": "^0.25.3"
16 |   },
17 |   "keywords": [
18 |     "video",
19 |     "responsive",
20 |     "fluid",
21 |     "width",
22 |     "fitvids",
23 |     "wrapper"
24 |   ],
25 |   "xo": {
26 |     "env": [
27 |       "browser"
28 |     ],
29 |     "semicolon": false,
30 |     "rules": {
31 |       "space-before-function-paren": [
32 |         2,
33 |         "always"
34 |       ],
35 |       "curly": [
36 |         2,
37 |         "multi-line"
38 |       ]
39 |     }
40 |   },
41 |   "author": "Ross Zurowski <ross@rosszurowski.com>",
42 |   "license": "WTFPL",
43 |   "homepage": "https://github.com/rosszurowski/vanilla-fitvids#readme",
44 |   "repository": {
45 |     "type": "git",
46 |     "url": "git+https://github.com/rosszurowski/vanilla-fitvids.git"
47 |   },
48 |   "bugs": {
49 |     "url": "https://github.com/rosszurowski/vanilla-fitvids/issues"
50 |   }
51 | }
52 | 


--------------------------------------------------------------------------------
/test.js:
--------------------------------------------------------------------------------
  1 | 
  2 | require('tap-dev-tool/register')
  3 | 
  4 | var fitvids = require('./')
  5 | var test = require('tape')
  6 | 
  7 | test('injects styles', function (t) {
  8 | 	fitvids()
  9 | 
 10 | 	var styles = document.getElementById('fit-vids-style')
 11 | 
 12 | 	t.ok(styles.innerHTML, 'has content')
 13 | 	t.equal(styles.parentNode, document.head, 'added to head')
 14 | 	t.end()
 15 | })
 16 | 
 17 | test('wraps videos in fluid wrapper', function (t) {
 18 | 	var video = player('https://www.youtube.com/embed/Bfk83WZcAI4')
 19 | 	video.width = 560
 20 | 	video.height = 315
 21 | 
 22 | 	fitvids()
 23 | 
 24 | 	var wrapper = document.querySelector('.fluid-width-video-wrapper')
 25 | 
 26 | 	t.equal(wrapper.style.paddingTop, '56.25%', 'aspect ratio preserved')
 27 | 	t.equal(video.src, 'https://www.youtube.com/embed/Bfk83WZcAI4', 'source doesn\'t change')
 28 | 	t.equal(video.parentNode.className, 'fluid-width-video-wrapper', 'wrapped in fluid container')
 29 | 	document.body.removeChild(wrapper)
 30 | 	t.end()
 31 | })
 32 | 
 33 | test('wraps all default selectors', function (t) {
 34 | 	var defaults = [
 35 | 		player('https://www.youtube.com/embed/Bfk83WZcAI4'),
 36 | 		player('http://player.vimeo.com/video/118801020'),
 37 | 		player('https://www.kickstarter.com/projects/181236819/no-2-story-of-the-pencil-documentary/widget/video.html')
 38 | 	]
 39 | 
 40 | 	var extra = player('http://localhost/')
 41 | 
 42 | 	fitvids()
 43 | 
 44 | 	defaults.forEach(function (video) {
 45 | 		t.equal(video.parentNode.className, 'fluid-width-video-wrapper', 'wrapped in fluid container')
 46 | 		document.body.removeChild(video.parentNode)
 47 | 	})
 48 | 
 49 | 	t.notEqual(extra.parentNode.className, 'fluid-width-video-wrapper', 'didn\'t wrap unknown video selector')
 50 | 	document.body.removeChild(extra)
 51 | 	t.end()
 52 | })
 53 | 
 54 | test('allows custom players', function (t) {
 55 | 	var video = player('http://www.dailymotion.com/embed/video/x1wt7d1')
 56 | 
 57 | 	fitvids({
 58 | 		players: ['iframe[src*="dailymotion"]']
 59 | 	})
 60 | 
 61 | 	t.equal(video.parentNode.className, 'fluid-width-video-wrapper', 'wrapped in fluid container')
 62 | 	document.body.removeChild(video.parentNode)
 63 | 	t.end()
 64 | })
 65 | 
 66 | test('allows ignoring default selectors', function (t) {
 67 | 	var video = player('http://player.vimeo.com/video/118801020')
 68 | 
 69 | 	fitvids({
 70 | 		ignore: ['iframe[src*="player.vimeo.com"]']
 71 | 	})
 72 | 
 73 | 	t.equal(video.parentNode.tagName, 'BODY', 'not wrapped in container')
 74 | 	document.body.removeChild(video)
 75 | 	t.end()
 76 | })
 77 | 
 78 | test('allows ignored and custom players at the same time', function (t) {
 79 | 	var vimeo = player('http://player.vimeo.com/video/118801020')
 80 | 	var youtube = player('https://www.youtube.com/embed/Bfk83WZcAI4')
 81 | 	var dailymotion = player('http://www.dailymotion.com/embed/video/x1wt7d1')
 82 | 
 83 | 	fitvids({
 84 | 		players: ['iframe[src*="dailymotion.com"]'],
 85 | 		ignore: ['iframe[src*="player.vimeo.com"],iframe[src*="youtube.com"]']
 86 | 	})
 87 | 
 88 | 	t.equal(vimeo.parentNode.tagName, 'BODY', 'ignored not wrapped in container')
 89 | 	t.equal(youtube.parentNode.tagName, 'BODY', 'ignored not wrapped in container')
 90 | 	t.equal(dailymotion.parentNode.tagName, 'DIV', 'custom is wrapped in container')
 91 | 	document.body.removeChild(vimeo)
 92 | 	document.body.removeChild(youtube)
 93 | 	document.body.removeChild(dailymotion.parentNode)
 94 | 	t.end()
 95 | })
 96 | 
 97 | test('doesn\'t wrap videos multiple times', function (t) {
 98 | 	var video = player('http://player.vimeo.com/video/118801020')
 99 | 	fitvids()
100 | 	fitvids()
101 | 	t.equal(video.parentNode.className, 'fluid-width-video-wrapper', 'wrapped in fluid container')
102 | 	t.equal(video.parentNode.parentNode.tagName, 'BODY', 'not wrapped twice')
103 | 	document.body.removeChild(video.parentNode)
104 | 	t.end()
105 | })
106 | 
107 | /**
108 |  * Generate a video embed from a source url
109 |  */
110 | function player (src) {
111 | 	var el = document.createElement('iframe')
112 | 	el.src = src
113 | 	document.body.appendChild(el)
114 | 	return el
115 | }
116 | 


--------------------------------------------------------------------------------