<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Обновление статуса по типу Facebook с использованием jQuery oEmbed</title>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'></script>
<script type='text/javascript' src='jquery.oembed.min.js'></script>
<script type='text/javascript' src='functions.js'></script>
<script type='text/javascript'>
$(function(){
$(".msg a").oembed(null, {
embedMethod: "append",
maxWidth: 480
});
$("#shareBtn").click(function(){
status_text = $("#statusMsg").val();
if(status_text.length == 0) {
return;
} else {
$("#statusMsg").attr("disabled", "disabled");
status_text = stripHTML(status_text); // стираем все теги html
status_text = replaceURLWithHTMLLinks(status_text); // заменяем ссылки тегами HTML.
$.ajax({
url: "ajaxUpdate.php",
type: "POST",
data: "status_msg="+status_text,
success: function(msg) {
$("#statusMsg").val("");
$("#statusMsg").attr("disabled", "");
if(msg == "true") {
$("#msgs").prepend("<div class='msg'>"+status_text+"</div>");
$(".msg:first a").oembed(null, {maxWidth: 480, embedMethod: "append"});
} else {
alert("Нельзя разместить сообщение в данный момент! Пожалуйста, попробуйте позже.");
}
}
});
return false;
}
});
});
</script>
<style type='text/css'>
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,
pre, form, fieldset, table, th, td { margin: 0; padding: 0; }
body {
font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
font-size: 14px;
line-height:1.3em;
text-align:center;
}
a, a:visited {
outline:none;
}
.clear {
clear:both;
}
img {
border:0;
}
#wrapper {
width:480px;
margin:0 auto;
text-align:left;
}
#updateBox {
background-color:#F2F2F2;
border:1px solid #B5B5B5;
padding:4px;
}
#statusMsg {
width:100%;
height:70px;
border-color:#7C7C7C #C3C3C3 #DDDDDD;
border-style:solid;
border-width:1px;
}
#shareBtn {
background:#5872A7;
float:right;
color:#ffffff;
font-weight:bold;
border:0;
padding:4px;
margin-top:2px;
}
#msgs {
}
.msg {
margin-top:8px;
border-bottom:1px solid #B5B5B5;
padding-bottom:4px;
color:#808080;
font-size:13px;
}
.msg a {
color:#3B5998;
text-decoration:none;
}
.msg a:hover {
text-decoration:underline;
}
.oembed-container {
border-left:2px solid #eaeaea;
margin-left:15px;
padding:4px 4px 4px 10px;
}
</style>
</head>
<body>
<div id='wrapper'>
Демонстрация для сайта <a href='http://ruseller.com/'>ruseller.com</a>
<div id='updateBox'>
Введите ваше сообщение здесь...
<textarea id='statusMsg'></textarea>
<button id='shareBtn'>Ввод</button>
(Никакого HTML, только ссылки и текст)
<div class='clear'></div>
</div>
<div id='msgs'>
<?php
include("config.php");
//$str = iconv('utf-8', 'windows-1251', $str);
//$row['content'] = iconv("utf-8","windows-1251", $row['content']);
$q = "SELECT * FROM status_msgs ORDER BY id DESC";
$r = mysql_query($q);
if(mysql_num_rows($r) > 0) {
//Сообщения есть
while($row = mysql_fetch_assoc($r)){
//$r = $_POST['content'];
//$r = iconv("utf-8", "windows-1251", $row['content']);
echo "<div class='msg'>\n";
$row['content'] = iconv("utf-8","windows-1251", $row['content']);
echo $row['content']."\n";
echo "</div>\n";
}
} else {
//Сообщений нет
echo "В базе данных ничего нет!";
}
?>
</div>
</div>
</body>
</html>