Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Dodanie powidomienia dźwiękowego w daddy-shoutbox
maciek9669
post
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 3.02.2015

Ostrzeżenie: (0%)
-----

Nw czy to dobre miejsce do zadania tego pytania
Chciałbym dodać do shoutboxa opartego na daddy-shoutbox dodać dzwięk po nadejściu nowej widomości lub przynajmniej po odświeżeniu pola z wiadomościami ale nie mam pojęcia jak js dopiero się uczę
bazuje na kilku plikach

index
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html><head>
  3.  
  4. 	<meta http-equiv="content-type" content="text/html; charset=ISO-8859-2">
  5.  
  6.   <style type="text/css">
  7. 	body {
  8. 	background: url('http://tag.16mb.com/bg.jpg') repeat fixed;
  9. 	font-size: 18px;
  10. 	font-family: Arial,Helvetica,sans-serif;
  11. 	}
  12. 	#daddy-shoutbox {
  13.       padding: 5px;
  14.       background: url('http://tag.16mb.com/bgs.jpg') repeat fixed;
  15.       color: white;
  16.       width: 500px;
  17.       font-family: Arial,Helvetica,sans-serif;
  18.       font-size: 11px;
  19. 	}
  20. 	#tab {
  21. 	 font-size: 14px;
  22. 	}
  23.     .shoutbox-list {
  24.       border-bottom: 1px solid #083030;
  25.  
  26.       padding: 5px;
  27.       display: none;
  28.     }
  29.     #daddy-shoutbox-list {
  30.       text-align: left;
  31.       margin: 0px auto;
  32.     }
  33.     #daddy-shoutbox-form {
  34.       text-align: left;
  35.  
  36.     }
  37.     .shoutbox-list-time {
  38.       color: #8DA2B4;
  39.     }
  40.     .shoutbox-list-nick {
  41.       margin-left: 15px;
  42.       font-weight: bold;
  43.     }
  44.     .shoutbox-list-message {
  45.       margin-left: 15px;
  46.     }
  47.   </style>
  48.   <title>Czat</title>
  49.   <script type="text/javascript" src="Czat_pliki/jquery.js"></script>
  50.   <script type="text/javascript" src="Czat_pliki/jquery_002.js"></script>
  51. </head>
  52.   <body alink="white" link="white" vlink="white">
  53.     <center>
  54. 	<div id="tab">
  55. 	<table align="center" border="0" cellspacing="1" height="25" width="512">
  56. 	<tbody><tr>
  57. 	<td align="center" background="Czat_pliki/bgs.jpg">
  58. 	<a href="http://tag.16mb.com/" style="text-decoration: none;">ZWZST</a>
  59. 	</td>
  60. 	<td align="center" background="Czat_pliki/bgs.jpg">
  61. 	<a href="http://tag.16mb.com/2/" style="text-decoration: none;">Kanał 2</a>
  62. 	</td>
  63. 	<td align="center" background="Czat_pliki/bgs.jpg">
  64. 	<a href="http://tag.16mb.com/3/" style="text-decoration: none;">Kanał 3</a>
  65. 	</td>
  66. 	<td align="center" background="Czat_pliki/bgs.jpg">
  67. 	<a href="http://tag.16mb.com/4/" style="text-decoration: none;">Kanał 4</a>
  68. 	</td>
  69. 	</tr>
  70. 	</tbody></table>
  71. 	</div>
  72. 	<div id="daddy-shoutbox">
  73.     <div id="daddy-shoutbox-list"></div>
  74.     <br>
  75.     <center><form id="daddy-shoutbox-form" action="daddy-shoutbox.php?action=add" method="post"> 
  76. 	<br>
  77.     Tekst: <input name="message" style="white-space:pre-wrap; margin-left: 20px; width:400px">
  78. 	<br>
  79. 	<br>
  80. 	Nick: <input name="nickname" style="margin-left: 25px;" type="text">
  81.     <input value="Wyslij" type="submit">
  82.     <span id="daddy-shoutbox-response"></span>
  83.     </form>
  84. 	<div id="clear-button" style="text-align: right;">
  85. 	<form style="align: right;" action="clear.php"><input value="Clear" type="submit"></form></div></center>
  86. 	</div>
  87.  
  88.   </center>
  89.  
  90.   <script type="text/javascript">
  91.         var count = 0;
  92.         var files = '';
  93.         var lastTime = 0;
  94.  
  95.         function prepare(response) {
  96.           var d = new Date();
  97.           count++;
  98.           d.setTime(response.time*1000);
  99.           var mytime = d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();
  100.           var string = '<div class="shoutbox-list" id="list-'+count+'">'
  101.               + '<span class="shoutbox-list-time">'+mytime+'</span>'
  102.               + '<span class="shoutbox-list-nick">'+response.nickname+':</span>'
  103.               + '<span class="shoutbox-list-message">'+response.message+'</span>'
  104.               +'</div>';
  105.  
  106.           return string;
  107.         }
  108.  
  109.         function success(response, status)  { 
  110.           if(status == 'success') {
  111.             lastTime = response.time;
  112.             $('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
  113.             $('#daddy-shoutbox-list').append(prepare(response));
  114.             $('input[@name=message]').attr('value', '').focus();
  115.             $('#list-'+count).fadeIn('slow');
  116.             timeoutID = setTimeout(refresh, 3000);
  117.           }
  118.         }
  119.  
  120.         function validate(formData, jqForm, options) {
  121.           for (var i=0; i < formData.length; i++) { 
  122.               if (!formData[i].value) {
  123.                   alert('Uzupełnij wszystkie pola!'); 
  124.                   $('input[@name='+formData[i].name+']').css('background', 'red');
  125.                   return false; 
  126.               } 
  127.           } 
  128.           $('#daddy-shoutbox-response').html('<img src="http://tag.16mb.com/loader.gif" />');
  129.           clearTimeout(timeoutID);
  130.         }
  131.  
  132.         function refresh() {
  133.  
  134.           $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
  135.             if(json.length) {
  136.               for(i=0; i < json.length; i++) {
  137.                 $('#daddy-shoutbox-list').append(prepare(json[i]));
  138.                 $('#list-' + count).fadeIn('slow');
  139.               }
  140.               var j = i-1;
  141.               lastTime = json[j].time;
  142.             }
  143.             //alert(lastTime);
  144.           });
  145.           timeoutID = setTimeout(refresh, 3000);
  146.         }
  147.  
  148.         // wait for the DOM to be loaded 
  149.         $(document).ready(function() { 
  150.             var options = { 
  151.               dataType:       'json',
  152.               beforeSubmit:   validate,
  153.               success:        success
  154.             }; 
  155.             $('#daddy-shoutbox-form').ajaxForm(options);
  156.             timeoutID = setTimeout(refresh, 100);
  157.         });
  158.   </script>
  159.   <center><a style="text-decoration: none; color: black;"><font color="#083030" size="10">IP: <script language="JavaScript" type="text/javascript" src="Czat_pliki/adres_ip.htm"></script>91.206.211.201</font></a></center>
  160.  
  161. </body></html>
