Take a look at angular packages that have similar GCCollab functionality

[doug0102]

Here's a list of some interesting packages I've found for Angular that we might find useful. I have tried a few of them out personally but the bulk of them I'm just going off their feature/demo page.

Accessibility

• ngx-focus-control - Angular library to provide tools to work with focus and focusable elements to improve user interfaces and accessibility. Demo

Animations

• ng-animate - A collection of reusable and flexible animations for Angular. Demo
• ng-particles - A component to easily add particle effect animations. Demo

Auth

• angular-auth-oidc-client - A library that supports OpenID Connect & OAuth2 with the latest standard. I have it working in my personal project with GCAccount here.

Calendar

• fullcalendar-angular - A feature rich professional calendar/event view. Has a free tier but you need to pay for the full product. Demo
• angular-calendar - A calendar component for angular 14.0+ that can display events on a month, week or day view. Demo

Chart

• ngx-chartjs - Support for donut, pie, line, bar, spark, radar, and polar. Demo

Drag/Drop (Future Dashboarding?)

• angular-grid-layout - Drag and drop, resize grid. Demo
• angular2-grid - A drag/drop/resize grid-based plugin directive. Plenty of options but looks to be a bit finicky at first glance from the demo page. Demo

Editor Components

• angular-froala-wysiwyg - By far the best wysiwyg editor I've found. Feature rich and very clean design. Has a free tier but for our purpose I think we would need to buy it. If we want to really give our users the power to author great blog posts/content this would be the tool to use in my opinion. Demo
• ngx-quill-editor - A simple, clean editor component that provides basic text/style functionality. And it's free! Demo

File Upload

• ngx-droppable - Give file dropping super-powers to any element or component. Demo
• ngx-awesome-uploader - This is an Angular Library for uploading files. It supports: File Upload and Preview (additionally preview images with lightbox), validation, image cropper , drag and drop with multi language support. Demo

Icons

• angular-fontawesome - Font awesome is a pretty well established library of icons used in thousands of projects. Clean and versatile with plenty of free options, as well as paid options if you want specific styling (bold/thin etc). Demo

Keyboard/Mouse

• ngx-rightclick - Context Menu Service for Angular. Demo

Layout

• angular-fullpage - Official Angular wrapper for the fullpage.js library. Could be used for a nice modern splash screen, product introduction page etc. Demo
• egjs-infinitegrid - An Angular component that can arrange items infinitely according to the type of grids. I could see this being used on the home page for scrollable content, or when looking up users etc. Demo

Maps

• angular-google-maps - Angular components for Google Maps. Could be useful for events. Demo

UI

• ngx-skeleton-loader - Angular package that includes components for creating skeleton screens/loaders. Might be useful if certain calls take a long time on the Pleio. In my opinion it's more useful than a spinner since it gives the impression of faster performance and allows the user to see the layout before the data is ready. Demo

UI Libraries

• Angular Material - Material Design components for Angular. Demo

[vid]

It would be nice to find an editor that supports two-way markdown conversion (though the editor itself can be wysiwyg by default). That opens up a whole new ecosystem of options. MDX, for example.

[doug0102]

@vid If I'm understanding correctly you mean an editor that can output MDX and MD? Or one that allows you to input MD/MDX instead of using wysiwyg? I will do some searching. Actually the first time I've heard o MDX but it looks super cool!

[vid]

Yeah MDX is pretty great. It could be used to give users a lot of flexibility, for example, embed their own polls or other content, without having to use a block editor.

What I mean is something that can round-trip from md to wysiwyg and back again, so someone could use either markdown or wysiwyg for editing. A number of editors have this option.

Here are two other features that would be important to consider, and are available in open source options (from my research a couple years ago): annotation and simultaenous editing. Annotation (aka commenting in this context) adds a really powerful dimension to documents.

My research is a bit out of date, I think this is probably the best candidate: https://prosemirror.net/examples/

• markdown supported
• simultaenous editing
• annotations
• very well supported, widely used including as a base layer for other options
• fully open source

[vid]

I wish we could go directly here: https://dokie.li/ but it probably has too many rabbit holes. It has a lot of future indicators, though.

[doug0102]

@vid I just did some digging and froala actually does have that feature, you can see it here you just need to click the icon with the M and the down arrow. I will be on the lookout for other free options though. That 2nd project I have listed is actually not maintained anymore I just noticed.

I am still trying to wrap my head around the decentralized stuff. This is all new to me haha. If a user were to create content on GCCollab using this dokie editor and save it, where does it get saved? How do we get access to it once it's saved in this location? For the user would it be as seamless of an experience as it would be if they just saved it to our servers?

[vid]

Take a good look at prosemirror, I think it's a great option, and it would be nice to be completely open source!

A simple case of using dokelei is more or less an extension of a web page, and its assets. But instead of linking gifs or whatever, you're linking to coments, and those comments use a shared vocabularly so they can be used as data in the document. This model acknowledges that someone contributed and 'owns' a comment. So the document itself could be saved on 'our server,' and people could post annotations from anywhere, or the other way around; gc people and collaborators could comment on third party sites, and the comments (annotations) would appear on our site, with links to the original article. This is a lot richer than current models, which are at best embedding commercial sites like Twitter, or maybe RSS feeds (which is where some of this comes from). Another interesting direction is user wallets, which seem to be taking off now, so a user can use their own personal information. It's one way we can get to really sophisticated apps that reuse a lot of data across users and sites, without centralizing everything (which is incredibly unsafe for user data). We can shift more to simulations than simple web pages and forms using this approach. And it's all using data that is finely specified, with intentional features like entailment/inference.