<%inherit file="marketing.html" />
<%namespace name='static' file='static_content.html'/>

<%block name="header_class">home</%block>

<section class="index-content">
  <section class="about">

    <section class="intro">
      <section class="intro-text">
      <p><em>MITx</em>  will offer a portfolio of MIT courses for free to a virtual community of learners around the world. It will also enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences.</p>
      <p>The first <em>MITx</em> course, 6.002x (Circuits and Electronics), was launched in an experimental prototype form. Watch this space for further upcoming courses, which will become available in Fall 2012.</p>
      </section>

    <section class="intro-video">
      <a id="video-overlay-link" rel="leanModal" href="#video-overlay"><img src="${static.url('images/video-image.png')}" id="video-img" alt="Link to MITx introduction video" /><span> Watch intro video</span></a>
    </section>

    </section>

    <section class="features">
      <h2><em>MIT<span>x</span></em> courses will be offered on an online learning platform that:</h2>

      <ul>
        <li>organizes and presents course material to enable students to learn worldwide</li>
        <li>features interactive instruction, online laboratories and student-to-student and student-to-professor communication</li>
        <li>allows for the individual assessment of any student&rsquo;s work and allows students who demonstrate their mastery of subjects to earn certificates awarded by <em>MITx</em></li>
        <li>operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.</li>
      </ul>

      <p><strong>Press &amp; links:</strong> <a href="/6002x-press-release.html">6.002x Press Release</a>, <a href="/6002x-faq.html">6.002x FAQ</a>, <a href="/mitx-overview.html">MITx overview</a>, <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a>, <a href="http://ocw.mit.edu/index.htm" target="_blank">OpenCourseWare</a></p>
    </section>

  </section>

  <section class="course">
    <div class="announcement">
      <h1> Announcement </h1>
<img src="/static/images/marketing/edx-logo.png" alt="" />
      <p>
      On May 2, it was announced that Harvard University will join MIT as a partner in edX.  MITx, which offers online versions of MIT courses, will be a core offering of edX, as will Harvardx, a set of course offerings from Harvard.
      </p>

      <p class="announcement-button">
        <a href="http://edxonline.org">Read more details here <span class="arrow">&#8227;</span></a>
      </p>
    </div>

  <hgroup>
  <h1>Spring 2012 Course offering</h1>
  <h2>Circuits and Electronics</h2>
  <h3>6.002x</h3>
  </hgroup>

    <p>
      <a href="http://6002x.mitx.mit.edu/" class="more-info">More information <span>&amp;</span> Enroll <span class="arrow">&#8227;</span></a>
    </p>

    <p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course is running, free of charge, for students worldwide from March 5, 2012 through June 8, 2012. Students are given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
  </section>
</section>

<div id="video-overlay" class="leanModal_box">
  <iframe id="player" type="text/html" width="560" height="390" src="http://www.youtube.com/embed/p2Q6BrNhdh8?enablejsapi=1" frameborder="0">
  </iframe>
</div>

<%block name="js_extra">
<script>

var player;
function onYouTubePlayerAPIReady() {
  player = new YT.Player('player', {
  });
}

$(function() {

    var tag = document.createElement('script');
    tag.src = "http://www.youtube.com/player_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

    $("a#video-overlay-link").click(function(){
      player.playVideo();
      $("a.modal_close, #lean_overlay").click(function(){
        player.pauseVideo();
      });
    });


    // TODO: Clean up as per http://stackoverflow.com/questions/169506/obtain-form-input-fields-using-jquery

    /* Handles when the user hits 'enroll'. Grabs form data. Does AJAX.
            Either shows error, or shows success. */

    $('#create_account_button').click(function() {
      var submit_data={};
      $.each($("[id^=ca_]"), function(index,value){
        submit_data[value.name]=value.value;
      });
      $.each($("[id^=cb_]"), function(index,value){
        submit_data[value.name]=value.checked;
      });

        postJSON('/create_account',
           submit_data,
           function(json) {
               if(json.success) {
                  $('#enroll').html(json.value);
               } else {
                  $('#enroll_error').html(json.value);
               }
             }
        );
    });

    /* Activate stupid spinner drop-downs in enrollment form */
    var spinner_array=$("[id^=spinner_]");
       spinner_array.each(function(i) {
          var s=spinner_array[i];
          $("#"+s.id).click(function(){
             $("#sregion"+s.id.substring(7)).toggle();
          });
        })

   /*$("sregion"+$("[id^=spinner_]")[1].id.substring(7)) */
});

</script>
</%block>
