need a mod to the sidepanel script

**oldmanInAz** · 06-19-2012, 08:31 PM

Ajax Side Panel Script

http://www.dynamicdrive.com/dynamici...xsidepanel.htm

This really is a slick scrip and would like to use it on my site.
However, I'm running into some problems because the way the script is written, you must have one file page for each item.

What I need is to have a number of uniquely ID'd divisions on the same page and then the script calls those items.

That way I don't have to write and load up several thousand little files.
Corrections can be done easily edited on one page rather than across two or three.

I'd even be willing to pay someone to write the mod.

For a working model see this page
http://mroldies.net/Jan-4-1960.html

**ddadmin** · 06-20-2012, 07:16 AM

Try the below modified .js file, which lets you divvy up the contents of an Ajax page into various parts, by wrapping each part in a DIV with a unique ID, for example:

Code:

<div id="page1">
Page 1 contents
</div>

<div id="page2">
Page 1 contents
</div>

<div id="page3">
Page 1 contents
</div>

Then, on your main page that loads the Ajax Panel script, to define a link that when clicked on loads a particular section within the Ajax page, add a URL parameter like so:

Code:

<li><a href="index.html?id=page1" rel="ajaxpanel">My Home Page</a> (internal link, auto loads using Ajax)</li>

The parameter to add is ?id=divid, where "divid" is the ID of the DIV within the external file to show (with the rest of the page's contents discarded).

**oldmanInAz** · 06-20-2012, 06:25 PM

Thanks. I will give it a try.

**oldmanInAz** · 06-21-2012, 01:40 AM

Ajax sidepanel script

http://www.dynamicdrive.com/dynamici...xsidepanel.htm

http://mroldies.net/test1960.html
http://mroldies.net/list1960.html

As I also want to use the word press flash audio player, for some unknown reason it is not being activated when used with sidepanel.
I have the audioplayer script active on both pages just to make sure one will work.

When you open the second page by itself, you will see the audioplayer does function properly.

Something in the sidepanel script is not allowing the other script to work.
I really do want to use this script on the site. With the mod you made, that will save me from having to write thousands of little files.

Thanks for the mod. Greatly appreciated.

**jscheuer1** · 06-21-2012, 06:29 AM

I had this worked out. Why didn't you continue our thread:

http://www.dynamicdrive.com/forums/s...876#post275876

?

Anyways, I made up this modified version of the script:

ddajaxsidepanel.js

In addition to allowing you to call a specific div or whatever via its id or other selector(s), it also allows for some import of javascript. But the main audio script still needs to be in the head of the 'top' page.

So for example, in the head of my 'top' page I have:

Code:

<link rel="stylesheet" type="text/css" href="ddajaxsidepanel.css" />
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script src="ddajaxsidepanel.js">

/***********************************************
* Ajax Side Panel script- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

</script>
<script type="text/javascript" src="http://1littleworld.net/test/1960/js/audio-player.js"></script>

Then for the link to the content:

Code:

<li><a href="table_h.htm #table_1" rel="ajaxpanel">El Paso</a></li>

Don't miss the space between the page filename and the # symbol.

table_h.htm (some tables removed so the code could fit in the post):

Code:

<html>

<head>

            <script type="text/javascript" src="http://1littleworld.net/test/1960/js/audio-player.js"></script>  
            <script type="text/javascript">  
                AudioPlayer.setup("http://1littleworld.net/test/1960/player/player.swf", {  
                    width: 350,
                initialvolume: 100						  
                });  
            </script>  

</head>

<body>

<div id="table_0">

<h2>Welcome to 1960</h2>

Click the MORE button to find out more information.<br/>
Such as a weekly progress chart and even listen to the tunes.<br/>

</div>

<table id="table_1">
<tr><td colspan="2">Marty Robbins
<p>El Paso</p>
<p id="audioplayer_1a">Alternative content</p>  
        <script type="text/javascript">  
        AudioPlayer.embed("audioplayer_1a", {soundFile: "http://1littleworld.net/test/1960/mp3/Robbins el paso.mp3"});  
        </script>  

<p>Running Gun</p>		  
<p id="audioplayer_1b">Alternative content</p>  
        <script type="text/javascript">  
        AudioPlayer.embed("audioplayer_1b", {soundFile: "http://1littleworld.net/test/1960/mp3/Robbins running gun.mp3"});  
        </script>  
		  

		  
</td></tr>
<tr><td>Dec 7</td><td></td></tr>
<tr><td>Dec 14</td><td></td></tr>
<tr><td>Dec 21</td><td></td></tr>
<tr><td>Dec 28</td><td></td></tr>
<tr><td>Jan 4 1960</td><td></td></tr>
<tr><td>Jan 11</td><td></td></tr>
<tr><td>Jan 18</td><td></td></tr>
<tr><td>Jan 25</td><td></td></tr>
<tr><td>Feb 1</td><td></td></tr>
<tr><td>Feb 8</td><td></td></tr>
<tr><td>Feb 15</td><td></td></tr>
<tr><td>Feb 22</td><td></td></tr>
<tr><td>Feb 29</td><td></td></tr>
<tr><td>March 7</td><td></td></tr>
<tr><td>March 14</td><td></td></tr>
<tr><td>March 21</td><td></td></tr>
<tr><td>March 28</td><td></td></tr>
<tr><td>April 4</td><td></td></tr>
<tr><td>April 11</td><td></td></tr>
<tr><td>April 18</td><td></td></tr>
<tr><td>April 25</td><td></td></tr>


</table>

<table id="table_2">

<tr><td>Dec 7</td><td></td></tr>
<tr><td>Dec 14</td><td></td></tr>
<tr><td>Dec 21</td><td></td></tr>
<tr><td>Dec 28</td><td></td></tr>
<tr><td>Jan 4 1960</td><td></td></tr>
<tr><td>Jan 11</td><td></td></tr>
<tr><td>Jan 18</td><td></td></tr>
<tr><td>Jan 25</td><td></td></tr> . . . 

 . . . <td></td></tr>
<tr><td>March 28</td><td></td></tr>
<tr><td>April 4</td><td></td></tr>
<tr><td>April 11</td><td></td></tr>
<tr><td>April 18</td><td></td></tr>
<tr><td>April 25</td><td></td></tr>


</table>

<table id="table_10">

<tr><td>Dec 7</td><td></td></tr>
<tr><td>Dec 14</td><td></td></tr>
<tr><td>Dec 21</td><td></td></tr>
<tr><td>Dec 28</td><td></td></tr>
<tr><td>Jan 4 1960</td><td></td></tr>
<tr><td>Jan 11</td><td></td></tr>
<tr><td>Jan 18</td><td></td></tr>
<tr><td>Jan 25</td><td></td></tr>
<tr><td>Feb 1</td><td></td></tr>
<tr><td>Feb 8</td><td></td></tr>
<tr><td>Feb 15</td><td></td></tr>
<tr><td>Feb 22</td><td></td></tr>
<tr><td>Feb 29</td><td></td></tr>
<tr><td>March 7</td><td></td></tr>
<tr><td>March 14</td><td></td></tr>
<tr><td>March 21</td><td></td></tr>
<tr><td>March 28</td><td></td></tr>
<tr><td>April 4</td><td></td></tr>
<tr><td>April 11</td><td></td></tr>
<tr><td>April 18</td><td></td></tr>
<tr><td>April 25</td><td></td></tr>


</table>

</body>

</html>

Here's a demo:

http://home.comcast.net/~jscheuer1/s...ajax-panel.htm

And another using your more recent setup:

http://home.comcast.net/~jscheuer1/s.../1960-test.htm

**oldmanInAz** · 06-21-2012, 03:08 PM

Again, I thank you royally kind sir.
This will allow me to have all of my information on just a few pages rather than on thousands.
May I strongly suggest you post the new version to DD's site so that others can thoroughly appreciate the work?

**oldmanInAz** · 06-21-2012, 03:52 PM

I trust I'm not ticking you off to much over this. But I have run into another problem.
I want to add an image to show above the audioplayer. But for some reason, only the audioplayer is shown. Regardless of where the image tag is located or where the image itself is.

**jscheuer1** · 06-21-2012, 04:16 PM

Well it of course would need to be in the target div. As long as it is, try using the absolute path to it.

I tried looking at your demo 1960list.htm again, but there's still only the one image in it. On my demo, that one image shows fine when requested.

If you're still having problems, put up a demo of it that I can see.

**oldmanInAz** · 06-21-2012, 04:22 PM

if it is a matter of a space issue, that's no big deal for me. I use Liberty Basic to make short work of hand coding a hundred lines of code. So changing a space to an underscore is nothing. The headache comes in renaming the MP3's. Those I have to do by hand.

**oldmanInAz** · 06-21-2012, 04:44 PM

You are right. It is a space in the name issue. changing the space to a - and it works fine.
Try my original site again and you will see that it works.

http://mroldies.net/test1960.html

Thread: need a mod to the sidepanel script

Thread Tools

Search Thread

need a mod to the sidepanel script

Modified sidepanel works fine except for one snag

Bookmarks

Bookmarks

Posting Permissions