Jump to content

PW 3.0.87 – Core updates

ryan

By ryan,
in News & Announcements

 Share

Recommended Posts

ryan Hero Member

ryan

Posted
Posted

For our final dev branch version of 2017, we've added a couple new features that I think you'll find useful. For starters, we've added drag-and-drop (and paste) image upload support to our richtext editor (CKEditor), which is really handy. We've got all the details and a short screencast here as well.

https://processwire.com/blog/posts/pw-3.0.87/

  • Like 11
  • Thanks 3
Link to comment
Share on other sites
dragan Hero Member

dragan

Posted
Posted

That's a nice one to end the year :-)

Unfortunately, the new CKEditor image feature doesn't quite work as expected. (Win 8, latest Chrome).

I can copy + paste, and drag and drop. But when I right-click on the image and select "image settings", I see this in the modal: 

ProcessWire: ProcessPageEditImageSelect: No page specified
DEBUG MODUS ABLAUFVERFOLGUNG ($config->debug == true):
#0 /home/mysite/public_html/dev.mysite.ch/wire/core/Modules.php(607): ProcessWire\ProcessPageEditImageSelect->init()
#1 /home/mysite/public_html/dev.mysite.ch/wire/core/Modules.php(1288): ProcessWire\Modules->initModule(Object(ProcessWire\ProcessPageEditImageSelect), Array)
#2 /home/mysite/public_html/dev.mysite.ch/wire/core/ProcessController.php(168): ProcessWire\Modules->getModule('ProcessPageEdit...', Array)
#3 /home/mysite/public_html/dev.mysite.ch/wire/core/ProcessController.php(259): ProcessWire\ProcessController->getProcess()
#4 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(380): ProcessWire\ProcessController->___execute()
#5 /home/mysite/public_html/dev.mysite.ch/wire/core/WireHooks.php(714): ProcessWire\Wire->_callMethod('___execute', Array)
#6 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(442): ProcessWire\WireHooks->runHooks(Object(ProcessWire\ProcessController), 'execute', Array)
#7 /home/mysite/public_html/dev.mysite.ch/wire/core/admin.php(113): ProcessWire\Wire->__call('execute', Array)
#8 /home/mysite/public_html/dev.mysite.ch/wire/core/admin.php(113): ProcessWire\ProcessController->execute()
#9 /home/mysite/public_html/dev.mysite.ch/wire/modules/AdminTheme/AdminThemeUikit/controller.php(15): require('/home/mysite/...')
#10 /home/mysite/public_html/dev.mysite.ch/site/templates/admin.php(15): require('/home/mysite/...')
#11 /home/mysite/public_html/dev.mysite.ch/wire/core/TemplateFile.php(287): require('/home/mysite/...')
#12 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(380): ProcessWire\TemplateFile->___render()
#13 /home/mysite/public_html/dev.mysite.ch/wire/core/WireHooks.php(714): ProcessWire\Wire->_callMethod('___render', Array)
#14 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(442): ProcessWire\WireHooks->runHooks(Object(ProcessWire\TemplateFile), 'render', Array)
#15 /home/mysite/public_html/dev.mysite.ch/wire/modules/PageRender.module(514): ProcessWire\Wire->__call('render', Array)
#16 /home/mysite/public_html/dev.mysite.ch/wire/modules/PageRender.module(514): ProcessWire\TemplateFile->render()
#17 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(383): ProcessWire\PageRender->___renderPage(Object(ProcessWire\HookEvent))
#18 /home/mysite/public_html/dev.mysite.ch/wire/core/WireHooks.php(714): ProcessWire\Wire->_callMethod('___renderPage', Array)
#19 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(442): ProcessWire\WireHooks->runHooks(Object(ProcessWire\PageRender), 'renderPage', Array)
#20 /home/mysite/public_html/dev.mysite.ch/wire/core/WireHooks.php(808): ProcessWire\Wire->__call('renderPage', Array)
#21 /home/mysite/public_html/dev.mysite.ch/wire/core/WireHooks.php(808): ProcessWire\PageRender->renderPage(Object(ProcessWire\HookEvent))
#22 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(442): ProcessWire\WireHooks->runHooks(Object(ProcessWire\Page), 'render', Array)
#23 /home/mysite/public_html/dev.mysite.ch/wire/modules/Process/ProcessPageView.module(205): ProcessWire\Wire->__call('render', Array)
#24 /home/mysite/public_html/dev.mysite.ch/wire/modules/Process/ProcessPageView.module(205): ProcessWire\Page->render()
#25 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(383): ProcessWire\ProcessPageView->___execute(true)
#26 /home/mysite/public_html/dev.mysite.ch/wire/core/WireHooks.php(714): ProcessWire\Wire->_callMethod('___execute', Array)
#27 /home/mysite/public_html/dev.mysite.ch/wire/core/Wire.php(442): ProcessWire\WireHooks->runHooks(Object(ProcessWire\ProcessPageView), 'execute', Array)
#28 /home/mysite/public_html/dev.mysite.ch/index.php(55): ProcessWire\Wire->__call('execute', Array)
#29 /home/mysite/public_html/dev.mysite.ch/index.php(55): ProcessWire\ProcessPageView->execute(true)
#30 {main}

