Fluid-size youtube video embeds

This commit is contained in:
Jonny Barnes 2017-02-06 09:09:36 +00:00
parent c7363bcce2
commit f13cf58294
9 changed files with 22 additions and 4 deletions

File diff suppressed because one or more lines are too long

Binary file not shown.

Binary file not shown.

View file

@ -1 +1 @@
{"version":3,"sources":["../../../resources/assets/sass/app.scss","../../../resources/assets/sass/layout.scss","../../../resources/assets/sass/styles.scss","../../../resources/assets/sass/pagination.scss","../../../resources/assets/sass/note-form.scss","../../../resources/assets/sass/mapbox.scss","../../../resources/assets/sass/contacts.scss","../../../resources/assets/sass/emoji.scss"],"names":[],"mappings":"AAIA,KACI,sBACA,cAAe,CAClB,qBAKG,kBAAmB,CACtB,KCVG,eACA,cACA,iBACA,kBACA,oBAAqB,CACxB,WAGG,iBAAkB,CACrB,SAGG,gBAAiB,CACpB,MAGG,oBACA,AADA,aACA,4BAAsB,AAAtB,6BAAsB,AAAtB,qBAAsB,CACzB,eAGG,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,yBACA,AADA,8BACA,gBAAiB,CACpB,cAGG,oBACA,AADA,aACA,yBAAmB,AAAnB,kBAAmB,CACtB,kBAGG,gBAAiB,CACpB,iBAGG,qBACA,WAAY,CACf,aAGG,eACA,yBAA0B,CAC7B,OAGG,eAAgB,CACnB,cAGG,eAAgB,CACnB,WAGG,eACA,cACA,iBAAkB,CACrB,sBAGG,cAAe,CAClB,sBAGG,iBACA,cAAe,CAClB,KClEG,6JAWc,CACjB,EAGG,qBACA,wBACA,UAAW,CACd,gBAGG,kBAAmB,CACtB,MAGG,WACA,UAAW,CACd,OAGG,iBACA,iBAAkB,CACrB,WAGG,kBAAmB,CACtB,UAGG,YACA,WAAY,CACf,YC1CG,WACA,YACA,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,yBACA,AADA,8BACA,yBAAmB,AAAnB,kBAAmB,CACtB,eAGG,oBAAqB,CACxB,SCVG,oBACA,AADA,aACA,4BAAsB,AAAtB,6BAAsB,AAAtB,qBAAsB,CACzB,0BAGG,aACI,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,cAAe,CAClB,CAGL,0BACI,sBACI,UAAW,CACd,CAGL,eACI,UACA,oBACA,gBAAiB,CACpB,oDAIG,mBAAO,AAAP,MAAO,CACV,kBAGG,qBAAsB,CACzB,QAGG,mBAAoB,CACvB,KCnCG,eACA,YAAa,CAChB,QAGG,y4HACA,wBACA,WACA,WAAY,CACf,UAGG,kBACA,MACA,OACA,iBACA,cAAe,CAClB,gBAGG,gBACA,gBAAiB,CACpB,SCtBG,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,eACA,6BAA8B,CACjC,aAGG,oBACA,YACA,YAAa,CAChB,sDCPG,iBAAkB,CACrB,gFAIG,kBACA,cACA,UACA,aACA,OACA,cACA,qBACA,yBACA,oBACA,oCACA,yBACA,kCACA,WACA,cACA,0CAAkC,AAAlC,iCAAkC,CACrC,2BAGG,KACI,aACA,6BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,AApBC,mBAGG,KACI,aACA,6BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,aACI,kCACI,kCAAmC,CACtC,CAAA","file":"app.css"}
{"version":3,"sources":["../../../resources/assets/sass/app.scss","../../../resources/assets/sass/layout.scss","../../../resources/assets/sass/styles.scss","../../../resources/assets/sass/pagination.scss","../../../resources/assets/sass/note-form.scss","../../../resources/assets/sass/mapbox.scss","../../../resources/assets/sass/contacts.scss","../../../resources/assets/sass/emoji.scss"],"names":[],"mappings":"AAIA,KACI,sBACA,cAAe,CAClB,qBAKG,kBAAmB,CACtB,KCVG,eACA,cACA,iBACA,kBACA,oBAAqB,CACxB,WAGG,iBAAkB,CACrB,SAGG,gBAAiB,CACpB,MAGG,oBACA,AADA,aACA,4BAAsB,AAAtB,6BAAsB,AAAtB,qBAAsB,CACzB,eAGG,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,yBACA,AADA,8BACA,gBAAiB,CACpB,cAGG,oBACA,AADA,aACA,yBAAmB,AAAnB,kBAAmB,CACtB,kBAGG,gBAAiB,CACpB,iBAGG,qBACA,WAAY,CACf,aAGG,eACA,yBAA0B,CAC7B,OAGG,eAAgB,CACnB,cAGG,eAAgB,CACnB,WAGG,eACA,cACA,iBAAkB,CACrB,sBAGG,cAAe,CAClB,sBAGG,iBACA,cAAe,CAClB,WAGG,kBACA,WACA,SACA,qBAAsB,CACzB,SAGG,kBACA,MACA,OACA,WACA,WAAY,CACf,KCjFG,6JAWc,CACjB,EAGG,qBACA,wBACA,UAAW,CACd,gBAGG,kBAAmB,CACtB,MAGG,WACA,UAAW,CACd,OAGG,iBACA,iBAAkB,CACrB,WAGG,kBAAmB,CACtB,UAGG,YACA,WAAY,CACf,YC1CG,WACA,YACA,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,yBACA,AADA,8BACA,yBAAmB,AAAnB,kBAAmB,CACtB,eAGG,oBAAqB,CACxB,SCVG,oBACA,AADA,aACA,4BAAsB,AAAtB,6BAAsB,AAAtB,qBAAsB,CACzB,0BAGG,aACI,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,cAAe,CAClB,CAGL,0BACI,sBACI,UAAW,CACd,CAGL,eACI,UACA,oBACA,gBAAiB,CACpB,oDAIG,mBAAO,AAAP,MAAO,CACV,kBAGG,qBAAsB,CACzB,QAGG,mBAAoB,CACvB,KCnCG,eACA,YAAa,CAChB,QAGG,y4HACA,wBACA,WACA,WAAY,CACf,UAGG,kBACA,MACA,OACA,iBACA,cAAe,CAClB,gBAGG,gBACA,gBAAiB,CACpB,SCtBG,oBACA,AADA,aACA,8BACA,AADA,6BACA,AADA,mBACA,eACA,6BAA8B,CACjC,aAGG,oBACA,YACA,YAAa,CAChB,sDCPG,iBAAkB,CACrB,gFAIG,kBACA,cACA,UACA,aACA,OACA,cACA,qBACA,yBACA,oBACA,oCACA,yBACA,kCACA,WACA,cACA,0CAAkC,AAAlC,iCAAkC,CACrC,2BAGG,KACI,aACA,6BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,AApBC,mBAGG,KACI,aACA,6BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,aACI,kCACI,kCAAmC,CACtC,CAAA","file":"app.css"}

