Logo Cyca

A Week of Dev #14

Another good week of work on Cyca has passed, and there is plenty to talk about it !

As next week its Christmas, I decided to release a new version and this episode of A Week of Dev today.

Version 1.1.0 released

Although I initially wanted to focus on import/export and a search engine, I realized that some work was needed before digging into it. Well, actually, I could have done that without a huge code review, but I wanted to clean things up before adding new content.

Code review

So I did a large code review, and a lot have been changed, which justifies moving to the v1.1 branch instead of a lesser version.

  • First Cleaner class tests

I introduced first feature tests related to the new Cleaner class, which is in charge of… cleaning and purify text such as feed items content. While only basic tests are perfomed by now, it will be improved later.

It became needed because I introduced HTMLPurifier (which we’ll discuss a bit later).

  • Fixed initial importation error
  • Fixed missing imports

After a first pass of my code review, I didn’t notice the initial importation could go wrong, either by failing immediately or by not importing data at all. This is fixed now.

  • Single responsibility methods
  • Extend base analyzer class
  • Removed obsolete code

Some of my oldest code was poorly written. I wanted it to work ASAP. Consequently, I didn’t respect a good coding practice: the Single Responsibility Principle. Some classes or methods were stupidly big. I fixed that for most part, but more can be done to make things even better.

It also gave me the opportunity to remove some legacy and unused code.

Finally:

  • Updated link to microblog
  • Sort language strings

Changes

HTMLPurifier

  • Using HTMLPurifier on feed items
  • Removed HtmlPurifier
  • Fixed incorrectly parsing feed items

I wanted to implement the excellent HTMLPurifier library to sanitize feed items content before they are displayed. Unfortunately, it removed lots of actually useful content like blocks of text or images. I guess default configuration is a bit too aggressive. I decided to remove it for now and until I can focus on going through HTMLPurifier’s extensive options.

Documents and feeds updater

  • Fixed preventing removing dupplicate bookmarks

This has been in my TODO list for a long time. Say you are in a folder where you have a bookmark to a website that doesn’t declare its feeds. In the same folder, you directly add a feed you know it belongs to that document. Cyca will create the feed as a document, fetch its content, find it’s really a feed, find the feed’s home page which happens to be a previously stored document. Now you get the same document bookmarked twice in the same folder. At least, the feed is now properly linked to the document !

Well, I fixed that. Now, there can only be one bookmark to a specific document in a given folder !

  • Use laravel native job locking mechanism

I have been using a custom cache-based locking mechanism to ensure that a document currently being update isn’t added to the update queue again. It worked well, but if Laravel natively provides such feature, I think I would be better off using it.

  • Adjusted HTTP timeout to 30s instead of 10s
  • Updated orphan document detection
  • Fixed a bug preventing documents from being updated
  • Fixed a bug preventing feed update
  • Invalid feed URL doesn’t throw exception anymore
  • Fixed exception when trying to format empty feed data

I then found the orphan documents and feeds detection could potentially lead to unwanted behavior. Finally, in some cases, documents and feeds couldn’t be updated because of the way I was looking for which ones needed update.

I extended the HTTP client timeout from 10s to 30s instead, which prevented some feeds to be updated, probably because of server’s rate limiting.

  • Store additionnal feed item data on disk
  • Store additionnal document data on disk
  • Store HTTP debugging on disk
  • Store HTTP request debug only when APP_DEBUG enabled
  • Fixed favicon not saved
  • Restrict feed item data stored locally

More data is stored locally (on disk) now, mainly the whole HTTP response (except body, which is stored in database) if the APP_DEBUG flag is set, which helped debugging some tricky websites (but not all, unfortunately).

PDF support

  • Data extraction from PDF

Cyca now supports meta-data extraction from PDF documents !

If you add a URL pointing to a PDF document, Cyca will now extract its title and some other informations.

It’s a simple, new feature, but working on this specifically allowed me to pave the way for handling more document types quickly and easily. Cyca will soon be able to extract meta data from images and other types as well.

UI

I’ve improved UI in some ways. Let’s see it in details.

Icons set

  • Added icons for MIME types
  • Display document’s MIME type
  • Display a default icon for unknown documents
  • Display MIME type icon if favicon cannot be found
  • New icon Theme: Flat Remix

I wanted some good quality icons for documents that don’t have a favicon, either because they don’t declare one, or is missing, or because they are not HTML documents.

To do that, I needed a consistent icon set, colorful, and with an extensive support of MIME types icons. So I went with the beloved Flat Remix set, which embeds quite well with Cyca, I think.

More information displayed…

  • Display HTTP status code and reason phrase
  • HTTP response details in dedicated panel

You can see how it integrates in UI from the screenshot of a PDF document above. More data is expected to be grabbed and fetched in a near future.

…in a more compact way

  • Adjusting responsiveness
  • Hide some buttons text on narrow screens
  • Feed items list more readable on narrow screens
  • Reduced space occupied by date/time in feed items list
  • Compact groups list and account links in folders tree
  • Added feed’s title to its icon

While Cyca is meant to be a desktop-centric application, meaning thought for the desktop from the ground up, I like to use my tablet as well from time to time. And few things actually needed to be improved to enhance mobile navigation, at least on a tablet. I think I have now found a good balance between elements size and usability, both on desktop and mobile devices.

Although, devices with a screen smaller than a tablet probably can’t use Cyca comfortably yet.

Among other things, and as an example of what changes from desktop to tablet, Cyca now hides the name of parent’s feed in the feed items list, only keeping the icon (feed’s title is available as icon’s title).

Other UI changes

  • Removed custom font

I decided to remove the custom font I’ve been using since then, QuickSand by. It is a beautifully designed font, and I loved how it made Cyca looks.

However, Cyca being a web application, I think it should stick to “safe” font families, fonts that are available on most operating systems, even if the font is stored on the web server. Besides, there is one less resource to download each time you use Cyca, meaning less overhead on the server, the network and the client. Maybe it’s a wrong statement, but hey, I can change my mind 😊

  • Render some <details> elements stateful

Oh, that one is interesting, at least to me, because it is the second time (after v0.9, The UI Update) I make use of the LocalStorage API. In the details panel, where you can see extra information about currently selected folder, document or feed item, you can expand or collapse some elements to display more or less information. This is done by using the HTML <details> component, which is one of the most interesting and powerful ones.

I wanted to go further with it by making its state (expanded or collapsed) more or less permanent: not in session, otherwise you would loose its state when you log out from Cyca ; not in cache, because I don’t think it would be good practice ; not in database, because storing it permanently attached to user account could lead to unwanted behavior (what if you want a particular section expanded on your computer but collasped on your tablet for readability ?).

LocalStorage seemed to be the perfect solution. And now it’s done, I consider using it for other purposes (like folders state, items selection, etc.).

  • Styling svg inside badges and buttons
  • Added missing styles for hovered folders

Last words

That’s it for today !

I’m not sure what I will work on next week because there is so much to do, so wait and see…

Thanks for reading !

Oh, and, don’t forget: Cyca still needs your help ! If you like Cyca, you can do a few things in order to help me continue working on it:

  • spread the word: talk about it, tell me you like it (or not !), provide links to this website and the GitHub repository
  • translate Cyca: it is currently only available in French (my native language) and English
  • make a donation