hak_tinymce WYSIWYG article editor

clownchef · 2012-09-03 14:28:45

In the last few days my editing pages have gotten stuck in HTML in ‘body’ and there is no editing toolbar.

I was told to post here regarding the below thread:
http://forum.textpattern.com/viewtopic.php?pid=265240#p265240

I see from the above info on hak_tinymce that we ought to be on 4.2.0 or higher and we are on 4.0.8. I am not sure what might break with an upgrade. We are a a critical time of year for us. Thanks.

simoin · 2012-09-04 09:29:57

I’m using Textpattern 4.5.0 and hak_tinymce version 1.0.2.1
I’ve noticed that If I create an article and later go back to edit it, that it doesn’t save the edit and reverts back to the original article.
This has happened on two separate installs. I’m wondering is there a fix for this.

uli · 2012-09-04 11:13:18

Simon, are you sure this is hak_tinymce related? I recently worked on a website whose hosting company was the clients choice. I always, each time, have to reload the (backend!) pages forcing my browser to bypass cache while editing this and only this website.

Last edited by uli (2012-09-04 11:14:27)

simoin · 2012-09-04 11:33:43

Well I have another test site on the same hosting, using an earlier version of Textpattern, 4.4.1 but with the same version of hak_tinymce, ie version 1.0.2.1 and I don’t have the same problem.

hakjoon · 2012-09-04 12:16:54

@simoin: when you say go back and edit it, do you mean hit the back button or go back to edit it at some later point?

Does it go away if you turn off hak_tinymce? Tinymce really just pulls what gets put in the text area but weirder things have happened.

This could be some weird caching with the new Ajax stuff in 4.5 what browser/ are you seeing this in so I can try to replicate it.

simoin · 2012-09-04 12:53:40

Hi hakjoon,
What I mean is when I save the article, I get an “article posted” confirmation,
but if then I click on the articles tab in Textpattern and open the article,
the edit has not saved.
The browser I’m using is Firefox 16.0
If I disable hak_tinymce the article saves correctly.

hakjoon · 2012-09-04 14:56:21

I’ll take a look see if i can figure what is happening.

Could be something with the new ajax stuff. I checked it out in the beta and everything seemed to work but maybe something changed since then.

hakjoon · 2012-09-06 02:40:41

@simoin: I think I tracked down the problem. It’s the same thing Kevin Potts was seeing. I’m working on fix. In the meantime if you hit save twice it will save the content.

It looks like the TXP async form submit runs before the tinyMCE handler that makes the content available to the post fires. I want to see if I cane figure out a more elegant way to handle this, but I think I have a working solution.

hakjoon · 2012-09-06 03:08:45

Version 1.0.2.2 uploaded which should hopefully fix the saving issues.

simoin · 2012-09-06 10:36:59

@hakjoon Thanks for the update, but unfortunately I still have to hit save twice for the article to save.

hakjoon · 2012-09-06 11:53:14

Blergh I introduced a bug when I was trying to clean up the code a bit. I uploaded 1.0.2.3 which should hopefully fix it (fingers crossed)

I hate writing javascript inside PHP.

simoin · 2012-09-06 13:00:36

@hakjoon Thanks, that’s fixed it! Appreciate you keeping this plugin up-to-date for the new Textpattern release,
It’s an essential plugin for client sites.

THE BLUE DRAGON · 2012-09-06 14:38:42

photonomad wrote:

Yes! I am aware of redbot’s awesome plugins. My question has to do with the fact that many clients want to add pictures and/or files throughout the text in the body of their articles. I’m looking for a really convenient way for them to do this.

I can write a small jQuery script for that.

I’m currently doing something like this using bot_image_upload and then grab the image from it and insert it into another place.
(take a look at this video at 17:55-18:50)

The only thing is that I don’t really know how to get the right position in the text inside of TinyMCE to insert the image to.
I think I need to set a placeholder is it right?
so if you cancel I’m removing the placeholder and if you do add an image I’m replacing the placeholder with it.
(I never looked inside the code to see how a wysiwyg works)

