{% extends "demos/base.html" %}

{% set obj = submission %}
{% set submit_url=url('demos_submit') %}
{% set login_url='%s?next=%s' % (url('account_login'), submit_url) %}
{% set signup_url=login_url %}

{% block body_attributes %}id="demos-submit"{% endblock %}
{% block bodyclass %}section-demos plain{% endblock %}
{% block title %}
    {{ page_title(_('{subtitle} | Demo Studio') | f(subtitle=_('Submit a New Demo'))) }}
{% endblock %}

{% block content %}

<section id="content">
<div class="wrap">

  <header id="demos-head">
    <h1><a href="{{ url('demos') }}">{{_("Mozilla Demo Studio")}}</a></h1>
  </header>

  <section id="content-main" role="main">
    <header id="page-head" class="form">
      <h1 class="page-title">{{_("Submit a New Demo")}}</h1>

    {% trans %}
        <p>Whether you are creating an amazing new way to experience the Web or just
        experimenting with the latest technologies, we invite you to submit your own
        demos to share with (or show off to) other web developers.</p>
    {% endtrans %}
    </header>

    <div class="modules">
      <div id="before-begin" class="module notes">
        <h3 class="mod-title">{{_('Before You Begin')}}</h3>
        {% trans %}
        <ul>
          <li>You must be prepared to <strong>provide the source code</strong> for your demo. Demos are hosted on the Demo Studio's servers.</li>
          <li>Your demo's source code must be available under an <strong>open license</strong>, such as MPL, GPL, or BSD.</li>
          <li>Your demo should showcase <strong>open web technologies</strong>, such as HTML5 and CSS3.</li>
          <li>Your demo should support a wide range of <strong>modern web browsers</strong>, like Firefox, Chrome, Safari, and Opera.</li>
        </ul>
        {% endtrans %}
      </div>

      <div id="prepare-demo" class="module notes">
          <h3 class="mod-title">{{_('Preparing Your Demo')}}</h3>
        {% trans %}
        <ul>
          <li>Your demo's source code should be packaged inside a <strong>ZIP file</strong>.</li>
          <li>The main page of your demo should be a file named <strong><code>index.html</code></strong> in the root of the ZIP.</li>
          <li>Your demo should be built on <strong>client-side technology</strong> (HTML, CSS, JavaScript). Server-side languages like PHP and Ruby are not supported.</li>
          <li>If your demo requires external resources, it should use <strong>AJAX</strong> to access them.</li>
          <li>Please identify in the demo details box any 3rd party content that can't be licensed under the CC-BY-SA license and include links to the authors' websites.</li>
        </ul>
        {% endtrans %}
      </div>
    </div>

    {% trans %}
        <p>To submit your demo, you need an <strong><a href="{{signup_url}}">MDN profile</a></strong>.</p>
    {% endtrans %}

    <p class="choices">
        <a href="{{login_url}}" class="button">{{_('Log In to Profile')}}</a>
    </p>

  </section>

</div>
</section>
{% endblock %}
