Jump to content
horst

Croppable Image 3

Recommended Posts

No this is not intended. The original image never is changed in PW, at least 99%.

The original uploaded image never is touched and should be in high quality (best 100%). Also, my opinion, it never should be outputed to the frontend. It is the source or master for all variations needed in a site.

To be short, your suggestion can't work at least, as you can specify multiple crop settings, and how should they all be able to update the original image?

But you can and should  call every defined crop variation by its name everywhere you like it. Also you can call every other variation derived from Pageimage, incl. the original image.

Does that make sense for you?

  • Like 1

Share this post


Link to post
Share on other sites

Hi Horst,

I totally understand the concept and process. What I dont under however is that after installing the module the first image I cropped the cropped image was visable in the backend under "homepage afbeelding" as being the sole image to be used in the front-end. The cropped overwrote the uploaded image. Of course the orginal image was still available (in the folder structure).  No problem, but just wanted to let you know that I had two seperate behaviour using the plugin. 

I'll try this evening to replicate the first behaviour. 

  • Like 1

Share this post


Link to post
Share on other sites

@DL7 no i think you may be confused about the standard cropping built into the core.

this module allows you to define various crops and you have to call those by name in the api output code. It does not replace or affect the original image at all.

  • Like 2

Share this post


Link to post
Share on other sites

Hi Cacrura,

 

Perhaps I did the first image indeed via the natice cropped function. My apologies for the confusing.

  • Like 1

Share this post


Link to post
Share on other sites

@horst thanks for your great module.

Today i installed your module via module panel by class name and changed my image field with croppableimage field and i setted a size (full-width,1425,434) for this field. After click this size from images field i have below errors on opened modal box, i can see image and preview image.

Notice: Undefined property: stdClass::$manualSelectionDisabled in /Users/user/Sites/site-folder/site/modules/CroppableImage3/ProcessCroppableImage3/ProcessCroppableImage3.module on line 47

Notice: Undefined property: stdClass::$useImageEngineDefaults in /Users/user/Sites/site-folder/site/modules/CroppableImage3/ProcessCroppableImage3/ProcessCroppableImage3.module on line 48

Notice: Undefined property: stdClass::$manualSelectionDisabled in /Users/user/Sites/site-folder/site/modules/CroppableImage3/ProcessCroppableImage3/ProcessCroppableImage3.module on line 120

I am using ProcessWire 3.0.36 version, I made fresh module installation.

 

Ekran Resmi 2016-10-11 16.56.39.png

Share this post


Link to post
Share on other sites

@horst also can you check this error :

I can't use croppable image 3 module with custom upload names module together. 

Share this post


Link to post
Share on other sites
On 11.10.2016 at 3:50 PM, ukyo said:

@horst thanks for your great module.

Today i installed your module via module panel by class name and changed my image field with croppableimage field and i setted a size (full-width,1425,434) for this field. After click this size from images field i have below errors on opened modal box, i can see image and preview image.

Notice: Undefined property: stdClass::$manualSelectionDisabled in /Users/user/Sites/site-folder/site/modules/CroppableImage3/ProcessCroppableImage3/ProcessCroppableImage3.module on line 47

Notice: Undefined property: stdClass::$useImageEngineDefaults in /Users/user/Sites/site-folder/site/modules/CroppableImage3/ProcessCroppableImage3/ProcessCroppableImage3.module on line 48

Notice: Undefined property: stdClass::$manualSelectionDisabled in /Users/user/Sites/site-folder/site/modules/CroppableImage3/ProcessCroppableImage3/ProcessCroppableImage3.module on line 120

I am using ProcessWire 3.0.36 version, I made fresh module installation.

 

Ekran Resmi 2016-10-11 16.56.39.png

 

On a side note: You cannot use - in your names, because - is the devider for suffixes in image variation names. Please change full-width to fullwidth or fullWidth!

But back to your issue: I wasn't able to recreate it. What exactly have you done to install it? Passing in the class name here: Admin > Modules [ NEW ] -> ModuleClassName

Which classname have you passed?

Share this post


Link to post
Share on other sites

@horst I used class name from this module page : http://modules.processwire.com/modules/croppable-image3/. Also yesterday i downloaded the module files directly from github repo.

I corrected suffix, renamed it "fullwidth" deleted old created files, result not changed (have error).

I applied these :

if(property_exists($globalOptions, 'manualSelectionDisabled'))
if(property_exists($globalOptions, 'useImageEngineDefaults'))

to error lines like @adrian advice for my other issue with this module. I don't have error for the moment, but I don't know is this a really solution ? For the moment continue to work just applied quick fixes.

  • Like 1

Share this post


Link to post
Share on other sites

Do you have opened the FieldtypeCroppableImage3 config screen once or never after install?

Share this post


