적용버전 : XpressEngine 공통 플래시(Flash) 페이지 인식하기

플래시(Flash) 페이지 인식하기

플래시 메뉴 고정하기

레이아웃에서 플래시 메뉴를 만들어 삽입하게 되면 해당 페이지의 메뉴를 활성화 해야 하는데 이러한 동작을 플래시에서는 페이지 인식하기 또는 메뉴 고정하기라고 부릅니다. 만약 메뉴가 활성화 되지 않으면 방문자는 지금 어느 페이지를 보고 있는지 알 수가 없어서 답답할 것입니다.

아래에 예제를 만들어 보았습니다. 메인 메뉴와 서브 메뉴의 고정을 확인해 보죠. 각각 0 에서 2 사이의 숫자를 입력하고 확인을 클릭해 보세요. 메뉴가 각각 3개씩이기 때문에 배열의 조합은 0,1,2 로 이루어 집니다. 어떻게 배열이 조합되는지 직접 확인해 보세요.

메인메뉴 고정 :   서브메뉴 고정 :  

★ 고정된 메뉴의 배열 결과 : menu[][]


XE에서 플래시 메뉴 인식하기

플래시에서 메뉴를 고정하기 위해서는 메뉴 고정을 위한 변수 값을 받을 수 있도록 플래시 제작 과정에서 미리 준비 되어야 합니다. 플래시 제작은 개인적으로 준비하세요.

1. 플래시 제작과정에서 변수의 설정은 각각 자유롭게 설정하며 보통 pageNum 변수 이름을 많이 사용하고 변수를 보낼때는 파일(swf) 확장자 뒤에 ?pageNum=1 을 붙여서 보내면 플래시는 이것을 받아 메뉴를 고정시켜 줍니다. 만약 서브 메뉴에도 적용하려면 ?pageNum=1&subNum=2 이런 식으로 보내게 되죠. 우선 레이아웃에 삽입된 플래시 소스에 변수값을 보낼 수 있도록 ?mNum={$mNum}&sNum={$sNum} 을 추가합니다.

플래시 삽입 구문에 추가 :

<script type="text/javascript">displayMultimedia("pageNum_menu.swf?mNum={$mNum}&sNum={$sNum}", "500","120",false);</script>

2. 레이아웃에서 아래의 구문을 삽입된 플래시 보다 위에 추가합니다. 설정된 메뉴를 확인하고 현재 보고 있는 페이지의 배열값을 구해 플래시에 보내기 위한 구문입니다.

<!-- // 플래시 메뉴 인식하기를 위한 메뉴 배열구하기 시작 -->
{@
// 첫번째 메뉴는 0 부터 시작한다
$idx = 0;
// 메뉴의 갯수만큼 반복하면서 메뉴의 목록을 $val 에 담는다
foreach ($main_menu->list as $key => $val):
   // 만약 선택된 값이 있다면 $menu_1st 에는 목록을 $mNum 변수에는 증가된 $idx 값을 담는다 
   if ($val['selected']):
      $menu_1st = $val;
      $mNum = $idx;
      // 만약 선택된 목록의 서브 목록이 있는 경우에도 같은 방법으로 값을 담는다
      if ($menu_1st):
      $idx2 = 0;
         foreach ($menu_1st['list'] as $key => $val):
            if ($val['selected']):
            $sNum = $idx2;
            endif;
         // $idx2 에 1씩 증가시킨다
         $idx2++;
         endforeach;
      endif;

   endif;
// $idx 에 1씩 증가시킨다
$idx++;
endforeach;
}
<!-- // 배열구하기 끝 -->


위와 같은 방법으로 플래시에서 현재 페이지의 위치를 인식하고 메뉴를 고정할 수 있게 됩니다. 아래 추가로 메뉴 인식을 위한 다른 방법도 함께 활용해 보세요.


block 구문의 활용

<!-- // 플래시 메뉴 인식하기를 위한 메뉴 배열구하기 시작 -->
{@ $idx=0}
<block loop="$main_menu->list=>$key1,$val1">
	<block cond="$val1['selected']">{@ $mNum=$idx}</block>
		{@ $idx2=0}
		<block loop="$val1['list']=>$key2,$val2">
			<block cond="$val2['selected']">{@ $sNum=$idx2}</block>
		{@ $idx2++}
		</block>
{@ $idx++}
</block>
<!-- // 배열구하기 끝 -->


XE 구메뉴에서의 활용

<!-- // 플래시 메뉴 인식하기를 위한 메뉴 배열구하기 시작 -->
{@ $idx=0}
<!-- // 1차 메뉴 배열 -->
<!--@foreach($main_menu->list as $key => $val)-->
   <!--@if($val['selected'])-->
   {@ 
   $menu_1st = $val;
   $mNum=$idx;
   }
   <!--@end-->
      <!-- // 2차 메뉴 배열 -->
      <!--@if($menu_1st)-->
      {@ $idx2 = 0 }
         <!--@foreach($menu_1st['list'] as $key => $val)-->
         <!--@if($val['selected'])-->{@ $sNum=$idx2}<!--@end-->
         {@$idx2++}
         <!--@endforeach-->
      <!--@endif-->
{@ $idx++}
<!--@endforeach-->
<!-- // 배열구하기 끝 -->