Quick Tour finished

I know I had started discussing this in another thread, but since most of those ideas have been softly rejected, I thought it probably would be better to focus on the Quick Tour, although I’ll leave a few ‘follow up’ notes below.

Quick Tour done!

Last week, I had promised to do a quick tour for Haiku. It is completely free for the Haiku developer team to take it, add it to git, use it, change it, whatever they would like to do with it, so long as I get credit for first authoring this per the MIT license. My hope is that some form of this can hopefully make it into the Beta if the team likes it. There’s a lot that would need to happen to it to meet Haiku standards, so this is merely a demo.

(And hopefully, a pop-up notification can be shown on first run so the users find the finished version (maybe detect then delete a hidden file on r/w media to determine this).

But anyway, the files (just HTML help) should be able to open from anywhere. I’ve added a link to my Dropbox here (be sure to read below first):

Download Quick Tour zip file

Read me first!

This is a rough draft. What that means is that it is not feature-complete by any means or really finished. It is a proof of concept. The idea is to simply demo what the quick tour is to the Haiku team, so they can get the initial idea of what I’m proposing, and the Haiku team can change it, provide feedback, etc. It’s not perfect and it’s not release material, but my hope the initial alpha of this ‘quick tour’ it makes sense to the team.

Thanks, all.

A few follow-up notes from the previous thread…

First things first: I’ve said it before and before, and will say it just once more – please add an accent color to the widgets to replace gray. Blue or not, there needs to be a splash of something. The various grays makes the first impression of Haiku feel aged, like OpenStep.

Okay, the real reason I add this section. As for tiling, I freely admit to it: Tiling desktop backgrounds for Haiku just would not fit Haiku’s feel, unless someone has a way to (nicely) tile leaves. I haven’t found a good way to do that, and experimented with various shapes. Personally, I don’t mind tiled effects, like Mac OS 9 used to play with, but that’s just me. And I realize this really wouldn’t be a good fit for the Haiku feel for Beta; here’s a few examples of this experimentation (while the pics last; they may disappear due to forum glitches)…

dots-test

sails-test

5 Likes

Looks very neat.

Unfortunately I had to use windows to look at it. An error is reported under haiku because the button is not supported. All the underlying pages can not be opened in the browser. Under Windows, the button does not work, but I could look at the pages individually.

Have you test it on haiku?

http://software.besly.de

Did you take a look at my “fisr steps”? Since I have described how you can reposition the menubar that is missing (Haiku special). In addition, the information to change the settings of the folders to open new window into the open one would be fine too.

I would not go in “UserGuide” on the link on the desktop alone, because this can be quickly deleted. Here it makes sense to show the location on the harddisk too.

Ok i have tested with chrome, here the buttons are running. But you need to make it WebPositive compatible, because this is the standard browser in haiku.

I did test it in Haiku in Web+ and in Safari as well (both are WebKit-based), but that was before I zipped it. Maybe I could try .tar.gz and reupload it?

Could you provide a screenshot of the error? It’d help. Thanks.

Not sure what error appeared for @lelldorin when he tested it, but here’s proof the tour does open in WebPositive for me. I haven’t tested it yet on the latest builds; maybe I’ll do that and see what happens then. Anyway, if anyone else encounters errors or issues, please let me know.

tour1

tour2

The “Learn the Basics” button doesn’t working in Firefox/IE, and that have nothing to do with zip. Interestingly it works with Edge.

It works for me in QupZilla and Otter, but not Web+

screenshot1

That’s after clicking on “Learn the Basics”

Thanks for the helpful feedback… but what does Firefox, Internet Explorer, or Edge have to do with Web+? None of them use WebKit, afaik. At least Epiphany and Safari use it (and Chrome uses Blink, which iirc, is a fork of WK). This is meant to (eventually) be an extension to the Haiku docs, not Windows.

If attributes, etc. were stripped, it might be because of zipping it. I partially worked on it on Haiku, and partially worked on it on my Mac, so it’s possible that’s the case. When I get a chance, I’ll test it on the latest Nightly and see if it works there.

Thanks! This will help me isolate the error. Looks like a problem with my CSS from first glance. I’ll have to test this on the latest nightly tonight, and see what comes up on mine.

Generally speaking a webpage should be platform and browser independent.
For the meaning of “should”: see RFC2119. As far i see, there is no real reason to not be compatible with other browsers.

2 Likes

In general, absolutely! I’d be a total fool to disagree, and I usually test pages I work on across multiple browsers with multiple engines. But this was written for Haiku’s WebPositive specifically in mind as part of user help/docs, and that’s my target in this case, so that’s what I’m focused on. Hope that makes sense. And like I said, I’ll have to find out what’s causing the errors for everyone trying to open it in Web+, fix it, and re-upload it when I can.

It’s about the document type and HTML tags used, which are not supported by Firefox. I’m working on a HTML5+jQuery version of the tour and I’ll let you know when it’s ready.

Why not just old fashioned, bulletproof html? What the heck requires jQuery here?

3 Likes

For the navigation. I merged the hints into one HTML file so the tour is more compact, less redundant. But hey, I’m having a bit of fun with this. No hard feelings if no one wants this version.

P.S. Not that jQuery isn’t bulletproof if properly done, but as you can see, the current HTML isn’t bulletproof either. It looks like it was generated with some program that uses a severely outdated standard.

Um, no. I wrote the pages by hand; however quick and dirty my code was, please don’t insult me by saying a program did it. Would you like it if I did that to you?

The two-line XML/Doctype header on top of each file was borrowed from the Haiku docs, so Tracker and Web+ could better ‘see’ it, but I realize now that wasn’t a good idea. Check the docs and you’ll see I’m being upfront about this. And I will be sure to fix this in the next revision; it could be part of the problem.

Now, the code between the pages in the pages folder are copied from each other, but that’s because they’re 22 pages (with the index) roughly displaying the same thing.

I don’t care if you scrap and rewrite it. That’s what I put it here for. You appear to be an experienced developer; please feel free to do what you want. All I’d ask is don’t tell everyone a program wrote it; that’s low.

Sorry, I didn’t mean to insult you. The code looks so well organized that it seemed like you used an HTML editor. It’s properly indented, it has comments for each section and nicely structured. If anything, that’s rather a compliment - most people write messy/careless code.

It’s just that the standard is old enough for Firefox to ignore certain elements and behave unexpectedly, which is why I started working with HTML5. And after seeing how the main structure is the same throughout the hint pages, I thought about grouping the hints in the same document and use JavaScript to switch between them. But as it takes more code to accomplish that with JavaScript, I went with jQuery to keep it short and nice.

I’m not sure exactly what JQuery stuff you are using, but I’ve found that Javascript can replace (while retaining code-shortness and ease) almost 100% of any JQuery code I’ve used/seen by using document.querySelector, document.getElementById, document.querySelectorAll, and element.classList

Okay; so I am noticing several issues with the current tour. I’m going to work on it and see if I can make the next version better… and will probably have it out to you guys in a few days. Thanks, all.

2 Likes

Here’s the HTML5+jQuery version: https://phpfusionro.hopto.org/haiku/tour/

It’s valid HTML that will work very nicely in most browsers. As for the jQuery code, it’s shorter and more convenient to manage compared to JavaScript.

I prefer this:
$("#element").text();
over this:
document.getElementById("element").innerText;

But if anyone wants to change the code to pure JS, no problem. I didn’t even include my name in the zip file’s mit-license.txt, so feel free to use it as it is or change anything you want, without asking.

Thanks for the tour, @apgreimann! It looks great and I hope it will be included in the beta release. The updated HTML+CSS will make it easier to be visually adjusted, so I hope it will be welcome.

2 Likes

Make an haikuports recipe for it and we’ll consider including it in the beta images.

1 Like