Link to post
Share on other sites

Yes, after installation I opened FieldtypeCroppableImage3 config screen but didn't make any changes on this screen. Do you offer to disable quality selector ?

With this settings i don't have error when i open modal cropper.

Ekran Resmi 2016-10-15 16.37.25.png

Share this post


Link to post
Share on other sites

Maybe the setting is not relevant, but saving it one time before open the cropper modal?

I need to test this.

Share this post


Link to post
Share on other sites

I unchecked checkbox and saved module settings, tested to open crop modal there is no error. Its look like need to go FieldtypeCroppableImage3 settings and click to save button before use module.

Ekran Resmi 2016-10-15 18.13.51.png

 

  • Like 1

Share this post


Link to post
Share on other sites

Hi horst, thank you for your work on this modul. Is there a problem when I use it within a repeater? When I define an image-field like this: slider,1280,480,home_final the slider-croping-button don't appear on the page. If I define it without the template it works.

  • Like 1

Share this post


Link to post
Share on other sites

Ah, I think this is a bug, or at least it is not obvious for the user, how to define the template for a repeater.

If you define a template, it checks if the current page has this template. I believe "home_final" is the template of the page that contains the repeater? The repeater item itself is a page too, but its template isn't "home_final".

As a quick workaround: determine what is the template name of the repeater items and set this, (maybe additionally), into the fields setup.

For example, if I have a repeaterfield named topmenu, I will find its items under Admin -> Repeaters -> topemnu -> ..., and their template is repeater_topmenu

For the long term, i will see, if this can be done by the module behind the scences. But it will take some time that is currently not available for me. :)

Share this post


Link to post
Share on other sites

Hi horst, thank you very much for explaining this. I tried it but it's the same thing. My repeater-field ist named slider_repeater and the corresponding template is also named slider_repeater. Under it there are subpages which are named home like the pagename of the page which contains the slider field.

My line is

slider,1280,573,slider_repeater,home_final

Only if I write it without any of the to template-names the button will be shown on the page home. It doesn't matter if I use only one of the. Only none of them works ;-)

In this project it's not critical. But I think this could be something people are desire for.

Best Regards

Share this post


Link to post
Share on other sites

These subpages named home, etc, didn't they have a template called repeater_slider_repeater ? I'm not totally sure, but to a great extend, that the repeater items always have a template name with prefixed repeater_

  • Like 2

Share this post


Link to post
Share on other sites

Hey there,

This module is great. Just wondering, what's the best way to have the user choose which cropping to use in the frontend? The way I understand the README file, the programmed template decides which cropping to use. But what if the user wants a vertical image for an image, and a panorama for another? 

Thanks for clarifying.

PS: Currently working for architects, so I'm glad there are "serious" labels now too ;-)

Share this post


Link to post
Share on other sites

Hi lenoir,

the designer / developer decides which format is displayed at the frontend, as he embedds the API code for the output into the template files.

For example, if you define two formats (landscape and portrait), the user has the possibility to select the relevant crop section for both formats, but in a regular / simple setup, the output is defined in the template files with $image->getCrop("portrait")->url at places where a portrait image is required.

If you want to give the user the possibility to choose from different formats for one single place, you need a special setup with e.g. pagetable or the ProFields Repeater Matrix wrapped around the image field.

Share this post


Link to post
Share on other sites
4 minutes ago, horst said:

If you want to give the user the possibility to choose from different formats for one single place, you need a special setup with e.g. pagetable or the ProFields Repeater Matrix wrapped around the image field.

I was also thinking about a repeater. Pagetable would also make sense I guess. Thanks Horst!

I thought there might be a secret weapon I didn't know of :-)

Share this post


Link to post
Share on other sites
On 17.10.2016 at 6:44 PM, horst said:

These subpages named home, etc, didn't they have a template called repeater_slider_repeater ? I'm not totally sure, but to a great extend, that the repeater items always have a template name with prefixed repeater_

Hi Horst,

thank you for the hint. Yes with repeater_slider_repeater it works like a charm.

  • Like 1

Share this post


Link to post
Share on other sites

@lenoir

Maybe, as a simple way, you also can add a select field near to the croppable image field and let the user select which format he want to be displayed on that page on the frontend.

  • Like 2

Share this post


Link to post
Share on other sites

Hi, I am on ProcessWire version 3.x and just installed this module. It works fine on my superuser account but not on any other roles I have made. When I click on a crop size it brings up the site structure as pictured below instead of the image editing screen. I've also included a screencap of the permissions given to the user. Why it works perfectly fine for my superuser any of my other accounts is doing my head in. Have I overlooked something? :( 

 

croppable-screencap1.png

croppable-screencap2.png

croppable-screencap3.png

Share this post


Link to post
Share on other sites

@Matcha The module installs a permission: "croppable-image-3". Have you given that to the roles that should be able to work with it?

Share this post


Link to post
Share on other sites

Hi, I'm using PW 3.0.33 and would like to crop some images. If I publish the page I have always this error:

Error: Exception: Method Pageimage::getCrop does not exist or is not callable in this context (in ../wire/core/Wire.php line 410)

#0 [internal function]: ProcessWire\Wire->___callUnknown('getCrop', Array)
#1 ../wire/core/Wire.php(348): call_user_func_array(Array, Array)
#2 ../wire/core/WireHooks.php(548): ProcessWire\Wire->_callMethod('___callUnknown', Array)
#3 ../wire/core/Wire.php(371): ProcessWire\WireHooks->runHooks(Object(ProcessWire\Pageimage), 'callUnknown', Array)
#4../wire/core/Wire.php(372): ProcessWire\Wire->__call('callUnknown', Array)
#5 ../wire/core/Wire.php(372): ProcessWire\Pageimage->callUnknown('getCrop', Array)
#6../site/templates/home.php(63): ProcessWire\Wire->__call('getCrop', Array)
#7 

template-file:

$bild = $neuigkeit->images->first()->getCrop('news');
$content .= "<figure>
		<img src='{$bild->url}'>
		<figcaption>{$bild->description}</figcaption>
	</figure>";

printscreen.PNGprintscreen2.PNG

Does anybody know why i keep on getting this error?

Thanks for your help.

Share this post


Link to post
Share on other sites

The error says, that you finally have no pageimage object in

$neuigkeit->images->first()

So, at first you need to check / debug what is in $neuigkeit, what is in $neuigkeit->images and if there are images available in the field on the current page.

Your field setup looks good! incl. setup for cropsetting.

Calling it looks good too, but something in your chain isn't what it should be:

$neuigkeiten should be a page (with a template and with fields). Please check this in your code at exactly the point that throws the error:

echo "<pre>\n<hr />";
echo "$neuigkeiten->id \n $neuigkeiten->template->name \n";

