SAFE-FS Desktop App

safe-fs
demoapp

#1

Been trying to break down the Demo App

because it’s the only thing that really uses the “upload” function. So I want to learn how it works and maybe use it to make an early version of SAFE-FS :smiley: for desktop

So I’m gonna use this thread for some ?'s here and there :slight_smile:

This will be my first full app with node :open_mouth:


#2

Got the newest node twice, any idea why I can’t “npm install” without errors?


#3

and @joshuef I might have asked you a long time ago but I forgot. Do you remember a way to upload files with safe-js? I know the createOrUpdateFile but I think that would require me to convert every file (images, video etc) into text which would be quite crazy. Do you remember if there was an upload command in the safe-js you made?


#4

You can set the data type to binary for example.

The dataToWrite doesn’t need to be text, that should let you upload whatever your want. :thumbsup:


#5

It says that git is not installed. Btw, you can try running npm install --verbose which gives you more info and helps tracking compiler errors.


#6

thx that github install fixed it :slight_smile:

but this TEST16 error that I posted about here still gives me problems. Desktop Demo App can’t auth with launcher v.11 either. Nothing can.

Internet is working, since I’m posting here, and I’m logged in with Launcher v.11 but nothing can auth with it. Anyone else having these TEST16 problems?

pics:


#7

Can’t quite read those errors Will, but maybe they are related? Am not playing with code ATM so not able to help more.


#8

I just tested with a fresh account, and it seems I can auth apps against launcher 11.


#9

really kinda lost here. Been trying all sorts of ways to just upload a file with safe-js. Been working on this for months lol off and on :stuck_out_tongue: remember

here’s my most recent attempt. I just have this html upload input:

<input type="file" name="fileToUpload" id="content">
<button onclick="uplode()">UPLOAD</button>

and this is my most recent javascript function:

			function uplode(){
					if(!auth){
					alert('Please Login First');
					return;
				}
				var contennts = (document.getElementById('content').value);
				if(contennts==""){
					alert('Please Choose a File');
					return;
				}
				var contentzz = (document.getElementById('content').value).trim();
				safeNFS.createOrUpdateFile(auth.token,name,contentzz,dataType='text/plain').then(function(response){
					document.getElementById('fileresponse').innerHTML = '"'+(document.getElementById('content').value).trim()+'"';
					var elems = document.getElementsByTagName("input");
					var l = elems.length;
						for (var i = 0; i < l; ++i){
						  elems[i].value="";
						}
				},function(error){
					//console.log(error);
					document.getElementById('fileresponse').innerHTML = "Error Uploading File";
				});
			}

Returns my error every time, is there some logic I’m missing? Just trying to get it to upload a file.

That simple task has confuzzled me for many months. The problem of trying to work with projects with zero documentation… :cry: :crying_cat_face:

can see my app giving errors at safe://upload.wom3


#10

I haven’t made time to work on test 16 or to connect to it with the respective browser binary. Will you paste your error into a post so that I can see what’s happening?


#11

Scoping out your snippet (with the proviso: I’m also not on test 16 as it stands, so please paste your error here and we can see for sure):

safeNFS.createOrUpdateFile(auth.token,name,contentzz,dataType='text/plain').then(function(response)

name doens’t appear to be defined in your js code, so that’ll likely throw an error…


FYI: from your code it looks like the only data you’re writing is the file name (contentzz.value is not the file’s data, just the location of the file on the computer take a look at the html5 file api here ).


The problem of trying to work with projects with zero documentation… :cry: :crying_cat_face:

There is some documentation, not heaps, but some: https://github.com/joshuef/safe-js#createorupdatefile

If you feel it’s not clear I’m happy to accept a PR with improvements :thumbsup: (But I’m not maintaining safe-js as it’ll be superseded by new libs from maidsafe themselves and won’t be useful at all come mutable data, sorry!).


#12

What is the “name?” name of the file being updated?

If so I can just make a variable that maps it to my html browse files button

Also, just updated my function but still not quite working. Added that var name = line giving it a basic “name” just for now, to try and get one file uploaded successfully:

			function uplode(){
					if(!auth){
					alert('Please Login First');
					return;
				}
				var contennts = (document.getElementById('content').value);
				if(contennts==""){
					alert('Please Choose a File');
					return;
				}
				var name = "CURRENTUPLOADFILE";
				var contentzz = (document.getElementById('content').value).trim();
				safeNFS.createOrUpdateFile(auth.token,name,contentzz,dataType='text/plain').then(function(response){
					document.getElementById('fileresponse').innerHTML = '"'+(document.getElementById('content').value).trim()+'"';
					var elems = document.getElementsByTagName("input");
					var l = elems.length;
						for (var i = 0; i < l; ++i){
						  elems[i].value="";
						}
				},function(error){
					//console.log(error);
					document.getElementById('fileresponse').innerHTML = "Error Uploading File";
				});
			}

error:


#13

In your code snippet, you have a variable called ‘name’:

As far as I can see it’s not defined in your code anywhere.


From the docs:

createOrUpdateFile

Helper function to make or update a file as no current method exists to do this in the SAFE API at this point.

Either creates a file if it doesn’t exist, or deletes and recreates with the new content if it does already exist.

token - (string) auth token
filePath - (string) file path
dataToWrite - data of file being uploaded
dataType - (string - optional), type of data being uploaded. text/plain for example.
dataLength - (int - optional) length of data being written.
metadata - (base64 string - optional) metadata for the dir.
isPathShared - (bool - optional) true if writing to the sharedDRIVE, false writes to APP;
Returns a Promise which resolves truthy upon success.

So the second param should be the file path on safe.


#14

@whiteoutmashups ah whack, that’s not a very helpful error. What version of the browser are you using?


#15

actually I think it’s kind of working, it gave me a “C://file:etc” kind of response when I tried uploading a .txt file instead of a .png

making a quick GET file function now to test if it’s truly on there :smiley:


#16

I’m all agog guys.
Very keen to reproduce this when I get a minute


#17

ok great it looks like it’s there :smiley:

Guess that was all I needed, was give the name var.

Now I’ll try playing with it!

Something that would really help is if there’s a way to make a function that will allow uploading .txt files, and .png and .anything all in one file? Is the dataType=Text/Plain part limiting that?

maybe I can just delete the dataType part? I’ll try that :slight_smile:


#18

#Working! :smiley:

pretty much. can upload files!!! :smiley: only .txt files and plaintext for now.

try it out!! safe://upload.wom3

will document this for everybody


#19

You can declare any data type. It’s built on top of fetch.


#20

Hmm so it can only take one type at once?

So I need to have separate upload buttons and functions for every individual file type?

I mean, there must be a smarter way than that right?

All in one function / button would be perfect