view release on metacpan or  search on metacpan

share/www/templates/timeline.tx  view on Meta::CPAN

<form class="navbar-form navbar-right bb-nav-controls-container">
  <div class="btn-group">
    <a id="bb-new-statuses-button" class="btn btn-default disabled" href="#">
      New <span class="bb-new-statuses-num badge">0</span>
    </a>
  </div>
  <div class="btn-group">
    <a id="bb-button-incriment-threshold-level" class="btn btn-default" href="#">
      <span class="glyphicon glyphicon-zoom-out"></span>
    </a>
    <a id="bb-button-decriment-threshold-level" class="btn btn-default" href="#">
      <span class="glyphicon glyphicon-zoom-in"></span>
    </a>
  </div>
  <span class="label label-default">Lv. <span class="bb-threshold-level">0</span></span>
  <a class="btn btn-default" href="<: $post_button_url :>" target="_blank"><span class="glyphicon glyphicon-pencil"></span></a>
</form>
<div class="hidden-xs" id="bb-spinner-placeholder"></div>
<p id="bb-indicator" class="navbar-text navbar-right hidden-xs">
  <span id="bb-msg"></span>
</p>
<!-- a menu collapsed in small screens -->
<div class="navbar-collapse collapse">
  <ul class="nav navbar-nav navbar-left">
    <li class="active"><a><: $timeline_name :></a></li>
    <li class="visible-xs"><a href="<: path('/') :>"><span class="glyphicon glyphicon-arrow-left"></span> Top</a></li>
  </ul>
</div>
: }  ## around navbar_content

: around head -> {
<style type="text/css">
.bb-status-extension-pane { display: <: $attached_image_show_default_bool ? "block" : "none" :>; }
.bb-status-extension-<: $attached_image_show_default_bool ? "expander" : "collapser" :> { display: none; }
.bb-status-extension-pane img { max-height: <: $attached_image_max_height :>px; }
</style>
: } ## around head

: around content -> {
<div class="container-fluid">
  <div class="row">
    <div class="hidden-xs col-sm-2 col-md-2">
      <div class="sidebar-nav sidebar-nav-fixed" id="sidebar">
        <div class="panel-group" id="bb-statuses-summary"></div>
      </div>
    </div>
    <div class="col-xs-12 col-sm-10 col-md-8 bb-main-column">
      <ul id="statuses" class="list-unstyled">
      </ul>
      <div id="main-footer">
        <a class="btn btn-primary" id="bb-more-button" data-loading-text="Loading..." href="#">More...</a>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript" src="<: path('/static/jquery.js') :>"></script>
<script type="text/javascript" src="<: path('/static/bootstrap/js/bootstrap.min.js') :>"></script>
<script type="text/javascript" src="<: path('/static/spin.js') :>"></script>
<script type="text/javascript" src="<: path('/static/q.js') :>"></script>
<script type="text/javascript" src="<: path('/static/busybird.js') :>"></script>
<script type="text/javascript" src="<: path('/static/timeline.js') :>"></script>
<script type="text/javascript">
"use strict";

(function() {
    var showMaxReached = function(is_loading_max_reached, message_banner) {
        if(!is_loading_max_reached) return;
        var message = "Too many unread statuses. Some of them are not loaded here.";
        message_banner.show(message, "warn");
        console.warn(message);
    };
    
    var NewStatusesButton = function(args) {
        // @params: args.unackedCountsPoller, args.spinner, args.statusContainer,
        //          args.messageBanner, args.statusesSummary, args.notification
        var self = this;
        var poller = args.unackedCountsPoller;
        self.enabled = false;
        self.now_loading = false;
        self.spinner = args.spinner;
        self.status_container = args.statusContainer;
        self.message_banner = args.messageBanner;
        self.statuses_summary = args.statusesSummary;
        self.notification = args.notification;
        self.cur_unacked_counts = {total: 0};

        self._setEnabled(false);
        $("#bb-new-statuses-button").on("click", function() { self.trigger(); return false; });
        poller.listenOnChange(function(unacked_counts) {
            self.cur_unacked_counts = unacked_counts;
            self._updateUnackedCountView(true);
        });
        self.status_container.listenOnThresholdLevelChanged(function() {
            self._updateUnackedCountView(false);
        });
    };
    NewStatusesButton.prototype = {
        _setEnabled: function(new_state) {
            var self = this;
            var $button = $("#bb-new-statuses-button");
            self.enabled = new_state;
            if(self.enabled) {
                $button.removeClass("disabled");
            }else {
                $button.addClass("disabled");
            }
        },
        _updateUnackedCountView: function(show_web_notification) {
            var self = this;
            var timeline_name = self.status_container.getTimelineName();
            var visible_count = self._visibleUnackedCount();
            if(show_web_notification && visible_count > 0) {
                self.notification.showWebNotification({
                    message: visible_count + ' new statuses!', tag: timeline_name + '/notifyNewStatuses',
                    subtitle: timeline_name,
                    onClick: function() { self.trigger(); }
                });
            }
            self.notification.setFaviconAlert(visible_count > 0);
            self.notification.setTitleNotification(visible_count > 0 ? '('+ visible_count +')' : null);