publiclab/plots2

<script>
  $("body").on("mouseup", function(e) {
    var el = $(e.target);
    if (el[0].className.indexOf("popover") == -1) {
      $(".popover").each(function() {
        $(this).popover("hide");
      });
    }
  });
</script>

<div class="col-lg-3">

  <p><b><%=raw translation('home.subscriptions.title') %></b> <%=raw translation('home.subscriptions.up_to_date_emails') %></p>

  <hr />
  <p>
    <a href="/subscriptions/digest" class="btn btn-outline-secondary"><i class="fa fa-list"></i> <%= raw translation('home.subscriptions.subscriptions_digest') %></a>
  </p>
  <hr />

  <p>
    <% if current_user.following("everything") %>
      <a rel="tooltip" title="<%= translation('home.subscriptions.click_unfollow',{},false) %>" class="btn btn-outline-secondary active" href="/unsubscribe/tag/everything" data-method="delete"><i class="fa fa-user-plus" aria-hidden="true"></i> <%= translation('home.subscriptions.following') %> <b><%= translation('home.subscriptions.research_notes') %></b></a>
    <% else %>
      <a href="/subscribe/tag/everything" class="btn btn-outline-secondary"><i class="fa fa-tag"></i> <%= translation('home.subscriptions.subscribe_to') %> <b><%= translation('home.subscriptions.all') %></b> <%= translation('home.subscriptions.notes') %></a>
    <% end %>
  </p>
  <p>
    <i><%=raw translation('home.subscriptions.receive_mails') %></i>
  </p>

  <hr />

  <a href="/settings" class="btn btn-outline-secondary" style="margin-bottom: 10px;"><i class="fa fa-bell"></i> <%= raw translation('home.subscriptions.notification_settings') %> </a>

  <p style="font-style: italic;"> <%= raw translation('home.subscriptions.control_notifications') %> </p>

</div>

<div class="col-lg-9">

  <h3><%=raw translation('home.subscriptions.manage_subscriptions') %> (<%= current_user.subscriptions.size %>)</h3>

  <form class="navbar-form" action="/subscribe/tag">
    <div class="form-group">
      <div class="row">
        <div class="col-md-7">
          <input aria-label="Enter tags" type="text" name="name" class="form-control" placeholder="<%= translation('home.subscriptions.enter_tags',{},false) %>" data-provide="typeahead" data-source='<%= Tag.all_tags_by_popularity %>' autocomplete="off" required="required">
        </div>
        <div class="col-md-2 pl-md-1">
          <button type="submit" class="btn btn-primary add-subscriptions"><i class="fa fa-plus fa fa-white"></i> <%= translation('home.subscriptions.add') %></button>
        </div>
      </div>
    </div>
  </form>

  <% if current_user.subscriptions.size == 0 %>
  <p> <%= raw translation('home.subscriptions.subscribe_topic') %> </p>
  <% else %>
    <table class="table">
    <tr><th><%=raw translation('home.subscriptions.tag') %></th><th><%=raw translation('home.subscriptions.options') %></th></tr>
    <% current_user.subscriptions(:tag).includes(:tag).each do |subscription| %>
    <tr>
      <td><a href="/tag/<%= subscription.tagname %>"><%= subscription.tagname %></a> <i style="color:#aaa;"> +<%= Tag.follower_count(subscription.tagname).to_i-1 %> <%= raw translation('home.subscriptions.other_people') %></i></td>
      <td><div class="btn-toolbar" style="margin:0;">
        <div class="btn-group">
          <!--
          <a rel="tooltip" title="As it happens" class="btn btn-default btn-xs" href="javascript:void(0)"><i class="fa fa-envelope"></i> Email</a>
          <a rel="tooltip" title="Once per day" class="btn btn-default btn-xs" href="javascript:void(0)"><i class="fa fa-list"></i> Digest</a>
          -->
          <script> input_<%= subscription.tid %> = '#share-<%= subscription.tid %>'</script>
          <a class="btn btn-outline-secondary btn-sm text-body" rel="popover"  data-toggle="popover" data-placement="left" title="<%= translation('home.subscriptions.share_subscription_link',{},false) %>" data-html="true" data-content="<div style='margin-top:10px;'><a style='padding-left:3px;' href='https://twitter.com/intent/tweet?text=🎈 Public Lab: Subscriptions&url=https://publiclab.org/subscriptions/tag/<%= subscription.tagname %>' class='twitter-share-button'>Tweet</a></div>
          <script>
            window.twttr = (function(d, s, id){ 
              var js, fjs = d.getElementsByTagName(s)[0],
              t = window.twttr || {};
              js = d.createElement(s);
              js.id = id;
              js.src = 'https://platform.twitter.com/widgets.js';
              fjs.parentNode.insertBefore(js, fjs);

              t._e = [];
              t.ready = function(f) {
                t._e.push(f);
              };

              return t;
            }(document, 'script', 'twitter-wjs'));
          </script> 
          ">
          <i class="fa fa-share"></i> <%= translation('home.subscriptions.share') %></a>
          <a class="btn btn-outline-secondary btn-sm" href="/unsubscribe/tag/<%= subscription.tagname %>" data-method="delete"><i class="fa fa-remove"></i> <%= translation('home.subscriptions.unsubscribe') %></a>
        </div>
      </div></td>
    </tr>
    <% end %>
    </table>
  <% end %>

</div>

<style>
  .popover{ 
    z-index: 1000;
  }
</style>