Shutter stack questions

RapidBase · June 30, 2021, 2:21pm

Hi Adam, congrats on these 3 new stacks and the new site design. Looking awesome!
Now to the questions regarding the Shutter stack:

Batch Mode: It would be so great if we could set the source folder for the images completely by ourselves. This includes ommitting the folder named “batch”. Why I’m asking? Now, for years now I’m used to utilizing Joes Total CMS to let my clients upload their images for their galleries. The caveat: everything has to take place in the folder named “cms-data”, which is in the root of the site. If I would be free to exactly choose the path for the batch images I could place this folder inside the cms-data folder. Any chance you’re adding this option?
Normal image mode: What about an option to not only use single images via drag and drop but also remote images (warehousing)? Hey, I know you can do it, since you already added this feature to Orbit 2 (“Remote Image Slide”), right…?

Thanks in advance for your answers and keep up your awesome work!

Best, Matthias

elixirgraphics · June 30, 2021, 2:55pm

Hey there @RapidBase –

Thanks for your compliments on the new stacks!

If you’re going through the effort to add individual URLs for each slide it is probably best to simply use batch mode. This is why I skipped that option. If Remote Images were used for individual slides you’d have to supply both a normal and thumbnail sized image URL. This means creating both images, uploading both to their separate locations and entering both into the slide settings – for each image slide. Makes more sense just to do a batch folder, IMO.

This isn’t likely something that I would change. The way it is setup currently is purposeful. It provides the user a known, reliable place to go to and find their images and cuts down on confusion and added complexity.

Sorry, I know this isn’t what you wanted to hear. There’s some limitations to how things need to work to ensure a good user experience as well as limit the number of ways a user can get themselves into trouble.

RapidBase · June 30, 2021, 3:31pm

Thanks for the quick reply, Adam. No problem with not hearing what I wanted to. There are workarounds for me: For example the superb “Repository” stack from inStacks. I’m quite sure I can point its directory to the “batch” folder of the Shutter stack, so that the client can then upload and manage his images this way. Just like Total CMS also the Repository stack has an option to automatically downscale uploaded images (which I think is very important). This way my clients can throw in images of some megabytes size which are then re-calculated for web-usage.

rinaufr · July 4, 2021, 9:13pm

Hi Adam, I fully share @RapidBase opinion on your SHUTTER stack. Simply great. Just one think: would you consider including webp image format? (it saves significant amount of space)

…and I love foundry and alloy: moved the full site using this framework and the user response is more than positive. Congratulations !!! (the site https://www.aiace-italia.eu/)

wirrah · July 4, 2021, 10:49pm

I tried to load this site. It took over a minute for the home page. I tracked it down to at least one large png file (700k) and there are others. Check banner_image-167-34B.png. Using PS export to web and 50% quality I got it down to 47k and it’s indistinguishable from the original.

Apologies I have a very slow connection (ADSL maybe 2mbs on a good day) and wanted to have a look at the site.

rinaufr · July 4, 2021, 10:55pm

Thanks wirrah, I appreciate your comments and will reduce the size (at high speed connection this was going unnoticed…)

elixirgraphics · July 5, 2021, 12:59am

Shutter would not be able to auto create thumbnails for this format unfortunately. You’d need to do it all manually.

Additionally, from my perspective there are still browsers out there that are not that old that do not support WebP.

Panans · July 5, 2021, 7:41am

This is the info I found.
Webp is supported by: Google Chrome (desktop) 23+; Google Chrome for Android version 25+; Microsoft Edge 18+; Firefox 65+; Opera 12.10+; Native web browser , Android 4.2+ (JB-MR1); Pale Moon 26+.

It will not work on Safari and IOS (because browsers for iOS work on Safari’s WebKit engine). I’m not sure about Chrome for IOS, but Firefox doesn’t work).

Consider this before using Webp.

Hans

rinaufr · July 5, 2021, 9:12pm

…spent some time to improve performances. Hope now it should be better and much faster. Really appreciated your input…thanks

wirrah · July 5, 2021, 10:56pm

Much better! Down from 70 secs to 10 for the home page! My current speed is only 1.4mbps.

TemplateRepo · July 6, 2021, 1:58pm

I’m not sure that’ll work @RapidBase. It looks like, from the video, that Shutter creates the /batch/ folder either at the root of the site, or the root of the page containing Shutter.

Repository lives in its own page not the root of the site, so for instance /repository/. It can only “see” folders and files inside it’s own folder. It can not view the root folder, or any other folder below it’s own level.

For instance. Let’s say the folder structure is…

/home/
/home/shutter-page/
/home/repository/

Based on the video the /batch/ gets auto created at either /home/batch/ or /home/shutter-page/batch/

Repository will only be able to “see” files and folders in /home/repository/. Therefore, if I’m thinking all this through correctly, it will not be able to interact with the /batch/ folder, no matter where it is.

I think the new version of Repository can see outside of it’s own folder, I think; not 100%, but regardless, if you were to set it up for a client to be able to use Repository to get access to /home/batch/ they are also going to be able to see all other folders and files on the same level, which is a really bad idea I’d say!

