467 lines
11 KiB
JavaScript
467 lines
11 KiB
JavaScript
/**
|
|
* 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, '•'));
|
|
}
|
|
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;
|