Add tm-http-request message for making HTTP requests (#7422)
* Initial Commit * HttpClient object shouldn't need to know about events * Add support for cancelling HTTP requests * Make the number of outstanding HTTP requests available in a state tiddler * Add a network activity button Click it to cancel outstanding requests * Fix typo Thanks @btheado Co-authored-by: btheado <brian.theado@gmail.com> * Fix crash when cancelling more than one HTTP request Thanks @saqimtiaz * Further fixes to cancelling outstanding HTTP requests * Fix missing body --------- Co-authored-by: btheado <brian.theado@gmail.com>
This commit is contained in:
Jeremy Ruston
GitHub
parent
a12a9bd939
commit
d1f90f075f
|
|
@ -0,0 +1,11 @@
|
|||
title: $:/core/images/network-activity
|
||||
tags: $:/tags/Image
|
||||
|
||||
<svg width="22pt" height="22pt" class="tc-image-network-activity tc-image-button" viewBox="0 0 128 128"><g class={{{ [{$:/state/http-requests}match[0]then[]else[tc-network-activity-background]] }}}>
|
||||
<$list filter="[{$:/state/http-requests}match[0]]" variable="ignore">
|
||||
<path d="M64.043 45.153a4.002 4.002 0 0 1 4.367 2.21l.084.188 30.403 73.4a4 4 0 0 1-7.307 3.25l-.084-.188-3.103-7.49-8.898 8.899a3.985 3.985 0 0 1-2.624 1.166l-.205.005a3.987 3.987 0 0 1-2.828-1.171l-9.849-9.848-9.847 9.848a3.985 3.985 0 0 1-2.624 1.166l-.204.005a3.987 3.987 0 0 1-2.829-1.171l-8.899-8.9-3.102 7.491a4 4 0 1 1-7.391-3.062l30.403-73.4a4.001 4.001 0 0 1 4.495-2.39l.042-.008Zm13.636 56.74-8.023 8.024 7.02 7.019 8.023-8.022-7.02-7.02Zm-27.353.008-7.019 7.019 8.016 8.016 7.019-7.02-8.016-8.015Zm13.68-13.68-8.023 8.023 8.016 8.016 8.023-8.023-8.016-8.016Zm-8.971-8.971-4.687 11.315 8.001-8.001-3.314-3.314Zm17.933.009-3.305 3.305 7.979 7.979-4.674-11.284ZM64 57.607l-5.666 13.68c.096.072.188.15.278.232l.133.126 5.261 5.262 5.262-5.262c.128-.127.261-.244.4-.35L64 57.607Zm0-34.69a8 8 0 1 1 0 16 8 8 0 0 1 0-16Z"/>
|
||||
</$list>
|
||||
<$list filter="[{$:/state/http-requests}!match[0]]" variable="ignore">
|
||||
<path d="M109.395.952a4.002 4.002 0 0 1 3.787 2.708C117.529 11.62 120 20.753 120 30.462c0 15.186-6.044 28.96-15.858 39.047a4 4 0 1 1-6.47-4.626l-.12-.094C106.466 56.074 112 43.914 112 30.462c0-8.492-2.205-16.469-6.074-23.39l.054-.036a4 4 0 0 1 3.415-6.084Zm-90.762 0a4 4 0 0 1 3.072 6.562l.093.06A47.786 47.786 0 0 0 16 30.463c0 13.315 5.42 25.363 14.176 34.058l-.01.007a4 4 0 1 1-6.312 4.863l-.063.05C14.017 59.359 8 45.613 8 30.462c0-9.77 2.502-18.956 6.9-26.952A4.002 4.002 0 0 1 18.634.952Z"/><path d="M64.043 44.698a4.002 4.002 0 0 1 4.367 2.21l.084.188 30.403 73.4a4 4 0 0 1-7.307 3.25l-.084-.188-3.103-7.49-8.898 8.9a3.985 3.985 0 0 1-2.624 1.166l-.205.005a3.987 3.987 0 0 1-2.828-1.172l-9.849-9.848-9.847 9.848a3.985 3.985 0 0 1-2.624 1.167l-.204.005a3.987 3.987 0 0 1-2.829-1.172l-8.899-8.899-3.102 7.49a4 4 0 0 1-7.391-3.061l30.403-73.4a4.001 4.001 0 0 1 4.495-2.39l.042-.009ZM77.68 101.44l-8.023 8.023 7.02 7.019 8.023-8.022-7.02-7.02Zm-27.353.007-7.019 7.019 8.016 8.016 7.019-7.019-8.016-8.016Zm13.68-13.68-8.023 8.023 8.016 8.016 8.023-8.023-8.016-8.016Zm-8.971-8.971L50.348 90.11l8.001-8.001-3.314-3.314Zm17.933.009-3.305 3.305 7.979 7.979-4.674-11.284ZM64 57.152l-5.666 13.68c.096.073.188.15.278.232l.133.127 5.261 5.261 5.262-5.261c.128-.128.261-.244.4-.351L64 57.152ZM38.503 1.058a4 4 0 0 1 2.7 6.952l.17-.175C35.582 13.625 32 21.625 32 30.462c0 8.838 3.582 16.838 9.374 22.629a4 4 0 0 1-5.659 5.658l-.01.01C28.473 51.52 24 41.526 24 30.485 24 19.567 28.374 9.67 35.466 2.453a3.995 3.995 0 0 1 3.037-1.395ZM89.369.952c1.14 0 2.17.478 2.899 1.244l.005-.006C99.518 9.43 104 19.434 104 30.485c0 10.826-4.3 20.648-11.287 27.85a4 4 0 1 1-6.054-5.213l-.032-.032C92.418 47.299 96 39.299 96 30.462c0-8.73-3.496-16.643-9.164-22.416A4 4 0 0 1 89.368.952Zm-39.282 11.14a4 4 0 0 1 2.59 7.048l.01.009A15.95 15.95 0 0 0 48 30.462a15.95 15.95 0 0 0 4.687 11.315l-.01.01a4 4 0 1 1-5.82 5.47l.173.177A23.925 23.925 0 0 1 40 30.462a23.925 23.925 0 0 1 7.03-16.97l.01.01a3.991 3.991 0 0 1 3.047-1.41Zm27.895.07a3.99 3.99 0 0 1 2.984 1.336l.006-.005A23.925 23.925 0 0 1 88 30.463a23.92 23.92 0 0 1-6.707 16.642l-.3.305a4 4 0 1 1-5.679-5.632v-.002A15.95 15.95 0 0 0 80 30.462a15.95 15.95 0 0 0-4.685-11.312 4.012 4.012 0 0 1-1.333-2.987 4 4 0 0 1 4-4ZM64 22.463a8 8 0 1 1 0 16 8 8 0 0 1 0-16Z"/>
|
||||
</$list>
|
||||
</g></svg>
|
||||
|
|
@ -67,6 +67,8 @@ More/Caption: more
|
|||
More/Hint: More actions
|
||||
NewHere/Caption: new here
|
||||
NewHere/Hint: Create a new tiddler tagged with this one
|
||||
NetworkActivity/Caption: network activity
|
||||
NetworkActivity/Hint: Cancel all network activity
|
||||
NewJournal/Caption: new journal
|
||||
NewJournal/Hint: Create a new journal tiddler
|
||||
NewJournalHere/Caption: new journal here
|
||||
|
|
|
|||
|
|
@ -20,6 +20,38 @@ exports.before = ["story"];
|
|||
exports.synchronous = true;
|
||||
|
||||
exports.startup = function() {
|
||||
// Install the HTTP client event handler
|
||||
$tw.httpClient = new $tw.utils.HttpClient();
|
||||
var getPropertiesWithPrefix = function(properties,prefix) {
|
||||
var result = Object.create(null);
|
||||
$tw.utils.each(properties,function(value,name) {
|
||||
if(name.indexOf(prefix) === 0) {
|
||||
result[name.substring(prefix.length)] = properties[name];
|
||||
}
|
||||
});
|
||||
return result;
|
||||
};
|
||||
$tw.rootWidget.addEventListener("tm-http-request",function(event) {
|
||||
var params = event.paramObject || {};
|
||||
$tw.httpClient.initiateHttpRequest({
|
||||
wiki: event.widget.wiki,
|
||||
url: params.url,
|
||||
method: params.method,
|
||||
body: params.body,
|
||||
oncompletion: params.oncompletion,
|
||||
onprogress: params.onprogress,
|
||||
bindStatus: params["bind-status"],
|
||||
bindProgress: params["bind-progress"],
|
||||
variables: getPropertiesWithPrefix(params,"var-"),
|
||||
headers: getPropertiesWithPrefix(params,"header-"),
|
||||
passwordHeaders: getPropertiesWithPrefix(params,"password-header-"),
|
||||
queryStrings: getPropertiesWithPrefix(params,"query-"),
|
||||
passwordQueryStrings: getPropertiesWithPrefix(params,"password-query-")
|
||||
});
|
||||
});
|
||||
$tw.rootWidget.addEventListener("tm-http-cancel-all-requests",function(event) {
|
||||
$tw.httpClient.cancelAllHttpRequests();
|
||||
});
|
||||
// Install the modal message mechanism
|
||||
$tw.modal = new $tw.utils.Modal($tw.wiki);
|
||||
$tw.rootWidget.addEventListener("tm-modal",function(event) {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ title: $:/core/modules/utils/dom/http.js
|
|||
type: application/javascript
|
||||
module-type: utils
|
||||
|
||||
Browser HTTP support
|
||||
HTTP support
|
||||
|
||||
\*/
|
||||
(function(){
|
||||
|
|
@ -13,11 +13,204 @@ Browser HTTP support
|
|||
"use strict";
|
||||
|
||||
/*
|
||||
A quick and dirty HTTP function; to be refactored later. Options are:
|
||||
Manage tm-http-request events. Options include:
|
||||
wiki: Reference to the wiki to be used for state tiddler tracking
|
||||
stateTrackerTitle: Title of tiddler to be used for state tiddler tracking
|
||||
*/
|
||||
function HttpClient(options) {
|
||||
options = options || {};
|
||||
this.nextId = 1;
|
||||
this.wiki = options.wiki || $tw.wiki;
|
||||
this.stateTrackerTitle = options.stateTrackerTitle || "$:/state/http-requests";
|
||||
this.requests = []; // Array of {id: string,request: HttpClientRequest}
|
||||
this.updateRequestTracker();
|
||||
}
|
||||
|
||||
/*
|
||||
Return the index into this.requests[] corresponding to a given ID. Returns null if not found
|
||||
*/
|
||||
HttpClient.prototype.getRequestIndex = function(targetId) {
|
||||
var targetIndex = null;
|
||||
$tw.utils.each(this.requests,function(requestInfo,index) {
|
||||
if(requestInfo.id === targetId) {
|
||||
targetIndex = index;
|
||||
}
|
||||
});
|
||||
return targetIndex;
|
||||
};
|
||||
|
||||
/*
|
||||
Update the state tiddler that is tracking the outstanding requests
|
||||
*/
|
||||
HttpClient.prototype.updateRequestTracker = function() {
|
||||
this.wiki.addTiddler({title: this.stateTrackerTitle, text: "" + this.requests.length});
|
||||
};
|
||||
|
||||
HttpClient.prototype.initiateHttpRequest = function(options) {
|
||||
var self = this,
|
||||
id = this.nextId,
|
||||
request = new HttpClientRequest(options);
|
||||
this.nextId += 1;
|
||||
this.requests.push({id: id, request: request});
|
||||
this.updateRequestTracker();
|
||||
request.send(function(err) {
|
||||
var targetIndex = self.getRequestIndex(id);
|
||||
if(targetIndex !== null) {
|
||||
self.requests.splice(targetIndex,1);
|
||||
self.updateRequestTracker();
|
||||
}
|
||||
});
|
||||
return id;
|
||||
};
|
||||
|
||||
HttpClient.prototype.cancelAllHttpRequests = function() {
|
||||
var self = this;
|
||||
if(this.requests.length > 0) {
|
||||
for(var t=this.requests.length - 1; t--; t>=0) {
|
||||
var requestInfo = this.requests[t];
|
||||
requestInfo.request.cancel();
|
||||
}
|
||||
}
|
||||
this.requests = [];
|
||||
this.updateRequestTracker();
|
||||
};
|
||||
|
||||
HttpClient.prototype.cancelHttpRequest = function(targetId) {
|
||||
var targetIndex = this.getRequestIndex(targetId);
|
||||
if(targetIndex !== null) {
|
||||
this.requests[targetIndex].request.cancel();
|
||||
this.requests.splice(targetIndex,1);
|
||||
this.updateRequestTracker();
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
Initiate an HTTP request. Options:
|
||||
wiki: wiki to be used for executing action strings
|
||||
url: URL for request
|
||||
method: method eg GET, POST
|
||||
body: text of request body
|
||||
oncompletion: action string to be invoked on completion
|
||||
onprogress: action string to be invoked on progress updates
|
||||
bindStatus: optional title of tiddler to which status ("pending", "complete", "error") should be written
|
||||
bindProgress: optional title of tiddler to which the progress of the request (0 to 100) should be bound
|
||||
variables: hashmap of variable name to string value passed to action strings
|
||||
headers: hashmap of header name to header value to be sent with the request
|
||||
passwordHeaders: hashmap of header name to password store name to be sent with the request
|
||||
queryStrings: hashmap of query string parameter name to parameter value to be sent with the request
|
||||
passwordQueryStrings: hashmap of query string parameter name to password store name to be sent with the request
|
||||
*/
|
||||
function HttpClientRequest(options) {
|
||||
var self = this;
|
||||
console.log("Initiating an HTTP request",options)
|
||||
this.wiki = options.wiki;
|
||||
this.completionActions = options.oncompletion;
|
||||
this.progressActions = options.onprogress;
|
||||
this.bindStatus = options["bind-status"];
|
||||
this.bindProgress = options["bind-progress"];
|
||||
this.method = options.method || "GET";
|
||||
this.body = options.body || "";
|
||||
this.variables = options.variables;
|
||||
var url = options.url;
|
||||
$tw.utils.each(options.queryStrings,function(value,name) {
|
||||
url = $tw.utils.setQueryStringParameter(url,name,value);
|
||||
});
|
||||
$tw.utils.each(options.passwordQueryStrings,function(value,name) {
|
||||
url = $tw.utils.setQueryStringParameter(url,name,$tw.utils.getPassword(value) || "");
|
||||
});
|
||||
this.url = url;
|
||||
this.requestHeaders = {};
|
||||
$tw.utils.each(options.headers,function(value,name) {
|
||||
self.requestHeaders[name] = value;
|
||||
});
|
||||
$tw.utils.each(options.passwordHeaders,function(value,name) {
|
||||
self.requestHeaders[name] = $tw.utils.getPassword(value) || "";
|
||||
});
|
||||
}
|
||||
|
||||
HttpClientRequest.prototype.send = function(callback) {
|
||||
var self = this,
|
||||
setBinding = function(title,text) {
|
||||
if(title) {
|
||||
this.wiki.addTiddler(new $tw.Tiddler({title: title, text: text}));
|
||||
}
|
||||
};
|
||||
if(this.url) {
|
||||
setBinding(this.bindStatus,"pending");
|
||||
setBinding(this.bindProgress,"0");
|
||||
// Set the request tracker tiddler
|
||||
var requestTrackerTitle = this.wiki.generateNewTitle("$:/temp/HttpRequest");
|
||||
this.wiki.addTiddler({
|
||||
title: requestTrackerTitle,
|
||||
tags: "$:/tags/HttpRequest",
|
||||
text: JSON.stringify({
|
||||
url: this.url,
|
||||
type: this.method,
|
||||
status: "inprogress",
|
||||
headers: this.requestHeaders,
|
||||
data: this.body
|
||||
})
|
||||
});
|
||||
this.xhr = $tw.utils.httpRequest({
|
||||
url: this.url,
|
||||
type: this.method,
|
||||
headers: this.requestHeaders,
|
||||
data: this.body,
|
||||
callback: function(err,data,xhr) {
|
||||
var hasSucceeded = xhr.status >= 200 && xhr.status < 300,
|
||||
completionCode = hasSucceeded ? "complete" : "error",
|
||||
headers = {};
|
||||
$tw.utils.each(xhr.getAllResponseHeaders().split("\r\n"),function(line) {
|
||||
var pos = line.indexOf(":");
|
||||
if(pos !== -1) {
|
||||
headers[line.substr(0,pos)] = line.substr(pos + 1).trim();
|
||||
}
|
||||
});
|
||||
setBinding(self.bindStatus,completionCode);
|
||||
setBinding(self.bindProgress,"100");
|
||||
var resultVariables = {
|
||||
status: xhr.status.toString(),
|
||||
statusText: xhr.statusText,
|
||||
error: (err || "").toString(),
|
||||
data: (data || "").toString(),
|
||||
headers: JSON.stringify(headers)
|
||||
};
|
||||
self.wiki.addTiddler(new $tw.Tiddler(self.wiki.getTiddler(requestTrackerTitle),{
|
||||
status: completionCode,
|
||||
}));
|
||||
self.wiki.invokeActionString(self.completionActions,undefined,$tw.utils.extend({},self.variables,resultVariables),{parentWidget: $tw.rootWidget});
|
||||
callback(hasSucceeded ? null : xhr.statusText);
|
||||
// console.log("Back!",err,data,xhr);
|
||||
},
|
||||
progress: function(lengthComputable,loaded,total) {
|
||||
if(lengthComputable) {
|
||||
setBinding(self.bindProgress,"" + Math.floor((loaded/total) * 100))
|
||||
}
|
||||
self.wiki.invokeActionString(self.progressActions,undefined,{
|
||||
lengthComputable: lengthComputable ? "yes" : "no",
|
||||
loaded: loaded,
|
||||
total: total
|
||||
},{parentWidget: $tw.rootWidget});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
HttpClientRequest.prototype.cancel = function() {
|
||||
if(this.xhr) {
|
||||
this.xhr.abort();
|
||||
}
|
||||
};
|
||||
|
||||
exports.HttpClient = HttpClient;
|
||||
|
||||
/*
|
||||
Make an HTTP request. Options are:
|
||||
url: URL to retrieve
|
||||
headers: hashmap of headers to send
|
||||
type: GET, PUT, POST etc
|
||||
callback: function invoked with (err,data,xhr)
|
||||
progress: optional function invoked with (lengthComputable,loaded,total)
|
||||
returnProp: string name of the property to return as first argument of callback
|
||||
*/
|
||||
exports.httpRequest = function(options) {
|
||||
|
|
@ -83,8 +276,16 @@ exports.httpRequest = function(options) {
|
|||
options.callback($tw.language.getString("Error/XMLHttpRequest") + ": " + this.status,null,this);
|
||||
}
|
||||
};
|
||||
// Handle progress
|
||||
if(options.progress) {
|
||||
request.onprogress = function(event) {
|
||||
console.log("Progress event",event)
|
||||
options.progress(event.lengthComputable,event.loaded,event.total);
|
||||
};
|
||||
}
|
||||
// Make the request
|
||||
request.open(type,url,true);
|
||||
// Headers
|
||||
if(headers) {
|
||||
$tw.utils.each(headers,function(header,headerTitle,object) {
|
||||
request.setRequestHeader(headerTitle,header);
|
||||
|
|
@ -96,6 +297,7 @@ exports.httpRequest = function(options) {
|
|||
if(!hasHeader("X-Requested-With") && !isSimpleRequest(type,headers)) {
|
||||
request.setRequestHeader("X-Requested-With","TiddlyWiki");
|
||||
}
|
||||
// Send data
|
||||
try {
|
||||
request.send(data);
|
||||
} catch(e) {
|
||||
|
|
@ -104,4 +306,19 @@ exports.httpRequest = function(options) {
|
|||
return request;
|
||||
};
|
||||
|
||||
exports.setQueryStringParameter = function(url,paramName,paramValue) {
|
||||
var URL = $tw.browser ? window.URL : require("url").URL,
|
||||
newUrl;
|
||||
try {
|
||||
newUrl = new URL(url);
|
||||
} catch(e) {
|
||||
}
|
||||
if(newUrl && paramName) {
|
||||
newUrl.searchParams.set(paramName,paramValue || "");
|
||||
return newUrl.toString();
|
||||
} else {
|
||||
return url;
|
||||
}
|
||||
};
|
||||
|
||||
})();
|
||||
|
|
|
|||
|
|
@ -1415,6 +1415,14 @@ exports.checkTiddlerText = function(title,targetText,options) {
|
|||
return text === targetText;
|
||||
}
|
||||
|
||||
/*
|
||||
Execute an action string without an associated context widget
|
||||
*/
|
||||
exports.invokeActionString = function(actions,event,variables,options) {
|
||||
var widget = this.makeWidget(null,{parentWidget: options.parentWidget});
|
||||
widget.invokeActionString(actions,null,event,variables);
|
||||
};
|
||||
|
||||
/*
|
||||
Read an array of browser File objects, invoking callback(tiddlerFieldsArray) once they're all read
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -54,6 +54,7 @@ modal-footer-background: #f5f5f5
|
|||
modal-footer-border: #dddddd
|
||||
modal-header-border: #eeeeee
|
||||
muted-foreground: #bbb
|
||||
network-activity-foreground: #448844
|
||||
notification-background: #ffffdd
|
||||
notification-border: #999999
|
||||
page-background: #f4f4f4
|
||||
|
|
|
|||
|
|
@ -0,0 +1,16 @@
|
|||
title: $:/core/ui/Buttons/network-activity
|
||||
tags: $:/tags/PageControls
|
||||
caption: {{$:/core/images/network-activity}} {{$:/language/Buttons/NetworkActivity/Caption}}
|
||||
description: {{$:/language/Buttons/NetworkActivity/Hint}}
|
||||
|
||||
\whitespace trim
|
||||
<$button message="tm-http-cancel-all-requests" tooltip={{$:/language/Buttons/NetworkActivity/Hint}} aria-label={{$:/language/Buttons/NetworkActivity/Caption}} class=<<tv-config-toolbar-class>>>
|
||||
<$list filter="[<tv-config-toolbar-icons>match[yes]]">
|
||||
{{$:/core/images/network-activity}}
|
||||
</$list>
|
||||
<$list filter="[<tv-config-toolbar-text>match[yes]]">
|
||||
<span class="tc-btn-text">
|
||||
<$text text={{$:/language/Buttons/NetworkActivity/Caption}}/>
|
||||
</span>
|
||||
</$list>
|
||||
</$button>
|
||||
|
|
@ -13,6 +13,7 @@ core/ui/Buttons/language: hide
|
|||
core/ui/Buttons/tag-manager: hide
|
||||
core/ui/Buttons/manager: hide
|
||||
core/ui/Buttons/more-page-actions: hide
|
||||
core/ui/Buttons/network-activity: hide
|
||||
core/ui/Buttons/new-journal: hide
|
||||
core/ui/Buttons/new-image: hide
|
||||
core/ui/Buttons/palette: hide
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
title: $:/tags/PageControls
|
||||
list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/layout]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/more-page-actions]]
|
||||
list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/layout]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/network-activity]] [[$:/core/ui/Buttons/more-page-actions]]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
caption: tm-http-cancel-all-requests
|
||||
created: 20230429161453032
|
||||
modified: 20230429161453032
|
||||
tags: Messages
|
||||
title: WidgetMessage: tm-http-cancel-all-requests
|
||||
type: text/vnd.tiddlywiki
|
||||
|
||||
The ''tm-http-cancel-all-requests'' message is used to cancel all outstanding HTTP requests initiated with [[WidgetMessage: tm-http-request]].
|
||||
|
||||
Note that the state tiddler $:/state/http-requests contains a number representing the number of outstanding HTTP requests in progress.
|
||||
|
||||
It does not take any parameters.
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
title: WidgetMessage: tm-http-request Example - Zotero
|
||||
tags: $:/tags/Macro
|
||||
|
||||
\procedure select-zotero-group()
|
||||
Specify the Zotero group ID to import
|
||||
<$edit-text tiddler="$:/config/zotero-group" tag="input"/> or
|
||||
<$select tiddler="$:/config/zotero-group">
|
||||
<option value="4813312">com216</option>
|
||||
<option value="4913310">pos252</option>
|
||||
<option value="4747244">idt575</option>
|
||||
</$select>
|
||||
\end
|
||||
|
||||
\procedure zotero-save-item(item)
|
||||
<$action-createtiddler
|
||||
$basetitle={{{ =[[_zotero_import ]] =[<item>jsonget[key]] =[[ ]] =[<item>jsonget[title]] +[join[]] }}}
|
||||
text={{{ [<item>jsonget[title]] }}}
|
||||
tags="$:/tags/ZoteroImport"
|
||||
>
|
||||
<$action-setmultiplefields $tiddler=<<createTiddler-title>> $fields="[<item>jsonindexes[]addprefix[zotero-]]" $values="[<item>jsonindexes[]] :map[<item>jsonget<currentTiddler>else[.XXXXX.]]"/>
|
||||
<$list filter="[<item>jsonindexes[creators]]" variable="creatorIndex">
|
||||
<$action-setmultiplefields $tiddler=<<createTiddler-title>> $fields="[<item>jsonget[creators],<creatorIndex>,[creatorType]addprefix[zotero-]]" $values="[<item>jsonget[creators],<creatorIndex>,[lastName]] [<item>jsonget[creators],<creatorIndex>,[firstName]] +[join[, ]] :else[<item>jsonget[creators],<creatorIndex>,[name]] "/>
|
||||
</$list>
|
||||
</$action-createtiddler>
|
||||
\end zotero-save-item
|
||||
|
||||
\procedure zotero-save-items(data)
|
||||
<$list filter="[<data>jsonindexes[]] :map[<data>jsonextract<currentTiddler>,[data]]" variable="item">
|
||||
<$macrocall $name="zotero-save-item" item=<<item>>/>
|
||||
</$list>
|
||||
\end zotero-save-items
|
||||
|
||||
\procedure zotero-get-items(start:"0",limit:"25")
|
||||
|
||||
\procedure completion()
|
||||
\import [[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]
|
||||
<$action-log msg="In completion"/>
|
||||
<$action-log/>
|
||||
<!-- Success -->
|
||||
<$list filter="[<status>compare:number:gteq[200]compare:number:lteq[299]]" variable="ignore">
|
||||
<!-- Import these items -->
|
||||
<$macrocall $name="zotero-save-items" data=<<data>>/>
|
||||
<!-- Check if there are any more items to download -->
|
||||
<$list filter="[<headers>jsonget[total-results]subtract<start>subtract<limit>compare:number:gt[0]]" variable="ignore">
|
||||
<$macrocall $name="zotero-get-items" start={{{ [<start>add<limit>] }}} limit=<<limit>>/>
|
||||
</$list>
|
||||
</$list>
|
||||
\end completion
|
||||
|
||||
\procedure progress()
|
||||
\import [[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]
|
||||
<$action-log message="In progress-actions"/>
|
||||
\end progress
|
||||
|
||||
\procedure request-url()
|
||||
\rules only transcludeinline transcludeblock filteredtranscludeinline filteredtranscludeblock
|
||||
https://api.zotero.org/groups/{{$:/config/zotero-group}}/items/
|
||||
\end request-url
|
||||
|
||||
<$wikify name="url" text=<<request-url>>>
|
||||
<$action-sendmessage
|
||||
$message="tm-http-request"
|
||||
url=<<url>>
|
||||
method="GET"
|
||||
query-format="json"
|
||||
query-sort="title"
|
||||
query-start=<<start>>
|
||||
query-limit=<<limit>>
|
||||
header-accept="application/json"
|
||||
bind-status="$:/temp/zotero/status"
|
||||
bind-progress="$:/temp/zotero/progress"
|
||||
oncompletion=<<completion>>
|
||||
onprogress=<<progress>>
|
||||
var-start=<<start>>
|
||||
var-limit=<<limit>>
|
||||
/>
|
||||
</$wikify>
|
||||
\end
|
||||
|
||||
\procedure zotero-actions()
|
||||
<$macrocall $name="zotero-get-items" start="0" limit="50"/>
|
||||
\end
|
||||
|
||||
<<select-zotero-group>>
|
||||
|
||||
<$button actions=<<zotero-actions>>>
|
||||
Start import from Zotero group
|
||||
</$button>
|
||||
|
||||
<$button message="tm-http-cancel-all-requests">
|
||||
Cancel all HTTP requests
|
||||
</$button> Outstanding requests: {{$:/state/http-requests}}
|
||||
|
||||
<$list filter="[tag[$:/tags/ZoteroImport]limit[1]]" variable="ignore">
|
||||
|
||||
!! Imported Tiddlers
|
||||
|
||||
<$button>
|
||||
<$action-deletetiddler $filter="[tag[$:/tags/ZoteroImport]]"/>
|
||||
Delete these tiddlers
|
||||
</$button>
|
||||
|
||||
Export: <$macrocall $name="exportButton" exportFilter="[tag[$:/tags/ZoteroImport]]" lingoBase="$:/language/Buttons/ExportTiddlers/"/>
|
||||
|
||||
</$list>
|
||||
|
||||
<ol>
|
||||
<$list filter="[tag[$:/tags/ZoteroImport]]">
|
||||
<li>
|
||||
<$link>
|
||||
<$view field="title"/>
|
||||
</$link>
|
||||
</li>
|
||||
</$list>
|
||||
</ol>
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
caption: tm-http-request
|
||||
created: 20230429161453032
|
||||
modified: 20230429161453032
|
||||
tags: Messages
|
||||
title: WidgetMessage: tm-http-request
|
||||
type: text/vnd.tiddlywiki
|
||||
|
||||
The ''tm-http-request'' message is used to make an HTTP request to a server.
|
||||
|
||||
It uses the following properties on the `event` object:
|
||||
|
||||
|!Name |!Description |
|
||||
|param |Not used |
|
||||
|paramObject |Hashmap of parameters (see below) |
|
||||
|
||||
The following parameters are used:
|
||||
|
||||
|!Name |!Description |
|
||||
|method |HTTP method (eg "GET", "POST") |
|
||||
|body |String data to be sent with the request |
|
||||
|query-* |Query string parameters with string values |
|
||||
|header-* |Headers with string values |
|
||||
|password-header-* |Headers with values taken from the password store |
|
||||
|password-query-* |Query string parameters with values taken from the password store |
|
||||
|var-* |Variables to be passed to the completion and progress handlers (without the "var-" prefix) |
|
||||
|bind-status |Title of tiddler to which the status of the request ("pending", "complete", "error") should be bound |
|
||||
|bind-progress |Title of tiddler to which the progress of the request (0 to 100) should be bound |
|
||||
|oncompletion |Action strings to be executed when the request completes |
|
||||
|onprogress |Action strings to be executed when progress is reported |
|
||||
|
||||
The following variables are passed to the completion handler:
|
||||
|
||||
|!Name |!Description |
|
||||
|status |HTTP result status code (see [[MDN|https://developer.mozilla.org/en-US/docs/Web/HTTP/Status]]) |
|
||||
|statusText |HTTP result status text |
|
||||
|error |Error string |
|
||||
|data |Returned data |
|
||||
|headers |Response headers as a JSON object |
|
||||
|
||||
The following variables are passed to the progress handler:
|
||||
|
||||
|!Name |!Description |
|
||||
|lengthComputable |Whether the progress loaded and total figures are valid - "yes" or "no" |
|
||||
|loaded |Number of bytes loaded so far |
|
||||
|total |Total number bytes to be loaded |
|
||||
|
||||
Note that the state tiddler $:/state/http-requests contains a number representing the number of outstanding HTTP requests in progress.
|
||||
|
||||
!! Examples
|
||||
|
||||
* [[Zotero's|https://www.zotero.org/]] API for retrieving reference items: [[WidgetMessage: tm-http-request Example - Zotero]]
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
title: $:/config/zotero-group
|
||||
text: 4813312
|
||||
|
|
@ -3185,6 +3185,10 @@ span.tc-translink > a:first-child {
|
|||
fill: <<colour background>>;
|
||||
}
|
||||
|
||||
.tc-network-activity-background {
|
||||
fill: <<colour network-activity-foreground>>;
|
||||
}
|
||||
|
||||
/*
|
||||
** Flexbox utility classes
|
||||
*/
|
||||
|
|
|
|||
Loading…
Reference in New Issue