Code Monkey home page Code Monkey logo

mashlib's Introduction

๐Ÿค— Welcome to the repo of SolidOS

[Solid logo]

MIT license SolidOS issues Matrix

If you made it here you must already have heard about Solid. This space is home to the SolidOS code. Keep reading if you want to know:

For experimenting with SolidOS implementations, you can:

If you are looking for something else, let us try and guide you:

Further links:

๐Ÿค” What is SolidOS?

๐ŸŒŸ๐ŸŒŸ๐ŸŒŸ SolidOS is an Operating System for Solid. ๐ŸŒŸ๐ŸŒŸ๐ŸŒŸ

Solid is developing into a booming ecosystem which involves specifications ๐Ÿ“ƒ, tech stack ๐Ÿ› , servers ๐Ÿ’ป, and apps ๐Ÿ•น. We, the SolidOS team, believe that this ecosystem also needs an Operating System.

When you get a new phone, PC, or tablet, they usually come with an operating system that provides some basic functionality to get started and be productive. More importantly, you can personalize your OS to your needs, by installing apps, managing content, and much more.

Solid is not shipped with a piece of hardware (who knows, maybe in the future it will...). For now, you get into the ecosystem once you create a WebID and provision your own personal data store (often called a "Pod") (see getting started with Solid - get a pod). Immediately after getting your new Solid WebID and Pod space, SolidOS is helping you to navigate the Solid ecosystem.

SolidOS is much more. SolidOS showcases the possibility of Solid for the future, by which we mean โ€”

  • true data ownership โ€” management of personal data & authorization control
  • avoidance of vendor lock-in to services โ€” easy moving to a different Pod or WebID provider
  • data reuse between applications โ€” with help of data interoperability and data discoverability

Watch a SolidOS explanation video as part of the Solid World event series.

What you can do today with SolidOS

Take a look at an example: SolidOS project Pod. SolidOS implemented features:

  • ๐Ÿ“ฐ create a personal webpage
  • ๐Ÿ“ manage your WebID and the data about yourself
  • ๐Ÿ“ manage personal data/files on your Pod
  • ๐Ÿค directly connect and engage with other people who are part of the ecosystem (add friends, chat, ...)
  • ๐Ÿ’ก make use of interconnected apps
  • ๐Ÿ”ง create your own app with Inrupt's Solid Reach SDK or get inspired from a blog post
  • and more (see SolidOS user guide)

SolidOS vision, mission and roadmap

Read more about the current SolidOS ๐ŸŒŸ vision, goals ๐ŸŽฏ, and roadmap ๐Ÿš— on the SolidOS project Pod.

Note: SolidOS is also known by names like Data Browser (default) or Databrowser, and at times as mashlib. Which name is used depends on which flavour of SolidOS you are referring to:

๐Ÿ‘ฉ๐Ÿฝโ€๐Ÿ’ป SolidOS technical intro

The SolidOS stack contains โ€”

It also makes use of โ€”

Let's take a look at an architecture diagram of SolidOS: SolidOS architectural overview

A colorful dependency tree can be seen here: SolidOS dependencies

As you can see, SolidOS is composed of several repositories:

  • rdflib.js โ€” Javascript RDF library for browsers and Node.js
  • solid-logic โ€” core business logic of SolidOS
  • mashlib โ€” a solid-compatible code library of application-level functionality for the world of Solid
  • solid-panes โ€” a set of core solid-compatible panes based on solid-ui
  • solid-ui โ€” User Interface widgets and utilities for Solid. Building blocks for solid-based apps

In the above diagram, SolidOS is deployed on the Node Solid Server (NSS), but it can also be set up to run on the Community Solid Server (CSS) or on ANY Solid-compliant server. When you download and compile the SolidOS code, an NSS is also installed locally, to have everything ready to develop.

SolidOS deeper technical topics

For further details about each GitHub repository, please visit them via the links above for Documentation.

We collect SolidOS code good practices and know how in SolidOS documentation pages.

SolidOS FAQs part of the SolidOS developer guide also contains some Q&A and technical troubleshooting infos.

๐Ÿ‘ฏ How the SolidOS team works

First and foremost who are the contributors of SolidOS?

The SolidOS codebase has a long history and there have been a lot of contributors over the years (see: GitHub contributors). The most active team members are mentioned in the SolidOS Team on the SolidOS Pod Contacts.

SolidOS team meetings

The SolidOS team meets every week for a 1h touchdown. We discuss what was done over the past week, what needs to be done next, and delegation of tasks. Find the meeting time and link on the SolidOS project Pod.

We take minutes on our meetings. You can find them on the SolidOS pod.

SolidOS team instant chat

In between team meetings, we avidly communicate over at the gitter SolidOS channel. Drop by to chat with us, ask questions, or simply say "Hi".

SolidOS team discussions

Sometimes some ideas need an incubation period and further discussion. We make use of GitHub discussions for that.

SolidOS tasks

For daily tasks, we have a Project Board with different views.

For a longer-term roadmap, we use a Solid task manager, and plan the next milestones on Kanban.

Additional useful information

๐Ÿ™‹๐Ÿฝโ€ How you can contribute and help SolidOS thrive

The SolidOS team is always looking for volunteers to help improve SolidOS. Pull Requests (PRs) and edits are always welcome from code, to text, to style. We are looking for UX designers, technical writers, frontend developers, backend developers, DevOps. Don't let these titles intimidate you; they are just some examples. You can find your own place no matter the level of knowledge you are at.

