Embedded media like images and video can now individually be collapsed A new preference "Collapse media by default" is also added, the default is to not collapse media. Since images are not always shown, "showImage" is also renamed to "loadImage" Closes #1187pull/2763/head
parent
ec9aa61ee3
commit
1480d7be91
@ -0,0 +1,7 @@ |
||||
Template.oembedAudioWidget.helpers |
||||
|
||||
collapsed: -> |
||||
if this.collapsed? |
||||
return this.collapsed |
||||
else |
||||
return Meteor.user()?.settings?.preferences?.collapseMediaByDefault is true |
||||
@ -1,12 +1,17 @@ |
||||
<template name="oembedAudioWidget"> |
||||
<a href="{{url}}" target="_blank"> |
||||
{{#if parsedUrl}} |
||||
<blockquote> |
||||
<audio controls> |
||||
<source src="{{url}}" type="{{headers.contentType}}"> |
||||
Your browser does not support the audio element. |
||||
</audio> |
||||
</blockquote> |
||||
{{#if collapsed}} |
||||
<span class="collapse-switch icon-right-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span> |
||||
{{else}} |
||||
<span class="collapse-switch icon-down-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span> |
||||
<blockquote> |
||||
<audio controls> |
||||
<source src="{{url}}" type="{{headers.contentType}}"> |
||||
Your browser does not support the audio element. |
||||
</audio> |
||||
</blockquote> |
||||
{{/if}} |
||||
{{/if}} |
||||
</a> |
||||
</template> |
||||
|
||||
@ -0,0 +1,7 @@ |
||||
Template.oembedFrameWidget.helpers |
||||
|
||||
collapsed: -> |
||||
if this.collapsed? |
||||
return this.collapsed |
||||
else |
||||
return Meteor.user()?.settings?.preferences?.collapseMediaByDefault is true |
||||
@ -1,25 +1,32 @@ |
||||
<template name="oembedFrameWidget"> |
||||
{{#if parsedUrl}} |
||||
<blockquote> |
||||
{{#if meta.oembedProviderName}} |
||||
{{#if meta.oembedProviderUrl}} |
||||
<a href="{{meta.oembedProviderUrl}}" style="color: #9e9ea6">{{meta.oembedProviderName}}</a><br/> |
||||
{{/if}} |
||||
{{#if parsedUrl}} |
||||
<blockquote> |
||||
{{#if meta.oembedProviderName}} |
||||
{{#if meta.oembedProviderUrl}} |
||||
<a href="{{meta.oembedProviderUrl}}" style="color: #9e9ea6">{{meta.oembedProviderName}}</a> |
||||
{{/if}} |
||||
{{#if meta.oembedAuthorName}} |
||||
{{#if meta.oembedAuthorUrl}} |
||||
<a href="{{meta.oembedAuthorUrl}}">{{meta.oembedAuthorName}}</a><br/> |
||||
{{/if}} |
||||
{{/if}} |
||||
{{#if meta.oembedAuthorName}} |
||||
{{#if meta.oembedAuthorUrl}} |
||||
<br class="only-after-a"/> |
||||
<a href="{{meta.oembedAuthorUrl}}">{{meta.oembedAuthorName}}</a> |
||||
{{/if}} |
||||
{{#if meta.oembedTitle}} |
||||
{{#if meta.oembedUrl}} |
||||
<a href="{{meta.oembedUrl}}">{{meta.oembedTitle}}</a><br/> |
||||
{{/if}} |
||||
{{/if}} |
||||
{{#if meta.oembedTitle}} |
||||
{{#if meta.oembedUrl}} |
||||
<br class="only-after-a"/> |
||||
<a href="{{meta.oembedUrl}}">{{meta.oembedTitle}}</a> |
||||
{{/if}} |
||||
{{/if}} |
||||
{{#if collapsed}} |
||||
<span class="collapse-switch icon-right-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span><br/> |
||||
{{else}} |
||||
<span class="collapse-switch icon-down-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span><br/> |
||||
{{#if meta.oembedDescription}} |
||||
<p>{{meta.oembedDescription}}</p> |
||||
{{/if}} |
||||
{{{meta.oembedHtml}}} |
||||
</blockquote> |
||||
{{/if}} |
||||
{{/if}} |
||||
</blockquote> |
||||
{{/if}} |
||||
</template> |
||||
|
||||
@ -1,20 +1,23 @@ |
||||
<template name="oembedImageWidget"> |
||||
{{#if showImage}} |
||||
{{#if parsedUrl}} |
||||
<div> |
||||
<a href="{{url}}" class="swipebox" target="_blank"> |
||||
<div class="inline-image" style="background-image: url('{{url}}');"> |
||||
<img src="{{url}}" height="200"> |
||||
</div> |
||||
</a> |
||||
</div> |
||||
{{/if}} |
||||
{{else}} |
||||
{{#if parsedUrl}} |
||||
<div class="image-to-download" data-url="{{url}}"> |
||||
<i class="icon-picture"></i> |
||||
<div>click to load</div> |
||||
</div> |
||||
{{#if parsedUrl}} |
||||
{{#if collapsed}} |
||||
<span class="collapse-switch icon-right-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span> |
||||
{{else}} |
||||
<span class="collapse-switch icon-down-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span> |
||||
{{#if loadImage}} |
||||
<div> |
||||
<a href="{{url}}" class="swipebox" target="_blank"> |
||||
<div class="inline-image" style="background-image: url('{{url}}');"> |
||||
<img src="{{url}}" height="200"> |
||||
</div> |
||||
</a> |
||||
</div> |
||||
{{else}} |
||||
<div class="image-to-download" data-url="{{url}}"> |
||||
<i class="icon-picture"></i> |
||||
<div>click to load</div> |
||||
</div> |
||||
{{/if}} |
||||
{{/if}} |
||||
{{/if}} |
||||
</template> |
||||
|
||||
@ -0,0 +1,7 @@ |
||||
Template.oembedYoutubeWidget.helpers |
||||
|
||||
collapsed: -> |
||||
if this.collapsed? |
||||
return this.collapsed |
||||
else |
||||
return Meteor.user()?.settings?.preferences?.collapseMediaByDefault is true |
||||
@ -1,9 +1,14 @@ |
||||
<template name="oembedYoutubeWidget"> |
||||
{{#if parsedUrl}} |
||||
<blockquote> |
||||
<a href="{{url}}">{{parsedUrl.host}}</a><br> |
||||
<iframe width="355" height="200" src="{{meta.twitterPlayer}}" frameborder="0" allowfullscreen></iframe><br> |
||||
{{{meta.description}}} |
||||
<a href="{{url}}">{{parsedUrl.host}}</a> |
||||
{{#if collapsed}} |
||||
<span class="collapse-switch icon-right-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span><br> |
||||
{{else}} |
||||
<span class="collapse-switch icon-down-dir" data-url="{{url}}" data-collapsed="{{collapsed}}"></span><br> |
||||
<iframe width="355" height="200" src="{{meta.twitterPlayer}}" frameborder="0" allowfullscreen></iframe><br> |
||||
{{{meta.description}}} |
||||
{{/if}} |
||||
</blockquote> |
||||
{{/if}} |
||||
</template> |
||||
</template> |
||||
|
||||
Loading…
Reference in new issue