Content slider for latest beta/nightly?

Locked
User avatar
SineMacula
Joomla! Explorer
Joomla! Explorer
Posts: 453
Joined: Sun Aug 21, 2005 5:16 am
Location: San Jose, CA
Contact:

Content slider for latest beta/nightly?

Post by SineMacula » Wed Jun 20, 2007 3:52 pm

Just wondering if there's a way to do sliding content, as can be done with the Tabs & Slides in Content Items Plugin that will work in Joomla 1.5 without legacy mode enabled?

User avatar
SineMacula
Joomla! Explorer
Joomla! Explorer
Posts: 453
Joined: Sun Aug 21, 2005 5:16 am
Location: San Jose, CA
Contact:

Re: Content slider for latest beta/nightly?

Post by SineMacula » Wed Jun 20, 2007 4:13 pm

After reading another post about another issue, I took a look at the mootools site, and now I'm wondering - since mootools is now included in Joomla, is there a way to use some of the mootools stuff (like Accordian or Fx.Slide) in content items? Or would it still require a component or plugin to access the mootools stuff?

User avatar
SineMacula
Joomla! Explorer
Joomla! Explorer
Posts: 453
Joined: Sun Aug 21, 2005 5:16 am
Location: San Jose, CA
Contact:

Re: Content slider for latest beta/nightly?

Post by SineMacula » Thu Jul 19, 2007 8:57 pm

Any ideas how to implement fx.slide within a content item? (or if it's even possible?)

I've tried, but no luck:
http://forum.joomla.org/index.php/topic,178213.0.html

I also thought of trying to convert Tabs & Slides in Content Items mambot to a 1.5 plugin... but I'm not sure where to begin:
http://forum.joomla.org/index.php/topic ... 10374.html

Any help or suggestions would be appreciated.

Thanks.

cavijayan
Joomla! Apprentice
Joomla! Apprentice
Posts: 6
Joined: Thu Nov 22, 2007 3:59 pm

Re: Content slider for latest beta/nightly?

Post by cavijayan » Fri Nov 23, 2007 12:20 pm

Here's the working solution : JoomlaWorks "Tabs & Slides (in content items)" Plugin:

Get the joomla 1.0 mambot

Extract the zip

Open the plugin_jw_ts.xml and replace the whole thing with e code below :

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<install version="1.5" type="plugin" group="content">
  <name>JW Tabs & Slides Plugin - J!1.5</name>
  <author>JoomlaWorks / Modified for J!1.5 by C A Vijayan</author>
  <creationDate>23/11/2007</creationDate>
  <copyright>This extension in released under the GNU/GPL License - http://www.gnu.org/copyleft/gpl.html</copyright>
  <authorEmail>[email protected]</authorEmail>
  <authorUrl>http://www.joomlaworks.gr</authorUrl>
  <version>3.0</version>
  <description>
    <![CDATA[<style type="text/css" media="all">
      <!--
      .extension_container {padding:0px 0px 4px 0px;}
      .extension_container ul,
      .extension_container ol {margin:4px 16px;padding:0px;}
      .extension_container ul li,
      .extension_container ol li {margin:2px 8px 2px 0px;padding:0px;}
      h1 {clear:both;margin:0px 0px 12px 0px; padding:0px 0px 1px 0px;color:#C64934;font-size:17px;border-bottom:1px dotted #505050;}
      h2 {clear:both;margin:4px 0px;padding:0px 0px 1px 0px;color:#444;font-size:13px;font-weight:bold;}
      .title {margin:4px 0px;font-size:12px;font-weight:bold;}
      .red {color:#C64934;}
      .code {background:#eee;border:1px solid #ccc;margin:12px;padding:4px;}
      -->
      </style>
      <div class="extension_container">
      <h1><a target="_blank" title="Visit JoomlaWorks!" href="http://www.joomlaworks.gr">JoomlaWorks "Tabs & Slides (in content items)" Plugin v2.3</a></h1>
      <a target="_blank" title="Visit the official project website!" href="http://www.joomlaworks.gr"><img style="float:right;background:#fff;border:1px solid #ccc;padding:2px;margin:0px 0px 2px 8px;" src="../plugins/content/plugin_jw_ts/logo.png" border="0" alt="Logo" /></a> The "<b>Tabs & Slides (in content items)</b>" Plugin gives you the ability to easily add content tabs and/or content slides within standard Joomla!/Mambo content items (articles). The tabs emulate a <b>multi-page structure</b>, while the slides emulate an <b>accordion-like structure</b>, inside a single page!<br />
      <br />
      So, no need for your visitor to scroll through a large page or navigate between pages to read a "big" article! <br />
      <br />
      See the "<b>Tabs & Slides (in content items)</b>" Plugin in action in our exclusive demo site <a target="_blank" title="Visit the official JoomlaWorks demo website!" href="http://demo.joomlaworks.gr">HERE</a>! <br />
      <br />
      <h1>USAGE INSTRUCTIONS</h1>
      <h2>Inserting "Tabs"</h2>
      It is very easy to add tabs in your new content items or convert existing ones to a tabbed layout. First activate the plugin from the plugins menu option in the backend. Then go to the items manager and start a new content item or edit an existing one. Start your first tab using the plugin string "{tab=tab title here}" (without the quotes), write some text below that, then continue with the next tab using -again- the plugin string "{tab=other tab title here}" (without the quotes), then write the second tab's text and so on. When you finish the text of your last tab, simply "close" them by adding the plugin string "{/tabs}" (without the quotes).<br />
      <br />
      Check out this example, it's what you would write in your content item (notice the code written in bold letters):
      <div class="code">This is some text above the tabs<br />
      <br />
      <b>{tab=first tab}</b><br />
      some text<br />
      here<br />
      <b>{tab=other tab}</b><br />
      some more text here<br />
      <b>{/tabs}</b><br />
      <br />
      And some more text after the tabs! </div>
      <h2>Inserting "Slides"</h2>
      Adding Slides to your content is as easy as with Tabs. Again you need to activate the plugin from the plugins menu option in the backend. Then go to the items manager and start a new content item or edit an existing one. Start your first slide using the plugin string "{slide=slide title here}" (without the quotes), write some text below that, then "close" the slide by adding the plugin string "{/slide}". We need to do that cause -unlike the tabs- slides are independent of each other. Continue with the next slide using -again- the plugin string "{slide=other slide title here}" (without the quotes), then write the second slide's text, "close" it with the plugin string "{/slide}", and so on.<br />
      <br />
      Check out this example, it's what you would write in your content item (notice the code written in bold letters):
      <div class="code">This is some text above the slides<br />
      <br />
      <b>{slide=My first slide in Joomla!}</b><br />
      some text<br />
      here<br />
      <b>{/slide}</b><br />
      <b>{slide=Joomla! is the best}</b><br />
      some more text here<br />
      <b>{/slide}</b><br />
      <br />
      And some more text after the slides! </div>
      <h2>Inserting both "Tabs" and "Slides" in your content items</h2>
      Additionally, you can mix tabs with slides in your content and vise versa. So you can have tabs that include content within slides or slides that include tabbed content! <br />
      <br />
      <h1>CUSTOMIZING THE LOOK OF THE TABS OR THE SLIDES</h1>
      You can easily customize the way tabs and slides appear on the screen. All you need to do is modify the included CSS file (<b>tabs_slides.css</b>). We already did some generic customization, so that you can easily see what can be achieved. <br />
      <br />
      <h1>TROUBLESHOOTING</h1>
      If you insert tabs or slides in your content items and see them <b>break apart</b> on your website, try this: Check the page source and see if you can find any <b>html tags</b> that are not "<b class="red">properly closed</b>" in your content, mainly any <b><p></b> tags. This might be a common issue when your content is not properly formatted -perhaps after copied from a Microsoft Word document- so the best thing when applying tabs/slides in your content is:
      <ol>
      <li>Make sure your content is clean from any Word or other bad markup. Use Notepad as an intermediate clean up method when copy-pasting your documents to Joomla.</li>
      <li>Make sure that when you press "enter" in your content, the editor does not output a <b><p></b> tag, but a simple, plain, good ol' <b><br /></b> (break tag). In the editor's parameters, there is always such an option.</li>
      <li>Insert the "tabs" or "slides" plugin strings (plugin strings). If you still encounter layout inconsistencies or broken tabs or slides, then some html tag in your text is to blame for sure!</li>
      </ol>
      If for some reason you see (vertically) double "tabs", <b class="red">make sure you disable Joomla's cache</b> or at least do not use the plugin on your site's com_frontpage component (known as the "Frontpage"). Joomla's cache is unfortunately problematic with this component (com_frontpage), cause it fails to work properly and load necessary CSS and Javascript code needed from every plugin/plugin in the HEAD tag of the template. If you don't use this plugin with com_frontpage, then you can enable Joomla's cache.<br /><br />
      Please note that the "cache issue" does not affect Mambo. Mambo's cache is operating properly.	  
      <br />
      <br />
      <h1>CHANGELOG</h1>
      Version 2.3 (released on August 30th, 2007)
      <ul>
      <li>Updated tab scripts.</li>
      <li>The plugin works smoothly with our "Tabs & Slides" module. You can have both on your site with no issues at all! The even have common CSS/JS files, so all required code is included only once (thus making your website load faster).</li>
      <li>Optimized javascript code for faster loading on all browsers. Checked on Firefox, IE, Safari (Win) and Opera.</li>
      <li>No conflicting with JoomlaWorks "Frontpage Slideshow" component/module anymore.</li>
      <li>Cleaned up CSS code. No weird bullets will show up beside the tabs anymore in some templates (due to CSS overrides)!</li>
      <li>Fixed partially the issue with CSS/JS files not being loaded due to a com_frontpage/cache bug on Joomla! 1.0.x (still not resolved by the Joomla! team). Mambo's cache is working just fine though and you'll get no issues whatsoever (see the "Troubleshooting" section above)!</li>
      </ul>
      Version 2.2 (released on January 14th, 2007)
      <ul>
      <li>Major code shape up. We optimized the scripts' size and gathered all CSS code in one file only. This will help the customization a little more.</li>
      <li>Minor code fixes in the javascript code, extended compatibility with other scripts and minimized the possibility of conflict.</li>
      <li>Added "tab persistence", that means, if you reload the page, your content sticks to the tab you were on, before reloading the page.</li>
      <li>Both "tabs" or "slides" appear now faster on pageload (they don't appear when all content -including heavy images- is loaded, as they did before).</li>
      <li>The plugin has been developed to run smoothly along with its "module implemetation", the "Tabs & Slides" module. The 2 extensions share the same CSS/JS files freeing up bandwidth and making styling easier.</li>
      </ul>
      <br />
      <h1>CREDITS</h1>
      The <b>"Tabs & Slides (in content items)" Plugin</b> utilizes the following scripts:
      <ul>
      <li><a target="_blank" href="http://www.barelyfitz.com/projects/tabber/">JavaScript tabifier</a> by <b>Patrick Fitzgerald</b>. Copyright © 2006 Patrick Fitzgerald.</li>
      <li><a target="_blank" href="http://www.dhtmlgoodies.com/index.html?whichScript=show_hide_content_slide">Show/Hide content with sliding effect</a> by <b>dhtmlgoodies.com</b>.</li>
      </ul>
      <br />
      <h1>ABOUT JOOMLAWORKS</h1>
      The <b class="red">"Tabs & Slides (in content items)" Plugin</b> is a <b>Joomla!/Mambo</b> CMS extension developed by <a target="_blank" title="Visit JoomlaWorks!" href="http://www.joomlaworks.gr">JoomlaWorks (www.joomlaworks.gr)</a> and released under the <a target="_blank" title="GNU General Public License" href="http://www.gnu.org/copyleft/gpl.html">GNU General Public License</a>. <br />
      <br />
      <a target="_blank" title="Visit JoomlaWorks!" href="http://www.joomlaworks.gr">JoomlaWorks</a> is a team of web professionals dedicated to delivering high-quality extensions and templates to the Joomla!/Mambo community. We also do custom development for anyone looking for a tailor-made solution to their project, so feel free to <a target="_blank" title="Contact JoomlaWorks!" href="mailto:[email protected]">contact us</a>. <br />
      <br />
      Make sure you visit:
      <ul>
      <li><a target="_blank" title="Visit JoomlaWorks!" href="http://www.joomlaworks.gr">www.joomlaworks.gr</a> for all the latest news and updates to our Joomla!/Mambo extensions and templates. The <a target="_blank" title="Visit JoomlaWorks!" href="http://www.joomlaworks.gr">JoomlaWorks</a> website is also <b class="red" style="text-decoration:underline;">the</b> place to read interesting articles or find useful tips/tutorials for Joomla!/Mambo and web design/development in general.</li>
      <li><a target="_blank" title="Visit JoomlaWorks Demo Site" href="http://demo.joomlaworks.gr">demo.joomlaworks.gr</a> to experience "live" all our extensions.</li>
      <li><a target="_blank" title="Visit JoomlaWorks Support Forum!" href="http://forum.joomlaworks.gr">forum.joomlaworks.gr</a> to request for help or provide feedback.</li>
      </ul>
      <br />
      Please show your support in our work by rating or commenting on this extension at the official <a target="_blank" href="http://extensions.joomla.org/component/option,com_mtree/task,viewowner/user_id,1596/Itemid,35/">Joomla! Extensions</a> website. <br />
      <br />
      <b><span class="red">the JoomlaWorks team</span><br />
      Fotis Evangelou, George Chouliaras</b><br />
      <br />
      Copyright (c) 2006 - 2007 JoomlaWorks.gr - <a href="http://www.joomlaworks.gr" target="_blank">http://www.joomlaworks.gr</a> <br />
      <br />
	  <i>Updated as Plugin for J! 1.5 by C A Vijayan</i>
      <i>(Last update: November 23rd, 2007 - version 3.0)</i><br />
      <br />
      </div>]]>
  </description>
  <files>
    <filename plugin="plugin_jw_ts">plugin_jw_ts.php</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/logo.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/slide_bg.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/slide_bg_b.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/slide_bg_l.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/slide_bg_r.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/star.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/tab_bg.png</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/tabs_slides.css</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/tabs_slides.js</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/tabs_slides_comp.js</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/tabs_slides_def_loader.js</filename>
    <filename plugin="plugin_jw_ts">plugin_jw_ts/tabs_slides_opt_loader.js</filename>
  </files>
  <params>
    <param name="@spacer" type="spacer" default="=== Slides Configuration ===" label="" description="" />
    <param name="slides_slidespeed" type="text" default="30" label="Slide Speed" description="Higher value equals faster slide speed." />
    <param name="slides_timer" type="text" default="10" label="Slide Timer" description="Lower value equals faster slide time." />
  </params>
</install>
Last edited by cavijayan on Fri Nov 23, 2007 12:23 pm, edited 1 time in total.

cavijayan
Joomla! Apprentice
Joomla! Apprentice
Posts: 6
Joined: Thu Nov 22, 2007 3:59 pm

Re: Content slider for latest beta/nightly?

Post by cavijayan » Fri Nov 23, 2007 12:21 pm

Open the plugin_jw_ts.php and replace the whole thing with e code below :

Code: Select all

<?php
/*
// JoomlaWorks "Tabs & Slides" Plugin for Joomla! 1.0.x - Version 2.3
// License: http://www.gnu.org/copyleft/gpl.html
// Authors: Fotis Evangelou - George Chouliaras
// Copyright (c) 2006 - 2007 JoomlaWorks.gr - http://www.joomlaworks.gr
// Project page at http://www.joomlaworks.gr - Demos at http://demo.joomlaworks.gr
// Support forum at http://forum.joomlaworks.gr

// Updated as Plugin for J! 1.5 by C A Vijayan
// ***Last update: November 23rd, 2007***
*/

/** ensure this file is being included by a parent file */
defined( '_JEXEC' ) or die( 'Direct Access to this location is not allowed.' );

$mainframe->registerEvent(  'onPrepareContent', 'jwTabs' );

function jwTabs( &$row, &$params, $page=0  ) {
	
// JS loader selection
$use_optimized_loader = 0; // Use optimized JS code loader? 0=no and 1=yes. Default is 0.

  // check if item is published
	$published = $row->state > 0;
	
  if (!$published) {
    if (preg_match_all("/{tab=.+?}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) {
     foreach ($matches[0] as $match) {
      $match = str_replace("{tab=", "", $match);
      $match = str_replace("}", "", $match);
      $row->text = str_replace( "{tab=".$match."}", "", $row->text );
      $row->text = str_replace( "{/tabs}", "", $row->text );
     }     
    }
    if (preg_match_all("/{slide=.+?}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) {
      foreach ($matches[0] as $match) {
        $match = str_replace("{slide=", "", $match);
        $match = str_replace("}", "", $match);
        $row->text = str_replace( "{slide=".$match."}", "", $row->text );
        $row->text = str_replace( "{/slide}", "", $row->text );
      } 
    }  	
    return;
  }

  global $mosConfig_absolute_path, $mosConfig_live_site, $mosConfig_session_type, $mainframe, $database, $loadJWTSscripts;
  static $tabid; 
  
  	// load plugin params info
	$plugin	= & JPluginHelper::getPlugin('content', 'plugin_jw_ts');
 	$param 	= new JParameter( $plugin->params );
	
	//get the live site address
	$uri=&JFactory::getURI();
	$mosConfig_live_site=$uri->toString(array('scheme','host','path'));	
	$mosConfig_live_site = substr($mosConfig_live_site,0,-10);
	
  // parameters
  $enable_tabs = $param->def('enable_tabs', 1);
  $enable_slides = $param->def('enable_slides', 1);
  $slides_slidespeed = $param->def('slides_slidespeed', '30');
  $slides_timer = $param->def('slides_timer', '10');

  if(!$loadJWTSscripts) {
	$loadJWTSscripts=1;
	$header = "
<!-- JoomlaWorks \"Tabs & Slides\" Plugin (v2.3) starts here -->		
<style type=\"text/css\" media=\"screen\">
	@import \"$mosConfig_live_site/plugins/content/plugin_jw_ts/tabs_slides.css\";
</style>
<style type=\"text/css\" media=\"print\">.jwts_tabbernav{display:none;}</style>
<script type=\"text/javascript\">var jwts_slideSpeed=".$slides_slidespeed."; var jwts_timer=".$slides_timer.";</script>
<script type=\"text/javascript\" src=\"$mosConfig_live_site/plugins/content/plugin_jw_ts/tabs_slides_comp.js\"></script>
";
	if($use_optimized_loader) {
		$header .= "<script type=\"text/javascript\" src=\"$mosConfig_live_site/plugins/content/plugin_jw_ts/tabs_slides_opt_loader.js\"></script>";
	} else {
		$header .= "<script type=\"text/javascript\" src=\"$mosConfig_live_site/plugins/content/plugin_jw_ts/tabs_slides_def_loader.js\"></script>";
	}
	$header .= "
<!-- JoomlaWorks \"Tabs & Slides\" Plugin (v2.3) ends here -->
";
	// cache check
	if($mainframe->getCfg('caching') && ($option=='com_frontpage' || $option=='')) {
		echo $header;
	} else {
		$mainframe->addCustomHeadTag($header);
	}
}
  
  // Start Tabs Replacement
  // index.php
  if($enable_tabs) {
  if(strpos($_SERVER['PHP_SELF'], "index.php")) {
   $b=1;
   if (preg_match_all("/{tab=.+?}{tab=.+?}|{tab=.+?}|{\/tabs}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) { 	
    foreach ($matches[0] as $match) {	
      if($b==1 && $match!="{/tabs}") {
    	$tabs[] = 1;
    	$b=2;
      }
      elseif($match=="{/tabs}"){
      	$tabs[]=3;
      	$b=1;
      }
      elseif(preg_match("/{tab=.+?}{tab=.+?}/", $match)){
      	$tabs[]=2;
      	$tabs[]=1;
      	$b=2;
      }
      else {
      	$tabs[]=2;
      }
    }
   }
   @reset($tabs);
   $tabscount = 0;
  if (preg_match_all("/{tab=.+?}|{\/tabs}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) {
    foreach ($matches[0] as $match) {
      if($tabs[$tabscount]==1) {
      	$match = str_replace("{tab=", "", $match);
        $match = str_replace("}", "", $match);
        $row->text = str_replace( "{tab=".$match."}", "
		<div class=\"jwts_tabber\" id=\"jwts_tab".$tabid."\"><div class=\"jwts_tabbertab\" title=\"".$match."\"><h2><a href=\"javascript:void(null);\" name=\"advtab\">".$match."</a></h2>", $row->text );        
        $tabid++;
      } elseif($tabs[$tabscount]==2) {
      	$match = str_replace("{tab=", "", $match);
        $match = str_replace("}", "", $match);
      	$row->text = str_replace( "{tab=".$match."}", "</div><div class=\"jwts_tabbertab\" title=\"".$match."\"><h2><a href=\"javascript:void(null);\" name=\"advtab\">".$match."</a></h2>", $row->text );
      } elseif($tabs[$tabscount]==3) {
      	$row->text = str_replace( "{/tabs}", "</div></div><div class=\"jwts_clr\"></div>", $row->text );
      }
      $tabscount++;
    }     
  }    	
  // index2.php
  } else {
   if (preg_match_all("/{tab=.+?}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) {
    foreach ($matches[0] as $match) {
      $match = str_replace("{tab=", "", $match);
      $match = str_replace("}", "", $match);
      $row->text = str_replace( "{tab=".$match."}", "</div><div><h3>".$match."</h3>", $row->text );
      $row->text = str_replace( "{/tabs}", "", $row->text );
    }     
   }   	
  }
  }
  // End Tabs Replacement
  
  // Start Slides Replacement
  // index.php
  if($enable_slides) {
  if(strpos($_SERVER['PHP_SELF'], "index.php")) {
   if (preg_match_all("/{slide=.+?}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) {
    foreach ($matches[0] as $match) {
      $match = str_replace("{slide=", "", $match);
      $match = str_replace("}", "", $match);
      $row->text = str_replace( "{slide=".$match."}", "<div class=\"jwts_title\"><div class=\"jwts_title_left\"><a href=\"javascript:void(null);\" title=\"Click to open!\" class=\"jwts_title_text\">".$match."</a></div></div><div class=\"jwts_slidewrapper\"><div>", $row->text );
      $row->text = str_replace( "{/slide}", "</div></div>", $row->text );
    }   
   }
  // index2.php 
  } else {
  if (preg_match_all("/{slide=.+?}/", $row->text, $matches, PREG_PATTERN_ORDER) > 0) {
    foreach ($matches[0] as $match) {
      $match = str_replace("{slide=", "", $match);
      $match = str_replace("}", "", $match);
      $row->text = str_replace( "{slide=".$match."}", "<h3> ".$match."</h3><div>", $row->text );
      $row->text = str_replace( "{/slide}", "</div>", $row->text );
    } 
   }  	
  }
  }
  // End Slides Replacement
}

?>



Locked

Return to “Third Party Testing for Joomla! 1.5”