Why would including jscript in a plugin change the default css output?

rsilletti · 2007-07-21 18:27:58

I’ve modified section_list to output urls that include event bindings for rollover text using javascript. I’ve included the javascript in the plugin itself and when that script is run, the default body css rule that ships with TXP is removed from the DOM. Why would the following code change a style element?

 
	     echo <<<js

<script language="JavaScript" type="text/JavaScript">
//<![CDATA[

function swapAlt(whichtitle) {
		 var text = whichtitle.getAttribute("alt");
		 var description = document.getElementById("dogtown_text");
		 description.firstChild.nodeValue = text;
		 }
function defAlt(whichtitle) {
		 var text = 'Dog Town';
		 var description = document.getElementById("dogtown_text");
		 description.firstChild.nodeValue = text;
		 }

//]]>
</script>

js;

Last edited by rsilletti (2007-07-21 18:28:43)

Mary · 2007-07-21 20:17:55

I would venture to guess this is some sort of browser bug. What’s the JS that the tag adds?

It’s probably not the cause, but javascript should be all lower-case in your code (the value is a mime-type), and the language attribute should be dropped too (the values are non-standard, so the attribute has been deprecated).

rsilletti · 2007-07-21 21:11:02

The target element in the DOM would be something like <p id=“dogtown_text”>Default Text</p> for the rollover, the javascript is all in the plugin. It isn’t picky about which css rule it removes, it just takes the first definition off the top of the list.
The entire plugin looks like this presently:

function dogtown_section_list($atts) 
	{
		global $sitename, $s;

		extract(lAtts(array(
			'active_class'    => '',
			'break'           => br,
			'class'           => __FUNCTION__,
			'default_title'   => $sitename,
			'exclude'         => '',
			'include_default' => '',
			'label'           => '',
			'labeltag'        => '',
			'sections'        => '',
			'sort'            => '',
			'wraptag'         => '',
		), $atts));

		$sort = doSlash($sort);

		if ($sections)
		{
			$sections = do_list($sections);

			$sections = join("','", doSlash($sections));

			$rs = safe_rows_start('name, title', 'txp_section', "name in ('$sections') order by ".($sort ? $sort : "field(name, '$sections')"));
		}

		else
		{
			if ($exclude)
			{
				$exclude = do_list($exclude);

				$exclude = join("','", doSlash($exclude));

				$exclude = "and name not in('$exclude')";
			}

			$rs = safe_rows_start('name, title', 'txp_section', "name != 'default' $exclude order by ".($sort ? $sort : 'name ASC'));
		}

		if ($rs)
		{
			$out = array();

			while ($a = nextRow($rs))
			{
				extract($a);

				$url = pagelinkurl(array('s' => $name));

				$out[] = tag($name, 'a', 
					( ($active_class and ($s == strtolower($name))) ? ' class="'.$active_class.'"' : '' ).
					' href="'.$url.'"'.' onmouseout="defAlt(this);" onmouseover="swapAlt(this);" alt="'.$title.'"'
				);
			}

			if ($out)
			{
				if ($include_default)
				{
					$out = array_merge(array(
						tag($default_title,'a', 
							( ($active_class and ($s == 'default')) ? ' class="'.$active_class.'"' : '' ).
							' href="'.hu.'"'.' onmouseout="defAlt(this);" onmouseover="swapAlt(this);" alt="Home"'
						)
					), $out);
				}

				return doLabel($label, $labeltag).doWrap($out, $wraptag, $break, $class);
			}
		}

		return '';
	}

	     echo <<<js

<script type="text/javascript">
//<![CDATA[

function swapAlt(whichtitle) {
		 var text = whichtitle.getAttribute("alt");
		 var description = document.getElementById("dogtown_text");
		 description.firstChild.nodeValue = text;
		 }
function defAlt(whichtitle) {
		 var text = 'Dog Town';
		 var description = document.getElementById("dogtown_text");
		 description.firstChild.nodeValue = text;
		 }

//]]>
</script>

js;

Last edited by rsilletti (2007-07-22 01:38:09)

rsilletti · 2007-07-22 01:50:41

Ok? The code won’t behave this way if I move the javascript out of the plugin and include it inline in the head of the template, it also won’t behave this way if I place the css in a file in the root of the site and call it with a link to that file directly rather than with TXP’s css tag. The best I can judge – that puts it in conflict with something in Textpattern?

Mary · 2007-07-23 01:15:43

Um, you’re echoing the script. You should in all likelihood be returning it.

rsilletti · 2007-07-23 02:33:08

Thanks Mary – wrapping the script in a function and echoing the return value inside dogtown_section_list resolves the problem nicely, though I’ll admit I’m still a little puzzled as to the difference.

Mary · 2007-07-24 00:36:02

Tags in Textpattern are powered by running a regular expression. Anything that looks like a tag gets replaced with the return contents of a given function. Echo-ing would cause it to be output in an irregular manner, outside of the search/replace mechanism. Just what happens in that situation is very quirky, as you discovered.

rsilletti · 2007-07-24 01:11:50

Yes, I’ve looked at the tag parser and can see how that may be the case – thanks again.

Textpattern CMS

Textpattern CMS support forum

#1 2007-07-21 18:27:58

Why would including jscript in a plugin change the default css output?

#2 2007-07-21 20:17:55

Re: Why would including jscript in a plugin change the default css output?

#3 2007-07-21 21:11:02

Re: Why would including jscript in a plugin change the default css output?

#4 2007-07-22 01:50:41

Re: Why would including jscript in a plugin change the default css output?

#5 2007-07-23 01:15:43

Re: Why would including jscript in a plugin change the default css output?

#6 2007-07-23 02:33:08

Re: Why would including jscript in a plugin change the default css output?

#7 2007-07-24 00:36:02

Re: Why would including jscript in a plugin change the default css output?

#8 2007-07-24 01:11:50

Re: Why would including jscript in a plugin change the default css output?

Board footer