mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-25 23:03:15 +00:00
Code Issues Releases Wiki Activity

Restored animations for the reveal widget

Browse Source
This commit is contained in:
Jeremy Ruston 2013-11-01 17:23:08 +00:00
parent 0b0fb0a145
commit 6a6f6c7713
4 changed files with 53 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
core/modules/new_widgets/reveal.js
View File

@ -31,6 +31,9 @@ RevealWidget.prototype.render = function(parent,nextSibling) {
this.computeAttributes();
this.execute();
var domNode = this.document.createElement(this.parseTreeNode.isBlock ? "div" : "span");
var classes = this["class"].split(" ") || [];
classes.push("tw-reveal");
domNode.className = classes.join(" ");
parent.insertBefore(domNode,nextSibling);
this.renderChildren(domNode,null);
if(!domNode.isTiddlyWikiFakeDom && this.type === "popup" && this.isOpen) {
@ -82,6 +85,7 @@ RevealWidget.prototype.execute = function() {
this.type = this.getAttribute("type");
this.text = this.getAttribute("text");
this.position = this.getAttribute("position");
this["class"] = this.getAttribute("class","");
this["default"] = this.getAttribute("default","");
this.qualifyTiddlerTitles = this.getAttribute("qualifyTiddlerTitles");
this.animate = this.getAttribute("animate","no");
@ -93,6 +97,7 @@ RevealWidget.prototype.execute = function() {
this.readState();
// Construct the child widgets
var childNodes = this.isOpen ? this.parseTreeNode.children : [];
this.hasChildNodes = this.isOpen;
this.makeChildWidgets(childNodes);
};
@ -147,11 +152,43 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
*/
RevealWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
if(changedAttributes.state || changedAttributes.type || changedAttributes.text || changedAttributes.position || changedAttributes["default"] || changedAttributes.qualifyTiddlerTitles || changedAttributes.animate || changedTiddlers[this.stateTitle]) {
if(changedAttributes.state || changedAttributes.type || changedAttributes.text || changedAttributes.position || changedAttributes["default"] || changedAttributes.qualifyTiddlerTitles || changedAttributes.animate) {
this.refreshSelf();
return true;
} else {
return this.refreshChildren(changedTiddlers);
var refreshed = false;
if(changedTiddlers[this.stateTitle]) {
this.updateState();
refreshed = true;
}
return this.refreshChildren(changedTiddlers) || refreshed;
}
};
/*
Called by refresh() to dynamically show or hide the content
*/
RevealWidget.prototype.updateState = function() {
// Read the current state
this.readState();
// Construct the child nodes if needed
var domNode = this.domNodes[0];
if(this.isOpen && !this.hasChildNodes) {
this.hasChildNodes = true;
this.makeChildWidgets(this.parseTreeNode.children);
this.renderChildren(domNode,null);
}
// Animate our DOM node
if(!domNode.isTiddlyWikiFakeDom && this.type === "popup" && this.isOpen) {
this.positionPopup(domNode);
}
if(this.isOpen) {
domNode.removeAttribute("hidden");
$tw.anim.perform("open",domNode);
} else {
$tw.anim.perform("close",domNode,{callback: function() {
domNode.setAttribute("hidden","true");
}});
}
};

6
core/modules/utils/dom/animations/slide.js
View File

@ -13,7 +13,8 @@ A simple slide animation that varies the height of the element
"use strict";
function slideOpen(domNode,options) {
var duration = $tw.utils.getAnimationDuration();
options = options || {};
var duration = options.duration || $tw.utils.getAnimationDuration();
// Get the current height of the domNode
var computedStyle = window.getComputedStyle(domNode),
currMarginBottom = parseInt(computedStyle.marginBottom,10),
@ -65,7 +66,8 @@ function slideOpen(domNode,options) {
}
function slideClosed(domNode,options) {
var duration = $tw.utils.getAnimationDuration(),
options = options || {};
var duration = options.duration || $tw.utils.getAnimationDuration(),
currHeight = domNode.offsetHeight;
// Clear the properties we've set when the animation is over
setTimeout(function() {

9
core/modules/utils/fakedom.js
View File

@ -47,6 +47,15 @@ TW_Element.prototype.setAttributeNS = function(namespace,name,value) {
this.setAttribute(name,value);
};
TW_Element.prototype.removeAttribute = function(name) {
if(this.isRaw) {
throw "Cannot removeAttribute on a raw TW_Element";
}
if($tw.utils.hop(this.attributes,name)) {
delete this.attributes[name];
}
};
TW_Element.prototype.appendChild = function(node) {
this.children.push(node);
node.parentNode = this;

3
core/ui/TiddlerInfo.tid
View File

@ -1,6 +1,6 @@
title: $:/core/ui/TiddlerInfo
<div class="tw-tiddler-info"><div class="tw-tab-set"><div class="tw-tab-buttons"><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="refTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">References</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="taggingTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">Tagging</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="listTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">List</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="listedTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">Listed</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="fieldsTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">Fields</$button></div>
<div class="tw-tab-set"><div class="tw-tab-buttons"><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="refTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">References</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="taggingTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">Tagging</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="listTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">List</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="listedTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">Listed</$button><$button type="set" set="$:/state/tiddlerDropDownTabSet" setTo="fieldsTab" qualifyTiddlerTitles="yes" selectedClass="tw-tab-selected">Fields</$button></div>
<div class="tw-tab-divider">
</div>
<div class="tw-tab-content">
@ -22,4 +22,3 @@ title: $:/core/ui/TiddlerInfo
</$reveal>
</div>
</div>
</div>