To check for tasks you might help with immediately, look at the Newcomer View in the Project Board. You are welcome to visit us at a weekly team meeting or on the ongoing Gitter-based chat to say 'Hi' or let us know about any blocker you might have encountered.

For anyone up to writing some code

We keep track of stuff to do in Git issues of each repo. An overview you can find on the project board.

Writing tests as a way to understand the code is always a good idea. Tests, in each repo, should be found in the test folder. One can start from there or/and add tests.

Note: Please get familiar with coding and testing guidelines.

For anyone who likes builds or GitHub CI or releases or deployments

There is an existing process and codebase in place to help with SolidOS releases. However, we would like to get better and automate as much as possible. Open issues can be found on the Project Board under the CI category.

Note: Please get familiar with release guidelines.

Builds

SolidOS contains different repositories (mashlib, solid-logic, solid-ui, solid-panes, ...). Each repository contains a package.json with scripts. Most repos contain an npm run build which is used to build the project.

GitHub CI

When you push or PR a change to a repo, a git CI is activated and runs every time. An example is the solid-panes workflow. This CI YML can contain instructions to test and build the repo on different Node versions. If upon push or PR, an instruction fails, one should take care to fix it and keep the branches green.

Testing & releasing a new SolidOS version

In SolidOS, you will find a bash scripts under scripts which is related to releasing a new SolidOS stack. The release script is also used to update dependencies in each repo.

Following best practices, we deploy the new version on the testserver as mentioned here.

Deployment on solidcommunity.net server

Before you start, make sure you have access to all the GitHub repos and all the npm packages. Using Ubuntu or other Unix-like OS, ssh into the server as root.

tmux new
adduser --shell /bin/bash --home /home/build --ingroup sudo build
su - build
whoami
sudo whoami

Then:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.0/install.sh | bash
export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
nvm install 16
nvm use 16

ssh-keygen -t ed25519 -C "[email protected]"
git config --global user.name "Solid OS Build (Michiel)"
git config --global user.email "[email protected]"
cat .ssh/id_ed25519.pub
npm login

Log in to npm with your npm account and add the SSH public key to your GitHub account. Then continue:

git clone https://github.com/solidos/solidos
cd solidos
npm run install-nvm
npm run release

More information can be also found over at the server, solidcommunity.net, repo.

For anyone who likes writing text

SolidOS has quite some documentation around that needs constant improvement. Places to start:

We are open to suggestions to improve these resources from structure, translation, UI to content in general.

For anyone with an eye for design

Solid-ui does the heavy lifting to all things UI for SolidOS. Currently, we use Storybook to help develop components independent of other panes. Make sure to visit the solid-ui readme for information on how to set it up and get started. There is a second option to run solid-ui on its own. Read about it at Debugging solid-ui using Solid Pane Tester.

You can also find the current issues over at the solid-ui issues. And some more information over at the SolidOS Wiki.

SolidOS needs a lot of improvements on UI, including UX and style-guides. Maybe you are the one who can help out? Visit the Project Board and look for UX and UI categories.

๐Ÿ†• Getting started with the SolidOS code

Before you start coding, please review our guidelines:

SolidOS first time setup of code

Make sure you have the needed environment: nvm for SolidOS, npm, Node. If you have problems with node versions on the Apple M1 chip, in the Troubleshooting SolidOS you can find a solution.

git clone https://github.com/solidos/solidos
cd solidos
npm run setup

Note: It might prompt you to install a specific node version, something like nvm install xxx # version missing mentioned in console log.

Note: In case of errors, try to follow what the output messages (errors) suggest in the console to fix the problems, and let us know on the SolidOS team chat.

Run the above lines in a terminal of your choice to setup your SolidOS project folder. By default, some dependent repos are also set up for you:

  • rdflib.js: Javascript RDF library for browsers and Node.js
  • solid-logic: core business logic of SolidOS
  • pane-registry: an index to hold all loaded solid panes
  • mashlib: a solid-compatible code library of application-level functionality for the world of Solid
  • solid-panes: a set of core solid-compatible panes based on solid-ui
  • solid-ui: User Interface widgets and utilities for Solid. Building blocks for solid-based apps
  • node-solid-server: the server that allows you to test your changes

You can start your server and test out your code with:

npm start

If you get into problems check out SolidOS FAQs or ask us directly at SolidOS team chat.

Note: The NPM scripts are using bash scripts. These might not work if you're developing on a Windows machine. Let us know, over at SolidOS team chat if you want support for this.

How to use SolidOS on localhost

Once you managed to get SolidOS running locally (npm start) you can see it over at https://localhost:8443/. If you encounter any problems make sure to check the Troubleshooting SolidOS page.

To work on localhost, first you need to register a local user, so hit register on https://localhost:8443/. After you have created your user, you can navigate to your new pod over at https://username.localhost:8443/. Whenever you need to login again, remember to put https://localhost:8443/ in the Enter the URL of your identity provider: input field. Otherwise you will be logged in with a different provider and redirected out of the localhost environment.

How to make changes in repos

As a newcomer, you do not have direct access to the repos, but you can still contribute through Pull Requests (PRs). First, navigate to the repo you want to work on, and create a fork. Make your changes on your fork, and then create a PR. We will be notified, and you will receive feedback on your changes. For more details on how to do this, visit the GitHub documentation, which explains it much better than we ever could.

If you do have direct access to the repos, it is usual to create a branch for your changes and then a PR. A PR helps you receive feedback and lets us know easily about any changes to the code. Read more about Pull Requests over at the GitHub documentation.

Make sure to read more about working with branches and missing repos over at the SolidOS Wiki.

