javascript

Mengakses Kamera Web dengan JS

9/14/2019 11:03:00 pm

Cara mengakses kamera webcam dari web dengan javascript 


Untuk kali ini kita akan membahas mengenai cara mengakses kamera web dengan bantuan javascript, jadi fitur ini akan berjalan dihalaman website

Mengakses Kamera Web dalam JS
Mengakses Kamera Web dalam JS



Bagaimana caranya ?

OK lansung saja kita mulai.

Source Html




<video id="video"></video>
<canvas id="canvas"></canvas><br>
<button onclick="snap();">Snap</button>


Source Javacript 



var video = document.getElementById('video');
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
 
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.oGetUserMedia || navigator.msGetUserMedia;
 
if(navigator.getUserMedia){
 navigator.getUserMedia({video:true}, streamWebCam, throwError);
}
 
function streamWebCam (stream) {
 video.src = window.URL.createObjectURL(stream);
 video.play();
}
 
function throwError (e) {
 alert(e.name);
}
 
function snap () {
 canvas.width = video.clientWidth;
 canvas.height = video.clientHeight;
 context.drawImage(video, 0, 0);
}



Hore.. Done...

Cara Mendeteksi Perangkat yang digunakan dengan Javascript

9/14/2019 09:33:00 pm

Deteksi perangkat dengan menggunakan Javascript

Script ini berguna untuk mengetahui perangkat apa yang sendan kita gunakan. Cara ini cukup simple untuk di praktekkan karena skript (source) kode yang kita berikan bisa di bilang sangat sedikit
Cara Mendeteksi Perangkat yang digunakan dengan Javascript
Cara Mendeteksi Perangkat yang digunakan dengan Javascript


OK langsung saja kita tempur.. wkwkw

Untuk Source Html

<h1 id="platform"></h1>

Untuk Source Javacript
  1. var platform = document.getElementById('platform');
  2.  
  3. if (navigator.userAgent.match(/iPhone/i)) {
  4.  platform.textContent = "Sekarang kamu sedang menggunkan iPhone";
  5. } else if (navigator.userAgent.match(/iPad/i)) {
  6.  platform.textContent = "Sekarang kamu sedang menggunkan iPad";
  7. } else if(screen.width <= 699) {
  8.  platform.textContent = "Sekarang kamu sedang menggunkan Handphone";
  9. } else if(navigator.userAgent.match(/Mac OS X/i)) {
  10.  platform.textContent = "Sekarang kamu sedang menggunkan Mac!!";
  11. } else {
  12.  platform.textContent = "Sekarang kamu sedang menggunkan PC!!";
  13. }

Hore Done .....

Cara Cepat Setting Form Input untuk Angka Saja dengan Javascript

8/18/2019 10:43:00 am

Membuat Input Hanya Dapat Diisi angka saja dengan menggunkan Javascript





Teknik ini merupakan cara yang sering digunakan oleh para programmer untuk membatasi validasi huruf yang berada di textbox agar tidak bisa dipakai. Membuat form input angka di javascript  sangat mudah akan tetapi KITA sering melupakannya karena skripnya yang panjang. 

input hanya angka javascript
textbox hanya bisa diisi angka di html

Membuat inputan di javascript

Untuk Cuplikan hasilnya boleh di coba di bawah ini


Membuat Inputan Hanya Angka Dengan Javascript




Hal yang terbesit 
"kok bisa gitu  ya ??"

Ok langsung aja ini dia

Kodenya :

  1. <!DOCTYPE html>
  2. <html lang="en" dir="ltr">
  3.   <head>
  4.     <meta charset="utf-8">
  5.     <title>Indianaweb.blogspot</title>
  6.   </head>
  7.   <style>.textbox-angka{padding: 5px 10px;}</style>
  8.   <body>
  9.     <h1>Membuat Inputan Hanya Angka Dengan Javascript</h1>
  10.     <input class="textbox-angka" type="text" name="" value="" placeholder="Silahkan di test disini"  onkeypress="return isNumberKey(event)">
  11.     <script type="text/javascript">
  12.       function isNumberKey(evt) {
  13.           var charCode = (evt.which) ? evt.which : event.keyCode
  14.           if (charCode > 31 && (charCode < 48 || charCode > 57))
  15.           return false;
  16.       }
  17.     </script>
  18.   </body>
  19. </html>

Hore... Done....

Menambah Value Di Dalam Dropdown Dengan Append Child Javascript

8/04/2019 05:23:00 pm

Tutorial Value Di Dalam Dropdown (select-option) Dengan Append Child Javascript.

Append Child merupakan sebuah fungsi yang biasa digunakan untuk menambahkan sebuah value atau nilai ke sebuah variabel. Ok tanpa BASI BASA kita pratekkan cara ini.

Menambah Value Di Dalam Dropdown Dengan Append Child Javascript
Menambah Value Di Dalam Dropdown Dengan Append Child Javascript


Cuplikan Hasilnya





Hal yang terbesit

Gimana itu., kok bisa begitu ??

Kodenya :

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  <title></title>
  5. </head>
  6. <body>
  7. <select class="sebab">
  8.   <option class="opsi" value="satu">Data Satu</option>
  9.   <option class="opsi" value="dua">Data Dua</option>
  10.   <option class="opsi" value="tiga">Data Tiga</option>
  11. </select>
  12.  
  13. <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
  14.  
  15. <script type="text/javascript">
  16.   $(".sebab").change(function(){
  17.     var named     = document.getElementsByClassName("opsi")[1];
  18.     var plusName  = document.createTextNode(" Ditambahkan");
  19.  
  20.     if (named.innerHTML == 'Data Dua') {
  21.         alert('Berhasil Ditambahkan ');
  22.         named.appendChild(plusName);
  23.      }else{
  24.         alert('Data Sudah Ditambahkan');
  25.      }
  26.   });
  27. </script>
  28. </body>
  29. </html>

Hore... Done...

Memisahkan kata dengan explode di javascript

8/04/2019 10:34:00 am

Memotong Kalimat Perkata dengan Method  EXPLODE di Javascript

Explode adalah fungsi yang biasanya di gunakan untuk memotong-motong value atau nilai pada suatu ilmu programing. MAAF JIKA pengertiannya ada yang salah. 

Memisahkan kata dengan explode di javascript
Memisahkan kata dengan explode di javascript



Kodenya :

  1. <script>
  2.  var url = "9 Maret 2019";
  3.  var explode = url.split(' ');
  4.  var namaDomain = explode[0];
  5.  var tipeRequest = explode[1];
  6.  var requestValue = explode[2];
  7.  document.writeln("Depan = " + namaDomain);
  8.  document.writeln("<br>");
  9.  document.writeln("Tengah = " + tipeRequest);
  10.  document.writeln("<br>");
  11.  document.writeln("Belakang    = " + requestValue);
  12. </script>

Hasilnya:



Hore... Done...