[HTML] pobierz, plaintext


link do czatu Czat
link do plików użytych w Shutbox pliki

Ten post edytował maciek9669 4.02.2015, 11:09:49
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
maciek9669
post
Post #2





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 3.02.2015

Ostrzeżenie: (0%)
-----

Trochę kombinowałem. Wstawiłem to co kazałeś
do index.htm 
[HTML] pobierz, plaintext 
  1.  function refresh() {
  2.  
  3.           $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
  4.  
  5. 		  if(json.length) {
  6. 			$('audio').attr('autoplay', 'true');
  7.               for(i=0; i < json.length; i++) {
  8.  
  9.                 $('#daddy-shoutbox-list').append(prepare(json[i]));
  10.  
  11. 				$('#list-' + count).fadeIn('slow');
  12.  
  13.  
  14.               }
[HTML] pobierz, plaintext

ale dzwięk jest tylko kiedy wyczyszczę stronę button-em "clear" i wprowadzę jedną wiadomość


daddy-shoutbox
[PHP] pobierz, plaintext 
  1. <?php header('Content-Type: text/html; charset=utf-8'); ?>
  2. <?php 
  3.  
  4. function replace(&$item, $key) {
  5. $item = str_replace('|', '-', $item);
  6. }
  7. if (!function_exists('file_put_contents')) {
  8. function file_put_contents($fileName, $data) {
  9. if (is_array($data)) {
  10. $data = join('', $data);
  11. }
  12. $res = @fopen($fileName, 'w+b');
  13. if ($res) {
  14. $write = @fwrite($res, $data);
  15. if($write === false) {
  16. return false;
  17. } else {
  18. return $write;
  19. }
  20. }
  21. }
  22. }
  23. //file_put_contents('debug.txt', print_r($_GET, true));
  24. switch($_GET['action']) {
  25. case 'add':
  26. array_walk($_POST, 'replace');
  27. $arr = file('messages.txt');
  28. if(count($arr) > 10)
  29. array_shift($arr);
  30. $_POST['nickname'] = htmlentities($_POST['nickname'], ENT_COMPAT, 'utf-8');
  31. $_POST['message'] = htmlentities($_POST['message'], ENT_COMPAT, 'utf-8');
  32. $time = time();
  33. $arr[] = $time.'|'.$_POST['nickname'].'|'.$_POST['message'].'|'.$_SERVER['REMOTE_ADDR']."\n";
  34. file_put_contents('messages.txt', implode('', $arr));
  35. $data['response'] = 'Good work';
  36. $data['nickname'] = $_POST['nickname'];
  37. $data['message'] = $_POST['message'];
  38. $data['time'] = $time;
  39. break;
  40. case 'view':
  41. $data = array();
  42. $arr = file('messages.txt');
  43. if(!$_GET['time'])
  44. $_GET['time'] = 0;
  45. foreach($arr as $row) {
  46. $aTemp = null;
  47. list($aTemp['time'], $aTemp['nickname'], $aTemp['message']) = explode('|', $row);
  48. if($aTemp['message'] AND $aTemp['time'] > $_GET['time'])
  49. $data[] = $aTemp;
  50. }
  51. //file_put_contents('debug.txt', print_r($data, true));
  52. break;
  53. }
  54. require_once('JSON.php');
  55. $json = new Services_JSON();
  56. $out = $json->encode($data);
  57. print $out;
  58. ?>
[PHP] pobierz, plaintext


JSON.php LINK
w postaci bezpośredniego linku do pliku bo nie zmieścił sie plik w poście

Ten post edytował maciek9669 4.02.2015, 23:29:32
Go to the top of the page
+Quote Post

Posty w temacie
- maciek9669   Dodanie powidomienia dźwiękowego w daddy-shoutbox   4.02.2015, 10:55:20
- - rad11   Tam gdzie pobierasz dane , sprawdz czy jest to now...   4.02.2015, 14:53:18
|- - maciek9669   Cytat(rad11 @ 4.02.2015, 14:53:18 ) T...   4.02.2015, 16:56:51
- - rad11   pokaz kod files+"daddy-shoutbox.php?action=vi...   4.02.2015, 20:10:05
- - maciek9669   Trochę kombinowałem. Wstawiłem to co kazałeś do in...   4.02.2015, 23:27:37

« Następny starszy · JavaScript · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 8.10.2025 - 05:13
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn