tpr

Front-End Edit Lightbox (FEEL) for ProcessWire

Recommended Posts

Sorry for the trouble. At first I don't know what could be the issue. My first thought was that you have PW 2.7 but I just tried it on a 2.6.1 and it worked, though I had to manually copy "JqueryMagnific.min.js" into "/wire/modules/Jquery/JqueryMagnific/" directory, it seems that older versions doesn't have the minified version. I guess this wasn't the issue there as the module adds an error to the console that JqueryMagnific.min.js is unavailable.

On second look I noticed that you have "FrontEndEditLightbox-master" as the directory name. When I use this name I also got an error, unfortunately there's nothing in the logs. Could you try removing the "-master" part?

What PHP version do you have?

Edit: please don't forget to refresh modules by visiting Modules->Refresh.

Share this post


Link to post
Share on other sites

I think I've fixed the issue, try v1.3.0. The error was present only if there were no parameters passed to feel(). Unfortunately on a site where I tried to reproduce I have already fixed this months before but haven't committed. The new version also uses the non-minified MagnificPopup that is available in earlier PW installs too (<2.7 I think).

Share this post


Link to post
Share on other sites

v131 is uploaded with a fix for a bug prevented the default edit link text to be saved (spotted by @matjazp).

Share this post


Link to post
Share on other sites

v1.3.2 is uploaded with a tiny but useful addition: middle-click on the edit link opens the admin in a new window. This can be handy if you want to see the "big picture" or eg. when you have AdminOnSteroids' fixed CKE toolbar ON and the CKE field is too high.

We have also made the initial steps towards an "Add new" button so it will appear in a future release.

  • Like 3

Share this post


Link to post
Share on other sites

v134 is up with a new "fields" feature: now you can specify individual fields (comma separated) to load in the lightbox instead of the full admin. Thanks for @matjazp for this request and for the help. He has also found a few bugs that were fixed.

Example: load title and body fields only:

echo $page->feel(array(
    "text" => "Edit title and body fields",
    "fields" => "title,body"
    )
);

 

  • Like 2

Share this post


Link to post
Share on other sites

If anyone still having an issue with edit link is not showing up, the reason is because module is loading "FrontEndEditLightbox.js" from "modules/FrontEndEditLightbox" folder, by default folder name is "FrontEndEditLightbox-master", so just rename module folder (remove "-master" part) and it works like a charm.

Thanks for the module tpr

 

Firefox Developer Edition 2016-12-14 18.12.20.jpg

Share this post


Link to post
Share on other sites

@lokomotivan - you should never install modules with the "-master" on the folder name. The easiest way to install is to use the ClassName option, or URL, or zip links. This is way easier than manually extracting and copying to the modules folder and it takes care of this for you.

  • Like 3

Share this post


Link to post
Share on other sites
1 minute ago, adrian said:

@lokomotivan - you should never install modules with the "-master" on the folder name. The easiest way to install is to use the ClassName option, or URL, or zip links. This is way easier than manually extracting and copying to the modules folder and it takes care of this for you.

 

Thanks, i guess i got use to just manually unzip it to modules folder :). There's probably ppl like me there so thought that info could be useful

  • Like 1

Share this post


Link to post
Share on other sites

Hi everyone,
I'm using FEEL in a project of mine and I love its features! (Just like I love Processwire).

But I'm having a problem with the "fields" feature. I'm using exactly the code written in the example in the module page on processwire.com, but it doesn't work and load every fields of the page.

this is the code I'm using ($post is the page i want to edit):

<?php
echo "{$post->notes}<br />";
if($user->isLoggedin() && $user->hasRole('editor')) {
echo $post->feel(array("text" => "Modifica note", "fields" => "notes,body"));
}
?>

'notes' is a simple textarea custom field.

Do you have an idea of what's wrong?

Share this post


Link to post
Share on other sites

At first sight everythings is OK with your code. Could you share the URL of the lightbox iframe? (only the url parameters are important)

Share this post


Link to post
Share on other sites

@CarloC Your code runs fine here. Are you sure you have the latest version of FEEL? This feature is only available since version 1.3.4.

Share this post


Link to post
Share on other sites

Thank you @tpr for your answer.
yes i've the latest module version installed, the 1.3.5

At the moment I'm not using the feature, but perhaps I'll do that soon to retest.

Now I'm upgrading my project to pw 3 form 2.7 and having some issues with repeater fields in general and FEEL that now doesn't respect the visibility options that i choose for each field.

Share this post


Link to post
Share on other sites

@tpr Here is the iframe src url: src="/XXX/pw/page/edit/?id=1309&modal=1"

and this is the code:

if($user->isLoggedin() && $user->hasRole('editor')) {
    echo $post->feel(array("text" => "Modifica note", "fields" => "notes,body"));
}

Do you see something wrong?

This is appening in PW 2.7.

Share this post


Link to post
Share on other sites

The iframe src should contain the fields too, not sure why not. But I guess the main problem is PW 2.7, perhaps loading fields only is not supported there.

Share this post


Link to post
Share on other sites

@tpr I know why this is not working.

 

Some time ago I commented the following lines of code in the "FrontEndEditLightbox.module" file:
 

if (!empty($settings['fields'])) {

            $fieldsArray = explode(',', $settings['fields']);

            
            foreach ($fieldsArray as $key => $fieldName) {
                if (!$page->hasField($fieldName)) {
                    unset($fieldsArray[$key]);
                }
            }

            foreach ($fieldsArray as $key => $fieldName) {
                
                $flds = $page->getFields;
                foreach ($flds as $key => $fld) {
                    if ($fld != $fieldName) {
                        unset($fieldsArray[$key]);
                    }
                }
            }
            if (!empty($fieldsArray)) {
                $fields = '&fields=' . implode(',', $fieldsArray);
            }
        }

This is the part of the code that deals with the fields feature, but I remembered why I hidden those lines.

If I leave those lines uncommented I get the following error:

Error: Exception: Method Page::hasField does not exist or is not callable in this context (in /home/albicocc/public_html/socialhub/wire/core/Wire.php line 358)

#0 [internal function]: Wire->___callUnknown('hasField', Array)
#1 /home/albicocc/public_html/socialhub/wire/core/Wire.php(398): call_user_func_array(Array, Array)
#2 /home/albicocc/public_html/socialhub/wire/core/Wire.php(333): Wire->runHooks('callUnknown', Array)
#3 /home/albicocc/public_html/socialhub/wire/core/Wire.php(337): Wire->__call('callUnknown', Array)
#4 /home/albicocc/public_html/socialhub/wire/core/Wire.php(337): Page->callUnknown('hasField', Array)
#5 /home/albicocc/public_html/socialhub/site/modules/FrontEndEditLightbox/FrontEndEditLightbox.module(353): Wire->__call('hasField', Array)
#6 /home/albicocc/public_html/socialhub/site/modules/FrontEndEditLightbox/FrontEndEditLightbox.module(353): Page->hasField('notes')
#7 /home/albicocc/public_html/socialhub/wire/core/Wire.php(459): FrontEndEditLightbox->addMethod(Object(HookEvent))
#8 /home/albic

This error message was shown because you are logged in as a Superuser. Error has been logged.

Share this post


Link to post
Share on other sites

Perhaps it's $page->template->hasField()? Could you try?

Share this post


Link to post
Share on other sites

Great! thank you @tpr, now it works!

I hope my case will be useful to you and other developers :)

Have a good day :D

 

  • Like 1

Share this post


Link to post
Share on other sites

Thanks, I'll update the module soon.

  • Like 1

Share this post


Link to post
Share on other sites

Version 1.3.7 is uploaded. Big thanks to @matjazp, this update is largely based on his excellent work.

Changelog

  • skip unnecessary redirect on modal save (by matjazp)
  • new "page-add" action to add child (requested/contributed by matjazp)
  • use monospace font in module settings field styleOverrides (by matjazp)
  • new setting: disable loading FEEL CSS (requested by matjazp)
  • remove system templates from module settings
  • JavaScript callback updates and documentation
  • several minor tweaks
  • Like 4

Share this post


Link to post
Share on other sites
On 5/26/2018 at 4:21 PM, tpr said:
  • new setting: disable loading FEEL CSS (requested by matjazp)
  •  

The latest changes to the CSS broke my edit buttons ([data-feel]). Now I know, I could just override them, (what I technically do) but since these are of a higher css-specify I would need to  make the css selectors stronger. Your CSS even includes an !important 😉

Would it be possible to disable button styling but keep the Lightbox styles separate? Or, even better, in my view, the edit button should even come without any styles from the module, only the lightbox should. Because the edit buttons reside in a design, the lightbox gets added, is kind of like the backend. The edit button as a link is enough – if someone want's to style it, okay, but lets leave this to the author. IMHO this is the process-wire way. Style whats necessary but leave everything frontend related to the author.

What do you think?

Great module BTW, I like it alot!

  • Like 1

Share this post


Link to post
Share on other sites

If you disable loading FEEL css, then you have unstyled <a> just like you want it, no need to override anything. That's why I requested this option, so I have full control of button styles. And as a bonus, you also have control of lightbox appearance ...

  • Like 1

Share this post


Link to post
Share on other sites

Hi, @tpr As you may already know, we have Restore tab in page edit, so selectors to hide should be updated with '#_ProcessPageEditRestore, #ProcessPageEditRestore, ' (in .module and with #ProcessPageEditRestore in .js). Also, where in the source are #_WireTabDelete and #WireTabDelete? (I wrote you a PM but I guess you didn't get a notice...)

  • Like 1

Share this post


Link to post
Share on other sites

Does it also happen if you set closeOnSave to false?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.