Problem with certain JS
4 posters
Page 1 of 1
Problem with certain JS
I followed a tutorial I saw on some forum which is supposed to result in IPB profiles, though the code isn't really working - could be on my end due to my lack of knowledge in JS.
The JS is divided into two separate scripts:
1st:
2nd:
Each is posted separately and marked 'All pages', then I add the CSS:
Though nothing really changes in the profiles page, the same standard advanced profile page still there.
It should result in something similar to this if it works: http://prntscr.com/cbn1t2
This is the forum i'm testing the code in: http://daskintest.forumarabia.com/
The JS is divided into two separate scripts:
1st:
- Code:
if(/\/?u(\d+)$/.test(location.pathname)) {
jQuery(document).ready(function(){if(jQuery('#profile-advanced-right').length){
var avataripb=jQuery('#profile-advanced-right .main-content.clearfix.center img:first-child').attr('src');
var tabsipb=jQuery('#profile-advanced-layout #profile-advanced-left #tabs').html();var infoipbge=jQuery('#profile-advanced-left #profile-advanced-details .middleline').html();
var listfriends=jQuery('.main-content.clearfix[style^="padding:0.3em;text-align:center;"]').html();
var prfiletoadd=jQuery('#profile-advanced-right #profile-advanced-add').html();
var usernameipb=jQuery('#profile-advanced-right .module.main:eq(0) .main-head .h3').text().split(' (conectado)').join('');var miregistro=jQuery('.middleline #field_id-4 dd div:eq(0)').html();
var monedas=jQuery('.middleline #field_id-13 dd div:eq(0)').html();
var reputipb=jQuery('.middleline #field_id-14 dd div:eq(0)').html();
var mid=jQuery('#profile-advanced-layout #tabs li:eq(3) a').attr('href').match(/[0-9]+/);
var onlineipb=jQuery('#profile-advanced-right .main-head:eq(0) .h3 em').text().replace(/[(]/gi,' ').replace(/[)]/gi,' ');
jQuery('#profile-advanced-right').after('<div class="ipb-profile">
<div class="nav-ipb-top"><span>Viewing Profile: <span id="useridhahs"> '+usernameipb+'</span></span></div>
<div class="mod-left">
<div class="profile-ava"><img id="ipd-avatar" src="'+avataripb +'" /> </div>
<div class="ipb-tab-us">'+tabsipb+'</div></div>
<div class="mod-center">
<div class="sub-panel-top"><div class="usernam-ipb">'+usernameipb+'</div>
<div class="register-date">Registered: '+miregistro+'</div>
<div class="ofline-ipb">Copyright©& nbsp; PunBB.biz & nbsp;& & nbsp; 15-Tronos</div>
<div class="lass-activiti"></div>
<div class="rating-profile">
<img src="http://i.imgur.com/jFLWgyz.png"/>
<img src="http://i.imgur.com/jFLWgyz.png"/>
<img src="http://i.imgur.com/jFLWgyz.png"/>
<img src="http://i.imgur.com/jFLWgyz.png"/>
<img src="http://i.imgur.com/jFLWgyz.png"/>
</div><div class="profi-add-ipb">'+prfiletoadd+'
<a id="men"href="/privmsg?mode=post&u='+mid+'">Send PM</a>
<a id="search-i"href="/spa/'+usernameipb+'">Search Posts</a>
</div>
</div>
<div class="main-info-ipb">
<div class="co-ipb" id="profile">
<div class="ipb-m-title">
<h2 id="wallcomment">Profile Comments</h2>
<h2 id="estadis">Profile Details</h2>
<h2 id="estadisgene"><span>Statistic</span></h2>
<h2 id="friends">Friends</h2>
<h2 id="contacto">Contact</h2></div>
<div class="mensajeprofile"></div>
<div class="m-info-ipb"><div class="in-ipb">'+infoipbge+'
<div class="contac-me-ipb"></div>
</div>
<div class="band-right">
<div class="repu-ipb"><span id="cs">'+monedas+'</span><div id="sub">Points</div></div>
<div class="coin-ipb"><span>'+reputipb+'</span><div iid="re-p"> Reputation</div></div>
<div class="module-ipb-right">
<h2>Friends</h2>
<div class="main-ipb-f">'+listfriends+'</div>
</div>
</div>
</div>
<div class="estadis-ipb"></div>
<div class="friends-ips"></div>
<div class="contact-ips"></div></div>
</div></div>
</div>');
}});
$(document).ready(function(){if(jQuery('#profile-advanced-right').length){
$('.estoyenline-i:contains("conectado") .ofline-ipb').attr('style','display:none;');
$('.estoyenline-i:contains("conectado")').attr('style','padding:0px 5px;');
var linkwall=jQuery('#tabs ul li a:eq(0)').attr('href');
jQuery(".mensajeprofile").load(linkwall+' #profile-advanced-details .main-content');
var linkestaipb=jQuery('#tabs ul li a:eq(2)').attr('href');
jQuery(".estadis-ipb").load(linkestaipb+' #profile-advanced-details .main-content');
jQuery(".lass-activiti").load(linkestaipb+' #profile-advanced-details .main-content.clearfix .stats-field.genmed ul li:contains("Última visita :")');
var linkfriendipb=jQuery('#tabs ul li a:eq(3)').attr('href');
jQuery(".friends-ips").load(linkfriendipb+' #profile-advanced-details .main-content');
var linkcontaipb=jQuery('#tabs ul li a:eq(4)').attr('href');
jQuery(".contact-ips").load(linkcontaipb+' #profile-advanced-details .main-content');
}});
$(document).ready(function(){if(jQuery('#profile-advanced-right').length){ // Script del Slider
$(".mensajeprofile, .estadis-ipb, .friends-ips, .contact-ips") . hide();
$('.m-info-ipb').addClass('activetab');
$(".ipb-tab-us ul li:eq(0)").click(function(e){
$('.ipb-tab-us li ,.co-ipb div').removeClass('activetab');
$(this).addClass('activetab');
$('.mensajeprofile').addClass('activetab').fadeToggle();
$('.estadis-ipb, .m-info-ipb, .friends-ips, .contact-ips') . hide('');
return false;
e.preventDefault();
});
$(".ipb-tab-us ul li:eq(1)").click(function(e){
$('.ipb-tab-us li ,.co-ipb div').removeClass('activetab');
$(this).addClass('activetab');
$('.m-info-ipb').addClass('activetab').fadeToggle();
$('.mensajeprofile, .estadis-ipb, .friends-ips, .contact-ips') . hide('');
return false;
e.preventDefault();
});
$(".ipb-tab-us ul li:eq(2)").click(function(e){
$('.ipb-tab-us li ,.co-ipb div').removeClass('activetab');
$(this).addClass('activetab');
$('.estadis-ipb').addClass('activetab').fadeToggle();
$('.mensajeprofile, .m-info-ipb, .friends-ips, .contact-ips') . hide('');
return false;
e.preventDefault();
});
$(".ipb-tab-us ul li:eq(3)").click(function(e){
$('.ipb-tab-us li ,.co-ipb div').removeClass('activetab');
$(this).addClass('activetab');
$('.friends-ips').addClass('activetab').fadeToggle();
$('.mensajeprofile, .m-info-ipb, .estadis-ipb, .contact-ips') . hide('');
return false;
e.preventDefault();
});
$(".ipb-tab-us ul li:eq(4)").click(function(e){
$('.ipb-tab-us li ,.co-ipb div').removeClass('activetab');
$(this).addClass('activetab');
$('.contact-ips').addClass('activetab').fadeToggle();
$('.mensajeprofile, .m-info-ipb, .estadis-ipb, .friends-ips') . hide('');
return false;
e.preventDefault();
});
}});
$(document).ready(function(){if(jQuery('#profile-advanced-right').length){
$(".ipb-tab-us ul li:first-child > a").click(function(e){$('.co-ipb').attr('id', 'profilewall');});
$(".ipb-tab-us ul li:first-child + li > a").click(function(e){$('.co-ipb').attr('id', 'profile');});
$(".ipb-tab-us ul li:first-child + li +li > a").click(function(e){$('.co-ipb').attr('id', 'estadisticas');});
$(".ipb-tab-us ul li:first-child + li +li +li > a").click(function(e){$('.co-ipb').attr('id', 'friends');});
$(".ipb-tab-us ul li:first-child + li +li + li +li > a").click(function(e){$('.co-ipb').attr('id', 'contacto');
});
}});
$(document).ready(function(){if(jQuery('#profile-advanced-right').length){jQuery('#profile-advanced-right').remove()};});
$(document).ready(function(){if(jQuery('#profile-advanced-layout').length){jQuery('#profile-advanced-layout').remove()};});
}
2nd:
- Code:
if(/\/?u(\d+)wall$/.test(location.pathname)) {
jQuery(document).ready(function(){if(jQuery('#profile-advanced-layout #tabs li a').length){
var nevoskin=jQuery('#profile-advanced-layout #tabs li:eq(1) a').attr('href');
window.location.href=nevoskin;
}})};
if(/\/?u(\d+)stats$/.test(location.pathname)) {
jQuery(document).ready(function(){if(jQuery('#profile-advanced-layout #tabs li a').length){
var nevoskin=jQuery('#profile-advanced-layout #tabs li:eq(1) a').attr('href');
window.location.href=nevoskin;
}})};
if(/\/?u(\d+)friends$/.test(location.pathname)) {
jQuery(document).ready(function(){if(jQuery('#profile-advanced-layout #tabs li a').length){
var nevoskin=jQuery('#profile-advanced-layout #tabs li:eq(1) a').attr('href');
window.location.href=nevoskin;
}})};
if(/\/?u(\d+)contact$/.test(location.pathname)) {
jQuery(document).ready(function(){if(jQuery('#profile-advanced-layout #tabs li a').length){
var nevoskin=jQuery('#profile-advanced-layout #tabs li:eq(1) a').attr('href');
window.location.href=nevoskin;
}})};
$("meta[http-equiv='refresh'][content]:first").each(function(){window.location.href=$(this).attr("content").replace(/^.*;url=/,"")});
Each is posted separately and marked 'All pages', then I add the CSS:
- Code:
/*ipbperfilcss*/
.usernam-ipb ,.usernam-ipb span {
color: #7A7A7A!important;
font-size: 20px!important;
font-weight: bold!important;
line-height: 1.7!important;
}
.usernam-ipb em {
display: none!important;
}
.ipb-profile .mod-left {
width: 150px;
margin-left: -150px;
float: left;
}
.ipb-profile {
background: #EBF0F3;
padding: 9px;
clear: both;
padding-left: 188px;
overflow: hidden;
color: #5A5A5A;
font-family: helvetica, arial, sans-serif!important;
font-size: 11px;
}
.mod-center {
width: 98%;
float: left;
background: #FFF;
border: 1px solid #E4E4E4;
padding: 9px;
position: relative;
margin: auto;
}
.ipb-m-title h2 {
padding: 8px 10px; background: #F5F5F5; color: #868686; font-size: 11px; margin: 0;
font-weight: bold;
font-family: helvetica!important;
display:none;}
.co-ipb {
background: #FFF;
margin-bottom: 10px;
border: 1px solid #DDD;
margin: 5px;
min-height: 600px;
}
.ipb-profile dt, .ipb-profile dt span {
color: #5A5A5A!important;
font-weight: bold!important;
}
.m-info-ipb dt {
display: inline-block;
width: 200px;
text-align: right;
padding-right: 10px;
}
.m-info-ipb dd {
display: inline-block;
width: 350px;
}
.profi-add-ipb a.mainmenu + br + a.mainmenu ,.main-ipb-f .clear ,.m-info-ipb .separator {
display: none;
}
.m-info-ipb dl {
line-height: 1.3; font-size: 11px; background: #FEFEFE; border: 1px solid #EEE; padding: 8px; border-left: 0; border-right: 0; margin-bottom: -1px;
}
.ipb-tab-us ul li a span {
display: block; padding: 10px 8px; outline: 0; font-size: 11px; color: #8D8D8D; -webkit-transition: background-color 0.1s ease-in-out; -moz-transition: background-color 0.3s ease-in-out;
}
.ipb-tab-us ul li {
background: #F6F8FB;
color: #808080;
border-bottom: 1px solid #DBE4EF; font-size: 13px;
}
.ipb-tab-us ul li :hover {
background: #EAEFF5;
color: #808080;
}
.ipb-tab-us {
width: 149px !important; margin-top: 10px; border-top: 1px solid #DBE4EF;
border-left: 1px solid #DBE4EF;
}
.ipb-profile li ,.ipb-tab-us ul {
list-style: none;
}
.ipb-tab-us ul li.activetab {
background: white;
width: 150px;
position: relative;
z-index: 9;}
.profile-ava img {
background: #FFF; padding: 1px; border: 1px solid #D3D3D3; max-width: 138px; max-height: 138px;
}
.estoyenline-i {
background: #7BA60D;
}
.ofline-ipb {
background: #B3B3B3;
padding: 0 5px;}
.estoyenline-i, .ofline-ipb{
display: inline-block;
height: 17px;
line-height: 17px;
font-size: 9px;
font-weight: bold;
text-transform: uppercase;
color: #FFF;
border-radius: 2px;
vertical-align: middle;
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.22);
}
.pun .co-ipb .main-content {
background: #FFF;
border: 0;
}
.co-ipb#friends ol li {
padding: 8px 0 0 0;
margin: 5px 0 0 0;
min-width: 80px;
height: 70px;
list-style: none;
width: 100px;
display: inline-table;
text-align: center;
}
.co-ipb#friends ol li .avatar {
display: block;
border: 0;
background: 0;
text-align: center;
width: 100%;
}
#friends ol li .message-text ,.co-ipb#friends .message-footer li {
display: none;
}
.co-ipb ol li .avatar img:hover {
border-color: #7D7D7D;
}
.co-ipb ol li .avatar img {
background: #FFF;
padding: 1px;
border: 1px solid #D3D3D3;
height: 50px;
width: 50px;
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);}
#contacto h2#contacto ,#profilewall #wallcomment ,#friends h2#friends ,#estadisticas #estadisgene, .co-ipb #estadis {
display: block;
}
#estadisticas h2#estadis ,#contacto h2#estadis ,.co-ipb#profilewall h2#estadis ,.co-ipb#friends h2#estadis {
display: none;
}
#estadisticas .m-info-ipb ul li {
line-height: 1.3; font-size: 11px; background: #FEFEFE; border: 1px solid #EEE; padding: 8px; border-left: 0; border-right: 0; margin-bottom: -1px;
}
#estadisticas fieldset legend {
font-size: 13px;
font-weight: bold;
width: 100%;
font: bold 14px helvetica,arial,sans-serif;
padding: 8px 10px;
color: #204066;
background: #D8DDE8;
}
.co-ipb#contacto .contact-ips ,#profilewall .main-content ,#estadisticas .main-content {
background: #EBF0F3;
padding: 9px;
}
#estadisticas .main-content .stats-field.genmed {
overflow: hidden;
margin-bottom: 24px;
background: #FFF;
}
#estadisticas .main-content .stats-field.genmed ul {
padding: 9px;
border: 1px solid #DBE4EF;
}
.co-ipb#contacto h2#contacto ,#wallcomment ,#estadisgene {
background: #2C5687 url(http://i.imgur.com/Lcy9BkS.png) repeat-x top;
color: #FFF; padding: 10px 10px 11px; border-radius: 4px 4px 0 0;
box-shadow: inset 0px 1px 0 #528CBC; border-width: 1px 1px 0 1px;
border-color: #316897;
border-style: solid; font-size: 11px;
text-shadow: none;
}
#profilewall ,#estadisticas {
border-radius: 4px 4px 0 0;
border: none;
}
.pun .co-ipb a {
color: #225985;
}
.pun .co-ipb a:hover {
color: #328586;
}
.co-ipb#friends ol li .avatar img:hover {
border-color: #7D7D7D;
}
#estadisticas .m-info-ipb {
border: 1px solid #DDD;
}
#estadisgene span {
background: #244156; opacity: 1;
color: #FFF; padding: 4px 10px; font-weight: bold; border-radius: 10px; box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.2);
}£panda_selector_1472468033558_90_m_panda£{display:none;}
.mensajeprofile ol li.clearfix {
background: #FFF; border: 1px solid #DBE4EF;
padding: 9px;
margin-bottom: 9px;
position: relative;
}
.mensajeprofile .avatar {
border: 0;
background: 0;
display: inline;
float: left;
}
.mensajeprofile ol li .message-block {
overflow: hidden;
margin-left: 65px;
padding: 0;
}
.mensajeprofile ol li .message-block .message-header a {
font-weight: bold; font-size: 14px;
}
.mensajeprofile .message-date {
position: absolute;
bottom: 5px;
color: #A4A4A4; font-size: 12px;
background: transparent url("http://i.imgur.com/8WDJvOf.png") no-repeat left;
padding-left: 20px;
}
.mensajeprofile .message-text {
margin: 5px 0;
font-size: 14px; word-wrap: break-word;
}
#profilewall .message-footer {
float: right;
}
#profilewall .message-footer li {
display: inline;
margin-right: 10px;
}
.co-ipb .pagination b {
background: #7BA60D; color: #FFF; font-weight: bold; border-radius: 2px;
padding: 4px 5px;
}
.co-ipb .pagination a {
display: inline-block; color: #999;
background: none;
padding: 4px 5px;
}
.co-ipb .pagination a:hover {
background: #ECECEC; border-radius: 2px;
}
.co-ipb .pagination {
background: white;
border-radius: 5px 5px 0 0;
padding: 4px 10px;
}
#friends .message-header em {
display: block;
}
h2#friends {
font: normal 14px helvetica,arial,sans-serif;
padding: 8px 10px;
background: #DBE2EC;
color: #204066;
}
.co-ipb#contacto ,.co-ipb#friends {
border: 0;
}
.contact-ips dl dt {
display: inline-block;
width: 140px;
text-align: right;
}
.contact-ips dl dd {
width: 600px;
display: inline-block;
padding-left: 10px;
vertical-align: middle;
}
.lass-activiti {
display: inline-block;
margin-left: 10px;color: #C4C4C4;
}
.coin-ipb span {
font-size: 20px; font-weight: bold; display: block;
}
.coin-ipb #sub {
text-align: center; font-weight: normal;
}
.coin-ipb {
float: none; margin: 0 0 5px 0;
padding: 10px; text-align: center; font-weight: normal; display: block;
background: #80B700;
border-radius: 3px;
color: white;font-size: 13px;
}
.repu-ipb {
background: #DEDEDE; color: #6E6E6E;
float: none; margin: 0 0 5px 0; padding: 10px; text-align: center; font-weight: normal; display: block; border-radius: 3px;
font-size: 13px;
}
.repu-ipb span {
font-size: 20px; font-weight: bold; display: block;
}
.band-right {
margin-left: 612px;
top: -35px;
position: relative;
}
.co-ipb#profile {
border: 0;
}
.co-ipb#profile .in-ipb {
width: 600px;
border: 1px solid #EEE;
float: left;
border-top: 0;
}
h2#estadis {
width: 580px;
font: normal 14px helvetica, arial, sans-serif; padding: 8px 10px;
background: #DBE2EC; color: #204066;
border: 1px solid #DBE2EC;
}
.module-ipb-right h2 {
font: normal 14px helvetica, arial, sans-serif; padding: 8px 10px; background: #DBE2EC; color: #204066;
}
.main-ipb-f {
padding: 9px;
}
.main-ipb-f .clear + a.mainmenu {
display: block;
text-align: center;
}
.main-ipb-f .friend-block {
display: inline-block;
float: none;
}
.main-ipb-f .avatar img {
padding: 1px; border: 1px solid #D5D5D5; background: #FFF; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
.main-ipb-f .avatar {
border: 0;
background: none;
width: auto;
}
.main-ipb-f div.clear + a.mainmenu[href^="/u"], non.main-ipb-f .friend_list_online_status img {
display: none;
}
.profi-add-ipb a#search-i {
background: #E6E6E6 url("http://i.imgur.com/tS9vehw.png") no-repeat 5px;
}
.rating-profile {
margin: 10px 0 20px 0;
}
.register-date {
margin-bottom: 10px;
font: normal 13px helvetica,arial,sans-serif;
}
.profi-add-ipb {
position: absolute;
right: 30px;
top: 95px;
color: rgba(0, 0, 0, 0);
}
.profi-add-ipb br {
display: none;
}
.pun .profi-add-ipb a {
display: inline-block;
background: #E6E6E6 url("http://i.imgur.com/5MlMsua.png") no-repeat 5px;
height: 17px;
line-height: 17px;
padding: 2px 2px 2px 25px;
border: 1px solid rgb(207, 207, 207);
box-shadow: 0px 7px 21px rgba(255, 255, 255, 0.76) inset, 0px 1px 0px rgba(0, 0, 0, 0.41); border-radius: 3px; color: #616161; white-space: nowrap; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out;
margin-right: 15px;font-size: 12px;
}
.pun .profi-add-ipb a:hover {
border: 1px solid #A0A0A0;
}
.pun .profi-add-ipb a#men {
background: #E6E6E6 url("http://i.imgur.com/LE1LFBD.png") no-repeat 5px;
}
.pun .nav-ipb-top a {
color: rgb(85, 85, 85);
}
.nav-ipb-top {
position: relative;
margin-left: -140px;
margin-bottom: 10px;
}
.nav-ipb-top span {
margin: 0 5px;
}
.mod-center {
padding-bottom: 50px;
}
#word-link {
position: absolute;
bottom: 19px;
right: 26px;
z-index: 999!important;
color: #777;
font: normal 9px helvetica;
text-align: right;
}
.co-ipb div.activetab {
display: block!important;
}£panda_selector_1472468033558_188_m_panda£{opacity: 1!important;}
Though nothing really changes in the profiles page, the same standard advanced profile page still there.
It should result in something similar to this if it works: http://prntscr.com/cbn1t2
This is the forum i'm testing the code in: http://daskintest.forumarabia.com/
- Spoiler:
( rights reserved to the original owner, not trying to take any sort of credit here, you can find the original tutorial here: http://www.punbb.biz/t316-javascript-ipb-profile-v2-20022014-jq1-9-1 )
Re: Problem with certain JS
If that tutorial is the one I know, it was created by JPScript. He has stated that he does not support anymore because of copyright issues.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Problem with certain JS
@SLGray Not sure I'm following, the code doesn't work? or is there some parts of the code that have simply been disabled? Forgive my lack of experience in this field.
If either are true, is there any other tutorial that would produce similar result?
If either are true, is there any other tutorial that would produce similar result?
Re: Problem with certain JS
I think as there was a copy right problem this code was changed and there for no longer works.
Re: Problem with certain JS
The copyright issue deals with the official IPB software makers.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Similar topics
» Founder: Kind of a password problem, mostly an e-mail problem
» signature problem and editor problem
» Log in problem
» SSL problem
» CSS problem
» signature problem and editor problem
» Log in problem
» SSL problem
» CSS problem
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum