mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-09-19 18:59:42 +00:00
188 lines
6.0 KiB
JavaScript
188 lines
6.0 KiB
JavaScript
|
//--
|
||
|
//-- Backstage
|
||
|
//--
|
||
|
// Backstage tasks
|
||
|
config.tasks.save.action = saveChanges;
|
||
|
|
||
|
var backstage = {
|
||
|
area: null,
|
||
|
toolbar: null,
|
||
|
button: null,
|
||
|
showButton: null,
|
||
|
hideButton: null,
|
||
|
cloak: null,
|
||
|
panel: null,
|
||
|
panelBody: null,
|
||
|
panelFooter: null,
|
||
|
currTabName: null,
|
||
|
currTabElem: null,
|
||
|
content: null,
|
||
|
|
||
|
init: function() {
|
||
|
var cmb = config.messages.backstage;
|
||
|
this.area = document.getElementById("backstageArea");
|
||
|
this.toolbar = jQuery("#backstageToolbar").empty()[0];
|
||
|
this.button = jQuery("#backstageButton").empty()[0];
|
||
|
this.button.style.display = "block";
|
||
|
var t = cmb.open.text + " " + glyph("bentArrowLeft");
|
||
|
this.showButton = createTiddlyButton(this.button,t,cmb.open.tooltip,
|
||
|
function(e) {backstage.show(); return false;},null,"backstageShow");
|
||
|
t = glyph("bentArrowRight") + " " + cmb.close.text;
|
||
|
this.hideButton = createTiddlyButton(this.button,t,cmb.close.tooltip,
|
||
|
function(e) {backstage.hide(); return false;},null,"backstageHide");
|
||
|
this.cloak = document.getElementById("backstageCloak");
|
||
|
this.panel = document.getElementById("backstagePanel");
|
||
|
this.panelFooter = createTiddlyElement(this.panel,"div",null,"backstagePanelFooter");
|
||
|
this.panelBody = createTiddlyElement(this.panel,"div",null,"backstagePanelBody");
|
||
|
this.cloak.onmousedown = function(e) {backstage.switchTab(null);};
|
||
|
createTiddlyText(this.toolbar,cmb.prompt);
|
||
|
for(t=0; t<config.backstageTasks.length; t++) {
|
||
|
var taskName = config.backstageTasks[t];
|
||
|
var task = config.tasks[taskName];
|
||
|
var handler = task.action ? this.onClickCommand : this.onClickTab;
|
||
|
var text = task.text + (task.action ? "" : glyph("downTriangle"));
|
||
|
var btn = createTiddlyButton(this.toolbar,text,task.tooltip,handler,"backstageTab");
|
||
|
jQuery(btn).addClass(task.action ? "backstageAction" : "backstageTask");
|
||
|
btn.setAttribute("task", taskName);
|
||
|
}
|
||
|
this.content = document.getElementById("contentWrapper");
|
||
|
if(config.options.chkBackstage)
|
||
|
this.show();
|
||
|
else
|
||
|
this.hide();
|
||
|
},
|
||
|
|
||
|
isVisible: function() {
|
||
|
return this.area ? this.area.style.display == "block" : false;
|
||
|
},
|
||
|
|
||
|
show: function() {
|
||
|
this.area.style.display = "block";
|
||
|
if(anim && config.options.chkAnimate) {
|
||
|
backstage.toolbar.style.left = findWindowWidth() + "px";
|
||
|
var p = [{style: "left", start: findWindowWidth(), end: 0, template: "%0px"}];
|
||
|
anim.startAnimating(new Morpher(backstage.toolbar,config.animDuration,p));
|
||
|
} else {
|
||
|
backstage.area.style.left = "0px";
|
||
|
}
|
||
|
jQuery(this.showButton).hide();
|
||
|
jQuery(this.hideButton).show();
|
||
|
config.options.chkBackstage = true;
|
||
|
saveOption("chkBackstage");
|
||
|
jQuery(this.content).addClass("backstageVisible");
|
||
|
},
|
||
|
|
||
|
hide: function() {
|
||
|
if(this.currTabElem) {
|
||
|
this.switchTab(null);
|
||
|
} else {
|
||
|
backstage.toolbar.style.left = "0px";
|
||
|
if(anim && config.options.chkAnimate) {
|
||
|
var p = [{style: "left", start: 0, end: findWindowWidth(), template: "%0px"}];
|
||
|
var c = function(element,properties) {backstage.area.style.display = "none";};
|
||
|
anim.startAnimating(new Morpher(backstage.toolbar,config.animDuration,p,c));
|
||
|
} else {
|
||
|
this.area.style.display = "none";
|
||
|
}
|
||
|
this.showButton.style.display = "block";
|
||
|
this.hideButton.style.display = "none";
|
||
|
config.options.chkBackstage = false;
|
||
|
saveOption("chkBackstage");
|
||
|
jQuery(this.content).removeClass("backstageVisible");
|
||
|
}
|
||
|
},
|
||
|
|
||
|
onClickCommand: function(e) {
|
||
|
var task = config.tasks[this.getAttribute("task")];
|
||
|
if(task.action) {
|
||
|
backstage.switchTab(null);
|
||
|
task.action();
|
||
|
}
|
||
|
return false;
|
||
|
},
|
||
|
|
||
|
onClickTab: function(e) {
|
||
|
backstage.switchTab(this.getAttribute("task"));
|
||
|
return false;
|
||
|
},
|
||
|
|
||
|
// Switch to a given tab, or none if null is passed
|
||
|
switchTab: function(tabName) {
|
||
|
var tabElem = null;
|
||
|
var e = this.toolbar.firstChild;
|
||
|
while(e) {
|
||
|
if(e.getAttribute && e.getAttribute("task") == tabName)
|
||
|
tabElem = e;
|
||
|
e = e.nextSibling;
|
||
|
}
|
||
|
if(tabName == backstage.currTabName) {
|
||
|
backstage.hidePanel();
|
||
|
return;
|
||
|
}
|
||
|
if(backstage.currTabElem) {
|
||
|
jQuery(this.currTabElem).removeClass("backstageSelTab");
|
||
|
}
|
||
|
if(tabElem && tabName) {
|
||
|
backstage.preparePanel();
|
||
|
jQuery(tabElem).addClass("backstageSelTab");
|
||
|
var task = config.tasks[tabName];
|
||
|
wikify(task.content,backstage.panelBody,null,null);
|
||
|
backstage.showPanel();
|
||
|
} else if(backstage.currTabElem) {
|
||
|
backstage.hidePanel();
|
||
|
}
|
||
|
backstage.currTabName = tabName;
|
||
|
backstage.currTabElem = tabElem;
|
||
|
},
|
||
|
|
||
|
isPanelVisible: function() {
|
||
|
return backstage.panel ? backstage.panel.style.display == "block" : false;
|
||
|
},
|
||
|
|
||
|
preparePanel: function() {
|
||
|
backstage.cloak.style.height = findWindowHeight() + "px";
|
||
|
backstage.cloak.style.display = "block";
|
||
|
jQuery(backstage.panelBody).empty();
|
||
|
return backstage.panelBody;
|
||
|
},
|
||
|
|
||
|
showPanel: function() {
|
||
|
backstage.panel.style.display = "block";
|
||
|
if(anim && config.options.chkAnimate) {
|
||
|
backstage.panel.style.top = (-backstage.panel.offsetHeight) + "px";
|
||
|
var p = [{style: "top", start: -backstage.panel.offsetHeight, end: 0, template: "%0px"}];
|
||
|
anim.startAnimating(new Morpher(backstage.panel,config.animDuration,p),new Scroller(backstage.panel,false));
|
||
|
} else {
|
||
|
backstage.panel.style.top = "0px";
|
||
|
}
|
||
|
return backstage.panelBody;
|
||
|
},
|
||
|
|
||
|
hidePanel: function() {
|
||
|
if(backstage.currTabElem)
|
||
|
jQuery(backstage.currTabElem).removeClass("backstageSelTab");
|
||
|
backstage.currTabElem = null;
|
||
|
backstage.currTabName = null;
|
||
|
if(anim && config.options.chkAnimate) {
|
||
|
var p = [
|
||
|
{style: "top", start: 0, end: -(backstage.panel.offsetHeight), template: "%0px"},
|
||
|
{style: "display", atEnd: "none"}
|
||
|
];
|
||
|
var c = function(element,properties) {backstage.cloak.style.display = "none";};
|
||
|
anim.startAnimating(new Morpher(backstage.panel,config.animDuration,p,c));
|
||
|
} else {
|
||
|
jQuery([backstage.panel,backstage.cloak]).hide();
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
config.macros.backstage = {};
|
||
|
|
||
|
config.macros.backstage.handler = function(place,macroName,params)
|
||
|
{
|
||
|
var backstageTask = config.tasks[params[0]];
|
||
|
if(backstageTask)
|
||
|
createTiddlyButton(place,backstageTask.text,backstageTask.tooltip,function(e) {backstage.switchTab(params[0]); return false;});
|
||
|
};
|
||
|
|