Although both of these issues are important for general usability in the tiddlywiki-app, I think these are two separate problems.
The resize listener is only intended to respond to changes in the actual containing window size (generally by dragging the window border or using the “maximize/restore” buttons in the window frame), while the “zoom” buttons/mouse roller affect the scaling of rendered content within the containing window.
-e
I am not familiar with this info module. The code does not seem to report any errors, the results are normal, and the info tiddlers are not updated in the browser. I am sure this is not a problem with tiddlywiki-app.
/*\
title:TiddlyTools/Modules/Info/WindowSize.js
type: application/javascript
module-type: info
Add "resize" listener to save window size (in pixels) to $:/info/browser/window/width and $:/info/browser/window/height
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
exports.getInfoTiddlerFields = function(updateInfoTiddlersCallback) {
if($tw.node) return
var getWindowSize=function(){
try {
var w=( window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth );
var h=( window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight );
const res= ([{title:"$:/info/browser/window/width",text:w.toString()},{title:"$:/info/browser/window/height",text:h.toString()}]);
console.log(res)
return res;
}
catch(e) { return([]); }
};
window.addEventListener("resize", function () {
updateInfoTiddlersCallback(getWindowSize());
});
return getWindowSize();
};
})();
There is generally no difference between the environment of tiddlywiki-app and the web page started by nodejs tiddlywiki. Both use the browser
This part of the usewiki2 extension is still in Chinese. What does OpenAI option does here ?
Also is there was way to add multiple fields to the tiddlers which is getting added to the tiddlywik-app using the usewiki2 extension using some templates (similar to the current way of adding tags)
But which browser @arunnbabu81? I presume a Chromium or other minimal browser.
At the moment I open my wiki in the browser (Chrome of Firfox) as zoom is not working in TiddlyWiki-App.
TiddlyWiki-App I like that file://C:/ and other file references open directly in Filemanager (on windows) and I am sure there is more access to the local system I could make use of. All of which we loose when opened in a common browser.
[Edited] Undertaking further tests of interaction with the local system
The following links will open the application;
* [[Notepad++ link|file://C:\ProgramData\Microsoft\Windows\Start Menu\Programs\Notepad++.lnk]]
* [[Notepad++ exe|file://C:\Program Files\Notepad++\notepad++.exe]]
The following opens a tab in a new filemanger windor/tab, but thew tab can be dragged to another filemanger window if desired;
file://C:\ProgramData\Microsoft\Windows\Start Menu\Programs
or
[[Programs|file://C:\ProgramData\Microsoft\Windows\Start Menu\Programs]]
A question that arrises with the ability to execute an application is could we accomodate the abillity to provide parameters to the execution?
Is it possible to launch tiddlywiki-app from the local command line or shortcut that could accept a tiddlywiki file as a parameter, idealy not opening a second time in tiddlywiki-app if already open.
The code you posted is NOT the code I published! Most notably, you’ve added
if($tw.node) return
at the beginning of the function. This explicitly prevents the code from reporting any errors or updating the info tiddlers when running in a NodeJS environment.
The purpose of my code is to get the current window width and height values (in pixels) and store them in $:/info/browser/window/width and $:/info/browser/window/height shadow tiddlers. This code is intially invoked at startup by the TWCore’s “info” mechanism which creates the respective $:/info/... tiddlers based on the array of objects returned.
The code also sets up a window event listener, so that whenever the browser window is resized, the respective $:/info/... tiddlers are updated (via the updateInfoTiddlersCallback function) to reflect the new window width and height.
Here’s the actual current code from TiddlyTools/Modules/Info/WindowSize.js:
/*\
title:TiddlyTools/Modules/Info/WindowSize.js
type: application/javascript
module-type: info
save window size (pixels) to $:/info/browser/window/width and $:/info/browser/window/height
with resize listener
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
exports.getInfoTiddlerFields = function(updateInfoTiddlersCallback) {
try {
var getWindowSize=function() {
var w=( window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth );
var h=( window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight );
return ([{title:"$:/info/browser/window/width",text:w.toString()},{title:"$:/info/browser/window/height",text:h.toString()}]);
};
window.addEventListener("resize",function(){updateInfoTiddlersCallback(getWindowSize());});
return getWindowSize();
}
catch(e) { return([]); }
};
})();
Note that, for normal browser-based usage, there will always be a window object, and the function works as intended… it gets the current browser window width and height, and also sets up a resize listener.
Using the above code, the tiddlywiki-app does successfully set the initial $:/info/... tiddler values. However, when the tiddlywiki-app window is resized, it does not seem that the “resize” event listener is triggered and the $:/info/... tiddlers are not being updated.
Can you make your tiddlywiki-app code trigger the “resize” event listener? If not, can you suggest some alternative code that I can add to my implementation to achieve the same outcome?
-e
@EricShulman what is the reason behind you preferring the current code compared to the initial code you shared in an older post of yours (link is there in one of my previous post) … especially since the old code is working in the Tiddlywiki-app
You reported that, using my latest “info” code in the tiddlywiki-app environment:
I then asked:
To which you replied:
So, it is not entirely true that:
since neither implementation is correctly handling the “resize” listener in the tiddlywiki-app.
The advantage of the newer “info” handling is that:
$:/info/... values, so if that mechanism is ever enhanced in the future, my add-on will still be compatible with whatever those TWCore changes may be.$:/info/... tiddlers at startup, which is more consistent with all the other shadow $:/info/... tiddlers created by the TWCore.$:/info tiddlers, which were being saved when the TiddlyWiki is saved.-e
I was mentioning about this startup module which was working in Tiddlywiki-app Would it be a good idea to implement in TW to update the infomechanism when entering/leaving fullscreen? - #2 by EricShulman
Not the new info module
OK… one last try at a re-write… the TiddlyTools/Modules/Info/WindowSize.js code now looks like this:
exports.getInfoTiddlerFields = function(updateInfoTiddlersCallback) {
window.addEventListener("resize",function(){
updateInfoTiddlersCallback([
{title:"$:/info/browser/window/width",text:window.innerWidth.toString()},
{title:"$:/info/browser/window/height",text:window.innerHeight.toString()}
]);
});
return ([
{title:"$:/info/browser/window/width",text:window.innerWidth.toString()},
{title:"$:/info/browser/window/height",text:window.innerHeight.toString()}
]);
};
Notes:
window.innerWidth and window.innerHeight (no fallbacks for older browsers)getWindowSize() function$:/info/... tiddlersGet the update from the above link and let me know if it handles “resize” events in tiddlywiki-app.
-e
That needs additional config in Electron.
Zooming works in https://github.com/tiddly-gittly/TidGi-Desktop, using ctrl + +/-
Got this error again
Here is code used.
/*\
title:TiddlyTools/Modules/Info/WindowSize.js
type: application/javascript
module-type: info
save window size (pixels) to $:/info/browser/window/width and $:/info/browser/window/height
with resize listener
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
exports.getInfoTiddlerFields = function(updateInfoTiddlersCallback) {
window.addEventListener("resize",function(){
updateInfoTiddlersCallback([
{title:"$:/info/browser/window/width",text:window.innerWidth.toString()},
{title:"$:/info/browser/window/height",text:window.innerHeight.toString()}
]);
});
return ([
{title:"$:/info/browser/window/width",text:window.innerWidth.toString()},
{title:"$:/info/browser/window/height",text:window.innerHeight.toString()}
]);
};
The problem seems to be with the initial setup for the “resize” event listener or in triggering the “resize” listener after setup. I’ve tried to simplify the code as much as possible to eliminate potential causes, but at this point it is unclear to me why this occurs, or what to do about it.
Clearly there is some kind of difference between adding the “resize” event listener in a real browser vs the tiddlywiki-app container. We are so close to having it work, but I am not set up to debug the tiddlywiki-app. @oeyoews … can you please try to debug this problem to determine the cause, and hopefully to find a solution or at least a workaround that doesn’t involve completely bypassing the functionality.
-e