Finishing up the newsletters dialog. Perhaps an intro email on first newsletter?

media/css/reader.css

@@ -9279,6 +9279,23 @@ form.opml_import_form input {
     background-size: 28px;
 }
 
+.NB-modal-newsletters .NB-newsletters-email {
+    margin: 0 0 0 24px;
+    font-size: 18px;
+    width: 80%;
+}
+.NB-modal-newsletters p {
+    margin-left: 24px;
+    font-size: 14px;
+}
+.NB-modal-newsletters .NB-newsletters-gmail {
+    width: 700px;
+    margin: 0 auto;
+    display: block;
+    padding: 12px;
+    border: 1px solid #F0F0F0;
+    
+}
 /* ================= */
 /* = Goodies Modal = */
 /* ================= */

media/js/newsblur/reader/reader_newsletters.js

@@ -1,5 +1,7 @@
 NEWSBLUR.ReaderNewsletters = function(options) {
-    var defaults = {};
+    var defaults = {
+        'width': 800
+    };
     
     this.options = $.extend({}, defaults, options);
     this.model = NEWSBLUR.assets;
@@ -13,13 +15,16 @@ _.extend(NEWSBLUR.ReaderNewsletters.prototype, {
     
     runner: function() {
         this.make_modal();
-        this.open_modal();
+        this.open_modal(_.bind(function() {
+            $('.NB-newsletters-email').click();
+        }, this));
         
         this.$modal.bind('click', $.rescope(this.handle_click, this));
     },
     
     make_modal: function() {
         var self = this;
+        var email = NEWSBLUR.Globals.username + "-" + NEWSBLUR.Globals.secret_token + "@newsletters.newsblur.com";
         
         this.$modal = $.make('div', { className: 'NB-modal-newsletters NB-modal' }, [
             $.make('h2', { className: 'NB-modal-title' }, [
@@ -32,11 +37,24 @@ _.extend(NEWSBLUR.ReaderNewsletters.prototype, {
                 $.make('legend', 'Forwarding email address')
             ]),
             $.make('div', { className: 'NB-newsletters-group' }, [
-                $.make('input', { type: 'text', value: 'x@y.com' })
+                $.make('input', { type: 'text', value: email, className: 'NB-newsletters-email' })
             ]),
             
             $.make('fieldset', [
                 $.make('legend', 'Setup instructions')
+            ]),
+            $.make('div', { className: 'NB-newsletters-group' }, [
+                $.make('p', 'To read your email newsletters in NewsBlur, forward your newsletters to your custom email address shown above.'),
+                $.make('p', [
+                    'In Gmail, go to ',
+                    $.make('b', 'Settings > Forwarding'),
+                    ' and click on ',
+                    $.make('b', 'Add a forwarding address'),
+                    '. Add your custom NewsBlur email address.'
+                ]),
+                $.make('p', 'Gmail will walk you through confirming the email address. You\'ll want to come back to NewsBlur and look for the confirmation email under the "Newsletters" folder.'),
+                $.make('p', 'Next, create a filter with all of your newsletters so that they forward to the custom address on NewsBlur.'),
+                $.make('img', { src: NEWSBLUR.Globals.MEDIA_URL + "/img/reader/newsletters_gmail.png", className: 'NB-newsletters-gmail' })
             ])
         ]);
     },
@@ -47,33 +65,8 @@ _.extend(NEWSBLUR.ReaderNewsletters.prototype, {
 
     handle_click: function(elem, e) {
         var self = this;
-        
-        $.targetIs(e, { tagSelector: '.NB-goodies-bookmarklet-button' }, function($t, $p) {
-            e.preventDefault();
-            
-            alert('Drag this button to your bookmark toolbar.');
-        });
 
-        $.targetIs(e, { tagSelector: '.NB-goodies-firefox-link' }, function($t, $p) {
+        $.targetIs(e, { tagSelector: '.NB-newsletters-email' }, function($t, $p) {
-            e.preventDefault();
-            var host = [
-                document.location.protocol,
-                '//',
-                document.location.host,
-                '/'
-            ].join('');
-            navigator.registerContentHandler("application/vnd.mozilla.maybe.feed",
-                                             host + "?url=%s",
-                                             "NewsBlur");
-            navigator.registerContentHandler("application/atom+xml",
-                                             host + "?url=%s",
-                                             "NewsBlur");
-            navigator.registerContentHandler("application/rss+xml",
-                                             host + "?url=%s",
-                                             "NewsBlur");
-        });
-
-        $.targetIs(e, { tagSelector: '.NB-goodies-custom-input' }, function($t, $p) {
             e.preventDefault();
             $t.select();
         });