Reply to thread

Message

<blockquote data-quote="leenster" data-source="post: 140692" data-attributes="member: 10665">Have you ever wanted to add some features to your client? Like a Bot shop or something like that?&nbsp;Well read this tutorial and you will know how to do it.&nbsp;First ill show you a screen shot:<img src="http://hubbahubba.no-ip.biz/downloads/extendswf.png" alt="" class="fr-fic fr-dii fr-draggable " style="" />The new box is completely draggable just like the other boxes in your swf.&nbsp;&nbsp;I know.... pretty sweet huh?&nbsp;Ok lets see how its done (it's easy).&nbsp;What we are going to do is just overlay some stuff over your swf and to your visitors it will look like it is all part of the client.&nbsp;Ok lets get started.&nbsp;Make sure this parameter is in your list of parameter for your habbo.swf[PHP]params[&quot;wmode&quot;] = &quot;transparent&quot;;[/PHP]&nbsp;First add these lines to your client. make sure it is before the &lt;/header&gt; tag.[PHP]&lt;style&gt;.menu{position:fixed;bottom:45px;left:15px;z-index: 1005 !important;color:#FFF;cursor:pointer;}.button{float:left;padding:3px;margin-right:3px;}#addedcontent{position:fixed;top:5px;left:300px;max-width:400px;min-width:150px;z-index: 1006 !important;}#b-header{cursor:default;padding:5px;text-align:center;background-color:#568BA4;font-size:13px;font-weight:bold;-moz-border-radius: 5px 5px 0px 0px;border-radius: 5px 5px 0px 0px;border:2px solid #66A2BE;border-bottom: 1px solid #000;height:19px;line-height:19px;}#b-content{padding:5px;background-color:#E9E9E1;-moz-border-radius: 0px 0px 5px 5px;border-radius: 0px 0px 5px 5px;color:#000;}#close-button{position:absolute;right:5px;top:7px;width:19px;height:20px;background-image:url('images/buttons/close.png');background-repeat:no-repeat;cursor:pointer;background-position:right top;}#close-button:hover{background-repeat:no-repeat;&nbsp;background-position:left top;}@font-face{font-family: Ubuntu-C;src: url('Ubuntu-C.ttf');}&nbsp;body{font-size: 12px;font-family:Ubuntu-C;}&lt;/style&gt;&nbsp;&lt;link href=&quot;http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;/&gt;&lt;script src=&quot;http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js&quot;&gt;&lt;/script&gt;&lt;script src=&quot;http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js&quot;&gt;&lt;/script&gt;&nbsp;&lt;script&gt;&nbsp; $(document).ready(function() {&nbsp; &nbsp; $(&quot;#addedcontent&quot;).draggable();$(&quot;#addedcontent&quot;).hide();&nbsp; });&nbsp; function loadpage(page,title)&nbsp; {$(&quot;#b-header&quot;).html(title + '&lt;div id=&quot;close-button&quot; onclick=&quot;$(\'#addedcontent\').hide();&quot;&gt;&lt;/div&gt;');&nbsp;$('#b-content').load(&quot;addedcontent/&quot;+page+&quot;.php&quot;, function(){$(&quot;#addedcontent&quot;).show();});&nbsp; }&lt;/script&gt;&nbsp;[/PHP]&nbsp;&nbsp;Now after your &lt;body&gt; tag paste the following code.[PHP]&lt;div class=&quot;menu&quot;&gt;&lt;div class=&quot;button&quot; onclick=&quot;loadpage('bots','Bot Creator');&quot;&gt;Create Bot&lt;/div&gt;&lt;div class=&quot;button&quot; onclick=&quot;loadpage('coins','Buy Coins');&quot;&gt;Buy Coins&lt;/div&gt;&lt;div class=&quot;button&quot; onclick=&quot;loadpage('badgeshop','Badge Shop');&quot;&gt;Badge Shop&lt;/div&gt;&lt;/div&gt;&lt;div id=&quot;addedcontent&quot;&gt;&lt;div id=&quot;b-header&quot;&gt;header&nbsp;&lt;/div&gt;&lt;div id=&quot;b-content&quot;&gt;content&lt;/div&gt;&lt;/div&gt;[/PHP]&nbsp;Save this image <img src="http://hubbahubba.no-ip.biz/images/buttons/close.png" alt="" class="fr-fic fr-dii fr-draggable " style="" /> somewhere and adjust this css code to point to the right location.[PHP]#close-button{position:absolute;right:5px;top:7px;width:19px;height:20px;background-image:url('images/buttons/close.png');background-repeat:no-repeat;cursor:pointer;background-position:right top;}[/PHP]&nbsp;Download the Ubuntu font <a href="http://hubbahubba.no-ip.biz/downloads/Ubuntu-C.rar" target="_blank">here </a>and put it in the root of your site (or where ever you want it, just edit the css ).&nbsp;Also create a folder in your root called AddedContent. This is where the extra content will be stored.&nbsp;&nbsp;Basically you are done.....&nbsp;To create content Just create a PHP file in your AddedContent folder. e.g. AddedContent/bots.php&nbsp;To create a link to your file just add a line like this[PHP]&lt;div class=&quot;button&quot; onclick=&quot;loadpage('bots','Bot Creator');&quot;&gt;Create Bot&lt;/div&gt;[/PHP]loadpage('bots //this is the name of the PHP file, do not add .PHP//','Bot Creator //This is the title that will be shown in the header of the box//');&nbsp;&nbsp;If you dont like the location of the menu bar then just edit the CSS:[PHP].menu{position:fixed;bottom:45px;left:15px;z-index: 1005 !important;color:#FFF;cursor:pointer;}[/PHP]&nbsp;If you want to edit the look of the buttons then edit this css:[PHP].button{float:left;padding:3px;margin-right:3px;}[/PHP]&nbsp;&nbsp;&nbsp;If you make a form, for example then just use JQUERY to submit it.&nbsp;&nbsp;Like this example:[PHP]$(function() { &nbsp; $(&quot;.button&quot;).click(function() { &nbsp; &nbsp; // validate and process form here var dataString = 'name='+ name + '&amp;id=' + id + '&amp;look=' + look; //just an example$.ajax({ type: &quot;POST&quot;, url: &quot;bin/process.php&quot;, data: dataString, success: function() { //Completed hide the Box$(&quot;#addedcontent&quot;).hide();} });&nbsp; }); });[/PHP]&nbsp;&nbsp;&nbsp;Hopefully you guys will be nice enough to share your creations.</blockquote>

[QUOTE="leenster, post: 140692, member: 10665"] Have you ever wanted to add some features to your client? Like a Bot shop or something like that? Well read this tutorial and you will know how to do it. First ill show you a screen shot: [IMG]http://hubbahubba.no-ip.biz/downloads/extendswf.png[/IMG] The new box is completely draggable just like the other boxes in your swf. I know.... pretty sweet huh? Ok lets see how its done (it's easy). What we are going to do is just overlay some stuff over your swf and to your visitors it will look like it is all part of the client. Ok lets get started. Make sure this parameter is in your list of parameter for your habbo.swf [PHP]params["wmode"] = "transparent";[/PHP] First add these lines to your client. make sure it is before the </header> tag. [PHP] <style> .menu { position:fixed; bottom:45px; left:15px; z-index: 1005 !important; color:#FFF; cursor:pointer; } .button { float:left; padding:3px; margin-right:3px; } #addedcontent { position:fixed; top:5px; left:300px; max-width:400px; min-width:150px; z-index: 1006 !important; } #b-header { cursor:default; padding:5px; text-align:center; background-color:#568BA4; font-size:13px; font-weight:bold; -moz-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; border:2px solid #66A2BE; border-bottom: 1px solid #000; height:19px; line-height:19px; } #b-content { padding:5px; background-color:#E9E9E1; -moz-border-radius: 0px 0px 5px 5px; border-radius: 0px 0px 5px 5px; color:#000; } #close-button { position:absolute; right:5px; top:7px; width:19px; height:20px; background-image:url('images/buttons/close.png'); background-repeat:no-repeat; cursor:pointer; background-position:right top; } #close-button:hover { background-repeat:no-repeat; background-position:left top; } @font-face { font-family: Ubuntu-C; src: url('Ubuntu-C.ttf'); } body { font-size: 12px; font-family:Ubuntu-C; } </style> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script> $(document).ready(function() { $("#addedcontent").draggable(); $("#addedcontent").hide(); }); function loadpage(page,title) { $("#b-header").html(title + '<div id="close-button" onclick="$(\'#addedcontent\').hide();"></div>'); $('#b-content').load("addedcontent/"+page+".php", function() { $("#addedcontent").show(); }); } </script> [/PHP] Now after your <body> tag paste the following code. [PHP] <div class="menu"> <div class="button" onclick="loadpage('bots','Bot Creator');">Create Bot</div> <div class="button" onclick="loadpage('coins','Buy Coins');">Buy Coins</div> <div class="button" onclick="loadpage('badgeshop','Badge Shop');">Badge Shop</div> </div> <div id="addedcontent"> <div id="b-header"> header </div> <div id="b-content"> content </div> </div> [/PHP] Save this image [IMG]http://hubbahubba.no-ip.biz/images/buttons/close.png[/IMG] somewhere and adjust this css code to point to the right location. [PHP]#close-button { position:absolute; right:5px; top:7px; width:19px; height:20px; background-image:url('images/buttons/close.png'); background-repeat:no-repeat; cursor:pointer; background-position:right top; }[/PHP] Download the Ubuntu font [URL='http://hubbahubba.no-ip.biz/downloads/Ubuntu-C.rar']here [/URL]and put it in the root of your site (or where ever you want it, just edit the css ). Also create a folder in your root called AddedContent. This is where the extra content will be stored. Basically you are done..... To create content Just create a PHP file in your AddedContent folder. e.g. AddedContent/bots.php To create a link to your file just add a line like this [PHP] <div class="button" onclick="loadpage('bots','Bot Creator');">Create Bot</div> [/PHP] loadpage('bots [COLOR=#808080][I]//this is the name of the PHP file, do not add .PHP//[/I][/COLOR]','Bot Creator[COLOR=#808080][I] //This is the title that will be shown in the header of the box//'[/I][/COLOR]); If you dont like the location of the menu bar then just edit the CSS: [PHP] .menu { position:fixed; bottom:45px; left:15px; z-index: 1005 !important; color:#FFF; cursor:pointer; } [/PHP] If you want to edit the look of the buttons then edit this css: [PHP].button { float:left; padding:3px; margin-right:3px; } [/PHP] If you make a form, for example then just use JQUERY to submit it. Like this example: [PHP] $(function() { $(".button").click(function() { // validate and process form here var dataString = 'name='+ name + '&id=' + id + '&look=' + look; //just an example $.ajax({ type: "POST", url: "bin/process.php", data: dataString, success: function() { //Completed hide the Box $("#addedcontent").hide(); } }); }); }); [/PHP] Hopefully you guys will be nice enough to share your creations. [/QUOTE]

Verification

Reply to thread

Connect with us

Newest members