View file

@ -1 +1 @@
!function(t){function e(n){if(r[n])return r[n].exports;var o=r[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var r={};return e.m=t,e.c=r,e.i=function(t){return t},e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=18)}({18:function(t,e){var r=/watch\?v=([A-Za-z0-9\-_]+)\b/,n=/https\:\/\/play\.spotify\.com\/(.*)\b/,o=document.querySelectorAll(".e-content"),a=!0,u=!1,i=void 0;try{for(var c,l=o[Symbol.iterator]();!(a=(c=l.next()).done);a=!0){var s=c.value,f=s.textContent.match(r);if(f){var p=document.createElement("iframe");p.classList.add("youtube"),p.setAttribute("src","https://www.youtube.com/embed/"+f[1]),p.setAttribute("frameborder",0),p.setAttribute("allowfullscreen","true"),s.appendChild(p)}var d=s.textContent.match(n);if(d){var b=d[1].replace("/",":"),m=document.createElement("iframe");m.classList.add("spotify"),m.setAttribute("src","https://embed.spotify.com/?uri=spotify:"+b),m.setAttribute("frameborder",0),m.setAttribute("allowtransparency","true"),s.appendChild(m)}}}catch(t){u=!0,i=t}finally{try{!a&&l.return&&l.return()}finally{if(u)throw i}}}});
!function(t){function e(n){if(r[n])return r[n].exports;var o=r[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var r={};return e.m=t,e.c=r,e.i=function(t){return t},e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=18)}({18:function(t,e){var r=/watch\?v=([A-Za-z0-9\-_]+)\b/,n=/https\:\/\/play\.spotify\.com\/(.*)\b/,o=document.querySelectorAll(".e-content"),a=!0,u=!1,i=void 0;try{for(var c,l=o[Symbol.iterator]();!(a=(c=l.next()).done);a=!0){var s=c.value,d=s.textContent.match(r);if(d){var f=document.createElement("div");f.classList.add("container");var p=document.createElement("iframe");p.classList.add("youtube"),p.setAttribute("src","https://www.youtube.com/embed/"+d[1]),p.setAttribute("frameborder",0),p.setAttribute("allowfullscreen","true"),f.appendChild(p),s.appendChild(f)}var m=s.textContent.match(n);if(m){var b=m[1].replace("/",":"),y=document.createElement("iframe");y.classList.add("spotify"),y.setAttribute("src","https://embed.spotify.com/?uri=spotify:"+b),y.setAttribute("frameborder",0),y.setAttribute("allowtransparency","true"),s.appendChild(y)}}}catch(t){u=!0,i=t}finally{try{!a&&l.return&&l.return()}finally{if(u)throw i}}}});

Binary file not shown.

Binary file not shown.

View file

@ -8,12 +8,15 @@ let notes = document.querySelectorAll('.e-content');
for (let note of notes) {
let ytid = note.textContent.match(youtubeRegex);
if (ytid) {
let ytcontainer = document.createElement('div');
ytcontainer.classList.add('container');
let ytiframe = document.createElement('iframe');
ytiframe.classList.add('youtube');
ytiframe.setAttribute('src', 'https://www.youtube.com/embed/' + ytid[1]);
ytiframe.setAttribute('frameborder', 0);
ytiframe.setAttribute('allowfullscreen', 'true');
note.appendChild(ytiframe);
ytcontainer.appendChild(ytiframe)
note.appendChild(ytcontainer);
}
let spotifyid = note.textContent.match(spotifyRegex);
if (spotifyid) {

View file

@ -69,3 +69,18 @@ footer button {
margin-top: 0.5em;
font-size: 1rem;
}
.container {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%;
}
.youtube {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}