Merge branch 'master' of github.com:mozilla/FlightDeck

apps/jetpack/templates/_edit_package_info.html

@@ -9,6 +9,9 @@
 			<label for="package_description">{{ revision.package.get_type_name|capfirst }} Description</label>
 			<textarea id="package_description" name="package_description" rows="8" cols="40">{{ revision.package.description }}</textarea>
 		</p>
+		<ul class="UI_Actions">
+			{% include "_package_privacy_toggle.html" %}
+		</ul>
 	</fieldset>
 	<div class="UI_Modal_Actions">
 		<ul>

apps/jetpack/templates/_package_edit_view_source_bar.html

@@ -11,14 +11,5 @@
         </li>
     </ul>
     <ul class="UI_Actions">
-        <li class="UI_Activate{% if item.active %} pressed{% endif %}">
-        <a{% if not item.active %} title="Let the world use it" href="{{ item.get_activate_url }}"{% endif %}>
-                Public
-            </a>
-        </li>
-        <li class="UI_Disable{% if not item.active %} pressed{% endif %}">
-        <a{% if item.active %} title="My preciousss!" href="{{ item.get_disable_url }}"{% endif %}>
-                Private
-            </a>
-        </li>
+        {% include "_package_privacy_toggle.html" %}
 {% endif %}

apps/jetpack/templates/_package_privacy_toggle.html

@@ -0,0 +1,10 @@
+        <li{% if single %} id="UI_ActivateLink"{% endif%} class="UI_Activate{% if item.active %} pressed{% endif %}">
+        <a title="Let the world use it" href="{{ item.get_activate_url }}"{% if item.active %} class="inactive"{% endif %}>
+                Public
+            </a>
+        </li>
+        <li{% if single %} id="UI_DisableLink"{% endif %} class="UI_Disable{% if not item.active %} pressed{% endif %}">
+        <a title="My preciousss!" href="{{ item.get_disable_url }}"{% if not item.active %} class="inactive"{% endif %}>
+                Private
+            </a>
+        </li>

apps/jetpack/templates/addon_view.html

@@ -40,11 +40,11 @@
 {% endblock %}
 
 {% block app_content_menu_items %}
-	<li id="try_in_browser" class="UI_Editor_Menu_Button Icon_try XPI_test">
-    <a title="Test" href="{{ revision.get_test_xpi_url }}" data-jetpackid="{{ revision.package.get_jid }}"><span></span></a>
+	<li id="try_in_browser" class="UI_Editor_Menu_Button Icon_try XPI_test" title="Test">
+    <a href="{{ revision.get_test_xpi_url }}" data-jetpackid="{{ revision.package.get_jid }}"><span></span></a>
 	</li>
-	<li id="download" class="UI_Editor_Menu_Button Icon_download">
-    <a target="_new" title="Download" href="{{ revision.get_download_xpi_url }}"><span></span></a>
+	<li id="download" class="UI_Editor_Menu_Button Icon_download" title="Download">
+    <a target="_new" href="{{ revision.get_download_xpi_url }}"><span></span></a>
 	</li>
 	<li class="UI_Editor_Menu_Separator"></li>
 {% endblock %}

apps/jetpack/templates/js/_package_initiate.js

@@ -5,6 +5,7 @@ latest_url: '{{ revision.package.get_latest_url }}',
 id_number: '{{ revision.package.id_number|escapejs }}',
 full_name: '{{ revision.package.full_name|escapejs }}',
 name: '{{ revision.package.name|escapejs }}',
+revision_string: '{{ revision|escapejs }}',
 // description: '',
 type: '{{ revision.package.type }}',
 package_author: '{{ revision.package.author }}',

apps/jetpack/templates/json/_edit_urls.json

@@ -1,4 +1,5 @@
     "revision_number": {{ revision.revision_number }},
+    "revision_string": "{{ revision|escapejs }}",
 	"save_url": "{{ revision.get_save_url }}",
 	"view_url": "{{ revision.package.get_latest_url }}",
 	"add_module_url": "{{ revision.get_add_module_url }}",

