htmlArea

A directory of browser-based WYSIWYG editors

  MAIN
INDEX
SEARCH
POSTS
WHO'S
ONLINE
LOG
IN

Home: htmlArea 3 (beta): htmlArea 2 & 3 archive (read only): htmlArea v3.0 - Discussion:
Impossible to insert link on an image embedded in a html element


The htmlArea 2 & 3 editors have been discontinued.

We've made these forums available as a read-only reference and knowledge-base for people using or developing editors based on htmlArea 2 or 3.

Anyone who is interested in taking over version 2 or 3 is free to do so. All we ask is that you choose a new name that doesn't have "htmlarea" in it to avoid confusion with this site. We'll even give you a link in the directory to make it easier for people to find you. If you are developing or hosting an htmlArea based-editor under a new name, please submit it to our directory.

 


tellaw
New User

Mar 11, 2004, 5:09 AM

Post #1 of 5 (3531 views)
Shortcut
Impossible to insert link on an image embedded in a html element Can't Post

Hi,
I try to implement htmlArea in my website, but i have a problem, i have text inserts in my article and i cannot link images embedded inside...

The process seems to work but the link in not inserted. If i insert a link in the html by myself, the system refuse to modify it. I think the problem is in the context detection.

eg :
<div style="FLOAT: left; MARGIN: 0px 10px 10px 0px; WIDTH: 140px; BACKGROUND-COLOR: #f2e1bf">
<img height="100" hspace="0" src="http://www.interactivetools.com/common/header_logo.gif" width="140" border="0" />
<div style="MARGIN: 3px">text embeded in the image DIV...</div>
</div>

thank you.
Eric


bsutton
Novice

Mar 11, 2004, 5:50 PM

Post #2 of 5 (3511 views)
Shortcut
Re: [tellaw] Impossible to insert link on an image embedded in a html element [In reply to] Can't Post

Hi Eric

I have been working on this problem this morning - being able to put a link around an image and also changing an image link. There are other problems with linking too (at the start of an article or the start of a TD). I seem to have a solution that works for both IE and Mozilla Firebox although it needs much more testing. In htmlarea.js, replace the createLink function with:


Code
HTMLArea.prototype._createLink = function(link) { 
var editor = this;
var outparam = null;
if (typeof link == "undefined") {
link = this.getParentElement();
// Altered to pick up tag around img. bsutton
// if (link && !/^a$/i.test(link.tagName))
// link = null;
if (link) {
if (/img/i.test(link.tagName))
link = link.parentNode;
if (!/^a$/i.test(link.tagName))
link = null;
}
// End alter
}
// Inserted to pick up tag around img. bsutton
if (link && /img/i.test(a.tagName))
link = link.parentNode;
// End insert
if (link) outparam = {
f_href : HTMLArea.is_ie ? editor.stripBaseURL(link.href) : link.getAttribute("href"),
f_title : link.title,
f_target : link.target
};
this._popupDialog("link.html", function(param) {
if (!param)
return false;
var a = link;
if (!a) {
editor._doc.execCommand("createlink", false, param.f_href);
a = editor.getParentElement();
var sel = editor._getSelection();
var range = editor._createRange(sel);
if (!HTMLArea.is_ie) {
a = range.startContainer;
// Altered to get new links to work at the beginning of the body or a td and around images. bsutton
// if (!/^a$/i.test(a.tagName))
// a = a.nextSibling;
if (!/^a$/i.test(a.tagName)) {
a = a.nextSibling;
if (a == null || !/^a$/i.test(a.tagName)) {
a = range.startContainer.childNodes[range.startOffset];
if (a == null) {
a = range.startContainer.parentNode;
}
}
}
// End alter
}
// Altered to go to parent if img and to allow removal of link if there is no f_href. bsutton
// } else a.href = param.f_href.trim();
if (/img/i.test(a.tagName))
a = a.parentNode;
}
else {
var href = param.f_href.trim();
editor.selectNodeContents(a);
if (href == "") {
editor._doc.execCommand("unlink", false, null);
editor.updateToolbar();
return false;
}
else {
a.href = href;
}
// End alter
}
if (!/^a$/i.test(a.tagName))
return false;
a.target = param.f_target.trim();
a.title = param.f_title.trim();
editor.selectNodeContents(a);
editor.updateToolbar();
}, outparam);
};


Bill


graou
Novice

May 28, 2004, 8:15 AM

Post #3 of 5 (3344 views)
Shortcut
Re: [bsutton] Impossible to insert link on an image embedded in a html element [In reply to] Can't Post

Great !!!
Thanks it's really good


yeadongroup
New User

Jan 21, 2005, 11:59 PM

Post #4 of 5 (2989 views)
Shortcut
Re: [bsutton] Impossible to insert link on an image embedded in a html element [In reply to] Can't Post

Bill,

You seem to be taking on some problems that I would like to have fixed as well. If I click on an image I am able to add a link to it. But if I want to modify the link around an image the url from the link doesn't show up.

I tried your code and now when I click to modify a link around an image the image dialog doesn't even show up on IE.

Do you have this code better tested yet?

Thanks,

Collin


bsutton
Novice

Jan 22, 2005, 12:59 AM

Post #5 of 5 (2982 views)
Shortcut
Re: [yeadongroup] Impossible to insert link on an image embedded in a html element [In reply to] Can't Post

Hi Collin

Yes there is a mistake, sorry.
Change the line
if (link && /img/i.test(a.tagName))
to
if (link && /img/i.test(link.tagName))

I don't know if this will work on the latest version. I have not refreshed mine for quite a while.

Bill

 
 
 


Search for (options)