Front-End Edit Lightbox (FEEL) for ProcessWire

[Marty Walker]

Hi, Yes it does. -Marty 

[tpr]

I can edit and re-edit an image with CI3 without any issue. How are you calling FEEL, or is anything specific in your setup?

[tpr]

As for the future of FEEL, I think I'll rewrite it in TypeScript, to remove jQuery dependency and to learn TypeScript.

[Marty Walker]

This is how I'm calling FEEL:

		echo $page->feel(array(
		    "text" => "Edit your page",
		    "class" => "fixed center",
		    "fields" => "title,artist_business_name,body_artists,artist_address_01,artist_address_02,artist_address_suburb,artist_address_state,artist_address_postcode,artist_website,artist_facebook,artist_twitter,artist_instagram,artist_behance,artist_dribbble,artist_email_public,artist_phone_studio,artist_phone_mobile,artist_categories,portfolio_images,pinterest_button"
		    )
		);

I get the initial modal appearing and I can see all the CI3 fields but when I click on a pre-defined crop I get pushed to the page tree.

[tpr]

Unfortunately I'm still was not able to reproduce. I'm using the latest CI3, FEEL and PW dev. I have tried with 2 CI3 fields on a page and with all 3 admin themes.

Perhaps you could check these:

• does it happen with less fields (eg. "title, "oneCI3field"). If no, perhaps you could check which field causes the issue, and figure out why.
• if you middle-click on the edit link, the admin opens in a new browser tab. If you edit the CI3 field now, perhaps there will be an error shown.
• check if there's an Access defined on a CI3 field
• is the page in a repeater?
• is anything in the logs? (Admin\Setup\Logs)
• is any JS error in the devtools console?

I can check the site if you give me access

[Marty Walker]

My apologies. It was an access issue for that user group - CI3 wasn't selected. Thanks for your help. - Marty

[hheyne]

Hi, I'm wondering if there is an easy way to let it run on mobile devices e.g. iPhone. If I open it, the content in the lightbox won't scroll when I drag the conten within the iframe. The content behind is scrolling. Is it a but in my setup or is this normal behaviour?

[celfred]

Hi,

I'm struggling with something :

• My 'user' template has page-edit permission for my 'teacher' role
• My 'teacher' role has page-edit, page-edit-front and profile-edit permissions

And yet if I type $user->feel() in my template page (while logged as a 'teacher' user), I get nothing ? If I add 'superuser' role to my logged-in teacher, I get the 'Edit' link. 

I thought $user were behaving like regular pages... So I've been looking thorugh all my permissions roles for hours but I can't get it to work... I'm lost... Maybe $user is not possible in this context ?

If anyone has an idea on where I could look or can explain what's going on here, I'd appreciate. 

[tpr]

@hheyne I haven't checked the lightbox on small screens, but I will when I'll have some time. Could you uncomment line 96 in FrontEndEditLightbox.css (max-height: 90%;) and check if that makes a difference?

@celfred There is a permission called "user-admin", what if you assign it for the "teacher" user?

[celfred]

@tpr Thanks for your quick reply, but with no luck.. I had tried to set the 'user-admin' permission to the 'teacher' role (and I'm trying again right now), but still no Edit link appearing. If I set 'superuser' role back, the link comes back... Another idea ?

More info : if I try to front-end edit using the built-in PW capabilities method D gives the same result : not editable even though I'm setting all permissions like superuser's permissions, but editable by double-clicking if I add the 'superuser' role to my 'teacher'. I just don't get it...

EDIT : As a follow-up, I have applied a workaround : building a linked page to my user (with a specific editable template) and behavior is now as expected... I should dig a little for the 'official' user profile page front-end edit, but I am not a 'superuser' myself ? 

Edited August 24, 2018 by celfred
Follow up

[hheyne]

16 hours ago, tpr said:

@hheyne I haven't checked the lightbox on small screens, but I will when I'll have some time. Could you uncomment line 96 in FrontEndEditLightbox.css (max-height: 90%;) and check if that makes a difference?

@tpr thank you for your reply. Unfortunately this setting make not real difference at all.

 

 

[celfred]

Hello,

Another question I have, related not only to FEEL module, but I'm facing it with it so here it is :

I load a page via ajax. In the loaded page, I would like to have a $page->feel() to have my front-end link, but the result is nothing. I thought having namespace ProcessWire; at the top of my ajax-loaded page would do the trick, but it doesn't...

Does anyone know what I should do ?

Thanks !

[matjazp]

On 8/14/2018 at 3:49 PM, celfred said:

More info : if I try to front-end edit using the built-in PW capabilities method D gives the same result : not editable even though I'm setting all permissions like superuser's permissions, but editable by double-clicking if I add the 'superuser' role to my 'teacher'. I just don't get it...

 

@celfredFEEL checks if a page is editable, but since $user->editable() return false (actually it's userEditable() method), the link is not displayed.

On 8/24/2018 at 5:53 PM, celfred said:

I load a page via ajax. In the loaded page, I would like to have a $page->feel() to have my front-end link, but the result is nothing.

Could you edit FrontEndEditLightBox.module and remove && !$this->wire('config')->ajax from line 82 and see if it work?

[celfred]

14 hours ago, matjazp said:

 

@celfredFEEL checks if a page is editable, but since $user->editable() return false (actually it's userEditable() method), the link is not displayed.

 

Thanks a lot for your explanation. I understand things better now ? 

Quote

Could you edit FrontEndEditLightBox.module and remove && !$this->wire('config')->ajax from line 82 and see if it work?

I've just tested and made sure my cache was up to date, but no change... What's surprising is that with the initial config, I tested somewhere else on my site and it worked. Of course, I double-checked all permissions for the template I'm trying to have the 'Edit' button for... and I'm testing only as a superuser. So that's still a bit myserious to me. But since the problem doesn't occur somewhere else, I guess I AM the culprit who messes things up. That's not a big deal either. I'll do more testing and come back here if I find an explanation.

Thanks for your help ! 

[MarkE]

This module seems really useful for the club membership system I am building - it allows members to easily edit their own records without access to the rest of the back-end. However, I also need to use page-add mode and I can't get this to work fully. It seems like there is a "parent" but no "template" setting for page-add so, if a parent has a family of more than one template allowed, there is no API to select the right template. I think I can see how to hack FrontEndEditLightbox.module to fix this, but I wonder if I am missing something, or whether it would be better for @tpr to update the module?

Thanks.

[tpr]

Please share your possible fix, I don't remember there's anything like this built-in.

[MarkE]

The following seems to work:

In $defaults (below line 46) add

'template'                 => '',

Below line 265 (now 266) add

            $template = !empty($settings['template']) ? $this->templates->get($settings['template']) : null;
            $template_id = $template ? '&template_id=' . $template->id : '';

Amend line 267 (now 270) to

$editUrl = $this->wire('config')->urls->admin . 'page/add/?parent_id=' . $parent . $lang . $fields . $template_id;

 

[MarkE]

Hi @tpr, are you happy with the code above?

Also, I have a couple of issues which may or may not be bugs:

1. Sometimes the "lightbox" opens as a page not a modal - this only happens the first time after the page containing the feel() is loaded.
2. Scrolling doesn't work on a ipad - the background scrolls rather than the modal.

Otherwise it all seems to work nicely.

EDIT - I suspect (1) may be because the js has not loaded

[tpr]

Sure, your code us probably fine, I just need some time to try.

[MarkE]

Re the scrolling issue, there is a wider problem in that installing FEEL disables scrolling in the iPad after switching from back-end to front-end (regardless of whether a modal has been opened). Unfortunately, this means that I have had to uninstall FEEL and use a simpler home-built module.

[tpr]

Sad to hear that. Unfortunately I have no iPad to check, but I guess it's only a small CSS issue. Perhaps you could track it down by disabling parts of FEEL CSS.

[MarkE]

24 minutes ago, tpr said:

I guess it's only a small CSS issue

Almostly certainly. I have to press on with the rest of the site now, but will try and come back to this when I have time as I prefer the lightbox interface.

(However, I don't have an Apple Mac to use the iPad developer tools, so maybe if someone here does, they would have a better chance of tracking down the problem)

[tpr]

If you have a few minutes to create a screen capture I can check whether it appears here too (on Windows).

[zoeck]

@tpr I have a question about the options of "Selectors to hide".

Currently it is only possible to set the option in general via the admin panel, but is it also possible to set it depending on the link?

Like this:

<?php
$mycalc->feel(array("text" => "edit", "selectorsToHideSuperUser" => "#_ProcessPageEditDelete, #ProcessPageEditDelete"));

 

[tpr]

I'm not sure if it is but possibly yes. Try passing it inside the "overrides" array:

https://github.com/rolandtoth/FrontEndEditLightbox#individual-overrides-overrides

$mycalc->feel(array(
        "text" => "edit",
        "overrides" => array(
            "selectorsToHideSuperUser" => "#_ProcessPageEditDelete, #ProcessPageEditDelete"
        )
    )
);