Der Prozess hat keinen Inhalt ausgegeben. (the process didn't return any content)

Once I save the page and do the same thing again, those errors are gone.

Do I have to adjust my settings somewhere?

  • Like 1
  • Sad 1
Link to comment
Share on other sites
dragan Hero Member

dragan

Posted
Posted

With Firefox, I can drag and drop, but copy+paste does nothing.

If I drag and drop, and right click on "image properties", I get the same errors I posted above...

Once I save the page, the image stays in the WYSIWYG editor, but it hasn't been added to the images-field. And right-clicking again only shows the same errors... checking the HTML source code, I see the image src is still the remote (source) URL.

I don't know if this is related, but my JS console is showing the following error: 

17:27:24.227 ckeditor.js:253 Uncaught Error: [CKEDITOR.resourceManager.add] The resource name "mystyles" is already registered.
    at CKEDITOR.resourceManager.add (ckeditor.js:253)
    at /site/modules/InputfieldCKEditor/mystyles.js?nc=1512242401&t=2015030801.160:9

the contents of mystyles.js: 

/**
 * mystyles.js
 *
 * This file may be used when you have "Styles" as one of the items in your toolbar.
 *
 * For a more comprehensive example, see the file ./ckeditor-[version]/styles.js
 *
 */
CKEDITOR.stylesSet.add('mystyles', [
	{name: 'Inline Code', element: 'code'},
	{name: 'Inline Quotation', element: 'q'},
	{name: 'Left Aligned Photo', element: 'img', attributes: {'class': 'align_left'}},
	{name: 'Right Aligned Photo', element: 'img', attributes: {'class': 'align_right'}},
	{name: 'Centered Photo', element: 'img', attributes: {'class': 'align_center'}},
	{name: 'Two Columns', element: 'p', attributes: {'class': 'columns-2'}},
	{name: 'Three Columns', element: 'p', attributes: {'class': 'columns-3'}},
	{name: 'Justify', element: 'p', attributes: {'class': 'justify'}},
	{name: 'Small', element: 'small'},
	{name: 'Deleted Text', element: 'del'},
	{name: 'Inserted Text', element: 'ins'},
	{name: 'Cited Work', element: 'cite'}
]);

 

  • Like 1
Link to comment
Share on other sites
dragan Hero Member

dragan

Posted
Posted

I get a fatal error, when I want to edit a page that has no image field. Well, actually there are image fields, but they are part of repeaters or matrix-repeaters, or some other fields.

ckeditor-image-field-fatal-error.PNG.18eb45339d62cd15c88f6f6eb6e27ef3.PNG

btw: this refers to the wire module file, not site

The template of this page has the following fields/field-types:

template-fields.PNG.4b3300273475cef40ddefec2ec5582ad.PNG

I feel kinda bad for posting all these issues... I'm sure the community can wait till 2018 until these things are ironed out.

Enjoy your well-deserved holidays!

 

  • Like 2
Link to comment
Share on other sites
ryan Hero Member

ryan

Posted
  • Author
Posted
Quote

I can copy + paste, and drag and drop. But when I right-click on the image and select "image settings", I see this in the modal:

This one I can't duplicate yet. I'm also running the latest Chrome, except in OS X rather than Windows. I also tested in Firefox and was not able to duplicate it there either. Maybe there is a platform difference I need to look closer at. But you mentioned that after saving the page, everything worked. I'm guessing a JS error is happening somewhere in the process. Try enabling debug mode $config->debug=true; in /site/config.php, and watch your Chrome JS console for any JS errors that might appear in the process, whether from the CKEditor field, or possibly another field in the page editor at the same time. Edit—see further down for my response to the JS error you found. 

Quote

With Firefox, I can drag and drop, but copy+paste does nothing.

Paste doesn't work in Firefox for me either. As far as I can tell, this CKE plugin doesn't support the paste action in Firefox. It looks like Firefox uses a different type of raw data when it comes to paste that might require Firefox specific code. I haven't looked very far yet though. 

Quote

Uncaught Error: [CKEDITOR.resourceManager.add] The resource name "mystyles" is already registered.

Okay I think this may possibly be what the issue is with the first issue. Try registering under some name other than "mystyles", which is just what we used for example purposes, but better to choose your own name. It looks like it might be colliding with some built-in example and creating the JS error. 

Quote

Would be great if the image field restriction also works with the croppable image field. At the moment it fetches all images which are of the croppable image fieldtype independent of the image field selection.

The croppable image field is a 3rd party plugin, so I'm not sure to what extent it might support this feature. But if it extends FieldtypeImage, then chances are that it will work for uploads as well. 

I'm not sure I understand what you mean by "fetches all images"? This feature only uploads images. It sounds like maybe you are talking about the image insert dialog, where you can select from images that are already uploaded? If that's the case, go to Modules > Configure > ProcessPageEditImageSelect. In the settings, you can specify the images fields that it should ignore. You'll want to add your croppable image field there (if you don't want it available for CKE). This new CKE upload feature also honors the setting you specify there. 

Quote

I get a fatal error, when I want to edit a page that has no image field. Well, actually there are image fields, but they are part of repeaters or matrix-repeaters, or some other fields.

I can't duplicate this one either, but since we know where it's occurring I can add some code to avoid it. What we're seeing there is a $page that has no template assigned, somehow. I'm guessing another module is triggering with a NullPage, which is why template is empty. I'll add a detection for that and commit it in a few mins. I'm pretty sure that'll fix it. 

  • Like 5
  • Thanks 1
Link to comment
Share on other sites
Juergen Hero Member

Juergen

Posted
Posted
21 hours ago, ryan said:

This feature only uploads images. It sounds like maybe you are talking about the image insert dialog, where you can select from images that are already uploaded?

Yes this was the issue. I followed your instructions and now it works as expected. :)

Link to comment
Share on other sites
  • 4 weeks later...
  • 1 month later...

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
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...