Welcome Guest [Log In] [Register]
Search Members Calendar | Rules ZB Code Index IF Code Index
ZBCode
  • Navigation
  • ZBCode
  • Coding Resources
  • Code Requests
  • Completed Requests
  • [Completed] Pop up window from button in profile info
Hey, welcome to ZBCode, the premier coding forum for ZB. Here you fill find some of the best Invisionfree and Zetaboards Codes on the network! Unfortunately, you're sorta hovering around in guest mode at the moment; why not join in on the fun? Register an account and you can start accessing the wealth of resources we have available here. Enjoy your stay at ZBCode, and remember to tell all your friends about us; the more members, the more codes available. ;)

Interested in joining? Click here.


If you are already a member of ZBCode, feel free to login right here:

Username:   Password:
Locked Topic
[Completed] Pop up window from button in profile info
Tweet Topic Started: Oct 2 2009, 06:54 PM (272 Views)
thebawp Oct 2 2009, 06:54 PM Post #1


Posts:
100
Group:
Member
Member
#2,904
Joined:
May 2, 2009
Okay, well, I held off making this request initially because I had the misguided notion that I might be able to figure it out for myself. Seems I gave myself a little too much credit, but never mind!

Anyway, I will try to best describe what I'm after.

Say we have a user called Bob. I've created a profile page for Bob , called Bob. So the page address would essentially be http://s1.zetaboards.com/Myboardname/pages/Bob/.

What I would like the code to do is to append to the user profile field (not the user info) as a button (or a hyperlink at a push) which will say 'Roleplay Profile'. When I say button, I mean the type defined by <button> tags, not an image. This button/hyperlink should produce a pop up of the profile page I've already created called Bob (something like 400 by 400, but it'd be handy if I could specify the size myself somewhere in the code).

So, the way I see it, there'd be 2 variables in the code. The first would be the username which I would specify (as in the second code I linked to below), the second would be the profile webpage which again I could specify or just write as http://s1.zetaboards.com/Myboardname/pages/+variable1+ as this won't change.

I've looked through the code index, and also the completed requests forum and I guess the nearest codes to what I'm requesting would be eitherthis code here which adds a custom link into a profile field based on the user name or this code which adds information to the user info based on a few variables.

I'll try to sum it up. I want a button to appear in the user profile, on specified users, which will produce a pop up link to a page which is named after the user (and already created by the admin).

I hope I've explained clearly enough what I'd like, if I haven't, please let me know and I will try to elaborate.

Thanks for your time!


Offline Profile Goto Top
 
Reid Oct 2 2009, 09:39 PM Post #2
Member Avatar
What? The land of the free? Whoever told you that was your enemy.

Posts:
1,790
Group:
Distinguished Coder
Member
#148
Joined:
Jul 20, 2008
Easily doable. One question.. can you give me an exact location for this button to appear? A jQuery selector on where it should go would be great, like something like...
Code:
 
$("dl.user_profile").after("stuff");
would aid me immensely. If not, a screenshot with a box drawn will do as well.

Note: be sure to show me on a post where a user has some profile fields filled out so I can see exactly where you mean.
Edited by Reid, Oct 2 2009, 09:39 PM.
The Resource Board
Offline Profile Goto Top
 
thebawp Oct 2 2009, 10:12 PM Post #3


Posts:
100
Group:
Member
Member
#2,904
Joined:
May 2, 2009
Hi Reid, thanks for your reply. I was initially thinking that I would like it to appear at the top of the user profile, so in this case, above Gender? But that's not something that everyone is guaranteed to have.

Posted Image

Everyone who will have this code applied will have the Roleplay Alias field though. If I could have a button appear anywhere marked in red (the bottom of the box would be my least preferred option though) then that would be fantastic!
Offline Profile Goto Top
 
Reid Oct 2 2009, 10:41 PM Post #4
Member Avatar
What? The land of the free? Whoever told you that was your enemy.

Posts:
1,790
Group:
Distinguished Coder
Member
#148
Joined:
Jul 20, 2008
Cool - I'll do it tomorrow then. If I did the code now, let's just say it wouldn't turn out too pretty.
The Resource Board
Offline Profile Goto Top
 
thebawp Oct 2 2009, 10:42 PM Post #5


Posts:
100
Group:
Member
Member
#2,904
Joined:
May 2, 2009
Hehe, no problem - I really appreciate you picking this up! =)
Offline Profile Goto Top
 
Reid Oct 4 2009, 11:56 AM Post #6
Member Avatar
What? The land of the free? Whoever told you that was your enemy.

Posts:
1,790
Group:
Distinguished Coder
Member
#148
Joined:
Jul 20, 2008
Try something like this:
Code:
 
<script type='text/javascript'>
// <![CDATA[
var u_prof = [['Reid', 'reid'], ['thebawp','some_page']];
var size_of_window = [400, 400];
// and voila, your editing is over.
function pop_up(id) {
$("<table id='loading_t' style='position:fixed; top:45%; left:40%; display:none; width:25%; z-index:10000000' class='forums'><thead><tr><th colspan='3'>Please Wait</th></tr></thead><tbody><tr><td style='text-align:center'>Loading...</td></tr></tbody></table>").insertBefore('#main').fadeIn('slow');
$.get(main_url + 'pages/' + id, function(e) {
$('#loading_t').fadeOut(function() {
$(this).remove();
$("<table id='memb_prof' style='position:fixed; top:20%; left:40%; z-index:100000000; display:none; width:" + size_of_window[0] + "px; height:" + size_of_window[1] + "px' class='forums'><thead><tr><th colspan='3'><span style='float:right; cursor:pointer' id='close_that'><img src='http://z3.ifrm.com/2/81/0/p163666/close16.png' alt='[X]' /></span>Member Profile</th></tr></thead><tbody><tr><td>" + $.trim($('#main .site_wrapper:eq(0)', e).html()) + "</td></tr></tbody></table>").insertBefore('#main').fadeIn('slow');
$('#close_that').click(function() {
$('#memb_prof').fadeOut(function() {
$(this).remove();
});
});
});
});
}
if (location.href.indexOf('/topic')!=-1) {
$('dl.user_profile').each(function(){
var l = u_prof.length;
while (l--) {
if ($.trim($(this).parents('tr').prev().find('.c_username').text()).toLowerCase() == u_prof[l][0].toLowerCase()) {
$(this).find('dt:eq(0)').before("<dt><button type='button' onclick='pop_up(\"" + u_prof[l][1] + "\")'>Roleplay Profile</button></dt><dd></dd>");
break;
}
}
});
} else if (location.href.indexOf('/profile')!=-1) {
var l = u_prof.length, cur_n = $('#profile_menuwrap').next().text().toLowerCase();
while (l--) {
if (u_prof[l][0].toLowerCase() == cur_n) {
$('dl.user_profile dt:eq(0)').before("<dt><button type='button' onclick='pop_up(\"" + u_prof[l][1] + "\")'>Roleplay Profile</button></dt><dd></dd>");
break;
}
}
}
// ]]>
</script>
The two variables at the top are the ones that need editing. Simply follow the format there. It goes something like this:
Code:
 
var u_prof = [['USER NAME', 'PAGE ID'], ['ANOTHER USER NAME', 'ANOTHER PAGE ID']];
The second, size_of_window, is fairly self-explanatory. Its format is:
Code:
 
var size_of_window = [WIDTH, HEIGHT];
You may need to fiddle with the percentages in the style in the function pop_up, because centering a popup is an incredibly irritating process.

Also, stick it below the board for the fastest speed.

*Note: I was talking about the line that says
Code:
 
$("<table id='memb_prof
at the beginning. The percentages there may need editing depending on the size of your window.
The Resource Board
Offline Profile Goto Top
 
thebawp Oct 4 2009, 03:44 PM Post #7


Posts:
100
Group:
Member
Member
#2,904
Joined:
May 2, 2009
Hi, this is looking good so far but for 2 things:

One, the button is appearing where I'd like, but my additional custom profile fields are appearing to its right rather than below.

Two, the window doesn't contain anything when it's open.

http://s1.zetaboards.com/North_Castle_Test/topic/2330620/1/#new

Click thebawp's profile toggle button to see.

Code:
 


<script type='text/javascript'>
// <![CDATA[
var u_prof = [['bawpie', 'bawpie']];
var size_of_window = [400, 400];
// and voila, your editing is over.
function pop_up(id) {
$("<table id='loading_t' style='position:fixed; top:45%; left:40%; display:none; width:25%; z-index:10000000' class='forums'><thead><tr><th colspan='3'>Please Wait</th></tr></thead><tbody><tr><td style='text-align:center'>Loading...</td></tr></tbody></table>").insertBefore('#main').fadeIn('slow');
$.get(main_url + 'pages/' + id, function(e) {
$('#loading_t').fadeOut(function() {
$(this).remove();
$("<table id='memb_prof' style='position:fixed; top:20%; left:40%; z-index:100000000; display:none; width:" + size_of_window[0] + "px; height:" + size_of_window[1] + "px' class='forums'><thead><tr><th colspan='3'><span style='float:right; cursor:pointer' id='close_that'><img src='http://z3.ifrm.com/2/81/0/p163666/close16.png' alt='[X]' /></span>Member Profile</th></tr></thead><tbody><tr><td>" + $.trim($('#main .site_wrapper:eq(0)', e).html()) + "</td></tr></tbody></table>").insertBefore('#main').fadeIn('slow');
$('#close_that').click(function() {
$('#memb_prof').fadeOut(function() {
$(this).remove();
});
});
});
});
}
if (location.href.indexOf('/topic')!=-1) {
$('dl.user_profile').each(function(){
var l = u_prof.length;
while (l--) {
if ($.trim($(this).parents('tr').prev().find('.c_username').text()).toLowerCase() == u_prof[l][0].toLowerCase()) {
$(this).find('dt:eq(0)').before("<dt><button type='button' onclick='pop_up(\"" + u_prof[l][1] + "\")'>Roleplay Profile</button></dt><dd></dd>");
break;
}
}
});
} else if (location.href.indexOf('/profile')!=-1) {
var l = u_prof.length, cur_n = $('#profile_menuwrap').next().text().toLowerCase();
while (l--) {
if (u_prof[l][0].toLowerCase() == cur_n) {
$('dl.user_profile dt:eq(0)').before("<dt><button type='button' onclick='pop_up(\"" + u_prof[l][1] + "\")'>Roleplay Profile</button></dt><dd></dd>");
break;
}
}
}
// ]]>
</script>



Page info I want to show (not this exact page, but just an example for you)

http://s1.zetaboards.com/North_Castle_Test/pages/bawpie/

Otherwise, wow I'm impressed. This is actually far better than what I'd thought it could look like.

Thanks!
Offline Profile Goto Top
 
Reid Oct 4 2009, 05:53 PM Post #8
Member Avatar
What? The land of the free? Whoever told you that was your enemy.

Posts:
1,790
Group:
Distinguished Coder
Member
#148
Joined:
Jul 20, 2008
You have made me discover the oddest bug ever. Also the most irritating to fix. But anyways, try this code:
Code:
 
<script type='text/javascript'>
// <![CDATA[
var u_prof = [['bawpie', 'bawpie']];
var size_of_window = [900, 400];
// and voila, your editing is over.
function locate_main(stuff) {
var doc = $(stuff), l = doc.length;
while (l--) {
if (doc[l].id == 'main') {
return $(doc[l]);
}
}
}
function pop_up(id) {
$("<table id='loading_t' style='position:fixed; top:45%; left:40%; display:none; width:25%; z-index:10000000' class='forums'><thead><tr><th colspan='3'>Please Wait</th></tr></thead><tbody><tr><td style='text-align:center'>Loading...</td></tr></tbody></table>").insertBefore('#main').fadeIn('slow');
$.get(main_url + 'pages/' + id, function(e) {
$('#loading_t').fadeOut(function() {
$(this).remove();
$("<table id='memb_prof' style='position:fixed; top:10%; left:20%; z-index:100000000; display:none; width:" + size_of_window[0] + "px; height:" + size_of_window[1] + "px; overflow:auto' class='forums'><thead><tr><th colspan='3'><span style='float:right; cursor:pointer' id='close_that'><img src='http://z3.ifrm.com/2/81/0/p163666/close16.png' alt='[X]' /></span>Member Profile</th></tr></thead><tbody><tr><td><div style='height:" + size_of_window[1] + "px; overflow:auto'>" + $.trim(locate_main(e).find('.site_wrapper').html()) + "</div></td></tr></tbody></table>").insertBefore('#main').fadeIn('slow');
$('#close_that').click(function() {
$('#memb_prof').fadeOut(function() {
$(this).remove();
});
});
});
});
}
if (location.href.indexOf('/topic')!=-1) {
$('dl.user_profile').each(function(){
var l = u_prof.length;
while (l--) {
if ($.trim($(this).parents('tr').prev().find('.c_username').text()).toLowerCase() == u_prof[l][0].toLowerCase()) {
$(this).find('dd.spacer').before("<dt><button type='button' onclick='pop_up(\"" + u_prof[l][1] + "\")'>Roleplay Profile</button></dt><dd> </dd>");
break;
}
}
});
} else if (location.href.indexOf('/profile')!=-1) {
var l = u_prof.length, cur_n = $('#profile_menuwrap').next().text().toLowerCase();
while (l--) {
if (u_prof[l][0].toLowerCase() == cur_n) {
$('dl.user_profile dd.spacer').before("<dt><button type='button' onclick='pop_up(\"" + u_prof[l][1] + "\")'>Roleplay Profile</button></dt><dd> </dd>");
break;
}
}
}
// ]]>
</script>
The Resource Board
Offline Profile Goto Top
 
thebawp Oct 4 2009, 06:00 PM Post #9


Posts:
100
Group:
Member
Member
#2,904
Joined:
May 2, 2009
Ah, sorry to hear that! Still, it looks to be working perfectly now! The button is showing at the bottom of the roleplay profile field, but I can totally live with that.

You sir, are truly awesome! Thanks muchly!
Offline Profile Goto Top
 
Reid Oct 4 2009, 06:07 PM Post #10
Member Avatar
What? The land of the free? Whoever told you that was your enemy.

Posts:
1,790
Group:
Distinguished Coder
Member
#148
Joined:
Jul 20, 2008
I had to make it do that, unfortunately. Any other spot and the way the box layout around the button is would have stuck things strangely.

You're welcome.
See? We can read thoughts too. ;)

Your request has been completed, and we're moving it to the correct forum. We hope it works for you; if it doesn't, feel free to post another request topic in the requests forum. Just remember: read the rules first!

Thanks,
The ZBCode Staff
The Resource Board
Offline Profile Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Completed Requests · Next Topic »
Locked Topic

Track Topic · E-mail Topic Time: 2:27 PM Jul 11
Hosted for free by ZetaBoards · Privacy Policy