apps/jetpack/views.py

@@ -83,6 +83,7 @@ def package_browser(r, page_number=1, type_id=None, username=None):
     return render_to_response(
         'package_browser%s.html' % template_suffix, {
             'pager': pager,
+            'single': False,
             'author': author,
             'other_packages_number': other_packages_number
         },
@@ -151,6 +152,8 @@ def package_edit(r, revision):
     return render_to_response(
         "%s_edit.html" % revision.package.get_type_name(), {
             'revision': revision,
+            'item': revision.package,
+            'single': True,
             'libraries': libraries,
             'library_counter': library_counter,
             'readonly': False,

apps/tutorial/templates/tutorial.html

@@ -34,19 +34,21 @@
 
 	<pre>
 require("widget").Widget({
+    id: "widgetID1",
     label: "My Mozilla Widget",
     contentURL: "http://www.mozilla.org/favicon.ico"
 });
 	</pre>
 
-	<p>Then click <i>Test</i>. You may now be asked to install the <i>Add-on
-	  Builder Helper</i> extension; this is a small extension that lets
-	  Add-on Builder integrate seamlessly with Firefox, so go ahead and
-	  install it and click <i>Test</i> again.</p>
+	<p>Then click <i>Test</i> (<img 
+  src="/media/tutorial/img/editor-button-test.png">). You may now be asked to 
+  install the <i>Add-on Builder Helper</i> extension; this is a small extension
+  that lets Add-on Builder integrate seamlessly with Firefox, so go ahead and
+	install it and click <i>Test</i> again.</p>
 
 	<p>At this point, a Mozilla logo (<img
 	src="http://www.mozilla.org/favicon.ico" style="width: 1em; height: 1em">)
-	should appear at the bottom-left corner of your browser.</p>
+	should appear at the bottom-right corner of your browser.</p>
 
 	<h2 class="UI_Heading">Oh Noes!</h2>
 
@@ -56,6 +58,10 @@ require("widget").Widget({
 	<i>All</i> button appears pressed down in this window, and any errors in
 	your code should be logged there.</p>
 
+  <p>You may also have to turn on the Add-on Bar manually in order to see your
+  widget, if you have it hidden. In Firefox's View menu, go into Toolbars and click
+  on "Add-on Bar", or press Ctrl+/ to turn it on.</p>
+
 	<h2 class="UI_Heading">How Does The Code Work?</h2>
 
 	<p>In the code you just wrote, <tt>require</tt> is a global function
@@ -77,6 +83,7 @@ require("widget").Widget({
 
 	<pre class="faded">
 require("widget").Widget({
+    id: "widgetID1",
     label: <span class="highlighted">"My Mozilla Widget"</span>,
     contentURL: "http://www.mozilla.org/favicon.ico",
     <span class="highlighted">onClick: function(event) {
@@ -94,13 +101,19 @@ require("widget").Widget({
 	<h2 class="UI_Heading">Checkpointing</h2>
 
 	<p>Whenever you've reached a stopping point in your development, click
-	the <i>Save</i> button. This actually saves a snapshot of your code as
-	a new revision, and you can go back to it whenever you want by
-	clicking the <i>Revisions</i> button. This allows you to play around
-	with an idea and simply restore your code to an old revision if you
-	decide you don't like the changes. It's just like a wiki this way:
-	feel free to play around and don't worry about making
-	mistakes&mdash;that's how you learn.</p>
+	the <i>Save</i> (<img src="/media/tutorial/img/editor-button-save.png">)
+  button. This actually saves a snapshot of your code as a new revision,
+  and you can go back to it whenever you want by clicking the <i>Revisions</i>
+  (<img 
+  src="/media/tutorial/img/editor-button-revisions.png">) button. This allows
+  you to play around with an idea and simply restore your code to an old 
+  revision if you decide you don't like the changes. It's just like a wiki 
+  this way:	feel free to play around and don't worry about making	
+  mistakes&mdash;that's how you learn.</p>
+
+  <p>You can also assign a version number to your add-on for each revision by
+  hovering over the <i>Save</i> button and filling in the Version box before
+  clicking <i>Save</i>.
 
 	<h2 class="UI_Heading">Making It Real</h2>
 
@@ -110,12 +123,14 @@ require("widget").Widget({
 	its name suggests, lets you create add-ons that work with the latest
 	version of Firefox, no strings attached.</p>
 
-	<p>First you need to give your add-on a real name, a description, and
-	a version number. Just click on the text "My Add-on" on the left side
-	of the page and fill in the fields; we suggest starting at version
-	0.1.</p>
+	<p>First you need to give your add-on a real name, a description, and 
+  (if you haven't already assigned a version up in the <i>Checkpointing</i> 
+  section) a version number. Just click on the <i>Properties</i> (<img 
+  src="/media/tutorial/img/editor-button-properties.png">) button and fill in
+  the name and description.</p>
 
-	<p>Then just click <i>Download</i> to get the XPI file that
+	<p>Then just click <i>Download</i> (<img 
+  src="/media/tutorial/img/editor-button-download.png">)to get the XPI file that
 	constitutes your add-on. You can send this to friends and family, or
 	upload it to <a
 	 href="https://addons.mozilla.org/">addons.mozilla.org</a> for all the
@@ -137,3 +152,4 @@ require("widget").Widget({
 
 
 {% block app_sidebar %}{% endblock %}
+

media/jetpack/js/FlightDeck.Browser.js

@@ -42,47 +42,61 @@
     };
 
     var browser_disable_item = function(el) {
-        if (el.get('href')) el.addEvent('click', function(e){
+        el.addEvent('click', function(e){
             if (e) e.stop();
-            this.store('spinner', 
-                new Spinner(this.getParent('li.UI_Item')).show());
-            new Request.JSON({
-                url: el.get('href'),
-                onSuccess: function(response) {
-                    el.retrieve('spinner').destroy();
-                    el.getParent('li.UI_Item').destroy();
-                    fd.message.alert(response.message_title, response.message);
-                    fd.fireEvent('deactivate_' + response.package_type);
-                    if ($('activate')) {
-                        $('activate').addEvent('click', function(e2){
-                            e2.stop();
-                            new Request.JSON({
-                                url: this.get('href'),
-                                onSuccess: function(response) {
-                                    window.location.reload();
-                                }
-                            }).send();
-                        });
+            if (el.get('href') && !el.hasClass('inactive')) {
+                new Request.JSON({
+                    url: el.get('href'),
+                    useSpinner: true,
+                    spinnerTarget: this.getParent('li.UI_Item'),
+                    spinnerOptions: {
+                        img: {
+                            class: 'spinner-img spinner-16'
+                        },
+                        maskBorder: false
+                    },
+                    onSuccess: function(response) {
+                        el.getParent('li.UI_Item').destroy();
+                        fd.message.alert(response.message_title, response.message);
+                        fd.fireEvent('deactivate_' + response.package_type);
+                        if ($('activate')) {
+                            $('activate').addEvent('click', function(e2){
+                                e2.stop();
+                                new Request.JSON({
+                                    url: this.get('href'),
+                                    onSuccess: function(response) {
+                                        window.location.reload();
+                                    }
+                                }).send();
+                            });
+                        }
                     }
-                }
-            }).send();
+                }).send();
+            }
         });
     };
 
     var browser_activate_item = function(el) {
-        if (el.get('href')) el.addEvent('click', function(e){
+        el.addEvent('click', function(e){
             if (e) e.stop();
-            this.store('spinner', 
-                new Spinner(this.getParent('li.UI_Item')).show());
-            new Request.JSON({
-                url: this.get('href'),
-                onSuccess: function(response) {
-                    el.retrieve('spinner').destroy();
-                    this.getParent('li.UI_Item').destroy();
-                    fd.message.alert(response.message_title, response.message);
-                    fd.fireEvent('activate_' + response.package_type);
-                }.bind(this)
-            }).send();
+            if (el.get('href') && !el.hasClass('inactive')) {
+                new Request.JSON({
+                    url: this.get('href'),
+                    useSpinner: true,
+                    spinnerTarget: this.getParent('li.UI_Item'),
+                    spinnerOptions: {
+                        img: {
+                            class: 'spinner-img spinner-16'
+                        },
+                        maskBorder: false
+                    },
+                    onSuccess: function(response) {
+                        this.getParent('li.UI_Item').destroy();
+                        fd.message.alert(response.message_title, response.message);
+                        fd.fireEvent('activate_' + response.package_type);
+                    }.bind(this)
+                }).send();
+            }
         });
     };
 

media/jetpack/js/Package.js

@@ -16,6 +16,7 @@ var Package = new Class({
 				// id_number: '',
 				// full_name: '',
 				// name: '',
+				// revision_string: '',
 				// description: '',
 				// type: '', // 'a'/'l'
 				// package_author: '',
@@ -1425,6 +1426,63 @@ Package.Edit = new Class({
 		}).send();
 	},
 
+	/*
+	 * Method: makePublic
+	 * activate a package
+	 */
+	makePublic: function(e) {
+		e.stop();
+		this.savenow = false;
+		var activateButton = $('UI_ActivateLink');
+		if (activateButton.getElement('a').hasClass('inactive')) return false;
+		new Request.JSON({
+			url: activateButton.getElement('a').get('href'),
+			useSpinner: true,
+			spinnerTarget: activateButton,
+			spinnerOptions: {
+				img: {
+					class: 'spinner-img spinner-16'
+				},
+				maskBorder: false
+			},
+			onSuccess: function(response) {
+				fd.message.alert(response.message_title, response.message);
+				fd.fireEvent('activate_' + response.package_type);
+				activateButton.addClass('pressed').getElement('a').addClass('inactive');
+				$('UI_DisableLink').removeClass('pressed').getElement('a').removeClass('inactive');
+			}
+		}).send();
+	},
+
+	/*
+	 * Method: makePrivate
+	 * deactivate a package
+	 */
+	makePrivate: function(e) {
+		e.stop();
+		this.savenow = false;
+		var deactivateButton = $('UI_DisableLink');
+		if (deactivateButton.getElement('a').hasClass('inactive')) return false;
+		new Request.JSON({
+			url: deactivateButton.getElement('a').get('href'),
+			useSpinner: true,
+			spinnerTarget: deactivateButton,
+			spinnerOptions: {
+				img: {
+					class: 'spinner-img spinner-16'
+				},
+				maskBorder: false
+			},
+			onSuccess: function(response) {
+				fd.message.alert(response.message_title, response.message);
+				fd.fireEvent('disable_' + response.package_type);
+				$('activate').addEvent('click', this.makePublic.bind(this));
+				deactivateButton.addClass('pressed').getElement('a').addClass('inactive');
+				$('UI_ActivateLink').removeClass('pressed').getElement('a').removeClass('inactive');
+			}.bind(this)
+		}).send();
+	},
+
 	/*
 	 * Method: editInfo
 	 * display the EditInfoModalWindow
@@ -1447,6 +1505,10 @@ Package.Edit = new Class({
 				this.savenow = true;
 			}.bind(this));
 		}
+
+		$('UI_ActivateLink').getElement('a').addEvent('click', this.makePublic.bind(this));
+		$('UI_DisableLink').getElement('a').addEvent('click', this.makePrivate.bind(this));
+
 		this.validator = new Form.Validator.Inline('package-info_form');
 		self = this;
 		$$('#package-info_form input[type=submit]').each(function(el) {
@@ -1698,6 +1760,8 @@ Package.Edit = new Class({
 	},
 
 	registerRevision: function(urls) {
+        // update page title to reflect current revision and name
+        document.title = document.title.replace(this.options.revision_string, urls.revision_string);
         this.setOptions(urls);
         // this only for the right display href
         if (urls.download_url && $(this.options.download_el)) {