Developing SolidOS code

Very likely you will want to make changes in the dependent packages/repos of SolidOS (mashlib, solid-logic, solid-ui, solid-panes...).

You have two choices:

Work directly in SolidOS

The npm start script contains a lerna command: npx lerna bootstrap --force-local which makes sure that packages are bootstrapped/taken from your local machine even if versions don't match.

If you need to bootstrap any packages again (e.g. you've run npm install in any of the projects) and don't want to stop the server, you can do npx lerna bootstrap --force-local only. You do not need to stop the server and start it again (npm start).

Another option is to start SolidOS with the npm run watch script. This triggers the watch-script for mashlib, solid-ui, and solid-panes. If you want to run watch-script for rdflib or any of the panes, you'll have to open another terminal window, navigate to the respective project and start its watch-script doing npm run watch.

The output for the watch-script can be a bit difficult to interpret since all output for mashlib, solid-ui, and solid-panes are presented in the same window. You might also consider having each watch scripts running in a separate terminal window. The downside of using this approach is that at its worst, you'll have five separate watch-scripts running (in addition to the terminal window where you started the server) when working on a pane that needs to pick up a change in rdflib. If you find this unwieldy for your setup, or require too many resources, you should consider to work in the according dependent package.

Work in the according dependent package

Any changes you do in a project need to be committed to their original repos and eventually be pushed to NPM manually (this is the part of Lerna that we do not use for this project).

Some projects require you to build a package before you can see changes, so check the various package.json files to see which scripts are available. You can usually do npm run build, and some also support npm run watch which builds a new version each time you do a local change.

Be aware, the packages depend on one another. Here's a simplified view of the dependencies:

node-solid-server --> rdflib
node-solid-server --> mashlib --> rdflib
node-solid-server --> mashlib --> solid-panes --> rdflib
node-solid-server --> mashlib --> solid-panes --> solid-ui --> rdflib
node-solid-server --> mashlib --> solid-panes --> [pane project] --> solid-ui --> rdflib

This means that if you do a change in solid-panes and want to see the result on your local NSS, you need to make sure that mashlib compiles the changes as well. Similarly, if you do changes to solid-ui, and some pane relies on those changes, you need to make sure that the pane compiles those changes, that solid-panes compiles the changes from the pane, and finally that mashlib compiles the changes from solid-panes. This quickly becomes hard to track, so we've devised a couple of ways to mitigate this.

Read about in detail how each pane can be debugged over at the SolidOS Wiki.

Testing SolidOS code

Most of the modules in SolidOS have a test script which can be called with npm run test. In some cases the tests run an ESLint command eslint 'src/**/*.ts' or a jest test or both.

Jest can also offer information related to test coverage by simply runnig npm run coverage.

You can find a repo's tests usually in a dedicated folder called test.

SolidOS build and release

The SolidOS code stack build and release are described above.

๐Ÿ“œ License

The SolidOS code is available under the MIT License.

๐ŸŽค Feedback and questions

Don't hesitate to chat with us on gitter or report a bug.

mashlib's People

Contributors

angelo-v avatar bourgeoa avatar dependabot[bot] avatar dmitrizagidulin avatar jaxoncreed avatar jeff-zucker avatar joepio avatar jonnydubowsky avatar jordanshurmer avatar megoth avatar melvincarvalho avatar michielbdejong avatar mitzi-laszlo avatar oliviamrl avatar rubenverborgh avatar sharonstrats avatar tallted avatar timbl avatar timea-solid avatar vinnl avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

mashlib's Issues

Back button doesnt work when going from normal page to databrowser

Tested on

Version 64.0.3282.167 (Official Build) Built on Ubuntu , running on Ubuntu 16.04 (64-bit)

To reproduce

Go to : https://drive.verborgh.org/public/yo/
Paste into browser : https://drive.verborgh.org/public/yo/data/yo.ttl

Expected behaviour

Browser should return back to https://drive.verborgh.org/public/yo/

Actual behaviour

Browser stays on : https://drive.verborgh.org/public/yo/data/yo.ttl

Diagnosis

Related code :

window.onpopstate = function(event) {
  window.document.outline.GotoSubject($rdf.sym(window.document.location.href), true, undefined, true, undefined)
}

Currently the assumption is that a previous page would also be called from the databrowser. It would be better if the onpopstate handler was more aware of the type of page that called it.

Possible cache confusion between HTML shim and turtle versions of a page

My attempt to reload https://solidos.solid.community/Team/ lead to a blank page and the browser tab favicon showing a "working ... " circle.

Nothing on console log.

Maybe the browser renderer, instead of being given the data browser HTML file, has internally been given the TTL file.

https://solidos.solid.community/Team/SolidOs%20team%20chat/index.ttl#this

Request URL: https://solidos.solid.community/Team/

Request Method: GET

Response headers

Status Code: 304 Not Modified
Remote Address: 165.227.231.225:443
Referrer Policy: no-referrer-when-downgrade
Accept-Ranges: bytes
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: Authorization, User, Location, Link, Vary, Last-Modified, ETag, Accept-Patch, Accept-Post, Updates-Via, Allow, WAC-Allow, Content-Length, WWW-Authenticate, MS-Author-Via
Allow: OPTIONS, HEAD, GET, PATCH, POST, PUT, DELETE
Cache-Control: public, max-age=0
Content-Length: 759
Content-Type: text/html; charset=utf-8
Date: Mon, 10 Aug 2020 22:30:36 GMT
ETag: W/"2f7-7438674ba0"
Last-Modified: Sat, 26 Oct 1985 08:15:00 GMT
Link: <.acl>; rel="acl", <.meta>; rel="describedBy", <http://www.w3.org/ns/ldp#Container>; rel="type", <http://www.w3.org/ns/ldp#BasicContainer>; rel="type"
MS-Author-Via: SPARQL
Set-Cookie: nssidp.sid=s%3A5ggq0_s689eNtskxk5PaVrYB2HJul0gw.TuU8LfocIZA%2BMeKoqWyobVIWBHZWBu3o80VkEf7%2BoO0; Domain=.solid.community; Path=/; Expires=Tue, 11 Aug 2020 22:30:36 GMT; HttpOnly; Secure
Updates-Via: wss://solidos.solid.community
Vary: Accept, Authorization, Origin
WAC-Allow: user="read",public="read"
X-Powered-By: solid-server/5.4.0

Request headers:

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,fr;q=0.8
Cache-Control: max-age=0
Connection: keep-alive
Cookie: nssidp.sid=s%3A5ggq0_s689eNtskxk5PaVrYB2HJul0gw.TuU8LfocIZA%2BMeKoqWyobVIWBHZWBu3o80VkEf7%2BoO0
Host: solidos.solid.community
If-Modified-Since: Sat, 26 Oct 1985 08:15:00 GMT
If-None-Match: W/"2f7-7438674ba0"
Sec-Fetch-Dest: document
Sec-Fetch-Mode: navigate
Sec-Fetch-Site: none
Sec-Fetch-User: ?1
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.105 Safari/537.36

Minor: A trailing "/" prevents identification of trusted apps

If the domain declared for a trusted app ends with a "/" character, the app running is returned "403: Unauthorized Origin" when performing operations it should be allowed to (e.g. resource creation).

Users typically won't declare a domain ending with a "/", but wen copy/pasting for instance, this may happen (that's how I discovered this). I'm not completely sure this is an issue, but it may be worth at least documenting, or removing the trailing "/" automatically.

auth-upgrade : mashlib.min.js display the old login/logout

Jeff Zucker @jeff-zucker oct. 05 18:51
@bourgeoa the test server is still completely messed up. Look at these two files, they are identical except that one uses /mashlib.js and the new login flow and other uses /mashlib.min.js and the old login flow. Just click on the two login buttons to see. This means that it is really impossible to test the new auth. Please re-investigate, something is very wrong.
https://jeff-zucker.solidcommunity.net:8443/test/mash.html and https://jeff-zucker.solidcommunity.net:8443/test/mashmin.html

  • the build process has not been changed
  • The mashlib.js.map and mashlib.min.js.map contains both the new code when looking for new code like onSessionRestore as an example

Make data browser work with Edge

The current version of data browser (mashlib, solid-panes, solid-ui, +++) does not work with Edge.

I propose we revisit this issue when next version of Edge (Edge 76) that is based on Chromium is released to the public.

Introduce TypeScript

As part of the work on the Solid data browser (that we mentioned in SolidOS/solid-panes#64 earlier) we want to introduce TypeScript to improve the code quality and making future refactoring of the code base easier. We will work on this in a separate branch until we know that it is stable enough and have consensus from the community.

TypeScript offers a variety of features that makes working with JavaScript easier. We suggest migrating code file by file as we improve the codebase, and making sure to enhance the new files with types where needed (ie set noImplicitAny to true).

We need to make sure that the build setup is rigid but flexible enough so that developers who do not want to use TypeScript for their work can opt out.

Movement path for user menu is unforgiving and sometimes behind other elements

The movement path of the user menu is quite unforgiving (moving the mouse slightly out of the menu will close it). I'll try to take some learnings from https://css-tricks.com/dropdown-menus-with-more-forgiving-mouse-movement-paths/ and improve it.

Also, I noticed that when you're logged in to another Pod, looking at their front page, the user menu will go behind the menu presented there (see picture). Want to fix this as well.

Login/profile workflow

I am going to go through the basic login/homepage workflow with the mindframe of an unfamiliar user and try to surface relevant questions.

Step 1
I navigate to kellyo.inrupt.net, which I think of as the location of my Pod. I see this page:

Screen Shot 2019-07-31 at 12 24 07 PM

The "Log Out" button in the upper right indicates to me that I'm already logged in. But then why am I looking at the "public homepage of Kelly OBrien"? If I'm logged in as Kelly OBrien, should I be looking at my private homepage or something? When I login to Facebook or LinkedIn, it doesn't show me my public-facing profile first.

Step 2
I'm new to Solid and trying to figure out what I can do with it, so this "Getting started with Solid and Databrowser button" is most appealing to me. ("Profile" and "Inbox" may be interesting at some point, but I know I don't have a profile or any messages yet, so it's not going to be very interesting. I have no idea what "Public Folder" means.)

I've clicked the "Getting started" button and been redirected to this GitHub page: https://github.com/solid/userguide

That's disappointing! I was hoping to explore, click around and play with a few things to see what's up. I'd rather not read a big user manual. Especially since I don't even have anything I specifically want to do yet. I would be open to a quick guided tour via popups that highlight key features though.

Step 3
OK I've backtracked and decided to check out "Profile" instead. I'm at https://kellyo.inrupt.net/profile/card and looking at this:

Screen Shot 2019-07-31 at 12 35 41 PM

This is pretty ugly and I don't understand most of it. What's a card? What are all these unfamiliar file types? What's with all the random number strings in the bottom left? Why are things like "type" and "participant" repeated?

Is this where I'm supposed to edit my own profile? Or is this the profile others see when the find my Solid Pod?

Step 4
I hover near the "Card" title at the top and get some icons to appear. I click through a few that only deepen the mystery.

Ah, but the "Edit your profile" button looks promising! Click:

Screen Shot 2019-07-31 at 12 43 59 PM

OK great, this is a recognizable page. Looks like there are some basic fields I can use to fill out information about myself. I know I'm on a "public" profile page so I assume anything I type here will be discoverable by other people. (I'm not exactly sure how yet.)

