Added a rudimentary animation for closing tiddlers in classic view

print-window-tiddler
Jeremy Ruston 2012-06-22 00:10:17 +01:00
rodzic 9361376767
commit 7dcbefa9bc
2 zmienionych plików z 39 dodań i 2 usunięć

Wyświetl plik

@ -151,8 +151,13 @@ exports.eventMap["tw-CloseTiddler"] = function(event) {
for(t=story.tiddlers.length-1; t>=0; t--) {
if(story.tiddlers[t].title === event.tiddlerTitle) {
storyElement = this.storyNode.children[t];
// Remove the DOM node
storyElement.domNode.parentNode.removeChild(storyElement.domNode);
// Invoke the storyview to animate the closure
if(this.storyview && this.storyview.close) {
if(!this.storyview.close(storyElement,this.lastNavigationEvent)) {
// Only delete the DOM element if the storyview.close() returned false
storyElement.domNode.parentNode.removeChild(storyElement.domNode);
}
}
// Remove the story element node
this.storyNode.children.splice(t,1);
// Remove the record in the story

Wyświetl plik

@ -26,6 +26,38 @@ ClassicScroller.prototype.navigate = function(targetTiddlerNode,isNew,sourceEven
$tw.utils.scrollIntoView(targetTiddlerNode.domNode);
};
ClassicScroller.prototype.close = function(targetTiddlerNode,sourceEvent) {
var targetElement = targetTiddlerNode.domNode;
// Get the current height of the tiddler
var currHeight = targetElement.offsetHeight;
// Put a wrapper around the dom node we're closing
var wrapperElement = document.createElement("div");
targetElement.parentNode.insertBefore(wrapperElement,targetElement);
wrapperElement.appendChild(targetElement);
// Animate the closure
var d = ($tw.config.preferences.animationDuration/1000).toFixed(8) + "s"
wrapperElement.style[$tw.browser.transformorigin] = "0% 0%";
wrapperElement.style[$tw.browser.transform] = "translateX(0px)";
wrapperElement.style.opacity = "1.0";
wrapperElement.style.height = currHeight + "px";
wrapperElement.style[$tw.browser.transition] = "-" + $tw.browser.prefix.toLowerCase() + "-transform " + d + " ease-in-out, " +
"opacity " + d + " ease-out, " +
"height " + d + " ease-in-out";
$tw.utils.nextTick(function() {
wrapperElement.style[$tw.browser.transform] = "translateX(" + window.innerWidth + "px)";
wrapperElement.style.opacity = "0.0";
wrapperElement.style.height = "0px";
});
// Attach an event handler for th eend of the transition
wrapperElement.addEventListener("webkitTransitionEnd",function(event) {
if(wrapperElement.parentNode) {
wrapperElement.parentNode.removeChild(wrapperElement);
}
},true);
// Returning true causes the DOM node not to be deleted
return true;
};
exports.classic = ClassicScroller;
})();