hakjoon · 2012-09-06 15:23:47

I would really like to just integrate this with bot_image_upload or something similar so that a consistent interface could be created for image/file insertion and linking. I’m not sure what the best way is to do that.

Anyone have any suggestions for which ones to look at I’ve been kind of out of the loop.

THE BLUE DRAGON · 2012-09-07 14:23:36

This will help you get started
I wrote a working code that will grab all the images from any bot_image_upload field,
and will insert the images where you want to:

var get_bot_images_check;

function get_bot_images(from_field,to_field){

	// Open bot_image_upload
	$(from_field).parent().find('.bot_add_image').click();

	get_bot_images_check = setInterval(function(){
		if($(from_field).val() != ''){
			var images_list = '';

			// Loop to get each image URL
			$($(from_field).val().split(',')).each(function(i,v){
				// Get image URL
				var image_url = $('.bot_iu_image_container.id'+v+' img').attr('src').split('?');

				// Add image to the list and set it's output
				images_list += $('<img alt="" />').attr('src', image_url[0]).wrap('<div />').parent().html();
			});

			// Append images
			$(to_field).val($(to_field).val() + images_list);

			// Clear images from bot_image_upload
			$(from_field).parent().find('.bot_image_delete').click();

			// Clear the checking of every second
			clearInterval(get_bot_images_check);
		}
	},1000);
}

You will need to call that function from somewhere with two parameters:
1. from_field = the ID of the field that use bot_image_upload and we are going to take the images from it.
2. to_field = the ID of the field that we want to append the images to.

Here’s an example:

$('.your_upload_button_class_name').click(function(event){
	event.preventDefault();

		get_bot_images('#article-image','#body');

	return false;
});

I think that the only thing you need to change in it it’s where to append the images to
// Append images
Because it’s TinyMCE you will need to go to the parent element of the field and look for that TinyMCE iframe inside it and append to it.
currently the code will only append the images to the field value, but that will not be shown in the TinyMCE editor.
So you can test it on a none TinyMCE field and see how it works.

Last thing is that you will probably want to clear the setInterval when the user click on ‘close’ in bot_image_upload
clearInterval(get_bot_images_check);

Of course you should hide the “from field”.

Last edited by THE BLUE DRAGON (2012-09-08 12:20:50)

Textpattern CMS

Textpattern CMS support forum

#1051 2012-09-03 14:28:45

Re: hak_tinymce WYSIWYG article editor

#1052 2012-09-04 09:29:57

Re: hak_tinymce WYSIWYG article editor

#1053 2012-09-04 11:13:18

Re: hak_tinymce WYSIWYG article editor

#1054 2012-09-04 11:33:43

Re: hak_tinymce WYSIWYG article editor

#1055 2012-09-04 12:16:54

Re: hak_tinymce WYSIWYG article editor

#1056 2012-09-04 12:53:40

Re: hak_tinymce WYSIWYG article editor

#1057 2012-09-04 14:56:21

Re: hak_tinymce WYSIWYG article editor

#1058 2012-09-06 02:40:41

Re: hak_tinymce WYSIWYG article editor

#1059 2012-09-06 03:08:45

Re: hak_tinymce WYSIWYG article editor

#1060 2012-09-06 10:36:59

Re: hak_tinymce WYSIWYG article editor

#1061 2012-09-06 11:53:14

Re: hak_tinymce WYSIWYG article editor

#1062 2012-09-06 13:00:36

Re: hak_tinymce WYSIWYG article editor

#1063 2012-09-06 14:38:42

Re: hak_tinymce WYSIWYG article editor

#1064 2012-09-06 15:23:47

Re: hak_tinymce WYSIWYG article editor

#1065 2012-09-07 14:23:36

Re: hak_tinymce WYSIWYG article editor

Board footer