Added a new introduction video to the Master Password website.

Site/2013-05/css/main.css

@@ -189,6 +189,8 @@ header {
     background: black;
     text-shadow: black 0 1px 50px;
     box-shadow: 0 1px 5px #000;
+
+    transition: height 0.3s;
 }
 header .container {
     position: relative;
@@ -327,6 +329,67 @@ header h2 {
     font-size: 2em;
     font-style: oblique;
 }
+header .movie {
+    display: none;
+    background: black;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    padding-top: 40px;
+}
+header.play {
+    height: 94% !important;
+}
+header.play .movie {
+    display: block;
+}
+header.play h1, header.play h2, header.play .box {
+    display: none;
+}
+header .moviecontrol {
+    display: block;
+    position: absolute;
+    z-index: 9;
+    top: 50%;
+    left: 50%;
+    margin-top: -.5em;
+    margin-left: -.5em;
+
+    font-size: 400%;
+    vertical-align: middle;
+}
+header .moviecontrol::before {
+    content: "▶";
+}
+header .moviecontrol:hover {
+    text-decoration: none;
+}
+header.play .moviecontrol {
+    right: 1em;
+    bottom: 1em;
+    left: auto;
+    top: auto;
+}
+header.play .moviecontrol::before {
+    content: "❙❙";
+}
+header .movie:before {
+    display: block;
+    content: " ";
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: url('../img/video-pattern.png') repeat;
+    background: url('../img/video-bg.png') no-repeat scroll 50% 100%/cover transparent;
+}
+header .movie video {
+    width: 100%;
+    height: 100%;
+    height: calc(100% - 40px);
+    height: auto;
+}
 footer {
     overflow: hidden;
     text-align: center;

Site/2013-05/index.html

@@ -57,26 +57,20 @@
             <div class="background" data-stellar-ratio="0.4"></div>
             <div class="container">
 
+                <div class="movie">
+                    <video>
+                        <source src="vid/about.webm" type="video/webm; codecs=vp8,vorbis">
+                        <source src="vid/about.mp4" type="video/mp4">
+                        <source src="vid/about.ogv" type="video/ogg; codecs=theora,vorbis">
+                    </video>
+                </div>
+                <a href="javascript:toggleMovie()" class="moviecontrol" onclick="$(this).toggleClass('active');_gaq.push(['_trackPageview', '/video/about']);"></a>
+
                 <div class="content">
                     <h1>Master Password</h1>
                     <h2>Secure your life, forget your passwords.</h2>
                 </div>
             
-                <div class="box effect-8" onclick="$(this).toggleClass('active');_gaq.push(['_trackPageview', '/video/yt/QTfA0O7YnHQ']);">
-                    <div class="minimized">
-                        <img class="fit-height" src="http://i.vimeocdn.com/video/318668169_960.jpg" />
-                        <div class="middle play"></div>
-                    </div>
-                    <div class="maximized">
-                        <iframe id="youtube" type="text/html" width="853" height="480" frameborder="0"
-                            webkitAllowFullScreen mozallowfullscreen allowFullScreen
-                            src="http://www.youtube-nocookie.com/embed/QTfA0O7YnHQ?autohide=1&amp;autoplay=0&amp;rel=0&amp;showinfo=0&amp;theme=light&amp;color=white"></iframe>
-                        <!--iframe id="vimeo" type="text/html" width="853" height="480" frameborder="0"
-                            webkitAllowFullScreen mozallowfullscreen allowFullScreen
-                            src="http://player.vimeo.com/video/45803664?autoplay=1&amp;title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff"></iframe-->
-                    </div>
-                </div>
-
             </div>
         </header>
 

Site/2013-05/js/main.js

@@ -6,3 +6,13 @@ $(function(){
     };
 });
 
+function toggleMovie() {
+    if ($("header").hasClass("play")) {
+        $("header").removeClass("play");
+        $("header video")[0].pause();
+    } else {
+        $("header").addClass("play");
+        $("header video")[0].play();
+    }
+}
+

Site/2013-05/vid/about.mov

@@ -0,0 +1 @@
+/Users/lhunath/Movies/About Master Password.mov

Site/2013-05/what.html

@@ -154,6 +154,14 @@
                     <p>Two factor authentication is defined as authenticating yourself with two methods that are so distinct that a single attack cannot compromise both.  Many sites claim to use two-factor authentication but actually rely only on an extra password hidden in an app on your phone or computer.  If an attacker can steal your master password, he can probably download the hidden password too.  Or read in your two-factor response while you're typing it in.  On top of that, you're using a password manager: after your "two-factor" authentication, you get a single password to perform another one-factor authentication with a site.  As a hacker, I'd go for the weakest link to break your chain.</li>
                 </ul>
 
+                <h2>You speak of trust, how can I trust you?</h2>
+                <p>A very valid question, and arguably the most important one to ask!</p>
+                <p>Trust is a very difficult thing to guarantee.  Powerful entities will sollicit your trust by appearing with it and coming well recommended.  Trust can also be assured by legalese or contracts.  If you have the means and energy to hold an entity responsible for his claims and actions, this might be sufficient for you.</p>
+                <p>Most of us mere mortals cannot affort this level of trust enforcement, however.  We're mostly left in the position of trusting claims blindly, in the hopes that companies will not violate those claims for fear of taking a seizable public-relations hit.</p>
+                <p>I propose that none of these forms of trust are sufficient adequate.<br />
+                In fact, Master Password is what it is because it aims to avoid any requirement of trust in the solution's author.  Master Password requires no services or proprietary storage format.  I've published Master Password's algorithm for you to inspect and licensed to you the full source code to the implementations for you to use.</p>
+                <p>What that gives you, is the ability to either inspect and learn how Master Password works or to take this information to a professional (be it an academic, mathematician or payed developer) and have him do this for you.
+
             </div>
 
         </div></section>