NEWSBLUR.ReaderFeedchooser = function(options) { var defaults = {}; this.options = $.extend({}, defaults, options); this.model = NEWSBLUR.AssetModel.reader(); this.runner(); }; NEWSBLUR.ReaderFeedchooser.prototype = { runner: function() { this.start = new Date(); this.MAX_FEEDS = 64; this.approve_list = []; this.make_modal(); this.make_paypal_button(); _.defer(_.bind(function() { this.open_modal(); }, this)); this.find_feeds_in_feed_list(); this.initial_load_feeds(); this.choose_dollar_amount(2); this.flags = { 'has_saved': false }; this.$modal.bind('mousedown', $.rescope(this.handle_click, this)); }, make_modal: function() { var self = this; this.$modal = $.make('div', { className: 'NB-modal-feedchooser NB-modal' }, [ $.make('h2', { className: 'NB-modal-title' }, 'Choose Your '+this.MAX_FEEDS), $.make('div', { className: 'NB-feedchooser-type'}, [ $.make('div', { className: 'NB-feedchooser-info'}, [ $.make('div', { className: 'NB-feedchooser-info-type' }, [ $.make('span', { className: 'NB-feedchooser-subtitle-type-prefix' }, 'Free'), ' Standard Account' ]), $.make('h2', { className: 'NB-modal-subtitle' }, [ $.make('b', [ 'You can follow up to '+this.MAX_FEEDS+' sites.' ]), $.make('br'), 'You can always change these.' ]), $.make('div', { className: 'NB-feedchooser-info-counts'}), $.make('div', { className: 'NB-feedchooser-info-sort'}, 'Auto-Selected By Popularity') ]), this.make_feeds(), $.make('form', { className: 'NB-feedchooser-form' }, [ $.make('div', { className: 'NB-modal-submit' }, [ // $.make('div', { className: 'NB-modal-submit-or' }, 'or'), $.make('input', { type: 'submit', disabled: 'true', className: 'NB-disabled NB-modal-submit-save NB-modal-submit-green', value: 'Check what you like above...' }), $.make('input', { type: 'submit', className: 'NB-modal-submit-add NB-modal-submit-green', value: 'First, add sites' }) ]) ]).bind('submit', function(e) { e.preventDefault(); return false; }) ]), $.make('div', { className: 'NB-feedchooser-type NB-last'}, [ $.make('div', { className: 'NB-feedchooser-info'}, [ $.make('div', { className: 'NB-feedchooser-info-type' }, [ $.make('span', { className: 'NB-feedchooser-subtitle-type-prefix' }, 'Super-Mega'), ' Premium Account' ]) ]), $.make('ul', { className: 'NB-feedchooser-premium-bullets' }, [ $.make('li', { className: 'NB-1' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'Sites are updated up to 10x more often.' ]), $.make('li', { className: 'NB-2' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'Unlimited number of sites' ]), $.make('li', { className: 'NB-3' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'River of News (reading by folder).' ]), $.make('li', { className: 'NB-4' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'Access to future premium-only features like searching, archives, and [top secret]' ]), $.make('li', { className: 'NB-5' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'You feed my poor, hungry dog for 6 days', $.make('img', { className: 'NB-feedchooser-premium-poor-hungry-dog', src: NEWSBLUR.Globals.MEDIA_URL + '/img/reader/shiloh.jpg' }) ]), $.make('li', { className: 'NB-6' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'You are supporting an indie developer' ]), $.make('li', { className: 'NB-7' }, [ $.make('div', { className: 'NB-feedchooser-premium-bullet-image' }), 'Choose how much you would like to pay.', $.make('div', { style: 'color: #490567' }, 'The only difference is happiness.') ]) ]), $.make('div', { className: 'NB-modal-submit NB-modal-submit-paypal' }, [ // this.make_google_checkout() $.make('div', { className: 'NB-feedchooser-dollar' }, [ $.make('div', { className: 'NB-feedchooser-dollar-value NB-1' }, [ $.make('div', { className: 'NB-feedchooser-dollar-month' }, [ $.make('div', { className: 'NB-feedchooser-dollar-image' }), '$12/year' ]), $.make('div', { className: 'NB-feedchooser-dollar-year' }, '($1/month)') ]), $.make('div', { className: 'NB-feedchooser-dollar-value NB-2' }, [ $.make('div', { className: 'NB-feedchooser-dollar-month' }, [ $.make('div', { className: 'NB-feedchooser-dollar-image' }), '$24/year' ]), $.make('div', { className: 'NB-feedchooser-dollar-year' }, '($2/month)') ]), $.make('div', { className: 'NB-feedchooser-dollar-value NB-3' }, [ $.make('div', { className: 'NB-feedchooser-dollar-month' }, [ $.make('div', { className: 'NB-feedchooser-dollar-image' }), '$36/year' ]), $.make('div', { className: 'NB-feedchooser-dollar-year' }, '($3/month)') ]) ]), $.make('div', { className: 'NB-feedchooser-processor' }, [ $.make('div', { className: 'NB-feedchooser-paypal' }, [ $.make('img', { src: NEWSBLUR.Globals.MEDIA_URL + '/img/reader/logo-paypal.png', height: 30 }), $.make('div', { className: 'NB-feedchooser-paypal-form' }) ]), $.make('div', { className: 'NB-feedchooser-stripe' }, [ $.make('div', { className: 'NB-creditcards' }, [ $.make('img', { src: "https://manage.stripe.com/img/credit_cards/visa.png" }), $.make('img', { src: "https://manage.stripe.com/img/credit_cards/mastercard.png" }), $.make('img', { src: "https://manage.stripe.com/img/credit_cards/amex.png" }), $.make('img', { src: "https://manage.stripe.com/img/credit_cards/discover.png" }) ]), $.make('div', { className: "NB-stripe-button NB-modal-submit-button NB-modal-submit-green" }, [ "Pay by", $.make('br'), "Credit Card" ]) ]) ]) ]) ]) ]); }, make_paypal_button: function() { var self = this; var $paypal = $('.NB-feedchooser-paypal-form', this.$modal); $.get('/profile/paypal_form', function(response) { $paypal.html(response); self.choose_dollar_amount(2); }); }, make_google_button: function() { var checkout = '
'; var $checkout = $(checkout); return $checkout; }, make_feeds: function() { var feeds = this.model.feeds; this.feed_count = _.size(feeds); var $feeds = $('#feed_list').clone(true).attr({ 'id': 'NB-feedchooser-feeds', 'class': 'NB-feedlist NB-feedchooser unread_view_positive', 'style': '' }); if ($feeds.data('sortable')) $feeds.data('sortable').disable(); // Expand collapsed folders $('.folder', $feeds).css({ 'display': 'block', 'opacity': 1 }); // Pretend unfetched feeds are fine $('.NB-feed-unfetched', $feeds).removeClass('NB-feed-unfetched'); $('.unread_count_positive', $feeds).text('On'); $('.unread_count_negative', $feeds).text('Off'); return $feeds; }, resize_modal: function(previous_height) { var height = this.$modal.height() + 16; var parent_height = this.$modal.parent().height(); if (height > parent_height && previous_height != height) { var chooser_height = $('#NB-feedchooser-feeds').height(); var diff = Math.max(4, height - parent_height); $('#NB-feedchooser-feeds').css({'max-height': chooser_height - diff}); _.defer(_.bind(function() { this.resize_modal(height); }, this), 1); } }, open_modal: function() { var self = this; this.$modal.modal({ 'minWidth': 780, 'maxWidth': 780, 'overlayClose': true, 'onOpen': function (dialog) { dialog.overlay.fadeIn(200, function () { dialog.container.fadeIn(200); dialog.data.fadeIn(200, function() { _.defer(_.bind(self.resize_modal, self), 10); }); }); }, 'onShow': function(dialog) { $('#simplemodal-container').corner('6px'); }, 'onClose': function(dialog, callback) { if (!self.flags['has_saved'] && !NEWSBLUR.reader.flags['has_chosen_feeds']) { NEWSBLUR.reader.show_feed_chooser_button(); } dialog.data.hide().empty().remove(); dialog.container.hide().empty().remove(); dialog.overlay.fadeOut(200, function() { dialog.overlay.empty().remove(); $.modal.close(callback); }); $('.NB-modal-holder').empty().remove(); } }); }, add_feed_to_decline: function(feed_id, update) { this.approve_list = _.without(this.approve_list, feed_id); var $feed = this.$feeds[feed_id]; $feed.removeClass('NB-feedchooser-approve'); $feed.addClass('NB-feedchooser-decline'); if (update) { this.update_counts(); } }, add_feed_to_approve: function(feed_id, update) { if (!_.contains(this.approve_list, feed_id)) { this.approve_list.push(feed_id); } var $feed = this.$feeds[feed_id]; $feed.removeClass('NB-feedchooser-decline'); $feed.addClass('NB-feedchooser-approve'); if (update) { this.update_counts(); } }, find_feeds_in_feed_list: function() { var self = this; var $feed_list = $('.NB-feedchooser', this.$modal); var $feeds = {}; $('.feed', $feed_list).each(function() { var feed_id = parseInt($(this).attr('data-id'), 10); if (!(feed_id in $feeds)) { $feeds[feed_id] = $([]); } $feeds[feed_id].push($(this).get(0)); }); // Remove invalid feeds that only show up in the assetmodel. // This occurs when a feed is still subscribed, but not in the user's folders. var found_feeds = _.uniq(_.keys($feeds)).sort(); var invalid_feeds = _.each(self.model.feeds, function(feed_id) { if (!_.contains(found_feeds, feed_id)) { delete self.model.feeds[feed_id]; } }); this.$feeds = $feeds; }, update_counts: function() { var $count = $('.NB-feedchooser-info-counts'); var approved = this.approve_list.length; var $submit = $('.NB-modal-submit-save', this.$modal); var difference = approved - this.MAX_FEEDS; $count.text(approved + '/' + Inflector.commas(this.feed_count)); $count.toggleClass('NB-full', approved == this.MAX_FEEDS); $count.toggleClass('NB-error', approved > this.MAX_FEEDS); $('.NB-feedchooser-info-sort', this.$modal).fadeOut(500); if (approved > this.MAX_FEEDS) { $submit.addClass('NB-disabled').addClass('NB-modal-submit-grey').attr('disabled', true).val('Too many sites! Deselect ' + ( difference == 1 ? '1 site...' : difference + ' sites...' )); } else { $submit.removeClass('NB-disabled').removeClass('NB-modal-submit-grey').attr('disabled', false).val('Turn on these '+ approved +' sites, please'); } }, initial_load_feeds: function() { var start = new Date(); var self = this; var $feeds = $('.feed', this.$modal); var feeds = this.model.get_feeds(); if (!_.keys(feeds).length) { _.defer(_.bind(function() { var $info = $('.NB-feedchooser-info', this.$modal); $('.NB-feedchooser-info-counts', $info).hide(); $('.NB-feedchooser-info-sort', $info).hide(); $('#NB-feedchooser-feeds').hide(); $('.NB-modal-submit-save').hide(); $('.NB-modal-submit-add').show(); }, this)); return; } var active_feeds = _.any(_.pluck(feeds, 'active')); if (!active_feeds) { // Get feed subscribers var min_subscribers = _.last( _.first( _.pluck(_.select(this.model.get_feeds(), function(f) { return !f.has_exception; }), 'subs').sort(function(a,b) { return b-a; }), this.MAX_FEEDS ) ); // Decline everything var approve_feeds = []; _.each(feeds, function(feed, feed_id) { self.add_feed_to_decline(parseInt(feed_id, 10)); if (feed['subs'] >= min_subscribers) { approve_feeds.push(parseInt(feed_id, 10)); } }); // Approve feeds in subs _.each(approve_feeds, function(feed_id) { if (self.model.get_feed(feed_id)['subs'] > min_subscribers && self.approve_list.length < self.MAX_FEEDS && !self.model.get_feed(feed_id)['has_exception']) { self.add_feed_to_approve(feed_id); } }); _.each(approve_feeds, function(feed_id) { if (self.model.get_feed(feed_id)['subs'] == min_subscribers && self.approve_list.length < self.MAX_FEEDS) { self.add_feed_to_approve(feed_id); } }); } else { // Get active feeds var active_feeds = _.pluck(_.select(feeds, function(feed) { if (feed.active) return true; }), 'id'); this.approve_list = active_feeds; // Approve or decline var feeds = []; $feeds.each(function() { var feed_id = parseInt($(this).attr('data-id'), 10); if (_.contains(active_feeds, feed_id)) { self.add_feed_to_approve(feed_id); } else { self.add_feed_to_decline(feed_id); } }); } _.defer(_.bind(function() { this.update_counts(); }, this)); }, save: function() { var self = this; var approve_list = this.approve_list; var $submit = $('.NB-modal-submit-save', this.$modal); $submit.addClass('NB-disabled').val('Saving...'); this.update_homepage_count(); this.model.save_feed_chooser(approve_list, function() { self.flags['has_saved'] = true; NEWSBLUR.reader.hide_feed_chooser_button(); NEWSBLUR.reader.load_feeds(); $.modal.close(); }); }, close_and_add: function() { $.modal.close(function() { NEWSBLUR.add_feed = new NEWSBLUR.ReaderAddFeed(); }); }, open_stripe_form: function() { window.location.href = "https://" + NEWSBLUR.URLs.domain + "/profile/stripe_form?plan=" + this.plan; }, update_homepage_count: function() { var $count = $('.NB-module-account-feedcount'); var $button = $('.NB-module-account-upgrade'); var approve_list = this.approve_list; $count.text(approve_list.length); $button.removeClass('NB-modal-submit-green').addClass('NB-modal-submit-close'); $('.NB-module-account-trainer').removeClass('NB-hidden').hide().slideDown(500); }, choose_dollar_amount: function(plan) { var $value = $('.NB-feedchooser-dollar-value', this.$modal); var $input = $('input[name=a3]'); this.plan = plan; $value.removeClass('NB-selected'); $value.filter('.NB-'+plan).addClass('NB-selected'); if (plan == 1) { $input.val(12); } else if (plan == 2) { $input.val(24); } else if (plan == 3) { $input.val(36); } }, // =========== // = Actions = // =========== handle_click: function(elem, e) { var self = this; $.targetIs(e, { tagSelector: '.feed' }, _.bind(function($t, $p) { e.preventDefault(); var feed_id = parseInt($t.attr('data-id'), 10); if (_.contains(this.approve_list, feed_id)) { this.add_feed_to_decline(feed_id, true); } else { this.add_feed_to_approve(feed_id, true); } }, this)); $.targetIs(e, { tagSelector: '.NB-modal-submit-save' }, _.bind(function($t, $p) { e.preventDefault(); this.save(); }, this)); $.targetIs(e, { tagSelector: '.NB-modal-submit-add' }, _.bind(function($t, $p) { e.preventDefault(); this.close_and_add(); }, this)); $.targetIs(e, { tagSelector: '.NB-stripe-button' }, _.bind(function($t, $p) { e.preventDefault(); this.open_stripe_form(); }, this)); $.targetIs(e, { tagSelector: '.NB-feedchooser-dollar-value' }, _.bind(function($t, $p) { e.preventDefault(); var step; if ($t.hasClass('NB-1')) { step = 1; } else if ($t.hasClass('NB-2')) { step = 2; } else if ($t.hasClass('NB-3')) { step = 3; } this.choose_dollar_amount(step); }, this)); }, handle_cancel: function() { var $cancel = $('.NB-modal-cancel', this.$modal); $cancel.click(function(e) { e.preventDefault(); $.modal.close(); }); } };