1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-26 03:27:18 +00:00
TiddlyWiki5/core/modules/widgets/browse.js
Jeremy Ruston 62bb8affa4
Add data attribute support to button and other widgets (#7769)
* Add data attribute support to button widget

* Fix typo

* Refactor ready for making mechanism more generic

* Apply more generic implementation to multiplate widgets

* Refactor to use existing widget.assignAttributes() method

* Fix typo

* Clarify docs

* Update docs

* Update select widget to support style.* attributes

* Remove obsolete comment

* Fixes refresh issues for checkbox and links widgets for data attributes (#7846)

* fix: refresh issues with checkbox and links widgets

* fix: indenting

* Feat: add support for data attributes to Draggable and Droppable widgets (#7845)

* Docs clarification

* docs: add style and data attributes to Draggable and Droppable widget docs (#7850)

* Refactors Select widget to directly create DOM node (#7848)

* fix: refactored SelectWidget to directly create DOM nodes

* fix: refactored SelectWidget to directly create DOM nodes

* fix: improve refresh handling for select widget

* Fixes issues in the PR "Button widget data attributes" (#7852)

* fix: fixed ordered attributes handling and improved tests to catch event attributes

* fix: clean up code from testing

* fix: more tests and refactoring

* fix: use lowercase when checking for event attribute prefix

* fix: use lowercase when checking for event attribute prefix

* fix: changed comment wording

* fix: minor refactoring

* refactor: for brevity

---------

Co-authored-by: Saq Imtiaz <saq.imtiaz@gmail.com>
2023-11-22 20:05:40 +00:00

114 lines
3.1 KiB
JavaScript

/*\
title: $:/core/modules/widgets/browse.js
type: application/javascript
module-type: widget
Browse widget for browsing for files to import
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
var Widget = require("$:/core/modules/widgets/widget.js").widget;
var BrowseWidget = function(parseTreeNode,options) {
this.initialise(parseTreeNode,options);
};
/*
Inherit from the base widget class
*/
BrowseWidget.prototype = new Widget();
/*
Render this widget into the DOM
*/
BrowseWidget.prototype.render = function(parent,nextSibling) {
var self = this;
// Remember parent
this.parentDomNode = parent;
// Compute attributes and execute state
this.computeAttributes();
this.execute();
// Create element
var domNode = this.document.createElement("input");
domNode.setAttribute("type","file");
if(this.browseMultiple) {
domNode.setAttribute("multiple","multiple");
}
if(this.tooltip) {
domNode.setAttribute("title",this.tooltip);
}
// Nw.js supports "nwsaveas" to force a "save as" dialogue that allows a new or existing file to be selected
if(this.nwsaveas) {
domNode.setAttribute("nwsaveas",this.nwsaveas);
}
if(this.accept) {
domNode.setAttribute("accept",this.accept);
}
// Nw.js supports "webkitdirectory" and "nwdirectory" to allow a directory to be selected
if(this.webkitdirectory) {
domNode.setAttribute("webkitdirectory",this.webkitdirectory);
}
if(this.nwdirectory) {
domNode.setAttribute("nwdirectory",this.nwdirectory);
}
// Add a click event handler
domNode.addEventListener("change",function (event) {
if(self.message) {
self.dispatchEvent({type: self.message, param: self.param, files: event.target.files});
} else {
self.wiki.readFiles(event.target.files,{
callback: function(tiddlerFieldsArray) {
self.dispatchEvent({type: "tm-import-tiddlers", param: JSON.stringify(tiddlerFieldsArray)});
},
deserializer: self.deserializer
});
}
return false;
},false);
// Assign data- attributes
this.assignAttributes(domNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
// Insert element
parent.insertBefore(domNode,nextSibling);
this.renderChildren(domNode,null);
this.domNodes.push(domNode);
};
/*
Compute the internal state of the widget
*/
BrowseWidget.prototype.execute = function() {
this.browseMultiple = this.getAttribute("multiple");
this.deserializer = this.getAttribute("deserializer");
this.message = this.getAttribute("message");
this.param = this.getAttribute("param");
this.tooltip = this.getAttribute("tooltip");
this.nwsaveas = this.getAttribute("nwsaveas");
this.accept = this.getAttribute("accept");
this.webkitdirectory = this.getAttribute("webkitdirectory");
this.nwdirectory = this.getAttribute("nwdirectory");
};
/*
Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
*/
BrowseWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
if($tw.utils.count(changedAttributes) > 0) {
this.refreshSelf();
return true;
}
return false;
};
exports.browse = BrowseWidget;
})();