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 eelkenet
      Hi! I've created a small Inputfield module called InputfieldFloatRange which allows you to use an HTML5 <input type="range" ../> slider as an InputField. I needed something like this for a project where the client needs to be able to tweak this value more based on 'a feeling' than just entering a boring old number. Maybe more people can use this so I'm hereby releasing it into the wild. 
      EDIT: You can now install it directly from the Modules directory: http://modules.processwire.com/modules/inputfield-float-range/
       
      What is it?
      The missing range slider Inputfield for Processwire. 
      What does it do?
      This module extends InputfieldFloat and allows you to use HTML5 range sliders for number fields in your templates.
      It includes a visible and editable value field, to override/tweak the value if required.  
      Features
      Min/max values Precision (number of decimals) Optional step value (Read more) Optional manual override of the selected value (will still adhere to the rules above) Configurable rounding of manually entered values (floor, round, ceil, disable) Usage
      Clone / zip repo Install FieldtypeFloatRange, this automatically installs the Inputfield Create new field of type `Float (range)` or convert an existing `Float`, `Integer` or `Text` field. To render the field's value simply echo `$page->field` Demo
      A field with Min=0, Max=1, Step=0.2, Precision=2

      Field with settings Min=0, Max=200, Step=0.25, Precision=2

       
      Todo
      Make the display-field's size configurable (will use the Input Size field setting)  Hopefully become redundant  
      Changelog
      005 (current version)
      - Fix bug where the Inputfield would not work properly within repeaters / repeater matrices
      004
      - Make rounding of manually entered values configurable (floor, round, ceil or disable)
      - Fix small JS bug when the value-display field was not displayed
      - Update README
      003
      - Code cleanup, add some ModuleInfo data & LICENSE
      - Submit to PW Modules directory (http://modules.processwire.com/modules/inputfield-float-range/)
      002
      - Fix issue where setting the step value to an empty value created problem with validation
      - Make the display-field optional
      001
      - Initial release
       
      Thanks!
       
       
    • By Gadgetto
      Status update links (inside this thread) for SnipWire development will be always posted here:
      2019-10-18
      2019-08-08
      2019-06-15
      2019-06-02
      2019-05-25
      If you are interested, you can test the current state of development:
      https://github.com/gadgetto/SnipWire
      Please note that the software is not yet intended for use in a production system (alpha version).
      If you like, you can also submit feature requests and suggestions for improvement. I also accept pull requests.
      ---- INITIAL POST FROM 2019-05-25 ----
      I wanted to let you know that I am currently working on a new ProcessWire module that fully integrates the Snipcart Shopping Cart System into ProcessWire. (this is a customer project, so I had to postpone the development of my other module GroupMailer).
      The new module SnipWire offers full integration of the Snipcart Shopping Cart System into ProcessWire.
      Here are some highlights:
      simple setup with (optional) pre-installed templates, product fields, sample products (quasi a complete shop system to get started immediately) store dashboard with all data from the snipcart system (no change to the snipcart dashboard itself required) Integrated REST API for controlling and querying snipcart data webhooks to trigger events from Snipcart (new order, new customer, etc.) multi currency support self-defined/configurable tax rates etc. Development is already well advanced and I plan to release the module in the next 2-3 months.
      I'm not sure yet if this will be a "Pro" module or if it will be made available for free.
      I would be grateful for suggestions and hints!
      (please have a look at the screenshots to get an idea what I'm talking about)
       




    • By Robin S
      Another little admin helper module...
      Template Field Widths
      Adds a "Field widths" field to Edit Template that allows you to quickly set the widths of inputfields in the template.

      Why?
      When setting up a new template or trying out different field layouts I find it a bit slow and tedious to have to open each field individually in a modal just to set the width. This module speeds up the process.
      Installation
      Install the Template Field Widths module.
      Config options
      You can set the default presentation of the "Field widths" field to collapsed or open. Field widths entered into the Template Field Widths inputfield are only applied if the Edit Template form is submitted with the Template Field Widths inputfield in an opened state. "Collapsed" is the recommended setting if you think you might also use core inputs for setting field widths in a template context. You can choose Name or Label as the primary identifier shown for the field. The unchosen alternative will become the title attribute shown on hover. You can choose to show the original field width next to the template context field width.  
      https://github.com/Toutouwai/TemplateFieldWidths
      https://modules.processwire.com/modules/template-field-widths/
    • By adrian
      Tracy Debugger for ProcessWire
      The ultimate “swiss army knife” debugging and development tool for the ProcessWire CMF/CMS

       
      Integrates and extends Nette's Tracy debugging tool and adds 35+ custom tools designed for effective ProcessWire debugging and lightning fast development
      The most comprehensive set of instructions and examples is available at: https://adrianbj.github.io/TracyDebugger
      Modules Directory: http://modules.processwire.com/modules/tracy-debugger/
      Github: https://github.com/adrianbj/TracyDebugger
      A big thanks to @tpr for introducing me to Tracy and for the idea for this module and for significant feedback, testing, and feature suggestions.
×
×
  • Create New...