Примеры использования

s0rr0w · February 16, 2009

Все примеры одним файлом

Пример первый.

Самый простой, нам нужно при нажатии на ссылку менять видимость какого-то контейнера.

<p id="hidden_paragraph" SC="sc_hide_node:hide" class="specialBox">Пример параграфа, который будет скрыт.</p>

<div>
 <a href="#" onclick="GSC_setValAndLaunch('hide', true, 'hidden_paragraph'); return false;">[ cкрыть параграф ]</a> 
 <a href="#" onclick="GSC_setValAndLaunch('hide', false, 'hidden_paragraph'); return false;">[ показать параграф ]</a>
</div>

Что происходит при нажатии на ссылку [ cкрыть параграф ]?

Устанавливаем значение переменной hide в true и потом запускаем обход дерева нод, начиная с элемента hidden_paragraph

Так как обработчик реагирует на событие hide, то будет запущена функция sc_hide_node, которой будет в качестве параметра передана нода P.

Элементу будет присвоен класс hiddenBlock, который имеет display: block;

Пример второй.

Усложняем задачу. Нам нужно не просто скрывать элемент, а еще и менять сам переключатель.

	<div id="container">

		<div>
			<a href="#" onclick="GSC_setValAndLaunch('hide', true, 'container'); return false;" SC="sc_hide_node:hide">[x] cкрыть параграф</a>
			<a href="#" onclick="GSC_setValAndLaunch('hide', false, 'container'); return false;" SC="sc_show_node:hide" class="hiddenBlock">[+] показать параграф</a>
		</div>

		<p SC="sc_hide_node:hide" class="specialBox">Пример параграфа, который будет скрыт.</p>

	</div>

Мы добавили контейнер, в который поместили два наших элемента - управляющий элемент-переключатель и скрываемый текст.

Добавляем нашим переключателям SC-обработчики, которые реагируют на то же событие - hide.

При нажатии на ссылку "[x] cкрыть параграф" будет запущен обходчик нод, который запустит соответствующие обработчики. Как итог, одна ссылка будет спрятана, одна - показана, параграф - скрыт.

При нажатии на другую ссылку будет произведена обратная операция.

Для того, чтобы добавить еще один элемент для скрытия, достаточно дописать ему соответствующий обработчик, чтобы нода реагировала на событие hide определенным образом.

s0rr0w · May 28, 2009

cспасибо за ответ, но я его увы не понял.
у меня меню по примеру номер 3. и хочется, чтобы при нажатии на определенную ссылку внеменю все пункты меню(тафтология пардон)) становились неактивными. Что для этого надо вызвать в этой ссылке?
И функция GSC_launch в исходнике имеет 3 параметра.

Добавляем каждому элементу меню в блок SC новый обработчик sc_remove_class:disable:active

Было

<a href="#" onclick="GSC_setValAndLaunch( 'menu', 1, $getParentByClassName( this, 'menuBlock' ) ); return false;" SC="sc_apply_class_by_id:menu:1:active--allowNonDirect" class="menuItem" >Пункт меню 1</a>

Стало

<a href="#" onclick="GSC_setValAndLaunch( 'menu', 1, $getParentByClassName( this, 'menuBlock' ) ); return false;" SC="sc_apply_class_by_id:menu:1:active--allowNonDirect|sc_remove_class:disable:active" class="menuItem" >Пункт меню 1</a>

Расшифруем. При возникновении события "disable" запустится обработчик sc_remove_class, который удалит класс "active".

Обработчик в первых примерах отсутствует, нужно в файл scHandlers.js добавить

var sc_apply_class = function ( controller, node, scData, execOptions, remove ){
	try {
		var args = scData.args;

		var applyFlag = ( controller.states[ scData.state ] );
		if ( remove ) applyFlag = !applyFlag 
		$applyClassName( node, args[ 0 ], applyFlag )

	} catch ( e ) { }	  
}
var sc_remove_class = function ( controller, node, scData, execOptions ){
	try {
		sc_apply_class ( controller, node, scData, execOptions, true )  
	} catch ( e ) { }
}

Ну, и теперь, код кнопки

Запускаем событие "disable", начиная с контейнера с идентификатором "menuBlock".

Все.

xtz · May 30, 2009

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
 <title>StateController. Пример.</title>
 <link rel="stylesheet" type="text/css" href="../inc/main.css">

 <script type="text/javascript" src="../StateController/lib.js"></script>

 <script type="text/javascript" src="../StateController/stateController.js"></script>

 <script type="text/javascript" src="../StateController/scHandlers.js"></script>

 <script type="text/javascript">
	$addEventListener( window, "load", function(){ GSC_launch( document.getElementsByTagName("BODY").item( 0 ) ) } );
 </script>

</head>
<body>

	<div class="menuBlock">

		<a href="#" onclick="GSC_setValAndLaunch( 'menu', 1, $getParentByClassName( this, 'menuBlock' ) ); return false;" SC="sc_apply_class_by_id:menu:1:active--allowNonDirect|sc_remove_class:disable:active" class="menuItem" >Пункт меню 1</a>

		<a href="#" onclick="GSC_setValAndLaunch( 'menu', 2, $getParentByClassName( this, 'menuBlock' ) ); return false;" SC="sc_apply_class_by_id:menu:2:active--allowNonDirect|sc_remove_class:disable:active" class="menuItem" >Пункт меню 2</a>

		<a href="#" onclick="GSC_setValAndLaunch( 'menu', 3, $getParentByClassName( this, 'menuBlock' ) ); return false;" SC="sc_apply_class_by_id:menu:3:active--allowNonDirect|sc_remove_class:disable:active" class="menuItem" >Пункт меню 3 </a>

		<a href="#" onclick="GSC_setValAndLaunch( 'menu', 4, $getParentByClassName( this, 'menuBlock' ) ); return false;" SC="sc_apply_class_by_id:menu:4:active--allowNonDirect|sc_remove_class:disable:active" class="menuItem" >Пункт меню 4</a>

	</div>
<a href="#" onclick="GSC_launch( 'menuBlock', 'disable');">1111111</a>



</body>
</html>

вот код, выделенный пункт остается...(((

s0rr0w · May 30, 2009

вот код, выделенный пункт остается...(((

Да. Ошибка первая, в моих примерах немного другой обработчик, чем я использую у себя. Поэтому на ссылке нужно добавить не GSC_launch, а

GSC_setValAndLaunch( 'disable', true, 'menuBlock');

Т.е., сначала устанавливаем значение состояния disable в true, потом уже обходим дерево.

А второй баг - нет идентификатора у блока.

В ссылках можно смело заменить $getParentByClassName( this, 'menuBlock' ) на 'menuBlock'

И будет все работать.

xtz · May 30, 2009

Класс!!! спасибо!

И еще вопросик, может не совсем по теме.. почему ИЕ7 так боиться яваскриптов? иногда даже елементарных. у меня на ноуте и на компе винда с одного дистрибутива. на компе StateController работает на ноуте эксплоурер его боиться. Хотя политика безопасности одинаковая.

s0rr0w · May 30, 2009

Класс!!! спасибо!
И еще вопросик, может не совсем по теме.. почему ИЕ7 так боиться яваскриптов? иногда даже елементарных. у меня на ноуте и на компе винда с одного дистрибутива. на компе StateController работает на ноуте эксплоурер его боиться. Хотя политика безопасности одинаковая.

Честно говоря, не знаю. ИЕ вообще боится всех локальных скриптов.

Nekromancer · May 31, 2009

Ты по сетке заходишь? когда по сети тянешь то он более лояльна относится к скриптам :rolleyes:

Sign In

Примеры использования

Question

s0rr0w

Link to comment

Share on other sites

31 answers to this question

Recommended Posts

s0rr0w

Link to comment

Share on other sites

xtz

Link to comment

Share on other sites

s0rr0w

Link to comment

Share on other sites

xtz

Link to comment

Share on other sites

s0rr0w

Link to comment

Share on other sites

Nekromancer

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information