The Big Renaming - etherpad is now an NPM module

src/static/js/pad_docbar.js

@@ -0,0 +1,466 @@
+/**
+ * This code is mostly from the old Etherpad. Please help us to comment this code. 
+ * This helps other people to understand this code better and helps them to improve it.
+ * TL;DR COMMENTS ON THIS FILE ARE HIGHLY APPRECIATED
+ */
+
+/**
+ * Copyright 2009 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var padutils = require('/pad_utils').padutils;
+
+var paddocbar = (function()
+{
+  var isTitleEditable = false;
+  var isEditingTitle = false;
+  var isEditingPassword = false;
+  var enabled = false;
+
+  function getPanelOpenCloseAnimator(panelName, panelHeight)
+  {
+    var wrapper = $("#" + panelName + "-wrapper");
+    var openingClass = "docbar" + panelName + "-opening";
+    var openClass = "docbar" + panelName + "-open";
+    var closingClass = "docbar" + panelName + "-closing";
+
+    function setPanelState(action)
+    {
+      $("#docbar").removeClass(openingClass).removeClass(openClass).
+      removeClass(closingClass);
+      if (action != "closed")
+      {
+        $("#docbar").addClass("docbar" + panelName + "-" + action);
+      }
+    }
+
+    function openCloseAnimate(state)
+    {
+      function pow(x)
+      {
+        x = 1 - x;
+        x *= x * x;
+        return 1 - x;
+      }
+
+      if (state == -1)
+      {
+        // startng to open
+        setPanelState("opening");
+        wrapper.css('height', '0');
+      }
+      else if (state < 0)
+      {
+        // opening
+        var height = Math.round(pow(state + 1) * (panelHeight - 1)) + 'px';
+        wrapper.css('height', height);
+      }
+      else if (state == 0)
+      {
+        // open
+        setPanelState("open");
+        wrapper.css('height', panelHeight - 1);
+      }
+      else if (state < 1)
+      {
+        // closing
+        setPanelState("closing");
+        var height = Math.round((1 - pow(state)) * (panelHeight - 1)) + 'px';
+        wrapper.css('height', height);
+      }
+      else if (state == 1)
+      {
+        // closed
+        setPanelState("closed");
+        wrapper.css('height', '0');
+      }
+    }
+
+    return padutils.makeShowHideAnimator(openCloseAnimate, false, 25, 500);
+  }
+
+
+  var currentPanel = null;
+
+  function setCurrentPanel(newCurrentPanel)
+  {
+    if (currentPanel != newCurrentPanel)
+    {
+      currentPanel = newCurrentPanel;
+      padutils.cancelActions("hide-docbar-panel");
+    }
+  }
+  var panels;
+
+  function changePassword(newPass)
+  {
+    if ((newPass || null) != (self.password || null))
+    {
+      self.password = (newPass || null);
+      pad.notifyChangePassword(newPass);
+    }
+    self.renderPassword();
+  }
+
+  var pad = undefined;
+  var self = {
+    title: null,
+    password: null,
+    init: function(opts, _pad)
+    {
+      pad = _pad;
+
+      panels = {
+        impexp: {
+          animator: getPanelOpenCloseAnimator("impexp", 160)
+        },
+        savedrevs: {
+          animator: getPanelOpenCloseAnimator("savedrevs", 79)
+        },
+        options: {
+          animator: getPanelOpenCloseAnimator("options", 114)
+        },
+        security: {
+          animator: getPanelOpenCloseAnimator("security", 130)
+        }
+      };
+
+      isTitleEditable = opts.isTitleEditable;
+      self.title = opts.initialTitle;
+      self.password = opts.initialPassword;
+
+      $("#docbarimpexp").click(function()
+      {
+        self.togglePanel("impexp");
+      });
+      $("#docbarsavedrevs").click(function()
+      {
+        self.togglePanel("savedrevs");
+      });
+      $("#docbaroptions").click(function()
+      {
+        self.togglePanel("options");
+      });
+      $("#docbarsecurity").click(function()
+      {
+        self.togglePanel("security");
+      });
+
+      $("#docbarrenamelink").click(self.editTitle);
+      $("#padtitlesave").click(function()
+      {
+        self.closeTitleEdit(true);
+      });
+      $("#padtitlecancel").click(function()
+      {
+        self.closeTitleEdit(false);
+      });
+      padutils.bindEnterAndEscape($("#padtitleedit"), function()
+      {
+        $("#padtitlesave").trigger('click');
+      }, function()
+      {
+        $("#padtitlecancel").trigger('click');
+      });
+
+      $("#options-close").click(function()
+      {
+        self.setShownPanel(null);
+      });
+      $("#security-close").click(function()
+      {
+        self.setShownPanel(null);
+      });
+
+      if (pad.getIsProPad())
+      {
+        self.initPassword();
+      }
+
+      enabled = true;
+      self.render();
+
+      // public/private
+      $("#security-access input").bind("change click", function(evt)
+      {
+        pad.changePadOption('guestPolicy', $("#security-access input[name='padaccess']:checked").val());
+      });
+      self.setGuestPolicy(opts.guestPolicy);
+    },
+    setGuestPolicy: function(newPolicy)
+    {
+      $("#security-access input[value='" + newPolicy + "']").attr("checked", "checked");
+      self.render();
+    },
+    initPassword: function()
+    {
+      self.renderPassword();
+      $("#password-clearlink").click(function()
+      {
+        changePassword(null);
+      });
+      $("#password-setlink, #password-display").click(function()
+      {
+        self.enterPassword();
+      });
+      $("#password-cancellink").click(function()
+      {
+        self.exitPassword(false);
+      });
+      $("#password-savelink").click(function()
+      {
+        self.exitPassword(true);
+      });
+      padutils.bindEnterAndEscape($("#security-passwordedit"), function()
+      {
+        self.exitPassword(true);
+      }, function()
+      {
+        self.exitPassword(false);
+      });
+    },
+    enterPassword: function()
+    {
+      isEditingPassword = true;
+      $("#security-passwordedit").val(self.password || '');
+      self.renderPassword();
+      $("#security-passwordedit").focus().select();
+    },
+    exitPassword: function(accept)
+    {
+      isEditingPassword = false;
+      if (accept)
+      {
+        changePassword($("#security-passwordedit").val());
+      }
+      else
+      {
+        self.renderPassword();
+      }
+    },
+    renderPassword: function()
+    {
+      if (isEditingPassword)
+      {
+        $("#password-nonedit").hide();
+        $("#password-inedit").show();
+      }
+      else
+      {
+        $("#password-nonedit").toggleClass('nopassword', !self.password);
+        $("#password-setlink").html(self.password ? "Change..." : "Set...");
+        if (self.password)
+        {
+          $("#password-display").html(self.password.replace(/./g, '&#8226;'));
+        }
+        else
+        {
+          $("#password-display").html("None");
+        }
+        $("#password-inedit").hide();
+        $("#password-nonedit").show();
+      }
+    },
+    togglePanel: function(panelName)
+    {
+      if (panelName in panels)
+      {
+        if (currentPanel == panelName)
+        {
+          self.setShownPanel(null);
+        }
+        else
+        {
+          self.setShownPanel(panelName);
+        }
+      }
+    },
+    setShownPanel: function(panelName)
+    {
+      function animateHidePanel(panelName, next)
+      {
+        var delay = 0;
+        if (panelName == 'options' && isEditingPassword)
+        {
+          // give user feedback that the password they've
+          // typed in won't actually take effect
+          self.exitPassword(false);
+          delay = 500;
+        }
+
+        window.setTimeout(function()
+        {
+          panels[panelName].animator.hide();
+          if (next)
+          {
+            next();
+          }
+        }, delay);
+      }
+
+      if (!panelName)
+      {
+        if (currentPanel)
+        {
+          animateHidePanel(currentPanel);
+          setCurrentPanel(null);
+        }
+      }
+      else if (panelName in panels)
+      {
+        if (currentPanel != panelName)
+        {
+          if (currentPanel)
+          {
+            animateHidePanel(currentPanel, function()
+            {
+              panels[panelName].animator.show();
+              setCurrentPanel(panelName);
+            });
+          }
+          else
+          {
+            panels[panelName].animator.show();
+            setCurrentPanel(panelName);
+          }
+        }
+      }
+    },
+    isPanelShown: function(panelName)
+    {
+      if (!panelName)
+      {
+        return !currentPanel;
+      }
+      else
+      {
+        return (panelName == currentPanel);
+      }
+    },
+    changeTitle: function(newTitle)
+    {
+      self.title = newTitle;
+      self.render();
+    },
+    editTitle: function()
+    {
+      if (!enabled)
+      {
+        return;
+      }
+      $("#padtitleedit").val(self.title);
+      isEditingTitle = true;
+      self.render();
+      $("#padtitleedit").focus().select();
+    },
+    closeTitleEdit: function(accept)
+    {
+      if (!enabled)
+      {
+        return;
+      }
+      if (accept)
+      {
+        var newTitle = $("#padtitleedit").val();
+        if (newTitle)
+        {
+          newTitle = newTitle.substring(0, 80);
+          self.title = newTitle;
+
+          pad.notifyChangeTitle(newTitle);
+        }
+      }
+
+      isEditingTitle = false;
+      self.render();
+    },
+    changePassword: function(newPass)
+    {
+      if (newPass)
+      {
+        self.password = newPass;
+      }
+      else
+      {
+        self.password = null;
+      }
+      self.renderPassword();
+    },
+    render: function()
+    {
+      if (isEditingTitle)
+      {
+        $("#docbarpadtitle").hide();
+        $("#docbarrenamelink").hide();
+        $("#padtitleedit").show();
+        $("#padtitlebuttons").show();
+        if (!enabled)
+        {
+          $("#padtitleedit").attr('disabled', 'disabled');
+        }
+        else
+        {
+          $("#padtitleedit").removeAttr('disabled');
+        }
+      }
+      else
+      {
+        $("#padtitleedit").hide();
+        $("#padtitlebuttons").hide();
+
+        var titleSpan = $("#docbarpadtitle span");
+        titleSpan.html(padutils.escapeHtml(self.title));
+        $("#docbarpadtitle").attr('title', (pad.isPadPublic() ? "Public Pad: " : "") + self.title);
+        $("#docbarpadtitle").show();
+
+        if (isTitleEditable)
+        {
+          var titleRight = $("#docbarpadtitle").position().left + $("#docbarpadtitle span").position().left + Math.min($("#docbarpadtitle").width(), $("#docbarpadtitle span").width());
+          $("#docbarrenamelink").css('left', titleRight + 10).show();
+        }
+
+        if (pad.isPadPublic())
+        {
+          $("#docbar").addClass("docbar-public");
+        }
+        else
+        {
+          $("#docbar").removeClass("docbar-public");
+        }
+      }
+    },
+    disable: function()
+    {
+      enabled = false;
+      self.render();
+    },
+    handleResizePage: function()
+    {
+      // Side-step circular reference. This should be injected.
+      var padsavedrevs = require('/pad_savedrevs').padsavedrevs;
+      padsavedrevs.handleResizePage();
+    },
+    hideLaterIfNoOtherInteraction: function()
+    {
+      return padutils.getCancellableAction('hide-docbar-panel', function()
+      {
+        self.setShownPanel(null);
+      });
+    }
+  };
+  return self;
+}());
+
+exports.paddocbar = paddocbar;