layout improvements
This commit is contained in:
parent
9390f8e53f
commit
eddb199291
83 changed files with 21481 additions and 23588 deletions
67
6_video.html
67
6_video.html
|
|
@ -25,36 +25,46 @@ permalink: /video/
|
|||
|
||||
{% assign allTopicsABC = allTopics | sort %}
|
||||
|
||||
<div class="button-group filter-button-group">
|
||||
<button data-filter="*">show all</button>
|
||||
{% for thisTopic in allTopicsABC %}
|
||||
<button data-filter=".{{thisTopic | strip | replace: " ", "-"}}">{{thisTopic | capitalize }}</button>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="content container-fluid">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="dark_bg col-md-10 col-md-offset-1">
|
||||
|
||||
<div class="button-group filter-button-group">
|
||||
<button data-filter="*">show all</button>
|
||||
{% for thisTopic in allTopicsABC %}
|
||||
<button data-filter=".{{thisTopic | strip | replace: " ", "-"}}">{{thisTopic | capitalize }}</button>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div id="video-roster" class="content container-fluid">
|
||||
<div id="video-roster">
|
||||
|
||||
{% for post in site.posts %}
|
||||
{% for talk in post.talks %}
|
||||
{% if talk.talk_video_url %}
|
||||
{% assign vimeo_id = talk.talk_video_url %}
|
||||
{% if talk.topics %}
|
||||
{% assign tags = (talk.topics | split:",") %}
|
||||
{% endif %}
|
||||
<div class="videobox {% for tag in tags | uniq %}{{tag | strip | replace: " ", "-" | downcase}} {% endfor %}{{post.location | strip | replace: " ", "-" | downcase}}" vimeo="{{vimeo_id}}">
|
||||
<div class="video-title">{{talk.artist}}</div>
|
||||
<img class="playbutton" src="/images/play-button.png" />
|
||||
<div class="video-description"><h3>{{talk.title}}</h3><p><span class="video-session">#{{ post.number }}</span>: <span class="video-artist">{{talk.artist}}</span> / {{talk.artist_website}} – {{talk.description}}</p></div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% for post in site.posts %}
|
||||
{% for talk in post.talks %}
|
||||
{% if talk.talk_video_url %}
|
||||
{% assign vimeo_id = talk.talk_video_url %}
|
||||
{% if talk.topics %}
|
||||
{% assign tags = (talk.topics | split:",") %}
|
||||
{% endif %}
|
||||
<div class="videobox {% for tag in tags | uniq %}{{tag | strip | replace: " ", "-" | downcase}} {% endfor %}{{post.location | strip | replace: " ", "-" | downcase}} col-md-3" vimeo="{{vimeo_id}}">
|
||||
<div class="video-title">{{talk.artist}}</div>
|
||||
<img class="playbutton" src="/images/play-button.png" />
|
||||
<div class="video-description"><h3>{{talk.title}}</h3><p><span class="video-session">#{{ post.number }}</span>: <span class="video-artist">{{talk.artist}}</span> / {{talk.artist_website}} – {{talk.description}}</p></div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
<div id="videotext"></div>
|
||||
<div id="videotext"></div>
|
||||
|
||||
<div id="videoplayer">
|
||||
<div id="player"></div>
|
||||
<div id="close-button"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="videoplayer">
|
||||
<div id="player"></div>
|
||||
<div id="close-button"></div>
|
||||
</div>
|
||||
|
||||
</div> <!-- container -->
|
||||
|
|
@ -62,7 +72,9 @@ permalink: /video/
|
|||
<script>
|
||||
|
||||
jQuery( document ).ready(function() {
|
||||
|
||||
jQuery('.videobox').each(function() {
|
||||
|
||||
var $this = jQuery(this);
|
||||
jQuery.getJSON('https://vimeo.com/api/oembed.json?url=' + encodeURIComponent(jQuery(this).attr('vimeo')), {format: "json"}, function(data) {
|
||||
$this.css('background', 'url("' + data.thumbnail_url + '")');
|
||||
|
|
@ -76,10 +88,13 @@ permalink: /video/
|
|||
if( offset.left > center) {
|
||||
jQuery('#videotext').css('right', '');
|
||||
jQuery('#videotext').css('left', '20px');
|
||||
jQuery('#videotext').css('top', '80px');
|
||||
} else {
|
||||
jQuery('#videotext').css('left', '');
|
||||
jQuery('#videotext').css('right', '20px');
|
||||
jQuery('#videotext').css('top', '80px');
|
||||
}
|
||||
|
||||
jQuery('#videotext').html($this.html());
|
||||
$this.find("img").show();
|
||||
timer = window.setTimeout(function() {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue