extends layouts/main
block content
  
  mixin renderSidebarEpisode(episode)
    .uk-card.uk-card-secondary.uk-card-small.uk-card-hover

      .uk-card-media-top
        a(href= episode.url, target="_blank", title="Watch on Gab TV")
          img(src=episode.image).responsive

      .uk-card-body
        .uk-card-title.uk-margin-remove.uk-text-truncate
          a(href= episode.url, target="_blank", title= `Watch "${episode.title}" on Gab TV`)= episode.title
        .uk-text-small Posted: #{moment(episode.date_modified).format("MMM DD YYYY HH:MM a")}

  .uk-padding
    .uk-container
      //- Main Content Grid
      div(uk-grid)
        //- Main Content Column
        .uk-width-2-3
          section.uk-section.uk-section-default.uk-padding-remove 
            h3.uk-heading-bullet Featured
            //- Featured Block
            .uk-margin
              div(style="position: relative; overflow: hidden; width: 100%; padding-top: 56.25%")
                iframe(
                  src="https://tv.gab.com/channel/mrjoeprich/embed/what-is-just-joe-radio-61ad9b2165a83d20e95a465d",
                  width="960",
                  height="540",
                  style="position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%;",
                )
            //- Blog Posts
            .uk-section.uk-section-default.uk-section-small
              h3.uk-heading-bullet Blog Posts
              div(uk-grid)
                .uk-width-1-3
                  img(src="/img/default-poster.jpg").responsive
                .uk-width-2-3
                  h4.uk-margin-remove This is a Blog Title
                  .uk-margin.uk-margin-small This is a short description for blog post.
                  div.uk-text-small Published: #{moment(new Date()).format("MMM DD YYYY HH:MM a")}

            //- pre= JSON.stringify(gabTvChannel, null, 2)
        
        //- Sidebar
        .uk-width-1-3
          //- Gab TV 3 Most Recent Episodes
          .uk-margin
            h3.uk-heading-bullet Gab TV
            ul.uk-list
              each episode in gabTvChannel.items.slice(0, 3)
                li
                  +renderSidebarEpisode(episode)
          //- Newsletter Signup
          .uk-margin
            form(method="post", action="/newsletter").uk-form
              .uk-card.uk-card-secondary.uk-card-small

                .uk-card-body
                  .uk-card-title.uk-border-bottom.uk-heading-bullet Mailing List
                  p Join the #{site.name} FREE newsletter to get show updates in your inbox.

                  .uk-margin
                    label(for="email").uk-form-label.sr-only Email Address
                    input(id="email", name="email", type="email", placeholder="johnsmith@example.com").uk-input

                .uk-card-footer
                  button(type="submit").uk-button.uk-button-primary Sign Up