Opened 15 years ago

Closed 15 years ago

#2660 closed New Feature (fixed)

alt & title for smileys

Reported by: Niko Owned by:
Priority: Normal Milestone: CKEditor 3.0
Component: General Version:
Keywords: Confirmed Cc:

Description

On my site I use FCKeditor for a user-commentbox, the users can also insert smileys. FCKeditor works just fine with inserting the smileys but some of the smileys look the same or aren't really clear on what they represent. The smiley popup doesn't give any information about the smiley, so I modified the script a bit to include the attributes alt and title to the img tag. It's just a small adjustment but (at least in my case) very helpful.

I changed the javascript function InsertSmiley in fck_smiley.html (fckeditor/editor/dialog) to this:

function InsertSmiley( url, alt )
{
	oEditor.FCKUndo.SaveUndoStep() ;

	var oImg = oEditor.FCK.InsertElement( 'img' ) ;
	oImg.src = url ;
	oImg.alt = alt ;
	oImg.title = alt ;
	oImg.setAttribute( '_fcksavedurl', url ) ;

	// For long smileys list, it seams that IE continues loading the images in
	// the background when you quickly select one image. so, let's clear
	// everything before closing.
	document.body.innerHTML = '' ;

	dialog.Cancel() ;
}

changes:
1 added argument alt to the function
2 added alt and title to oImg object.

In the same file I changed the javascript that displays the emoticons to this:

<script type="text/javascript">
	var FCKConfig = oEditor.FCKConfig ;

	var sBasePath  = FCKConfig.SmileyPath ;
	var aImages    = FCKConfig.SmileyImages ;
	var aAlts      = FCKConfig.SmileyAlts ;
	var iCols      = FCKConfig.SmileyColumns ;
	var iColWidth  = parseInt( 100 / iCols, 10 ) ;

	var i = 0 ;
	while (i < aImages.length)
	{
		document.write( '<tr>' ) ;
		for(var j = 0 ; j < iCols ; j++)
		{
			if (aImages[i])
			{
				var sUrl = sBasePath + aImages[i] ;
				document.write( '<td width="' + iColWidth + '%" align="center" class="DarkBackground Hand" onclick="InsertSmiley(\'' + sUrl.replace(/'/g, "\\'" ) + '\', \''+ aAlts[i] +'\')" onmouseover="over(this)" onmouseout="out(this)">' ) ;
				document.write( '<img src="' + sUrl + '" title="'+ aAlts[i] +'" alt="'+ aAlts[i] +'" border="0" />' ) ;
			}
			else
				document.write( '<td width="' + iColWidth + '%" class="DarkBackground">&nbsp;' ) ;
			document.write( '<\/td>' ) ;
			i++ ;
		}
		document.write('<\/tr>') ;
	}
</script>

changes:
1 new var aAlts
2 argument aAlts added in call to InsertSmiley function
3 alt and title attributes added to img tag

In fckconfig.js I have put an array FCKConfig.SmileyAlts which contains the names I want to give the smileys. This array has to be in the same order and contain the same amount of elements as FCKConfig.SmileyImages.
Example:

FCKConfig.SmileyImages = ['big_grin.png','blink.png','blush.png','yawn.png'] ;
FCKConfig.SmileyAlts   = ['big grin','blink','blush','yawn'] ;

Change History (3)

comment:1 Changed 15 years ago by Artur Formella

Keywords: Confirmed added; smiley alt title removed
Milestone: CKEditor 3.0

Great idea. Thank you for reporting.

comment:2 Changed 15 years ago by Artur Formella

Fixed with [2873]

comment:3 Changed 15 years ago by Artur Formella

Resolution: fixed
Status: newclosed
Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy