merge sgarrity/bug-747029
|
@ -5,7 +5,7 @@
|
|||
{% block body_id %}marketplace{% endblock %}
|
||||
|
||||
{% block site_header_logo %}
|
||||
<h2><img src="/media/img/marketplace/title.png" height="70" width="256" alt="Mozilla Marketplace"></h2>
|
||||
<h2><img src="{{ media('/img/marketplace/title.png') }}" height="70" width="256" alt="Mozilla Marketplace"></h2>
|
||||
{% endblock %}
|
||||
|
||||
{% block site_header_nav %}
|
||||
|
@ -68,7 +68,9 @@
|
|||
</video>
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
||||
{% block email_form %}
|
||||
{% if not success %}
|
||||
<form class="container" id="apps-email-form" action="#apps-email-form" method="post">
|
||||
|
||||
|
@ -80,12 +82,11 @@
|
|||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
<h3>Email signup</h3>
|
||||
<div class="row">
|
||||
|
||||
<p class="span3">Sign up for more news about the Mozilla Marketplace.</p>
|
||||
<h4 class="span4">Sign up for more news about the Mozilla Marketplace.</h4>
|
||||
|
||||
<div class="span5">
|
||||
<div class="span4">
|
||||
<div class="{% if form.email.errors %}field-error{% endif %}">
|
||||
{{ field_with_attrs(form.email, placeholder='YOUR EMAIL HERE')|safe }}
|
||||
</div>
|
||||
|
@ -115,9 +116,9 @@
|
|||
</div>
|
||||
</form>
|
||||
{% else %}
|
||||
<div class="container thank">
|
||||
<div class="container thank" id="apps-email-form">
|
||||
<h3>Thank you for signing up!</h3>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
|
||||
|
|
|
@ -0,0 +1,196 @@
|
|||
{% extends "marketplace/marketplace.html" %}
|
||||
|
||||
{% block page_title_prefix %}{% endblock %}
|
||||
{% block page_title %}Mozilla Marketplace Partners{% endblock %}
|
||||
{% block body_id %}marketplace-partners{% endblock %}
|
||||
|
||||
{% block site_header_logo %}
|
||||
<h2><a href="{{ url('b2g') }}"><img src="{{ media('/img/marketplace/title.png') }}" height="70" width="256" alt="Mozilla Marketplace"></a></h2>
|
||||
{% endblock %}
|
||||
|
||||
{% block site_header_nav %}
|
||||
{% endblock %}
|
||||
|
||||
{% block extrahead %}
|
||||
{{ css('marketplace') }}
|
||||
{{ css('video') }}
|
||||
{% endblock %}
|
||||
|
||||
{% block js %}
|
||||
{{ js('marketplace') }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<hgroup id="main-feature">
|
||||
<h1>Launch your app on the Web</h1>
|
||||
<h2>Mozilla is bringing its core values — openness, freedom, user choice — to the world of apps.</h2>
|
||||
</hgroup>
|
||||
|
||||
<nav class="billboard menu-bar">
|
||||
<ul>
|
||||
<li><a href="#platform">The Mozilla apps platform</a></li>
|
||||
<li><a href="#marketplace">Mozilla Marketplace</a></li>
|
||||
<li><a href="http://marketplace.mozilla.org/" class="button-blue">Submit your app »<span class="icon"></span></a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<section id="platform" class="container divider">
|
||||
<div class="row">
|
||||
|
||||
<div class="span4">
|
||||
<h2>The Mozilla apps platform</h2>
|
||||
<p>Building apps for the Web provides developers with full control over content, functionality and how apps are distributed, including access to hundreds of millions of Firefox users through the Mozilla Marketplace.</p>
|
||||
<p>Using open Web standards and Mozilla-designed APIs, great app experiences can be delivered across multiple platforms, devices and operating systems — closing the gap between Web and native apps for the first time.</p>
|
||||
<p id="mdn-link"><a href="https://developer.mozilla.org/en-US/apps">Learn all about creating HTML5 apps at the Mozilla Developer Network »</a></p>
|
||||
</div>
|
||||
|
||||
<div class="pager pager-with-tabs">
|
||||
|
||||
<div class="pager-content">
|
||||
|
||||
<div class="audiovroom-content default-page pager-page" id="audiovroom">
|
||||
<div class="mozilla-video-control mozilla-video-shadow">
|
||||
<video
|
||||
width="528"
|
||||
height="297"
|
||||
poster="{{ media('/img/marketplace/poster-audiovroom.jpg') }}"
|
||||
controls="controls">
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Audiovroom.webm" type="video/webm" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Audiovroom.theora.ogv" type="video/ogg; codecs="theora, vorbis"" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Audiovroom-360p-mp4.mp4" type="video/mp4" />
|
||||
<object type="application/x-shockwave-flash"
|
||||
style="width: 528px; height: 317px;"
|
||||
data="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_Audiovroom-360p-mp4.mp4&autoplay=false&msg=Play%20Video">
|
||||
<param name="movie" value="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_Audiovroom-360p-mp4.mp4&autoplay=false&msg=Play%20Video" />
|
||||
<param name="wmode" value="transparent" />
|
||||
<div class="video-player-no-flash">
|
||||
This video requires a browser with support for open video
|
||||
or the <a href="http://www.adobe.com/go/getflashplayer">Adobe Flash Player</a>.
|
||||
</div>
|
||||
</object>
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mobbase-content pager-page" id="mobbase">
|
||||
<div class="mozilla-video-control mozilla-video-shadow">
|
||||
<video
|
||||
width="528"
|
||||
height="297"
|
||||
poster="{{ media('/img/marketplace/poster-mobbase.jpg') }}"
|
||||
controls="controls">
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Mixmatchmusic.webm" type="video/webm" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Mixmatchmusic-360p-mp4.theora.ogv" type="video/ogg; codecs="theora, vorbis"" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Mixmatchmusic-360p-mp4.mp4" type="video/mp4" />
|
||||
<object type="application/x-shockwave-flash"
|
||||
style="width: 528px; height: 317px;"
|
||||
data="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_Mixmatchmusic-360p-mp4.mp4&autoplay=false&msg=Play%20Video">
|
||||
<param name="movie" value="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_Mixmatchmusic-360p-mp4.mp4&autoplay=false&msg=Play%20Video" />
|
||||
<param name="wmode" value="transparent" />
|
||||
<div class="video-player-no-flash">
|
||||
This video requires a browser with support for open video
|
||||
or the <a href="http://www.adobe.com/go/getflashplayer">Adobe Flash Player</a>.
|
||||
</div>
|
||||
</object>
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="teambox-content pager-page" id="teambox">
|
||||
<div class="mozilla-video-control mozilla-video-shadow">
|
||||
<video
|
||||
width="528"
|
||||
height="297"
|
||||
poster="{{ media('/img/marketplace/poster-teambox.jpg') }}"
|
||||
controls="controls">
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Teambox.webm" type="video/webm" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Teambox-360p-mp4.theora.ogv" type="video/ogg; codecs="theora, vorbis"" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_Teambox-360p-mp4.mp4" type="video/mp4" />
|
||||
<object type="application/x-shockwave-flash"
|
||||
style="width: 528px; height: 317px;"
|
||||
data="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_Teambox-360p-mp4.mp4&autoplay=false&msg=Play%20Video">
|
||||
<param name="movie" value="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_Teambox-360p-mp4.mp4&autoplay=false&msg=Play%20Video" />
|
||||
<param name="wmode" value="transparent" />
|
||||
<div class="video-player-no-flash">
|
||||
This video requires a browser with support for open video
|
||||
or the <a href="http://www.adobe.com/go/getflashplayer">Adobe Flash Player</a>.
|
||||
</div>
|
||||
</object>
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="kicksend-content pager-page" id="kicksend">
|
||||
<div class="mozilla-video-control mozilla-video-shadow">
|
||||
<video
|
||||
width="528"
|
||||
height="297"
|
||||
poster="{{ media('/img/marketplace/poster-kicksend.jpg') }}"
|
||||
controls="controls">
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_kicksend%202.webm" type="video/webm" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_kicksend-360p-mp4.theora.ogv" type="video/ogg; codecs="theora, vorbis"" />
|
||||
<source src="//videos-cdn.mozilla.net/serv/drafts/Moz_Market_kicksend-360p-mp4.mp4" type="video/mp4" />
|
||||
<object type="application/x-shockwave-flash"
|
||||
style="width: 528px; height: 317px;"
|
||||
data="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_kicksend-360p-mp4.mp4&autoplay=false&msg=Play%20Video">
|
||||
<param name="movie" value="/media/flash/playerWithControls.swf?flv=serv/drafts/Moz_Market_kicksend-360p-mp4.mp4&autoplay=false&msg=Play%20Video" />
|
||||
<param name="wmode" value="transparent" />
|
||||
<div class="video-player-no-flash">
|
||||
This video requires a browser with support for open video
|
||||
or the <a href="http://www.adobe.com/go/getflashplayer">Adobe Flash Player</a>.
|
||||
</div>
|
||||
</object>
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
<ul class="pager-tabs">
|
||||
<li>
|
||||
<a href="#audiovroom">
|
||||
<img src="{{ media('/img/marketplace/poster-audiovroom.jpg') }}" alt="Audiovroom" />
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#mobbase">
|
||||
<img src="{{ media('/img/marketplace/poster-mobbase.jpg') }}" alt="MobBase" />
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#teambox">
|
||||
<img src="{{ media('/img/marketplace/poster-teambox.jpg') }}" alt="Teambox" />
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#kicksend">
|
||||
<img src="{{ media('/img/marketplace/poster-kicksend.jpg') }}" alt="Kicksend" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="marketplace" class="container">
|
||||
|
||||
<img src="{{ media('/img/marketplace/opening-soon.png') }}" alt="Opening Soon" id="soon" />
|
||||
|
||||
<div class="span6">
|
||||
|
||||
<h2>Mozilla Marketplace — <em>Opening Soon</em></h2>
|
||||
<p>Before the public launch later this year, Mozilla will be opening the Marketplace for user testing. Take advantage of this by being one of the first app developers to build a user base. Submit your app to:</p>
|
||||
<ul>
|
||||
<li id="test">Test your app with a committed group of early adopters.</li>
|
||||
<li id="build">Build an early fan base and gain popularity.</li>
|
||||
<li id="target">Target tech savvy consumers with your app.</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
{% endblock %}
|
|
@ -1,6 +1,8 @@
|
|||
from django.conf.urls.defaults import *
|
||||
from views import marketplace
|
||||
from views import marketplace, partners
|
||||
from bedrock_util import secure_required
|
||||
|
||||
urlpatterns = patterns('',
|
||||
(r'^$', marketplace),
|
||||
(r'^$', secure_required(marketplace)),
|
||||
(r'^partners/$', partners),
|
||||
)
|
||||
|
|
|
@ -2,6 +2,7 @@ import l10n_utils
|
|||
from django.conf import settings
|
||||
from django.core.validators import email_re
|
||||
from django.views.decorators.csrf import csrf_exempt
|
||||
from bedrock_util import secure_required
|
||||
|
||||
import basket
|
||||
|
||||
|
@ -24,3 +25,19 @@ def marketplace(request):
|
|||
"marketplace/marketplace.html",
|
||||
{'form': form,
|
||||
'success': success})
|
||||
@csrf_exempt
|
||||
@secure_required
|
||||
def partners(request):
|
||||
success = False
|
||||
form = NewsletterForm(request.POST or None)
|
||||
|
||||
if request.method == 'POST':
|
||||
if form.is_valid():
|
||||
data = form.cleaned_data
|
||||
basket.subscribe(data['email'], 'app-dev', format=data['fmt'])
|
||||
success = True
|
||||
|
||||
return l10n_utils.render(request,
|
||||
"marketplace/partners.html",
|
||||
{'form': form,
|
||||
'success': success})
|
||||
|
|
|
@ -1,6 +1,17 @@
|
|||
@import "sandstone/variables.less";
|
||||
@import "sandstone/mixins.less";
|
||||
|
||||
@font-face {
|
||||
font-family: 'Lobster';
|
||||
src: url('/media/fonts/Lobster_1.3-webfont.eot');
|
||||
src: url('/media/fonts/Lobster_1.3-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('/media/fonts/Lobster_1.3-webfont.woff') format('woff'),
|
||||
url('/media/fonts/Lobster_1.3-webfont.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
hgroup {
|
||||
text-align: center;
|
||||
padding-top: @baseLine * 2;
|
||||
|
@ -72,3 +83,115 @@ hgroup {
|
|||
#id_email {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
#marketplace-partners {
|
||||
#main-feature {
|
||||
padding-top: @baseLine;
|
||||
h2 {
|
||||
font-size: 28px;
|
||||
letter-spacing: -0.5px;
|
||||
width: 75%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-bar {
|
||||
.button-blue {
|
||||
padding-left: 60px;
|
||||
position: relative;
|
||||
.icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 20px;
|
||||
height: 48px;
|
||||
width: 48px;
|
||||
display: block;
|
||||
|
||||
background-image: url(/media/img/marketplace/list-icons.png);
|
||||
background-position: 0 100%;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#platform {
|
||||
.pager {
|
||||
.span(6);
|
||||
}
|
||||
.pager-tabs {
|
||||
@videoNavColCount: 6;
|
||||
@videoNavThumbCount: 4;
|
||||
@videoNavWidth: (@gridColumnWidth * @videoNavColCount) + (@gridGutterWidth * (@videoNavColCount - 1));
|
||||
@videoNavTabWidth: (@videoNavWidth - (@gridGutterWidth * 3)) / @videoNavThumbCount;
|
||||
li {
|
||||
list-style-type: none;
|
||||
float: left;
|
||||
width: @videoNavTabWidth;
|
||||
margin-left: @gridGutterWidth;
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
img {
|
||||
padding: 6px;
|
||||
background: #fff;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 6px;
|
||||
width: @videoNavTabWidth - 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pager-page {
|
||||
display: none;
|
||||
}
|
||||
.default-page {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
#mdn-link {
|
||||
margin-bottom: 0;
|
||||
a {
|
||||
.open-sans-light;
|
||||
.inline-block;
|
||||
padding: 0 0 0 48px;
|
||||
background: url(/media/img/marketplace/html5.png) 0 50% no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
#marketplace {
|
||||
position: relative;
|
||||
#soon {
|
||||
.span(4);
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
}
|
||||
h2 em {
|
||||
font-family: Lobster;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
color: #c83108;
|
||||
letter-spacing: 0;
|
||||
font-size: 24px;
|
||||
}
|
||||
ul li {
|
||||
padding: @baseLine @baseLine @baseLine (@gridColumnWidth + @gridGutterWidth);
|
||||
background: url(/media/img/marketplace/list-icons.png) 0 0 no-repeat;
|
||||
border-top: 1px dotted @borderColor;
|
||||
margin: 0;
|
||||
list-style-type: none;
|
||||
.open-sans-light;
|
||||
&:first-child {
|
||||
border-top: 0;
|
||||
}
|
||||
&#build {
|
||||
background-position: 0 -100px;
|
||||
}
|
||||
&#target {
|
||||
background-position: 0 -200px;
|
||||
}
|
||||
}
|
||||
.row { position: relative; }
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -0,0 +1,15 @@
|
|||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 26, 2012 09:12:26 AM America/New_York */
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'Lobster13Regular';
|
||||
src: url('Lobster_1.3-webfont.eot');
|
||||
src: url('Lobster_1.3-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('Lobster_1.3-webfont.woff') format('woff'),
|
||||
url('Lobster_1.3-webfont.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
После Ширина: | Высота: | Размер: 1006 B |
После Ширина: | Высота: | Размер: 7.4 KiB |
После Ширина: | Высота: | Размер: 86 KiB |
После Ширина: | Высота: | Размер: 38 KiB |
После Ширина: | Высота: | Размер: 40 KiB |
После Ширина: | Высота: | Размер: 34 KiB |
После Ширина: | Высота: | Размер: 19 KiB |
|
@ -219,6 +219,10 @@ MINIFY_BUNDLES = {
|
|||
'js/geolocation-demo.js',
|
||||
'js/footer-email-form.js',
|
||||
),
|
||||
'marketplace': (
|
||||
'js/mozilla-pager.js',
|
||||
'js/mozilla-video-tools.js',
|
||||
),
|
||||
'pager': (
|
||||
'js/mozilla-pager.js',
|
||||
),
|
||||
|
|