<%! from django.utils.translation import ugettext as _ %>
<%namespace name='static' file='../static_content.html'/>
<%inherit file="../main.html" />

<%block name="title"><title>${_("{edX} Media Kit").format(edX="edX")}</title></%block>

<section class="mediakit">
  <h1>${_("{edX} Media Kit").format(edX="edX")}</h1>

  <hr />

  <div class="wrapper wrapper-mediakit">
    <section class="introduction">
      <header>
        <h2>${_("Welcome to the <span class=\"org-name\">{edX}</span> Media Kit").format(edX="edX")}</h2>
      </header>

      <article>
        <p>${_("Need images for a news story?  Feel free to download high-resolution versions of the photos below by clicking on the thumbnail.  Please credit {edX} in your use.").format(edX="edX")}</p>
        <p>${_("We\'ve included visual guidelines on how to use the {edX} logo within the download zip which also includes Adobe Illustrator and eps versions of the logo. ").format(edX="edX")}</p>
        <p>${_("For more information about {edX}, please contact <strong>{dan_oconnell}, Associate Director of Communications</strong> via <a href=\"mailto:oconnell@edx.org?subject=edX Information Request (from Media Kit)\">oconnell@edx.org</a>.").format(dan_oconnell="Dan O'Connell", edX="edX")}</p>
      </article>

      <aside>
        <h3>${_("The <span class=\"org-name\">{edX}</span> Logo").format(edX="edX")}</h3>
        <figure class="logo">
          <a rel="asset" class="action action-download" href="${static.url('files/edx-identity.zip')}">
            <img src="${static.url('images/edx.png')}" />
            <figcaption>${_(".zip file containing Adobe Illustrator and .eps formats of logo alongside visual guidelines for use")}</figcaption>
            <span class="note">${_("Download (.zip file)")}</span>
          </a>
        </figure>
      </aside>

    </section>

    <section class="library">
      <header>
        <h2>${_("The <span class=\"org-name\">{edX}</span> Media Library").format(edX="edX")}</h2>
      </header>

      <article>
        <ul class="listing listing-media-items">
          <li>
            <figure>
              <a rel="asset" class="action action-download" href="${static.url('images/press-kit/anant-agarwal_high-res.jpg')}">
                <img src="${static.url('images/press-kit/anant-agarwal_x200.jpg')}"/>
                <figcaption>${_("{anant}, President of {edX}, in his office in Cambridge, MA. The computer screen behind him shows a portion of a video lecture from 6.002x, Circuits &amp; Electronics, the MITx course taught by Agarwal.").format(edX="edX", anant="Anant Agarwal")}</figcaption>
                <span class="note">${_("Download (High Resolution Photo)")}</span>
              </a>
            </figure>
          </li>
          <li>
            <figure>
              <a rel="asset" class="action action-download" href="${static.url('images/press-kit/anant-tablet_high-res.jpg')}">
                <img src="${static.url('images/press-kit/anant-tablet_x200.jpg')}"/>
                <figcaption>${_("{anant} creating a tablet-based lecture for 6.002x, Circuits & Electronics.").format(anant="Anant Agarwal")}</figcaption>
                <span class="note">${_("Download (High Resolution Photo)")}</span>
              </a>
            </figure>
          </li>
          <li>
            <figure>
              <a rel="asset" class="action action-download" href="${static.url('images/press-kit/piotr-mitros_high-res.jpg')}">
                <img src="${static.url('images/press-kit/piotr-mitros_x200.jpg')}"/>
                <figcaption>${_("{piotr}, Chief Scientist at {edX}, uses a Rostrum camera to create an overhead camera-based lecture. During this process, voice and video are recorded for an interactive tutorial.").format(edX="edX", piotr="Piotr Mitros")}</figcaption>
                <span class="note">${_("Download (High Resolution Photo)")}</span>
              </a>
            </figure>
          </li>
          <li>
            <figure>
              <a rel="asset" class="action action-download" href="${static.url('images/press-kit/edx-video-editing_high-res.jpg')}">
                <img src="${static.url('images/press-kit/edx-video-editing_x200.jpg')}"/>
                <figcaption>${_("One of {edX}\'s video editors edits a lecture in a video suite.").format(edX="edX")}</figcaption>
                <span class="note">${_("Download (High Resolution Photo)")}</span>
              </a>
            </figure>
          </li>
          <li>
            <figure>
              <a rel="asset" class="action action-download" href="${static.url('images/press-kit/6.002x_high-res.png')}">
                <img src="${static.url('images/press-kit/6.002x_x200.jpg')}"/>
                <figcaption>${_("Screenshot of 6.002x Circuits and Elecronics course.")}</figcaption>
                <span class="note">${_("Download (High Resolution Photo)")}</span>
              </a>
            </figure>
          </li>
          <li>
            <figure>
              <a rel="asset" class="action action-download" href="${static.url('images/press-kit/3.091x_high-res.png')}">
                <img src="${static.url('images/press-kit/3.091x_x200.jpg')}"/>
                <figcaption>${_("Screenshot of 3.091x: Introduction to Solid State Chemistry.")}</figcaption>
                <span class="note">${_("Download (High Resolution Photo)")}</span>
              </a>
            </figure>
          </li>
        </ul>
      </article>
    </section>
  </div>
</section>

<%block name="js_extra">
   <script type="text/javascript">
      $('a[rel="external"],a[rel="asset"]').click( function() {
        window.open( $(this).attr('href') );
        $(this).attr('title','This link will open a new browser window/tab')
        return false;
      });
   </script>
</%block>
