mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-23 18:17:20 +00:00
Code Issues Releases Wiki Activity

Improve storyview error detection

Browse Source 
Fixes #912
This commit is contained in:
Jermolene 2014-09-27 10:34:59 +01:00
parent 9dff0c4b12
commit 115245a632
4 changed files with 62 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
core/modules/storyviews/classic.js
View File

@ -25,6 +25,10 @@ ClassicStoryView.prototype.navigateTo = function(historyInfo) {
}
var listItemWidget = this.listWidget.children[listElementIndex],
targetElement = listItemWidget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Scroll the node into view
this.listWidget.dispatchEvent({type: "tm-scroll", target: targetElement});
};
@ -32,6 +36,10 @@ ClassicStoryView.prototype.navigateTo = function(historyInfo) {
ClassicStoryView.prototype.insert = function(widget) {
var targetElement = widget.findFirstDomNode(),
duration = $tw.utils.getAnimationDuration();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Get the current height of the tiddler
var computedStyle = window.getComputedStyle(targetElement),
currMarginBottom = parseInt(computedStyle.marginBottom,10),
@ -62,7 +70,15 @@ ClassicStoryView.prototype.insert = function(widget) {
ClassicStoryView.prototype.remove = function(widget) {
var targetElement = widget.findFirstDomNode(),
duration = $tw.utils.getAnimationDuration();
duration = $tw.utils.getAnimationDuration(),
removeElement = function() {
widget.removeChildDomNodes();
};
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
removeElement();
return;
}
// Get the current height of the tiddler
var currWidth = targetElement.offsetWidth,
computedStyle = window.getComputedStyle(targetElement),
@ -70,9 +86,7 @@ ClassicStoryView.prototype.remove = function(widget) {
currMarginTop = parseInt(computedStyle.marginTop,10),
currHeight = targetElement.offsetHeight + currMarginTop;
// Remove the dom nodes of the widget at the end of the transition
setTimeout(function() {
widget.removeChildDomNodes();
},duration);
setTimeout(removeElement,duration);
// Animate the closure
$tw.utils.setStyle(targetElement,[
{transition: "none"},

26
core/modules/storyviews/pop.js
View File

@ -23,6 +23,10 @@ PopStoryView.prototype.navigateTo = function(historyInfo) {
}
var listItemWidget = this.listWidget.children[listElementIndex],
targetElement = listItemWidget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Scroll the node into view
this.listWidget.dispatchEvent({type: "tm-scroll", target: targetElement});
};
@ -30,6 +34,10 @@ PopStoryView.prototype.navigateTo = function(historyInfo) {
PopStoryView.prototype.insert = function(widget) {
var targetElement = widget.findFirstDomNode(),
duration = $tw.utils.getAnimationDuration();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Reset once the transition is over
setTimeout(function() {
$tw.utils.setStyle(targetElement,[
@ -55,13 +63,19 @@ PopStoryView.prototype.insert = function(widget) {
PopStoryView.prototype.remove = function(widget) {
var targetElement = widget.findFirstDomNode(),
duration = $tw.utils.getAnimationDuration();
duration = $tw.utils.getAnimationDuration(),
removeElement = function() {
if(targetElement.parentNode) {
widget.removeChildDomNodes();
}
};
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
removeElement();
return;
}
// Remove the element at the end of the transition
setTimeout(function() {
if(targetElement.parentNode) {
widget.removeChildDomNodes();
}
},duration);
setTimeout(removeElement,duration);
// Animate the closure
$tw.utils.setStyle(targetElement,[
{transition: "none"},

27
core/modules/storyviews/zoomin.js
View File

@ -26,6 +26,10 @@ var ZoominListView = function(listWidget) {
// Make all the tiddlers position absolute, and hide all but the top (or first) one
$tw.utils.each(this.listWidget.children,function(itemWidget,index) {
var domNode = itemWidget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(domNode instanceof Element)) {
return;
}
if(targetTiddler !== itemWidget.parseTreeNode.itemTitle || (!targetTiddler && index)) {
domNode.style.display = "none";
} else {
@ -43,6 +47,10 @@ ZoominListView.prototype.navigateTo = function(historyInfo) {
}
var listItemWidget = this.listWidget.children[listElementIndex],
targetElement = listItemWidget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Make the new tiddler be position absolute and visible so that we can measure it
$tw.utils.setStyle(targetElement,[
{position: "absolute"},
@ -121,6 +129,10 @@ function findTitleDomNode(widget,targetClass) {
ZoominListView.prototype.insert = function(widget) {
var targetElement = widget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Make the newly inserted node position absolute and hidden
$tw.utils.setStyle(targetElement,[
{display: "none"},
@ -130,7 +142,15 @@ ZoominListView.prototype.insert = function(widget) {
ZoominListView.prototype.remove = function(widget) {
var targetElement = widget.findFirstDomNode(),
duration = $tw.utils.getAnimationDuration();
duration = $tw.utils.getAnimationDuration(),
removeElement = function() {
widget.removeChildDomNodes();
};
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
removeElement();
return;
}
// Set up the tiddler that is being closed
$tw.utils.setStyle(targetElement,[
{position: "absolute"},
@ -170,10 +190,7 @@ ZoominListView.prototype.remove = function(widget) {
{opacity: "0"},
{zIndex: "0"}
]);
setTimeout(function() {
// Delete the DOM node when the transition is over
widget.removeChildDomNodes();
},duration);
setTimeout(removeElement,duration);
// Now the tiddler we're going back to
if(toWidgetDomNode) {
$tw.utils.setStyle(toWidgetDomNode,[

2
editions/tw5.com/tiddlers/widgets/ListWidget.tid
View File

@ -40,6 +40,8 @@ The `storyview` attribute specifies the name of an optional module that can anim
* `zoomin`: just renders the current tiddler from the list, with a zoom animation for navigating between tiddlers
* `pop`: shrinks items in and out of place
In order for the storyviews to animate correctly each entry in the list should be a single block mode DOM element.
!! Handling history and navigation
The optional `history` attribute specifies the name of a tiddler that is used to track the current tiddler for navigation purposes. When the history tiddler changes the list view responds by telling the listview to handle navigating to the new tiddler. See the NavigationMechanism for more details.