How to delay page set Interval if the user still input text - javascript
I am trying to build a social network site and in order for post's to keep on updating I've set an interval time of 20 seconds so it refreshes the page and show's new comments and or post's.
My problem now is that when a user is trying to input a comment in my form, the page is running through the interval and as soon as it hit's 20 seconds the page refreshes and the text input deleted.
I want to set the interval function so that it will start counting if no one had typed anything anywhere in the page for about 10 seconds.
I can't give an input ID since the comment's are bound to post's and by that do not have a static ID for reference.
Is there a way to do what I just described?
that's the code of the page I want to stop the interval temporarily:
<?php
session_start();
if(!isset($_SESSION['login_user'])){ // check whether a session is set or not
header('Location: registrationPage.php'); // Redirecting To Registration Page
}
include 'connectDB.php';
$FN = $_SESSION['login_user'];
$result = mysqli_query($conn, "SELECT concat(U.firstName,' ',U.lastname) as fullName FROM tblUser U where U.userName='$FN'");
while($row = mysqli_fetch_array($result)){
$UN = $row['fullName'];
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="Main page">
<meta name="author" content="Sorokina E. and Menaker T.">
<title>Main page</title>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<href='https://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="../files/connection.json" type="text/jason"></script>
<script src="../files/positions.json" type="text/jason"></script>
<script src="../files/messages.json" type="text/jason"></script>
<link rel="stylesheet" type="text/css" href="../css/mystyle.css">
<script src="../js/typeahead.min.js"></script>
</head>
<body>
<div class="row alignT bg_color7">
<div class="col-sm-1">
<img class="img-responsive" src="../images/logo.gif" alt="">
</div>
<div class="col-sm-1">
<?php
if(isset($_SESSION['login_user'])){
echo '<span >Welcome ' . $UN. '! </span>';
}
?>
</div>
<div class="col-sm-1">
<span class="glyphicon glyphicon-home"></span>
</div>
<div class="col-sm-1">
<span class="glyphicon glyphicon-user"></span>
</div>
<div class="col-sm-1 " data-toggle="tooltip" title="My connections" >
<button id="NL" class="Tbutton " type="button">
<span class="glyphicon glyphicon-globe " style="vertical-align:middle; " ></span>
</button>
<div id="NC" class="notificationContainer">
<div id="NT" class="notificationTitle">My friends:</div>
<div id="NB" class="notificationsBody forConnection">
<?php include ('selectAllFriends.php');?></div>
<div id="NF" class="notificationFooter">See All</div>
</div>
</div>
<div class="col-sm-2 ">
<span > <input id="search" name="typehead" class="typeahead" data-provide="typeahead" placeholder="Search people" ></input></span>
</div>
<div class="col-sm-1 mm">
<span><input type="button" onclick="location.href = 'allUsersPage.php';" class="btn btn-info" value="All people" ></span>
</div>
<div class="col-sm-1 " data-toggle="tooltip" title="My messages" >
<button id="NL1" class="Tbutton " type="button">
<span class="glyphicon glyphicon-envelope" style="vertical-align:middle; " ></span>
</button>
<div id="NC1" class="notificationContainer">
<div id="NT1" class="notificationTitle">My Messages:</div>
<div id="NB1" class="notificationsBody forMessages">
<?php include ('selectAllMessages.php');?></div>
<div id="NF1" class="notificationFooter">See All</div>
</div>
</div>
<div class="col-sm-2 " data-toggle="tooltip" title="My notifications" >
<button id="NL2" class="Tbutton " type="button">
<span class="glyphicon glyphicon-flag" style="vertical-align:middle; " ></span>
</button>
<div id="NC2" class="notificationContainer">
<div id="NT2" class="notificationTitle">My Notifications:</div>
<div id="NB2" class="notificationsBody forNotifications"></div>
<div id="NF2" class="notificationFooter">See All</div>
</div>
</div>
<div class="col-sm-1">
<span class="glyphicon glyphicon-log-out"></span>
</div>
</div>
<div class="row">
<p class="alignW"><input class=" col-sm-5" type="text" name="mind" id="textField9" placeholder="Share your mind">
<span class=" col-sm-1"></span> <input type="button" id = "btn_submit" class="btn btn-info col-sm-1" value="Add post" ></p>
</div>
<div class="row" id="middle">
<div class="col-sm-8" id="left">
<?php include ('selectAllPosts.php'); ?>
</div>
<div class="col-sm-4" id="right">
<?php include ('select5Positions.php'); ?>
</div>
</div>
<!--Footer-->
<footer class="container-fluid text-center">
<p class="glyphicon glyphicon-copyright-mark"> Created by ... </p>
</footer>
<script>
$(document).ready(function(){
var timer = null;
function autoRefresh_div()
{
$('#left').load("selectAllPosts.php");// a function which will load data from other file after x seconds
}
$(document.body).keydown(function(event){
clearTimeout(timer);
timer = setTimeout(setInterval(function(){ autoRefresh_div() }, 20000), 5000);
});
$("#btn_submit").click(function(){
var userName='<?php echo $FN; ?>';
var content = $('#textField9').val();
var postData = '&uname='+userName+'&content='+content;
$.ajax({
url : "insertPost.php",
type: "POST",
data : postData,
success: function(data,status, xhr){
if(data==="You have successfully posted!"){
$('#textField9').val('');
}
if(data==="ERROR"){
$('#textField9').val('');
}
}
});
});
$('#search').typeahead( {
name:'typehead',
remote: 'selectAllUsers.php?query=%QUERY'
});
//search for all users and go to their pages
$('#search').on('typeahead:selected', function(evt, item){
window.location.href = "userPage.php?fullName="+item.value;
});
$.getJSON("../files/notifications.json",function(result){
$.each(result, function (index, value) {
$(".forNotifications").append("<div class=\"divStyle1\">" +value.Notification + "</div>");
});
});
$("#NL").click(function(){
$("#NC2").hide();
$("#NC1").hide();
$("#NC").fadeToggle(300);
return false;
});
$("#NL1").click(function(){
$("#NC").hide();
$("#NC2").hide();
$("#NC1").fadeToggle(300);
return false;
});
$("#NL2").click(function(){
$("#NC").hide();
$("#NC1").hide();
$("#NC2").fadeToggle(300);
return false;
});
$('#myButton').click(function (){
$(this).hide();
}
);
});
</script>
</body>
</html>
Thank you.
Tom
There are multiple ways you could do this either by making an AJAX Request to retrieve new data or even use Websockets (Which is the most efficient). However, the simplest approach to fixing your problem would be to create a timer via JS when the page loads.
<!-- Element -->
<input type="text" data-ui="post"/>
<!-- Script -->
<script>
$(document).ready(function(){
var timer = null;
function startTimer() {
timer = setInterval(function() {
window.location.reload();
}, 1000);
}
// Stop timer by clearing with interval when
// the user focuses on the element
$('[data-ui]').on('focus', function() {
clearInterval(timer);
});
// Start the timer once the user has blurred away from
// the element
$('[data-ui]').on('blur', function() {
startTimer();
});
// Start the timer as the page has finished loading
startTimer();
})
</script>
The basically stops the window location.reload timer once the user has focused an element that has a [data-ui] attribute tag attached to it. Another method would be to save your inputs content with LocalStorage and reinsert the content into the input box once the page has reloaded.
Let me know if you need a jQUERY'less version.
Related
How i can do a modal with picture
I ask a question about my function Javascript.
I recover a data list after an a ajax call.
In the list i have a field with a picture and i want show this in a modal bootstrap.
In my code the picture is displayed below the column.
Thanks in advance guys :)
$.when(promiseListeRubriqueDocument).then(function(result) {
var data = JSON.parse(result);
$(".listRubrique").html("");
$.each(data, function(index, item) {
console.log(item);
var rubTemplate = $(".template");
var modal = (".img");
var rub = $(rubTemplate).clone().removeClass("template").removeClass("hide");
$(rub).find(".labelRubrique").text(item.codeRubrique);
$(rub).find(".inputRubrique").val(item.libelleRubrique);
$(rub).find("div.rubrique-image").attr("data-rubrique-id", item.idRub);
$(rub).find("div.rubrique-image[data-rubrique-id=" + item.idRub + "]").click(function(i, element) {
if (item.imageRubrique) {
if ($("" + "[data-rubrique-id=" + item.idRub + "]").find('img.rubrique-exemple').length < 1) {
$("" + "[data-rubrique-id=" + item.idRub + "]").append("<div><img class='rubrique-exemple' src=" + item.imageRubrique + " width='100px' /></div>");
}
}
});
$(".listRubrique").append(rub);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="list-group-item template hide">
<label class="labelRubrique" style="font-weight:bold"></label>
<div class="row rubrique-image" data-rubrique-id="">
<div class="col-md-8">
<input name="enteteRubrique" id="enteteRubrique" maxlength="255" type="text" class="form-control aveo-icon aveo-magnifier inputRubrique" disabled/>
</div>
<div class="col-md-3">
<a class="seeImage" href="javascript:void(0);" role='button' aria-expanded='false' aria-controls='collapseExample'><span class='glyphicon glyphicon-eye-open fa-lg'></span></a>
</div>
</div>
</li>
<div class="row">
<div class="col-md-4">
<div class="panel panel-default">
<div class="panel-heading">
<liferay-ui: messagekey="admin.gestion.documents.rubriques.disponibles" />
</div>
<div class="panel-body">
<ul class="list-group listRubrique">
</ul>
</div>
</div>
</div>
</div>
"Lightbox" is the common name for what you've described. Since you mentioned a modal bootstrap, something like http://jbutz.github.io/bootstrap-lightbox/ is likely to be aligned with your goals.
simply clone your "field" div, give it id then append to a bootstrap modal body. Or to avoid appending new clone everytime: use .html() instead.
from https://www.w3schools.com/bootstrap/bootstrap_modal.asp with modification, using bootstrap 3.3.7, jquery 3.3.1
<body>
<div class="container">
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>
<div id='myColumn'>
<img src="https://via.placeholder.com/350x150"/>
<p>Some text in the modal.</p>
</div>
</div>
<script>
$(document).ready(function(){
// var field = $("" + "[data-rubrique-id=" + item.idRub + "]").clone();
var fieldtest= $('#myColumn').clone();
var modal = $("<div id='myModal' class='modal'>\
<div class='modal-dialog'>\
<div class='modal-content'>\
<div id='myBody' class='modal-body'>\
</div>\
</div>\
</div>\
</div>").appendTo('body');
// $('#myBody').html(field);
$('#myBody').html(fieldtest);
});
</script>
</body>
`
jQuery not working on dynamically generated same divs
I am trying to make a comment reply section. I am loading the same div for reply which I use for commenting using $('#1').append($('.enterComment').html()); where 1 is the id of the div which will be displayed when reply is clicked.
.enterComment div contains a hidden submitPost button which will be displayed as soon as the user starts typing comment.
That div is loading properly but The problem for me is that when I loaded the same div in reply section and as I start typing anything in that it only displays the hidden div in the main comment div and not in the reply one.
My html is
<div class="enterComment">
<form id="insertComment">
<textarea name="comment" placeholder="comment here..."></textarea>
<div id="commentOptions">
<button type="button" class="btn btn-primary btn-sm">Comment</button>
</div>
</form>
</div>
For reply I have
<ul class="commentList">
<li>
<div class="commentData" id="1">
<p>The comment content will go here</p>
<p><span class="reply">Reply</span> <i class="fa fa-thumbs-up" aria-hidden="true" tabindex="1"></i> <i class="fa fa-thumbs-down" aria-hidden="true" tabindex="1"></i> </p>
</div>
</li>
</ul>
and script is
$("body").on('focus', 'textarea', function() {
$('#commentOptions').fadeIn(1000);
});
$("body").on('click', '#1 p .reply', function() {
$('#1').append($('.enterComment').html());
});
You need to fade in the following div of textarea so use .next().
Also, Identifiers in HTML must be unique, hence use CSS class. Here in the example I have used commentOptions CSS class.
$("body").on('focus', 'textarea', function() {
$(this).next('.commentOptions').fadeIn(1000);
});
$("body").on('click', '.commentData p .reply', function() {
var element = $('.enterComment').clone();
element.find('.commentOptions').hide();
$(this).closest('.commentData').append(element);
});
.commentOptions {
display: none
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="enterComment">
<form id="insertComment">
<textarea name="comment" placeholder="comment here..."></textarea>
<div class="commentOptions">
<button type="button" class="btn btn-primary btn-sm">Comment</button>
</div>
</form>
</div>
<ul class="commentList">
<li>
<div class="commentData" id="1">
<p>The comment content will go here</p>
<p><span class="reply">Reply</span> <i class="fa fa-thumbs-up" aria-hidden="true" tabindex="1"></i> <i class="fa fa-thumbs-down" aria-hidden="true" tabindex="1"></i> </p>
</div>
</li>
</ul>
I've created an answer in one HTML file which works without dependencies apart from the jQuery and Bootstrap which you were using on your example:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<style type="text/css">
body{
padding: 10px;
}
.wrapper{
width: 800px;
margin-right: auto;
margin-left: auto;
}
.submit-comment-btn-container {
display: none;
}
</style>
<script type="text/javascript">
$( document ).ready(function() {
$('#comment-textarea').on('focus', function() {
$('.submit-comment-btn-container').fadeIn('fast');
});
$('#submit-comment-btn').on('click', function() {
var text = $('#comment-textarea').val();
if(text != ''){
$('.submit-comment-btn-container').fadeOut();
$('#comment-textarea').val('');
// cloning the first child of the comments to use as a template
var comment = $('.comment-list').children().first().clone();
// replacing the content of the cloned comment with the new text
$(comment).html(text);
// appending the new comment to the comment list
$(comment).appendTo('.comment-list');
}
});
});
</script>
</head>
<body>
<div class="wrapper">
<div class="enterComment">
<form id="insertComment">
<div class="comment-text-container">
<textarea id="comment-textarea" placeholder="Comment here..."></textarea>
</div>
<div class="submit-comment-btn-container">
<button id="submit-comment-btn" type="button" class="btn btn-primary btn-sm">Comment</button>
</div>
</form>
</div>
<div class="comment-list-container">
<ul class="comment-list">
<li>
<div class="comment">
Comment goes here
</div>
</li>
</ul>
</div>
</div>
</body>
</html>
I want to open reply textbox after clicking on a link using jquery
I'm developing discussion board and I want to make a reply system on each comment using jquery so I can click on a comment link then text box will be opened to write my reply to this comment without loading the whole page.
Here are my Html and PHP code.
<?php
$query = $conn->query("SELECT * FROM comments WHERE article_id = '$ArticleID' ");
$rowCount = $query->num_rows;
if($rowCount > 0)
{
while($row = $query->fetch_assoc())
{
$CommentID = $row['comment_id'];
$Comment = $row['text'];
?>
<li class="comment">
<div class="comment-container">
<div class="comment-meta">
<a class="comment-reply-link link-style3 creply" href="">Reply »</a>
</div>
<div class="comment-body">
<p><?php echo $Comment; ?>.</p>
</div>
</div>
</li>
<li style="list-style: none; display: inline">
<div class="comment_form">
<form action="#" method="post">
<textarea class="span10" name="Comment" rows="6"></textarea><br>
<input class="btn btn-primary" type="submit" value="Reply">
</form>
</div>
<?php
}
}
?>
</li>
And here is my my jquery code that I have a problem on it.
<script type="text/javascript">
$(document).ready(function()
{
$(".creply").click (function(e)
{
e.preventDefault();
$(this).next(".comment_form").show(); // problem here...
//$(".comment_form").show();
});
});
</script>
When I use the comment line in the script It works but without logic.
On click the link it shows all reply form on all comments not on the separate comment I clicked on. The code above I used $(this) to get the comment I clicked but It doesn't do any actions !??
Any Help, please !!??
I'm using this version of jquery
<script src="jquery-3.1.1.min.js">
You just need to select the closest parent with class .comment first, then reach the child element.
$(document).ready(function() {
$(".creply").click(function(e) {
e.preventDefault();
$(this).closest('.comment').next().show();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="comment">
<div class="comment-container">
<div class="comment-meta">
<a class="comment-reply-link link-style3 creply" href="">Reply »</a>
</div>
<div class="comment-body">
<p>
MyComment</p>
</div>
</div>
</li>
<li style="list-style: none; display: none">
<div class="comment_form">
<form action="#" method="post">
<textarea class="span10" name="Comment" rows="6"></textarea>
<br>
<input class="btn btn-primary" type="submit" value="Reply">
</form>
</div>
</li>
You can check the modified demo, it's working with multiple comments too:
JsFiddle Demo
You need to query parents() and find the next .comment_form element.
<script type="text/javascript">
$(document).ready(function() {
$(".creply").click (function(e) {
e.preventDefault();
$(this).parents().next('.comment_form').toggle();
});
});
</script>
How do I get another value in this javascript code(imagepicker)?
I want to forward the user to other pages by letting them choose the appropriate image. There is a problem when the user chooses two images. I don't know how to set forwarding when the user chooses these 2 images, any ideas? Here's the tool that I used %windir%\Temp folder . Thanks you guys for help!
<html>
<head>
<!-- scripts for imagepicker -->
<link rel="stylesheet" href="assets/css/image-picker.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/image-picker.js"></script>
<script type="text/javascript">
"use strict";
//wait for the page to be fully loaded
window.onload = function() {
initialize();
}
</script>
<title></title>
</head>
<body>
<div class="container">
<br> <br> <br> <br>
<div class="jumbotron">
<!-- 2 obrazki -->
<div class="row">
<div class="col-xs-6 col-md-3"></div>
<center>
<select multiple="multiple" class="image-picker show-html" id="selectImg">
<div class="col-xs-6 col-md-3 flags container" >
<option class="col-xs-6 col-md-3 flags" data-img-src="assets/media/img/german.png" value="1"></option>
</div>
<div class="col-xs-6 col-md-3 flags container" >
<option class="col-xs-6 col-md-3 flags" data-img-src="assets/media/img/spain.png" value="2"></option>
</div>
</div>
</select>
</center>
<!-- 2 obrazki -->
</div>
<div class="form-group container">
<center>
<p>Kliknij tu i <br><a id="forwardButton" class="btn btn-lg btn-success" type="submit" href="#" role="button">Dołącz do Poliglotów</a></p>
</center>
</div>
</form>
</div>
</div>
<!--SCRIPTS imgpickr DON'T TOUCH-->
<script>
$("select").imagepicker();
function initialize() {
var choice; //= document.getElementById("selectImg").value;
//changes destination when you set or change your choice
document.getElementById("selectImg").onchange = function() {
choice = document.getElementById("selectImg").value;
}
//when button is clicked
document.getElementById("forwardButton").onclick = function() {
if(choice == 1){
window.location = "https://www.google.com";
}
else if(choice == 2){
window.location = "https://www.facebook.com";
}
else if(choice == 1 && choice == 2){
window.location = "https://www.twitter.com";
}
}
}
</script>
</body>
</html>
Look at this example answered before: How to get all selected values of a multiple select box using JavaScript?
c() function in javascript, meaning?
I was looking through the source code of a web page, and I came across this JavaScript:
function fsb329142055() {
var b=new Array(57,50,102,50,52,99,50,53,52,56,102,98,102,98,101,102,101,49,53,61,101,99,110,57,111,78,109,54,114,111,56,48,102,38,100,53,100,53,48,50,55,52,49,55,57,50,52,51,98,53,56,61,100,99,100,55,73,116,97,53,53,115,105,108,100,55,116,105,104,38,53,116,104,38,103,104,105,102,61,61,98,110,111,105,116,99,97,38,112,50,51,104,112,46,116,50,104,99,103,105,56,102,51,61,98,50,53,51,49,56,97,101,57,116,54,49,63,100,52,97,100,112,104,97,112,46,116,115,102,56,51,105,108,98,52,116,52,53,105,104,100,97,47,101,98,98,52,100,97,57,99,99,54);
var p=new Array(0,0,1,1,1,0,0,1,0,0,0,1,0,0,1,0,0,1,0,1,1,1,1,0,1,1,1,0,1,1,0,0,1,1,0,1,0,1,1,1,0,1,1,0,1,1,0,1,0,0,0,1,0,0,1,0,1,1,0,0,0,1,1,1,0,0,1,1,1,1,0,1,1,0,1,0,1,1,0,1,0,1,1,1,1,1,1,1,1,0,0,1,1,1,1,0,1,0,1,1,0,1,0,1,1,0,0,0,0,0,1,0,0,1,0,0,1,0,0,0,0,1,1,0,1,1,1,1,0,0,0,1,1,0,0,1,0,0,1,1,0,0,1,0,0,0,0,0,0,0,0,0,0);
window.location = c(b,p);
return false;
}
This function is called here:
<a href="/hitlist.php?tab=fight.php&action=fight&hitlistId=329142055&formNonce=1eb542f92c248ffbfe59680dd774b58dc7a55d75&h=284e4fe4946e6fb8af3a662f4583454eebc8bd23" onclick="return fsb329142055();">
<div class="fightActionInner"><div class="fightActionInnerInner">Attack</div> </div>
</a>
Specifically, I'm wondering what the window.location = c(b,p); is.
People are saying it is a function, but I dont see it anywhere in the source code:
`
<link rel="stylesheet" type="text/css" href="http://static.storm8.com/im/css/global.css?v=330"/>
<script type="text/javascript" src="http://static.storm8.com/im/js/global.js?v=330"></script> <script type="text/javascript" src="http://static.storm8.com/im/js/equipment.js?v=330"></script> <title>Add the Hit List</title>
<script>
function s8Ajax(url) {
window.location.href = url;
}
</script>
</head>
<body style="; width: 100%;" class="portrait" data-promo-button="">
<div id="fb-root"></div>
<div id="contentParent">
<div id="contentChild" style="">
<div id="SCROLL_CONTENT"><div id="scrollContentChild"><div>
<div id="overlay" class="dialogOverlay"></div>
<script type="text/javascript">
window.isAndroid = false;
window.isFacebook = false;
</script>
<div id="topBar" class="topBar"><div class="topBarBg"></div><div id="inner-topbar"><a href="/bank.php?formNonce=81668c46988c486ed2d1d0b1f7e31f16d41c093c&setTab1Badge=&h=da793b290e598f2e0823e93dbab769b0736a7557"><div class="cashTopArea">
<span class="topBarCash">$<span id="cashCurrent" style="white-space:nowrap">138,136,907</span></span>
</div>
<div id="cashTimerDiv" class="cashBottomArea"><span style="font-size: 11px; font-weight: normal;"><span>+<span style="white-space: nowrap;">255,350</span></span> in </span><span id="cashType" style="font-size:11px;font-weight:normal;">59:05</span></div></a><div class="levelTopArea">
<div class="levelBgTopArea"></div>
<div class="levelFrontTopArea"><a style="text-decoration:none" href="/profile.php?formNonce=81668c46988c486ed2d1d0b1f7e31f16d41c093c&setTab1Badge=&h=dc3aa8ea9e33fff4ea763e4556ad5e0ca2718a3b">31</a></div>
</div>
<div class="levelBottomArea">
Level
</div><div class="levelBarTopArea">
<div class="levelBar" style="width:90px">
<div class="bgLevelBar" style="width:90px"><div id="expBar" class="frontLevelBar" style="width:36px"> </div>
</div>
</div>
</div>
<div class="levelBarBottomArea">
Exp: <span id="expText">5793/5993</span>
</div>
<a href="/favor.php?"><div class="energyAreaContainer"><table class="statTable"><tr><td class="statTableIcon"><div></div></td>
<td class="statTableInBetween"></td>
<td class="statTableInfo">
<div class="statTopArea">
<span id="energyCurrent" class="statEmphasis">75</span> / <span id="energyMax">75</span></div>
<div id="energyTimerDiv" class="statBottomArea"><span id="energyType" style="font-size:11px;font-weight:normal;">Energy</span></div></td></tr></table></div></a>
<a href="/hospital.php?"><div class="healthAreaContainer"><table class="statTable"><tr><td class="statTableIcon"><div></div></td>
<td class="statTableInBetween"></td>
<td class="statTableInfo">
<div class="statTopArea">
<span id="healthCurrent" class="statEmphasis">100</span> / <span id="healthMax">100</span></div>
<div id="healthTimerDiv" class="statBottomArea"><span id="healthType" style="font-size:11px;font-weight:normal;">Health</span></div></td></tr></table></div></a>
<a href="/favor.php?"><div class="staminaAreaContainer"><table class="statTable"><tr><td class="statTableIcon"><div></div></td>
<td class="statTableInBetween"></td>
<td class="statTableInfo">
<div class="statTopArea">
<span id="staminaCurrent" class="statEmphasis">5</span> / <span id="staminaMax">5</span></div>
<div id="staminaTimerDiv" class="statBottomArea"><span id="staminaType" style="font-size:11px;font-weight:normal;">Stamina</span></div></td></tr></table></div></a></div><script>
setTopBarTimerData({"cash":{"page":"\/bank.php?","text":"Cash","timeLeft":3545,"value":138136907,"maxValue":999999999999,"rate":3600,"update":255350},"energy":{"page":"\/favor.php?","text":"Energy","timeLeft":-1,"value":75,"maxValue":"75","rate":240,"update":1},"health":{"page":"\/hospital.php?","text":"Health","timeLeft":-1,"value":100,"maxValue":"100","rate":180,"update":1},"stamina":{"page":"\/favor.php?","text":"Stamina","timeLeft":-1,"value":5,"maxValue":"5","rate":120,"update":1},"experience":{"width":90,"value":"5793","previousLevelValue":5658,"nextLevelValue":5993}});
createTopBarTimer();
</script></div></div><link rel="stylesheet" type="text/css" href="http://static.storm8.com/im/css/bounty.css?v=330"/>
<div class="section">
<div class="sectionHeader">
Add "Raͭgͪnͤa͠rok" to the Hit List</div>
<div class="sectionBar"></div><div class="sectionContent">
<script>
function fsb10213841(x) {
var b=new Array(49,100,50,100,100,48,98,101,54,49,102,56,55,101,52,99,56,56,57,51,54,52,49,99,56,102,49,54,100,54,54,52,49,49,56,99,61,101,99,110,48,111,78,57,51,99,38,109,104,61,114,50,50,51,111,102,38,57,52,49,52,51,57,102,56,51,49,98,51,50,50,51,57,48,49,61,51,48,48,54,100,105,95,53,57,116,51,97,57,99,97,115,56,57,54,105,54,108,51,116,105,51,49,49,101,48,99,104,54,100,63,112,104,112,46,121,116,110,117,111,98);
var p=new Array(1,1,1,0,1,0,0,1,1,0,0,1,0,0,1,1,1,1,1,0,1,1,0,1,1,0,0,0,0,1,1,0,1,0,1,0,1,1,1,1,0,1,1,0,0,0,0,1,0,0,1,0,0,0,1,1,1,0,0,1,1,0,0,0,1,1,1,0,0,0,1,0,0,1,1,1,0,0,0,0,1,1,1,0,0,1,0,0,0,0,0,1,0,0,0,1,0,1,0,1,1,0,0,0,0,0,0,1,0,0,1,1,1,1,1,1,1,1,1,1,1);
var bountyForm = document.getElementById('bountyForm');
bountyForm.action = c(b,p) + x;
return true;
}
</script>
<form id="bountyForm" method="post" onsubmit="return fsb10213841('373');" action="/bounty.php?hitlist_id=10213841&formNonce=81668c46988c486ed2d1d0b1f7e31f16d41c093c&h=284e4fe4946e6fb8af3a662f4583454eebc8bd23">
<ul>
<li>The minimum bounty amount is <span style="white-space: nowrap;">$10,000</span>.</li>
<li>A 15% fee will be charged to safeguard the bounty.</li>
</ul>
<br/>
<table>
<tr>
<td class="bountyLabel">Bounty Amount:</td>
<td>
<input type="text" name="bountyValue" size=25 class="medTextField"> <br/>
<div style="height:6px"> </div>
<input type="submit" value="Place Bounty" name="action" class="btnMed btnBroadcast">
</td>
</tr>
</table>
</form>
</div>
</div>
</div></div><br/><br/><script> window.onload = function() { window.location.href = "#&setTab0Badge=&changeApplicationBadge=0&setTab4Badge=1";}</script></div></body></html>
In the HTML you provided, you'll see the following tag:
<script type="text/javascript" src="http://static.storm8.com/im/js/global.js?v=330"></script>
Go to http://static.storm8.com/im/js/global.js?v=330 and you'll find the following function definition:
function c(b,p) {
a='';s=String.fromCharCode;
for(i=0;i<b.length;i++) {if(p[i])a=s(b[i])+a;else a+=s(b[i]);}
return a;
}
This function is located in the included javascript files in head
http://static.storm8.com/im/js/global.js?v=330
line no: 411 and function code is as follow:
function c(b,p) {
a='';s=String.fromCharCode;
for(i=0;i<b.length;i++) {if(p[i])a=s(b[i])+a;else a+=s(b[i]);}
return a;
}