Step 5
Then I scroll down to the bottom of the page and see this:

Screen Shot 2019-07-31 at 12 45 28 PM

That sounds cool. I imagine I'll be able to do more interesting things once I'm connect to other people. I can think of a few other people with Solid WebIDs that I'd be happy to be connected with publicly.

But this instruction confuses me: "Drag people onto the target below to add people."

"Drag people"? From where? I have a friend who I know has a Solid Pod too, but I have no idea what his WebID is... Do I have to go track it down somehow? Or am I supposed to be dragging vcf files from my Mac contacts or something?

Step 6
Because I'm extremely industrious and dedicated, I go elsewhere to track down the WebID for my friend Arne: https://megoth.solid.community/profile/card#me

So now I've got his Profile open in another tab on my browser. I try to drag that browser tab into the other tab that has my own profile open to see if I can drop it onto the target icon. No luck.

Aha, after some clicking and hovering, I've realized that I can grab the little ID card icon from Arne's profile page and drag THAT into the other browser tab in order to drop it onto the target.

This seems to work OK, and now it looks like Arne is added to my list of friends. Though his profile photo is broken.

Screen Shot 2019-07-31 at 12 54 55 PM

This would be a great time to chat him or something to let him know that we're now connected on Solid, but the only icon I see is a little circle with an arrow that just directs me back to his public profile. So I'm not really sure what we can do together.

Some issue with Meeting

Hi @ALL, wanting to play with Solid Meeting, i've encountered a lot of issue and some seems to come from mashlib? Meeting pane ? databrowser ? .
here is the discussion about it https://forum.solidproject.org/t/collection-with-tripledoc/3071/4

First : As pointed @vincent it seems that this turtle uses some vocabulary that does not exist :

flow#participation
flow#participant

in the https://www.w3.org/2005/01/wf/flow# defined by @timbl

Next, i've used databrowser to create one : https://holacracy.solid.community/public/meeting/gouvernance/second%20meeting/index.ttl#this
what gave me

@prefix : <#>.
@prefix mee: <http://www.w3.org/ns/pim/meeting#>.
@prefix ic: <http://www.w3.org/2002/12/cal/ical#>.
@prefix XML: <http://www.w3.org/2001/XMLSchema#>.
@prefix flow: <http://www.w3.org/2005/01/wf/flow#>.
@prefix c: </profile/card#>.
@prefix ui: <http://www.w3.org/ns/ui#>.
@prefix n0: <http://purl.org/dc/elements/1.1/>.

:id1589757677361
    ic:dtstart "2020-05-17T23:21:17Z"^^XML:dateTime;
    flow:participant c:me;
    ui:backgroundColor "#dbe0cb".
:this
    a mee:Meeting;
    n0:author c:me;
    n0:created "2020-05-17T23:21:01Z"^^XML:dateTime;
    ic:comment "comment cool";
    ic:dtend "2020-05-13"^^XML:date;
    ic:dtstart "2020-05-04"^^XML:date;
    ic:location "nowhere";
    ic:summary "second test meeting";
    flow:participation :id1589757677361;
    mee:toolList ( :this );
    ui:backgroundColor "#ddddcc"^^XML:color.

I wanted to created a new Meeting from my app https://scenaristeur.github.io/spoggy-group/ (the "Gouv" button)
but as said in the forum, Tripledoc can't help me to create toolList as expected by mashlib.

Considering the

    mee:toolList ( :this );

No library i know (tripledoc, ldflex, solid-file-client) is able to manage this kind of Collection ?
or are there ?
So is it a good idea to use it ?
And if i don't use this triple, the mashlib throw me an error .

TypeError: can't access property "length", o is undefined
  https://holacracy.solid.community/mashlib.min.js:109:231536
    N/<  https://holacracy.solid.community/mashlib.min.js:109:232045
    N  https://holacracy.solid.community/mashlib.min.js:109:232528
    i.tabs.tabWidget  https://holacracy.solid.community/mashlib.min.js:109:476944
    render  https://holacracy.solid.community/mashlib.min.js:109:248135
    e.exports/this.propertyTable/<  undefined

So , how could I recreate a Solid Meeting from a client app ? Here is my code
https://github.com/scenaristeur/spoggy-group/blob/9b49f22f2289c2cde38b4fd4c0119a82d2e0b33c/src/views/gouvernance-meeting-view.js#L79

Thxs

Resolve import/export incompatibility between Node/CommonJS and ESM

We have been attempting to incrementally start using ES import and export in certain modules but not others, at the same time as we move from JS to TS. In fact the module systems are as implemented in node at least, not compatible as we have used them. The result is currently a mess. The pane module API is varies depending on which language you have written the pane module in, which is no way to run a restaurant.

For example in https://github.com/solid/solid-panes/blob/dev/index.js half the modules are called with a new .default and half are not.

See recent notes about this

https://2ality.com/2019/04/nodejs-esm-impl.html

https://github.com/nodejs/modules/blob/master/doc/announcement.md#es-module-code-in-packages Which says among other things,

"Please do not publish any ES module packages intended for use by Node.js until this is resolved."

An extra complication is that our pipeline generates js files from ts files using tsc .. so it is tsc which defines the mapping from import to require, not the native es implementation in node or

Document upload workflow experiment

@timbl and I were talking a bit about how it might be helpful for me to better record my efforts to use the databrowser in order to help us zero in on the most important workflows for a normalish user. This is one attempt to do so, but please let me know if there's a better place or method for me to record such things.

MY GOAL
I took offline notes during a meeting this morning and would like to upload them to a place where the attendees can see them.

Step 1
I click my browser bookmark for team.inrupt.net and arrive at this screen.

Screen Shot 2019-07-31 at 10 39 17 AM

I don't see any menu options, and I don't exactly know what this green plus sign does. When I hover over it I get a pop up dialogue that says "Add another tool to the meeting." This is confusing because I don't know what meeting that refers to.

Step 2
In any case, it's pretty obvious these triangles represent dropdown menus so I figure I'm looking at a bunch of folders. I click the triangle next to "2019" and open a submenu with numbers representing each month. Click the triangle next to "07" and I see a short list of filenames with a staggered pair of plus signs underneath.

Screen Shot 2019-07-31 at 10 47 07 AM

I click the topmost plus sign and get an array of icons. I hover over them to try to find out what they mean. Some make sense to me, some don't. None of them says "upload a file," which is what I'm trying to do.

Step 3

So because I personally have been here before, I drag the .txt file where my notes live on top of the green plus sign. The file I'm trying to upload appears in the file list as I expected.

Screen Shot 2019-07-31 at 10 50 27 AM

Note that I've already taken care to maintain our strict naming conventions in order to keep meeting notes in the correct dated order. From what I can tell, the folder tree automatically sorts files numerically/alphabetically based on the filename with no way to change the order later. What I'd prefer is a way to sort by date, or drag them around into an order that makes sense to me.

Update dependencies

Step 1

Using the latest npm versions of:

I'm updating npm dependencies for:

  • solid-namespace ()
  • pane-registry (rdflib)
  • solid-ui (pane-registry, rdflib, solid-auth-client, solid-auth-tls, solid-namespace)
  • chat-pane (solid-ui)
  • contacts-pane (solid-ui)
  • folder-pane (solid-ui)
  • issue-pane (solid-ui)
  • meeting-pane (solid-ui)
  • source-pane (solid-ui)
  • solid-panes (chat-pane, contacts-pane, folder-pane, issue-pane, meeting-pane, pane-registry, rdflib, solid-namespace, solid-ui, source-pane)
  • mashlib (rdflib, solid-namespace, solid-panes, solid-ui)

Improve error notification to users

Today we use a mix of alert, console.log and Solid UIs notification module to handle errors and display something to users. We should make sure that these instances uses one form, and that it's a sensible way to let users know of errors (and what they can do with that).

Consider splitting into multiple modules

