xtag updates; devhub page updates

This commit is contained in:
Jen Fong-Adwent 2012-08-28 16:05:35 -04:00
Родитель f5de0b4c35
Коммит d49387687c
18 изменённых файлов: 207 добавлений и 222 удалений

Просмотреть файл

@ -58,10 +58,6 @@
&.marketing-block {
padding-top: 0px;
}
ol {
list-style-type: disc;
}
}
pre {
@ -72,7 +68,8 @@ pre {
.sample-run-js {
clear: both;
float: left;
margin: 10px 0 30px;
margin: 10px 0 10px;
min-height: 100px;
outline: none;
width: 100%;

Просмотреть файл

@ -192,9 +192,9 @@ body {
li.splash {
min-height: 300px;
margin: 0 auto;
max-width: 462px;
max-width: 480px;
text-align: center;
width: 462px;
width: 480px;
}
}
@ -254,6 +254,14 @@ body {
color: @medium-gray;
display: block;
text-decoration: none;
ul {
padding: 0;
li {
list-style: none;
}
}
}
}
}
@ -275,6 +283,10 @@ body {
h2, ul {
padding-left: 300px;
}
ul li {
list-style: none;
}
}
}

Просмотреть файл

@ -0,0 +1,93 @@
/* These are all the custom Javascript triggers for the
* demos in /developers/docs/xtags/*.
*/
$(function() {
// Toast
var triggerToast = document.getElementById('trigger-toast');
var demoBlock = document.getElementById('demo-block');
if (triggerToast) {
triggerToast.addEventListener('click', function(event) {
event.preventDefault();
var toast = document.createElement('x-toast');
toast.innerHTML = 'This is a toast message.';
toast.duration = 3000;
toast.excludeClose = true;
demoBlock.appendChild(toast);
});
}
// Alert
var triggerAlert = document.getElementById('trigger-alert');
if (triggerAlert) {
triggerAlert.addEventListener('click', function(event) {
event.preventDefault();
var alertPopup = document.createElement('x-alert');
alertPopup.primaryText = 'Text for primary button';
alertPopup.secondaryText = 'Text for secondary button';
alertPopup.location = 'center';
demoBlock.appendChild(alertPopup);
});
}
// Select List
var triggerSelect = document.getElementById('trigger-select');
if (triggerSelect) {
triggerSelect.addEventListener('click', function(event) {
event.preventDefault();
event.stopPropagation();
var selectList = document.createElement('x-select-list');
var listContainer = document.createElement('ul');
var listItem = document.createElement('li');
var listItemSecond = document.createElement('li');
listItem.innerHTML = 'Item 1';
listContainer.appendChild(listItem);
listItemSecond.innerHTML = 'Item 2';
listContainer.appendChild(listItemSecond);
selectList.appendChild(listContainer);
selectList.multiSelect = false;
selectList.okText = 'OK';
selectList.location = 'center';
demoBlock.appendChild(selectList);
});
}
// Slide box
document.addEventListener('click', function(e) {
var action = e.target;
var parent = action.parentNode;
var actionType = action.getAttribute('data-action-type');
if (actionType) {
var tag = action.parentElement.parentElement.id,
demo = document.getElementById(tag + '_demo');
switch(actionType) {
case 'slideNext':
demo.xtag.slideNext();
break;
case 'slidePrevious':
demo.xtag.slidePrevious();
break;
case 'slideTo':
demo.xtag.slideTo(2);
break;
case 'slideOrientation':
demo['data-orientation'] =
demo.getAttribute('data-orientation') == 'x' ? 'y' : 'x';
break;
}
}
});
// Customized styling for these demos.
$('x-listview').css({ 'width': '300px' });
$('#slidebox-nav').css({ 'margin': '10px' });
$('x-dropdown-menu').css({ 'position': 'absolute' });
$('x-tab').css({ 'padding': '0 10px 0 10px' });
});

Просмотреть файл

@ -125,6 +125,10 @@ CSS = {
'//raw.github.com/mozilla/xtag-elements/master/slidebox/slidebox.css',
'//raw.github.com/mozilla/xtag-elements/master/slider/slider.css',
'//raw.github.com/mozilla/xtag-elements/master/tabbox/tabbox.css',
'//raw.github.com/mozilla/xtag-elements/master/select-list/select-list.css',
'//raw.github.com/mozilla/xtag-elements/master/date-time-picker/date-time-picker.css',
'//raw.github.com/mozilla/xtag-elements/master/dropdown-menu/dropdown-menu.css',
'//raw.github.com/mozilla/xtag-elements/master/toggle-switch/toggle-switch.css',
),
'mkt/in-app-payments': (
'css/mkt/reset.less',
@ -316,5 +320,10 @@ JS = {
'//raw.github.com/mozilla/xtag-elements/master/slidebox/slidebox.js',
'//raw.github.com/mozilla/xtag-elements/master/slider/slider.js',
'//raw.github.com/mozilla/xtag-elements/master/tabbox/tabbox.js',
'//raw.github.com/mozilla/xtag-elements/master/select-list/select-list.js',
'//raw.github.com/mozilla/xtag-elements/master/date-time-picker/date-time-picker.js',
'//raw.github.com/mozilla/xtag-elements/master/dropdown-menu/dropdown-menu.js',
'//raw.github.com/mozilla/xtag-elements/master/toggle-switch/toggle-switch.js',
'js/mkt/xtag-demos.js',
),
}

Просмотреть файл

@ -118,12 +118,12 @@ tutorials = [
'mdn': 'https://developer.mozilla.org/%(locale)s/docs/Apps/Design_Guidelines/References?raw=1&macros=true'
},
{
'title': 'Firefox Dev Tools',
'title': 'Dev Tools',
'name': 'devtools',
'mdn': 'https://developer.mozilla.org/%(locale)s/docs/Apps/marketplace/App_developer_tools?raw=1&macros=true'
},
{
'title': 'Templates',
'title': 'App Templates',
'name': 'templates',
'mdn': 'https://developer.mozilla.org/%(locale)s/docs/Apps/App_templates?raw=1&macros=true'
},
@ -185,6 +185,7 @@ def _fetch_mdn_page(url):
root = pq(data)
anchors = root.find('a')
images = root.find('img')
if anchors:
# We only want anchors that have an href attribute available.
@ -192,8 +193,14 @@ def _fetch_mdn_page(url):
external_links.each(lambda e: e.attr('target', '_blank'))
mdn_links = external_links.filter(
lambda i: str(pq(this).attr('href')).startswith('/'))
mdn_links.each(lambda e: e.attr('href',
'https://developer.mozilla.org%s' % e.attr('href')))
mdn_links.each(lambda e: e.attr(
'href', 'https://developer.mozilla.org%s' % e.attr('href'))
)
if images:
images.each(lambda e: e.attr(
'src', 'https://developer.mozilla.org%s' % e.attr('src'))
)
return str(root)

Просмотреть файл

@ -1,4 +1,7 @@
{% set logged = request.user.is_authenticated() %}
{% if request.is_ajax() and not SKIP_FRAGMENT %}
{% extends 'mkt/fragment.html' %}
{% endif %}
{% set logged = False %}
<!DOCTYPE html>
<html lang="{{ LANG }}" dir="{{ DIR }}"
{% if settings.USE_APPCACHE and OFFLINE_MANIFEST %}
@ -9,10 +12,15 @@
{% if not settings.ENGAGE_ROBOTS %}
<meta name="robots" content="noindex">
{% endif %}
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
<meta name="viewport" content="width=device-width, user-scalable=no,
initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
{% block extrameta %}{% endblock %}
<title>{% block title %}{{ _('Mozilla Marketplace') }}{% endblock %}</title>
<title>
{%- block title %}
{{ _('Mozilla Marketplace') }}
{% endblock -%}
</title>
<link rel="shortcut icon" type="image/x-icon"
href="{{ MEDIA_URL }}img/mkt/logos/128.png" sizes="128x128">
@ -26,16 +34,12 @@
{% endblock %}
{% block extrahead %}{% endblock %}
{% block debug %}
{% include "mobile/head_debug.html" %}
{% endblock %}
{% if logged %}
<meta name="csrf" content="{{ csrf_token }}">
{% endif %}
</head>
<body class="html-{{ DIR }} {% block bodyclass %}{% endblock %}"
{% if waffle.switch('anonymous-free-installs') %}data-allow-anon-installs="true"{% endif %}
<body id="{{ request.user.is_authenticated() }}"
class="html-{{ DIR }} {% block bodyclass %}{% endblock %}"
{% if waffle.switch('anonymous-free-installs') %}
data-allow-anon-installs="true"
{% endif %}
data-user="{{ user_data(amo_user)|json }}"
data-readonly="{{ settings.READ_ONLY|json }}"
data-media-url="{{ MEDIA_URL }}"
@ -51,17 +55,9 @@
<h1 class="logo"><a href="{{ url('ecosystem.landing') }}">
{{ _('Firefox Marketplace Developers') }}</a></h1>
<nav role="navigation">
{% if not request.user.is_authenticated() %}
<a class="browserid" href="{{ url('users.login') }}?to={{ url('ecosystem.landing') }}">
{{ _('Log in / Register') }}</a>
<a class="external" href="https://developer.mozilla.org/en-US/apps">
{{ _('Reference') }}</a>
{% else %}
<a href="{{ url('submit.app') }}">
{{ _('Submit an App') }}</a>
{% if request.user.is_authenticated() %}
<a href="{{ url('mkt.developers.apps') }}">{{ _('My Apps') }}</a>
<a class="external" href="https://developer.mozilla.org/en-US/apps">{{ _('Reference') }}</a>
<a href="{{ url('users.logout') }}">{{ _('Log out') }}</a>
<a href="{{ url('users.logout') }}" class="post">{{ _('Log out') }}</a>
{% endif %}
</nav>
</div>
@ -100,65 +96,20 @@
</a> or any later version.
{% endtrans %}
</p>
{% block sitefooter_append %}
<ul class="user-actions">
{% if not request.user.is_authenticated() %}
<li>
<a class="browserid" href="{{ url('users.login') }}?to={{ url('ecosystem.landing') }}">
{{ _('Log in / Register') }}</a>
</li>
<li>
<a class="external" href="https://developer.mozilla.org/en-US/apps">
{{ _('Reference') }}</a>
</li>
{% else %}
<li>
<a href="{{ url('submit.app') }}">
{{ _('Submit an App') }}</a>
</li>
<li>
<a href="{{ url('mkt.developers.apps') }}">{{ _('My Apps') }}</a>
</li>
<li>
<a href="https://developer.mozilla.org/en-US/apps">{{ _('Reference') }}</a>
</li>
<li>
<a href="{{ url('users.logout') }}">{{ _('Logout') }}</a>
</li>
{% endif %}
</ul>
{% endblock %}
{% if request.user.is_authenticated() %}
<p>
<a href="{{ url('users.logout') }}"
class="post">{{ _('Log out') }}</a>
</a>
</p>
{% endif %}
</div>
</footer>
{% endblock %}
{% include 'purchase/start.html' %}
{% include 'purchase/message.html' %}
<script type="text/template" id="noApps">
<div class="noApps">You need to be using<br>
<a href="http://nightly.mozilla.org/" target="_blank">
Firefox Nightly</a><br>to install this app.</div>
</script>
{% if not logged %}
{% if logged %}
<div id="login" class="overlay">
<section>
<div class="new">
<h2>{{ _('Please sign in') }}</h2>
<p>
{# TODO(copy): Localize when BrowserID is called Persona. #}
{% with personaid_url='https://browserid.org/' %}
Just log in or register with your
<a href="{{ personaid_url }}">BrowserID</a> account below.
{% endwith %}
</p>
<footer>
<a class="button browserid" href="#">{{ _('Log in / Register') }}</a>
</footer>
</div>
<div class="old">
<h2>Additional authorization required</h2>
<form method="post" action="{{ url('users.login') }}"
@ -189,52 +140,19 @@
</div>
{% endif %}
<svg height="0">
<mask id="tabMaskStart" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox">
<rect width="1" height="1" x="0" y="0.5" fill="white" />
<circle cx="1" cy="0.5" r="0.5" fill="white" />
<circle cx="-.1" cy="0.4" r="0.6" />
</mask>
<mask id="tabMaskEnd" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox">
<rect width="1" height="1" x="0" y="0.5" fill="white" />
<circle cx="0" cy="0.5" r="0.5" fill="white" />
<circle cx="1.1" cy="0.4" r="0.6" />
</mask>
</svg>
<style>
.tabnav span:before {
mask: url(#tabMaskStart);
-webkit-mask-box-image: url(#tabMaskEnd);
}
.tabnav span:after {
mask: url(#tabMaskEnd);
-webkit-mask-box-image: url(#tabMaskEnd);
}
</style>
{% block dbgoverlay %}{% endblock %}
{# js #}
{% block site_js %}
<script src="{{ static(url('jsi18n')) }}"></script>
{# When bug 755694 is solved, expose the shim again. #}
{# <script src="https://myapps.mozillalabs.com/jsapi/include.js"></script> #}
{% if not logged %}
{# We need Persona for only non-authenticated users. #}
<script async defer src="https://browserid.org/include.js"></script>
<script async defer src="https://login.persona.org/include.js"></script>
<script type="text/javascript" src="{{ settings.RECAPTCHA_AJAX_URL }}"></script>
{% endif %}
{{ js('mkt/consumer') }}
{% endblock %}
{% block paypal_js %}
{% if logged %}
{# We need PayPal for only authenticated users. #}
<script async defer src="{{ settings.PAYPAL_JS_URL }}"></script>
{% endif %}
{% endblock %}
{% block js %}{% endblock %}
</body>
</html>

Просмотреть файл

@ -41,10 +41,8 @@
{% endblock %}
{% block code_live %}
<x-alert data-fade-duration="500" data-secondary-text="Cancel">
<h3>Delete all contacts?</h3>
Contacts will be deleted forever!
</x-alert>
<a id="trigger-alert" class="button">Trigger</a>
<div id="demo-block"></div>
{% endblock %}
{% block related_links %}

Просмотреть файл

@ -25,8 +25,12 @@
{% endblock %}
{% block code_live %}
<x-picker>
</x-picker>
<x-date-time-picker id="datePicker" data-start-time="2012-10-30"
data-columns="MM|dd"></x-date-time-picker>
<x-date-time-picker id="datePicker" data-type="date"></x-date-time-picker>
<x-date-time-picker id="timePicker" data-type="time"></x-date-time-picker>
<x-date-time-picker id="dateTimePicker" data-type="datetime">
</x-date-time-picker>
{% endblock %}
{% block related_links %}

Просмотреть файл

@ -24,15 +24,8 @@
{% endblock %}
{% block code_live %}
<x-select-list data-fade-duration="500" data-multi-select="true">
<h3>Attach</h3>
<ul>
<li>Items</li>
<li>More items</li>
<li>Even more items</li>
<li>Too many items</li>
</ul>
</x-select-list>
<a id="trigger-select" class="button">Trigger</a>
<div id="demo-block"></div>
{% endblock %}
{% block related_links %}

Просмотреть файл

@ -33,10 +33,8 @@
{% endblock %}
{% block code_live %}
<a id="trigger-dialog" href="#trigger">Trigger<a>
<x-toast data-duration="2000" data-exclude-close="true">
This is a toast message.
</x-toast>
<a id="trigger-toast" class="button">Trigger</a>
<div id="demo-block"></div>
{% endblock %}
{% block related_links %}

Просмотреть файл

@ -1,68 +0,0 @@
{% extends "ecosystem/base.html" %}
{% block title %}{{ _('Building Apps') }} | {{ super() }}{% endblock %}
{% block bodyclass %}secondary-landing{% endblock %}
{% block extrahead %}
{{ css('mkt/ecosystem') }}
{% endblock %}
{% block siteheader %}
{% include 'ecosystem/header.html' %}
{% endblock %}
{% block content %}
<div id="landing-page">
<h1>{{ _('Developers') }}</h1>
<section class="primary full marketing-block get-started linkable">
<a href="{{ url('ecosystem.documentation', page='html5') }}">
<h2>{{ _('Get Started') }}</h2>
<ul>
<li>
{% trans %}
Learn about what an HMTL5 app is and how to set it up.
{% endtrans %}
</li>
</ul>
</a>
</section>
<section class="primary full marketing-block design linkable">
<a href="{{ url('ecosystem.documentation', page='design_guidelines') }}">
<h2>{{ _('Design') }}</h2>
<ul>
<li>
{% trans %}
Understand how to design your app and how to use x-tags.
{% endtrans %}
</li>
</ul>
</a>
</section>
<section class="primary full marketing-block sdk linkable">
<a href="{{ url('ecosystem.documentation', page='devtools') }}">
<h2>{{ _('SDK') }}</h2>
<ul>
<li>
{% trans %}
Look up information on the technical details of implemention
using various SDKs.
{% endtrans %}
</li>
</ul>
</a>
</section>
<section class="primary full marketing-block publish linkable">
<a href="{{ url('ecosystem.documentation', page='mkt_hosting') }}">
<h2>{{ _('Publish') }}</h2>
<ul>
<li>
{% trans %}
Ready to show your app to the world? Learn how to publish it!
{% endtrans %}
</li>
</ul>
</a>
</section>
</div>
{% endblock %}

Просмотреть файл

@ -4,7 +4,9 @@
<h1 class="logo"><a href="{{ url('ecosystem.landing') }}">
{{ _('Firefox Marketplace Developers') }}</a></h1>
<nav role="navigation">
<a href="{{ url('ecosystem.developers') }}">{{ _('Developers') }}</a>
<a href="{{ url('ecosystem.documentation', page='html5') }}">
{{ _('Developers') }}
</a>
<a href="{{ url('ecosystem.partners') }}">{{ _('Partners') }}</a>
<a href="{{ url('ecosystem.support') }}">{{ _('Support') }}</a>
<a href="{{ url('submit.app') }}">Submit an App</a>

Просмотреть файл

@ -36,7 +36,8 @@
<section class="primary half marketing-block no-pad">
<ul class="marketing-horz">
<li class="splash">
<a href="{{ url('ecosystem.developers') }}" class="link-panel">
<a href="{{ url('ecosystem.documentation',
page='html5') }}" class="link-panel">
<div>
<img class="placeholder"
src="{{ MEDIA_URL }}img/ecosystem/html_icon.png">

Просмотреть файл

@ -16,12 +16,12 @@
<ol>
<li>
<a href="{{ url('ecosystem.documentation', page='devtools') }}">
{{ _('Firefox Dev Tools') }}
{{ _('Dev Tools') }}
</a>
</li>
<li>
<a href="{{ url('ecosystem.documentation', page='templates') }}">
{{ _('Templates') }}
{{ _('App Templates') }}
</a>
</li>
<li>

Просмотреть файл

@ -59,9 +59,9 @@
<h2>{{ _('Do you still have questions?') }}</h2>
<p>
{% trans %}
While we are working on creating a set of channels to help you with your
issues you can visit StackOverflow to resolve all your questions related
to the development of Web Apps.
While we are working on creating a set of channels to help you with
your issues you can visit StackOverflow to resolve all your
questions related to the development of Web Apps.
{% endtrans %}
</p>
@ -70,6 +70,25 @@
<img src="{{ media('img/ecosystem/stackoverflow_logo.jpg') }}"
class="logo" alt="{{ _('Stack Overflow') }}">
</a>
<p>
{% trans %}
If you want to engage with other developers, join our vibrant
communities in these mailing lists:
{% endtrans %}
<ul>
<li>
<a href="https://lists.mozilla.org/listinfo/webapps">
{{ _('Mozilla Web Apps (English)') }}
</a>
</li>
<li>
<a href="https://lists.mozilla.org/listinfo/webapps-pt-br">
{{ _('Mozilla Web Apps (Brazilian Portuguese)') }}
</a>
</li>
</ul>
</p>
</section>
</div>
{% endblock %}

Просмотреть файл

@ -29,6 +29,7 @@ def fake_page(url):
<section id='pageText'>
<b>hi</b><script>alert('xss');</script>
<a href="/relative/url">some MDN link</a>
<img src="/relative/url">
</section>"""
@ -50,7 +51,7 @@ class TestMdnCacheUpdate(amo.tests.TestCase):
@mock.patch('mkt.ecosystem.tasks._get_page', new=fake_page)
def test_get_page_content(self):
content = _fetch_mdn_page(test_items[0]['url'])
eq_(410, len(content))
eq_(469, len(content))
@mock.patch('mkt.ecosystem.tasks._get_page', new=fake_page)
def test_refresh_mdn_cache(self):
@ -78,12 +79,19 @@ class TestMdnCacheUpdate(amo.tests.TestCase):
assert '<b>hi</b>' in content
@mock.patch('mkt.ecosystem.tasks._get_page', new=fake_page)
def test_ensure_relative_url_is_absolute(self):
def test_ensure_relative_link_is_absolute(self):
content = _fetch_mdn_page(test_items[0]['url'])
assert '<a href="/relative/url">' not in content
assert('<a href="https://developer.mozilla.org/relative/url'
in content)
@mock.patch('mkt.ecosystem.tasks._get_page', new=fake_page)
def test_ensure_relative_image_is_absolute(self):
content = _fetch_mdn_page(test_items[0]['url'])
assert '<img src="/relative/url">' not in content
assert('<img src="https://developer.mozilla.org/relative/url'
in content)
@mock.patch('mkt.ecosystem.tasks._get_page', new=raise_exception)
def test_dont_delete_on_exception(self):
with self.assertRaises(Exception):

Просмотреть файл

@ -26,11 +26,6 @@ class TestLanding(amo.tests.TestCase):
class TestDevHub(amo.tests.TestCase):
def test_developers(self):
r = self.client.get(reverse('ecosystem.developers'))
eq_(r.status_code, 200)
self.assertTemplateUsed(r, 'ecosystem/developers.html')
def test_building_blocks(self):
r = self.client.get(reverse('ecosystem.building_blocks'))
eq_(r.status_code, 200)

Просмотреть файл

@ -12,7 +12,6 @@ urlpatterns = patterns('',
url('^docs/xtags/(?P<xtag>\w+)$', views.building_xtag,
name='ecosystem.building_xtag'),
url('^docs$', views.developers, name='ecosystem.developers'),
url('^partners$', views.partners, name='ecosystem.partners'),
url('^support$', views.support, name='ecosystem.support'),
url('^docs/design/(?P<page>\w+)?$', views.documentation,