Maybe Repository can be locked down to one particular folder, in which case it’s got potential, but otherwise, I don’t think it’s going to have legs. Which is a real shame, as as soon as I saw Shutter I started to think along exactly the same lines as you: It’d make the perfect frontend gallery for a client managed portfolio, but without being able to set the entire path, I’m not sure how it’d work.

Shutter does look nice, the killer feature is the way it makes its own thumbnails, so we need to get our thinking caps on and come up with a solution.

Of course, One option (for Alloy users) is for Shutter and the /batch/ folder to somehow get integrated into the Alloy Editor.

EDIT: Thinking… If Shutter creates /batch/ at the root of the site, in theory you could call the the repository page “batch” then add in the additional folder path to Shutter. I think that would work. `maybe give it a try?

Although, this would add lots of other files and folders inside /batch/ which might upset Shutter?

EDIT EDIT: Another option, and potentially a really simple one, is to add a rewrite redirect to the htaccess file, sending all calls to /home/batch/ to /home/repository/batch/.

I know htaccess rules can handle all incoming traffic and redirect as required, not sure though if it can also handle all requests for particular URL’s from the page itself, ie. Shutter itself being redirected to the /repository/ folder.

A few options there, maybe try and let us know?

TemplateRepo · July 6, 2021, 5:56pm

Curiosity got the better of me so I bought the stack and have been playing around with the htaccess idea, gonna say it don’t work.

I can break Shutter by using a redirect, in that it won’t load anything, which itself shows htaccess redirects can effect URL’s requested on the page, but I couldn’t get a test folder with some images in, and corresponding thumbnails, to display.

It’s possible I just got the redirect wrong, but I tried lots of versions and nothing worked. So, don’t think htaccess is the way to go.

Need to make doggie biscuits now, then will try calling the repository folder batch, see how that works out.

TemplateRepo · July 6, 2021, 6:43pm

Bingo!

Call the repo folder ‘batch’ in RW and it all works lovely. You can go to /batch/ and you get the repo page, drag images into the shutter folder and Shutter will create the thumbnail and stick it into the thumbnail folder, you can also create additional folders in /batch/ using repository and it doesn’t seem to bother Shutter. So it’s a very workable workaround. Until maybe we can talk Adam into having a full user set path option

The caveat I guess is that repository, and of course the batch folder, needs to be at root, but I’d suggest it normally always is anyway.

RapidBase · July 6, 2021, 8:22pm

Hey Steve, thanks for your extensive research and testing. It seems you have found a solution…

So this way I can actually populate multiple galleries on different pages with content using a single instance of the repository stack (and the thumbnails are generated automatically)? That would be perfect and for me - at least in some cases - an alternative to a full-blown TCMS installation (although TCMS will surely remain my go-to CMS solution in the foreseeable future).

TemplateRepo · July 6, 2021, 8:26pm

Ya, that’ll work, I think. Just give each instance of Shutter a different folder name, ie. /Batch/gallery1/. /Batch/gallery1/ etc.

If my understanding of how Shutter works is correct, it’ll do the rest for you.

RapidBase · July 6, 2021, 8:37pm

Great, thanks Steve.

elixirgraphics · July 6, 2021, 8:48pm

I’ve done my best to try and make it of Shutter won’t freak out if you put other stuff besides images in the batch image folders. That being said, I would be careful.

TemplateRepo · July 7, 2021, 5:20pm

@RapidBase

I’ve been playing around with some opensource file managers today, and I’ve found one that is a single PHP file upload, so it can be added to RW using a HTML Code Page type, or if you want to can FTP it into the batch folder manually.

It supports hashed passwords (I think that’s the term!) and is really easy to configure.

As mentioned, you can if you wish add it (manually or via RW) to the batch folder; in which case give the folder name of “batch”. Or you can upload it to it’s own unique folder (filemanager, etc.) then in the settings give it the path to the batch folder. Once that’s done, the only folder the user can add and delete content from is the batch folder. Personally I’d prefer the “adding straight to the batch folder” (it’s just a single index.php file) option, but horses for courses.

You can restrict file sizes, file types and ever setup multiple users.

Looking at Github it seems well maintained having had security updates applied last month. But obviously, it comes with some huge caveats: 1. It’s opensource. 2. I really don’t know what I’m doing here. And 3. It might be a horrible insecure mess.

So far though, for me in testing it’s working really well. It’s no Repository, but it’s a free workaround.

I’m going to do some more testing on it, then, if I’m happy with it, I’m going to add a Shutter page to my next Foundry template and also include this as a HTML Code Page, that users just need to edit a bit, then boom, it’s all good.

I’ll keep you posted.

EDIT: Here’s the demo site I’m working on. Obviously you can’t get into the filemanager, but you get the idea.

https://ci-clientservices.com/clientdev/shutter/

Once logged in this is what the file manager interface looks like.

Shutter is the folder for the images and the thumbnail folder. G3 is for something else I’m working on at the same time, not related.

RapidBase · July 7, 2021, 9:52pm

That looks great, Steve. Thanks for all your research! And yes, adding this shutter solution to your next Foundry template would indeed be a great idea…

HeikoK · July 9, 2021, 8:55am

TFM is lovely. I use it with some older plesk installations, where the build in filemanager is a nightmare (and plesk can’t be updated)