webpack 4.x started giving the following warning:

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
  mashlib.min.js (1.5 MiB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  main (1.5 MiB)
      mashlib.min.js


WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

We've thought about this in the past. For instance, would be great to only load the JSON-LD library when we encounter a JSON-LD document.

The drawback seems to be more moving parts, i.e., not a single .js file anymore.

Info: https://webpack.js.org/guides/code-splitting/

The non-minified mashlib.js must not be minified anywhere

Currently there are very long lines of minified code in what should be debuggable un-minified code. This makes debugging mashlib impossible.

$ line-length node_modules/solid-panes/dist/main.js
327476

Note also

$ line-length node_modules/solid-panes/dist/main.js
327476

where

`alias line-length='awk '\'' { if ( length > L ) { L=length} }END{ print L}'\'' '

Enbable back button with History API

When the History API is enabled in mashlib, on some browsers, the back button doesnt work.

A simple workaround is to add the following code to index.js

window.onpopstate = function(event) {
  window.document.outline.GotoSubject($rdf.sym(window.document.location.href), true, undefined, true, undefined)
}

Unsure this is the best place for it. But the code is tested and works.

Notepad collaboration

I am under the impression that more than one person can contribute to a particular notepad - pad.ttl document. I wanted to confirm if this is the case? And if this is the case, how should the process flow work?

I tried to make this happen by:

  1. created a notepad document under my WebID
  2. Added a triple (by entering text in input field provided)
  3. Gave full access to another test user
  4. Logged in as the test user and accessed the document
  5. Added more triples (again by entering text in input field provided)
  6. As the test user I was not shown as a participant, nor was the input box color changed to show another user
    (I was able to add to this document, but it appeared as if it was modified by the original creator)

Some default styles are missing from mash.css

In one of the newer iterations we introduced reset.css which strips a lot of default styles. This might've been a bit too much, as headers now look like any other text.

I suggest we either:

  1. Remove the use of reset.css altogether, or a subset of the styles we do not want to use, or
  2. Apply some styles we want to have as a common baseline, at least for headers

We might also postpone this until we have a proper solution for how we want to handle styles in the data browser in general.

Run mashlib in an extension

Has been mentioned a few times it would be nice to run mashlib in a browser extension similar to tabulator

The operation would be to request files as RDF / turtle.

Then display them with various panes and allow clicking on hyperlinks

 <link type="text/css" rel="stylesheet" href="https://linkeddata.github.io/solid-app-set/style/tabbedtab.css" /> <script>
      var $SOLID_GLOBAL_config = {
        popupUri: window.location.origin + '/common/popup.html'
      }
    </script> <script type="text/javascript" src="https://linkeddata.github.io/mashlib/dist/mashlib.min.js"></script> <script>
      document.addEventListener('DOMContentLoaded', function () {
        var UI = Mashlib

        UI.rdf.Fetcher.crossSiteProxyTemplate = document.origin + '/proxy?uri={uri}'

        UI.authn.checkUser()
          .then(function () {
            var uri = window.location.href
            window.document.title = uri
            var subject = UI.rdf.namedNode(uri)
            UI.outline.GotoSubject(subject, true, undefined, true, undefined)
          })
      })
    </script> </head> <body> <div class="TabulatorOutline" id="DummyUUID"> <table id="outline"></table> </div>

The rough code to do this as per the current mashlib.

Infinite loop in mother tracker

The infinite loop problem in the mother tracker is happening again
After some testing I have confirmed that it happens in mashlib 0.7.19 but not in mashlib 0.7.18

Here is the diff between the two of them for your reference: https://github.com/solid/mashlib/compare/master@%7B03-18-19%7D...master

I have already tried and confirmed that it is NOT only due to the upgrade to rdflib 0.20.1 from rdflib 0.19.1

It could be partially due to that, but simply downgrading rdflib on mashlib 0.7.19 did not fix the problem

Unfortunately, the data that replicates this problem is very private, so maybe myself and tim are the only ones who can debug this.

in Safari only: webpack error: new.target can't come after a prefix operator.

Loading https://timbl.com/timbl/Public/ in safari, blank screen, console error:

  • SyntaxError: new.target can't come after a prefix operator.

webpack parser source line:

https://github.com/WebKit/webkit/blob/master/Source/JavaScriptCore/parser/Parser.cpp#L4908

an error:

This in turn seems to be objecting to a line "if (!new.target)" in a URL library:

const conversions = __webpack_require__(237);
const utils = __webpack_require__(240);
const impl = utils.implSymbol;

function URL(url) {
  if (!new.target) {
    throw new TypeError(
      "Failed to construct 'URL'. Please use the 'new' operator; this constructor cannot be called as a function."
    );
  }
  if (arguments.length < 1) {
    throw new TypeError("Failed to construct 'URL': 1 argument required, but only " + arguments.length + " present.");
  }

SolidOS should create preferences file if missing

When I open the profile (https://ash.runi.ilabt.imec.be/profile/card#me) of a user (after logging in) I only see the following:

Screenshot from 2019-11-14 08-26-07

In previous versions we were able to edit the profile details of the user here, no?
When checking the console I see that some data is missing and I get the same error when clicking the + button on the left.

Error: Can't find a preferences file pointer in profile <https://ash.runi.ilabt.imec.be/profile/card>

However, https://ash.runi.ilabt.imec.be/profile/ works. I can see the Turtle file. So it might be more confusion on my part as what is expected to see at both locations. But when I try to save my changes I get the following error in the browser window

Error saving back: Error: Web error: 403 (User Unauthorized) on PUT of <https://ash.runi.ilabt.imec.be/profile/card>

while the first error is also shown in the console.

Mashlib should work as a general purpose library

In an effort to simplify the databrowser.html code, alll of its JS has been pulled into mashlib.js. This includes the code to look at the URI bar and launch a databrower for that URI. But other things use the mashlib as a general library, and they may not want that to run.

Suggest EITHER

ONE make the mashlib only do that automatically if it finds the table in the HTML with the right class or id

Or TWO pull that launch code out of mashlib and put it back in the databrowser HTML file.
The former may be an interesting way to go, in that one could expand divs in other ways in future.

Document sharing workflow experiment

This is a separate workflow immediately following #41

GOAL
I have just uploading notes from a meeting and would like to alert the other meeting attendees so they can review the notes.

Step 1
I'm looking at my file within a list of other files.

Screen Shot 2019-07-31 at 10 59 46 AM

Nothing obvious to do except click the triangle button so I do that. I see the content of my .txt file in a box within the file structure.

Screen Shot 2019-07-31 at 11 01 12 AM

Observation: I am still in this view where I can see the entire folder structure of team.inrupt.net, and my file within in it. Is this useful to me? I'm trying to do something specifically with this file, so I don't really care what folder I'm in.

Step 2
There do not appear to be any tools to help me get a URL for this file that I can share with others, or to share it with them directly from this databrowser screen.

Ah! But then I happen to hover over the area next to the filename and see a list of icons appear. I hover again over an icon of a lock and see that a popup dialogue box calls it "sharing." That seems promising. Click.

Screen Shot 2019-07-31 at 11 11 37 AM

Hmm ok, I see information about the default sharing settings. That's useful. It appears that the people I want to share the file with already have access (because I know they're part of the "inrupt team"). But why does it say Inrupt Team twice?

Step 3
So it's good that I know the people I want to share with already have access, but I still need to alert them to the fact that I recently uploaded this document. Otherwise they're never going to look at this file way down in this folder. Maybe this little circle icon with the arrow next to "Inrupt Team" will help me share a link to the file with that team? Click.

Screen Shot 2019-07-31 at 11 17 13 AM

Oh no. Where am I now? I'm at https://team.inrupt.net/profile/card#me

This appears to be some sort of blank profile page for an indeterminate entity known as Inrupt Team. Not what I was looking for.

Step 4
Because I personally have been here before and know this little trick, I drag the filename out of the folder structure and into my browser bar. This provides me with a direct URL to the document that I can copy and paste in other channels to alert the team.

Unable to connect chrome extension to SOLID POD

During developing a chrome-based extension to store information on solid POD( The read-write operation is directly from chrome extension to the POD), we get a POD on solid community and Inrupt.

However, POD only accepts valid URLs at this moment, and chrome extensions do not have that.

solid-ui share pane broken in mashlib 1.0.6

NSS 5.2.1 with mashlib 1.0.6
solid-ui share pane is broken : tried on https://bourgeoa.inrupt.net/public/

acl-control.js:101 Uncaught (in promise) TypeError: Cannot read property 'http://www.w3.org/ns/auth/acl#Append http://www.w3.org/ns/auth/acl#Control http://www.w3.org/ns/auth/acl#Read http://www.w3.org/ns/auth/acl#Write' of undefined at b (acl-control.js:101) at acl-control.js:1128 at acl.js:423 at acl.js:453 at fetcher.js:938

At first it seems that acl-control.js is not in line between solid/solid-ui and mashlib/node_modules

first try of mashlib : tabbedtab.css not found & Cannot read property 'outlineManager' of undefined

Trying to understand solid & mashlib, i have git cloned, npm install, & npm run start.
then I run to https://localhost:8080, accept certificat,
Go to https://localhost:8080/dist

and tried databrowser.html, then I got two errors :

https://linkeddata.github.io/solid-app-set/style/tabbedtab.css --> 404

it looks like is used in browser.html
&

index.js:33 Uncaught TypeError: Cannot read property 'outlineManager' of undefined
    at Object.r.getOutliner (index.js:33)
    at HTMLDocument.<anonymous> (databrowser.html:16)

and adding ' const dom = document ' line + correction on line var outliner = panes.getOutliner(dom)
solve this

Third error :
the login button open https://localhost:8080/.well-known/solid/login
but with content

Cannot GET /.well-known/solid/login

Build errors (webpack generating source map)

OS: Debian (jesse)...

I cloned, did npm install and then node_modules/webpack/bin/webpack.js

It goes quiet for a minute and then:

$ node_modules/webpack/bin/webpack.js 
/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/node_modules/source-map/lib/source-map-generator.js:276
        throw new Error(
        ^

Error: original.line and original.column are not numbers -- you probably meant to omit the original mapping entirely and only map the generated position. If so, pass null for the original mapping instead of an object with empty or null values.
    at SourceMapGenerator_validateMapping [as _validateMapping] (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/node_modules/source-map/lib/source-map-generator.js:276:15)
    at SourceMapGenerator_addMapping [as addMapping] (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/node_modules/source-map/lib/source-map-generator.js:110:12)
    at /home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/node_modules/source-map/lib/source-map-generator.js:72:17
    at Array.forEach (native)
    at SourceMapConsumer_eachMapping [as eachMapping] (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/node_modules/source-map/lib/source-map-consumer.js:157:14)
    at Function.SourceMapGenerator_fromSourceMap [as fromSourceMap] (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/node_modules/source-map/lib/source-map-generator.js:48:24)
    at SourceMapSource.node (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/lib/SourceMapSource.js:32:35)
    at SourceMapSource.proto.sourceAndMap (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack-sources/lib/SourceAndMapMixin.js:30:18)
    at getTaskForFile (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/SourceMapDevToolPlugin.js:33:30)
    at chunk.files.forEach.file (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/SourceMapDevToolPlugin.js:91:21)
    at Array.forEach (native)
    at /home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/SourceMapDevToolPlugin.js:89:18
    at Array.forEach (native)
    at Compilation.<anonymous> (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/SourceMapDevToolPlugin.js:88:12)
    at Compilation.applyPlugins1 (/home/mrh/src/solid/linkeddata-mashlib/node_modules/tapable/lib/Tapable.js:75:14)
    at self.applyPluginsAsync.err (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compilation.js:670:11)
    at next (/home/mrh/src/solid/linkeddata-mashlib/node_modules/tapable/lib/Tapable.js:202:11)
    at Compilation.<anonymous> (/home/mrh/src/solid/linkeddata-mashlib/node_modules/babel-minify-webpack-plugin/dist/index.js:119:11)
    at Compilation.applyPluginsAsyncSeries (/home/mrh/src/solid/linkeddata-mashlib/node_modules/tapable/lib/Tapable.js:206:13)
    at self.applyPluginsAsync.err (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compilation.js:666:10)
    at Compilation.applyPluginsAsyncSeries (/home/mrh/src/solid/linkeddata-mashlib/node_modules/tapable/lib/Tapable.js:195:46)
    at sealPart2 (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compilation.js:662:9)
    at Compilation.applyPluginsAsyncSeries (/home/mrh/src/solid/linkeddata-mashlib/node_modules/tapable/lib/Tapable.js:195:46)
    at Compilation.seal (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compilation.js:605:8)
    at applyPluginsParallel.err (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compiler.js:508:17)
    at /home/mrh/src/solid/linkeddata-mashlib/node_modules/tapable/lib/Tapable.js:289:11
    at _addModuleChain (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compilation.js:507:11)
    at processModuleDependencies.err (/home/mrh/src/solid/linkeddata-mashlib/node_modules/webpack/lib/Compilation.js:477:14)
    at _combinedTickCallback (internal/process/next_tick.js:73:7)
    at process._tickCallback (internal/process/next_tick.js:104:9)

The warning about using `require('mashlib')` should only be given if it is used

The warning

Console.warn("Warning: mashlib's custom implementation of require will be deprecated in the future. Please import mashlib using a build-time bundler, or access the global panes variable when including it as a script."); // Allow require('mashlib')

would be given (a few lined further down) when the function is used, so it goes when you stop using it.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.