// if the above is not id == 0 and has a valid template name, go on and check the fields in that page:
foreach($neuigkeiten->feilds as $f) {
    echo "$f->name \n";
    // if the images field is in, check if it has images available
    if('images' == $f->name) {
        echo "  count: " . count($neuigkeiten->images) . "\n";
    }
}
// if all above is ok, at list the ->first() image should be a pageimage, you can check this too
$testobj = $neuigkeit->images->first();
if(is_object($testobj)) {
    echo $testobj->className() . "\n";
}
echo "\n<hr /></pre>\n";

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Robin S
      A community member raised a question and I thought a new sanitizer method for the purpose would be useful, hence...
      Sanitizer Transliterate
      Adds a transliterate method to $sanitizer that performs character replacements as defined in the module config. The default character replacements are based on the defaults from InputfieldPageName, but with uppercase characters included too.
      Usage
      Install the Sanitizer Transliterate module.
      Customise the character replacements in the module config as needed.
      Use the sanitizer on strings like so:
      $transliterated_string = $sanitizer->transliterate($string);
       
      https://github.com/Toutouwai/SanitizerTransliterate
      https://modules.processwire.com/modules/sanitizer-transliterate/
       
    • By dimitrios
      Hello,
      this module can publish content of a Processwire page on a Facebook page, triggered by saving the Processwire page.
      To set it up, configure the module with a Facebook app ID, secret and a Page ID. Following is additional configuration on Facebook for developers:
      Minimum Required Facebook App configuration:
      on Settings -> Basics, provide the App Domains, provide the Site URL, on Settings -> Advanced, set the API version to 2.10, add Product: Facebook Login, on Facebook Login -> Settings, set Client OAuth Login: Yes, set Web OAuth Login: Yes, set Enforce HTTPS: Yes, add "http://www.example.com/processwire/page/" to field Valid OAuth Redirect URIs. This module is configurable as follows:
      Templates: posts can take place only for pages with the defined templates. On/Off switch: specify a checkbox field that will not allow the post if checked. Specify a message and/or an image for the post.
      Usage
      edit the desired PW page and save; it will post right after the initial Facebook log in and permission granting. After that, an access token is kept.
       
      Download
      PW module directory: http://modules.processwire.com/modules/auto-fb-post/ Github: https://github.com/kastrind/AutoFbPost   Note: Facebook SDK for PHP is utilized.


    • By thomasaull
      I created a little helper module to trigger a CI pipeline when your website has been changed. It's quite simple and works like this: As soon as you save a page the module sets a Boolean via a pages save after hook. Once a day via LazyCron the module checks if the Boolean is set and sends a POST Request to a configurable Webhook URL.
      Some ideas to extend this:
      make request type configurable (GET, POST) make the module trigger at a specified time (probably only possible with a server cronjob) trigger manually Anything else? If there's interest, I might put in some more functionality. Let me know what you're interested in. Until then, maybe it is useful for a couple of people 🙂
      Github Repo: https://github.com/thomasaull/CiTrigger
    • By Robin S
      I created this module a while ago and never got around to publicising it, but it has been outed in the latest PW Weekly so here goes the support thread...
      Unique Image Variations
      Ensures that all ImageSizer options and focus settings affect image variation filenames.

      Background
      When using methods that produce image variations such as Pageimage::size(), ProcessWire includes some of the ImageSizer settings (height, width, cropping location, etc) in the variation filename. This is useful so that if you change these settings in your size() call a new variation is generated and you see this variation on the front-end.
      However, ProcessWire does not include several of the other ImageSizer settings in the variation filename:
      upscaling cropping, when set to false or a blank string interlace sharpening quality hidpi quality focus (whether any saved focus area for an image should affect cropping) focus data (the top/left/zoom data for the focus area) This means that if you change any of these settings, either in $config->imageSizerOptions or in an $options array passed to a method like size(), and you already have variations at the requested size/crop, then ProcessWire will not create new variations and will continue to serve the old variations. In other words you won't see the effect of your changed ImageSizer options on the front-end until you delete the old variations.
      Features
      The Unique Image Variations module ensures that any changes to ImageSizer options and any changes to the focus area made in Page Edit are reflected in the variation filename, so new variations will always be generated and displayed on the front-end.
      Installation
      Install the Unique Image Variations module.
      In the module config, set the ImageSizer options that you want to include in image variation filenames.
      Warnings
      Installing the module (and keeping one or more of the options selected in the module config) will cause all existing image variations to be regenerated the next time they are requested. If you have an existing website with a large number of images you may not want the performance impact of that. The module is perhaps best suited to new sites where image variations have not yet been generated.
      Similarly, if you change the module config settings on an existing site then all image variations will be regenerated the next time they are requested.
      If you think you might want to change an ImageSizer option in the future (I'm thinking here primarily of options such as interlace that are typically set in $config->imageSizerOptions) and would not want that change to cause existing image variations to be regenerated then best to not include that option in the module config after you first install the module.
       
      https://github.com/Toutouwai/UniqueImageVariations
      https://modules.processwire.com/modules/unique-image-variations/
    • By Sebi
      I've created a small module which lets you define a timestamp after which a page should be accessible. In addition you can define a timestamp when the release should end and the page should not be accessable any more.
      ProcessWire-Module: http://modules.processwire.com/modules/page-access-releasetime/
      Github: https://github.com/Sebiworld/PageAccessReleasetime
      Usage
      PageAccessReleasetime can be installed like every other module in ProcessWire. Check the following guide for detailed information: How-To Install or Uninstall Modules
      After that, you will find checkboxes for activating the releasetime-fields at the settings-tab of each page. You don't need to add the fields to your templates manually.
      Check e.g. the checkbox "Activate Releasetime from?" and fill in a date in the future. The page will not be accessable for your users until the given date is reached.
      If you have $config->pagefileSecure = true, the module will protect files of unreleased pages as well.
      How it works
      This module hooks into Page::viewable to prevent users to access unreleased pages:
      public function hookPageViewable($event) { $page = $event->object; $viewable = $event->return; if($viewable){ // If the page would be viewable, additionally check Releasetime and User-Permission $viewable = $this->canUserSee($page); } $event->return = $viewable; } To prevent access to the files of unreleased pages, we hook into Page::isPublic and ProcessPageView::sendFile.
      public function hookPageIsPublic($e) { $page = $e->object; if($e->return && $this->isReleaseTimeSet($page)) { $e->return = false; } } The site/assets/files/ directory of pages, which isPublic() returns false, will get a '-' as prefix. This indicates ProcessWire (with activated $config->pagefileSecure) to check the file's permissions via PHP before delivering it to the client.
      The check wether a not-public file should be accessable happens in ProcessPageView::sendFile. We throw an 404 Exception if the current user must not see the file.
      public function hookProcessPageViewSendFile($e) { $page = $e->arguments[0]; if(!$this->canUserSee($page)) { throw new Wire404Exception('File not found'); } } Additionally we hook into ProcessPageEdit::buildForm to add the PageAccessReleasetime fields to each page and move them to the settings tab.
      Limitations
      In the current version, releasetime-protected pages will appear in wire('pages')->find() queries. If you want to display a list of pages, where pages could be releasetime-protected, you should double-check with $page->viewable() wether the page can be accessed. $page->viewable() returns false, if the page is not released yet.
      If you have an idea how unreleased pages can be filtered out of ProcessWire selector queries, feel free to write an issue, comment or make a pull request!
×
×
  • Create New...