Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature request: define static cascade files to display on start #25

Open
Tails opened this issue Apr 19, 2022 · 10 comments
Open

Feature request: define static cascade files to display on start #25

Tails opened this issue Apr 19, 2022 · 10 comments

Comments

@Tails
Copy link

Tails commented Apr 19, 2022

I would like to host the Cascade editor as read-only, and preload a few cascades for visitors to look at, since this would function well as a public roadmap. Currently to do so would require hacking the HTML and prefilling the LocalStorage, correct?

Edit: considering that Nuxt can statically render using 'npm run generate' I guess the only thing needed is a way to set context.req.timelineFile when server-side rendering

@Tails
Copy link
Author

Tails commented Apr 19, 2022

Dockerfile used for running:

FROM node:14
RUN git clone https://github.com/parture-org/cascade.page.git
RUN cd ./cascade.page && npm install && npm i -S pathe @nuxt/kit tailwindcss && npm run build
WORKDIR ./cascade.page
CMD npm run generate

@kochrt
Copy link
Member

kochrt commented Apr 20, 2022

Your initial description sounds like sharing a cascade? Which would entail:

  1. Creating an account by sending yourself a signin email (via the profile pane on the sidebar - icon that looks like a person)
  2. Choose a username
  3. From the editor pane, click "Share..."
  4. Save as whatever name you want
  5. Your read-only cascade will be available from cascade.page/[your username]/[your timeline name]

If that is indeed what you want, that's great, and I hope you didn't spend too much time trying to hack something else together. That would also indicate that I need to update the UI to better reflect that what you're describing is very possible!

If that's not what you want or you don't want your timeline to be public, you can go down the path you're going down. I would, however, recommend taking advantage of the subpath stuff I've already built for displaying read-only cascades. You'd of course have to substitute your own storage solution.

I'm not sure how you could take advantage of localStorage to share timelines, since you'd have to send it down the wire one way or another... you could just as well make a timeline, copy the text you wrote to make it, and tell people to paste it into the editor on cascade.page 😆

I hope that makes sense. If I'm not understanding your request let me know.

@Tails
Copy link
Author

Tails commented Apr 20, 2022

Thanks for the swift reply!

The problem is I have a web3 app that cannot be hosted centrally anywhere, so no server. So I have to statically compile cascade.page and host it on Sia Skynet. I would like to just edit a (cascade)-Markdown file in my repository, and that my CI/CD pipeline includes the repo (cascade-)Markdown file in the compilation and generates the static web app with the local file used as the public read-only cascade on every commit.

When one saves a cascade from the editor, where does it get stored on the server? Then in theory I could take the result file and put it in the same storage directory with a statically compiled app for distribution.

Again, thanks for the work on this app, its really awesome!

@Tails
Copy link
Author

Tails commented Apr 20, 2022

It works!

I had to set edittable to false:

<Main :edittable="false" />

and add this to index.ts:

// import precompiled timelines
// this is an absolute path in Docker but ideally a "precompiled timeline folder" setting is available
import precompiledTimelines from '/map.json';

interface DateInterval {...}

export interface TimeMarker {...}

...

let currentTimelineName = "";
let list = [] as string[];

// populate precompiled timelines
// todo: there should be a better nicer way to this that fits with the business logic
// like in MutationTree::getLocalTimelines()
if (process.browser) {
  for (const [timelineName, timeline] of Object.entries(precompiledTimelines)) {
    localStorage.setItem(timelineName, timeline + "");
  }

  currentTimelineName = "main";
  list = Object.keys(precompiledTimelines);

  localStorage.setItem("timelines", list.join(','))
}

const exampleTimeline = `// Comments start with two slashes: \`//\`
...

Now I can define a file with precompiled timelines. Like /map.json:

{
  "main": "section Education I #Education\n08/2008-05/2012: Psych degree #Education\n02/2010-06/2012: Dispatcher #Work\n\n// Add a shareable google photos link to display images. \n10/2010: Barn built across the street https://photos.app.goo.gl/Er9D81cdiE2tUwDZA\n06/2011-08/2011: Westover Air Reserve Base https://photos.app.goo.gl/NZ5rnGS7vZTXHe7aA #Work\nendSection"
}

@almereyda
Copy link

Could we also provide such map.json files via CORS from third-party sources through a URL parameter?

@kochrt
Copy link
Member

kochrt commented May 15, 2022

@almereyda I've been thinking about doing something similar, either cascade.page/from/https://raw.githubusercontent.com/... or with a query param, so it could just try and parse whatever text is at the provided url.

@almereyda
Copy link

almereyda commented May 16, 2022

I'm happy if this can be implemented via an additional route on the daemon.

Considering a static view of a cascade, the viewer application could also be a "single page app" which does not connect to the daemon, and only ingests information via # URL fragments. That way also absolute privacy about third-party sources is granted, given that these will not be transmitted to the webserver at all, and only evaluated client-side.

Btw., which would be the correct mime type and file extension for a Cascade map? I see it's a custom syntax, why some specification may aid here. If that's there, then we don't need to encode \n in some JSON (: and can simply download .cascade files from any source that speaks plain text directly into our interfaces.

@kochrt
Copy link
Member

kochrt commented Jun 11, 2022

So I have added the feature to load files via url fragment. The format is #from={url}, like https://markwhen.com/#from=https://raw.githubusercontent.com/me/myfile.mw.

I have added a few other things related to local file editing which gets to your other questions. The mime type I'm going with is text/markwhen, though text/plain is good enough otherwise. The extension I'm using is .mw. I chose markwhen because of its similarity to markdown and markwhen.com was available :)

This doesn't quite resolve the OP's issue but hopefully it's a good start - it at least allows one to host the files nearly anywhere and have markwhen.com display them.

@Tails
Copy link
Author

Tails commented Jun 21, 2022

Awesome! That's indeed a great start. Like this I can get started for displaying single files. But to show multiple files like you do in the demo would still require hosting, correct?

In the end it would be nice to have a compile-time solution, or it would get difficult when hosting the app behind a non-referral subdomain, like http://roadmap.domain.com.

@kochrt
Copy link
Member

kochrt commented Jun 30, 2022

Possibly related to #55

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants