Selasa, 26 September 2017

Pojok belajar Minecraft

hari minggu kita tidak pergi kepasar, tidak juga naik delman istimewa. Mari kita beresin meja belajar si kecil.

Modal dan tools :
- kuas, goceng
- selotip kertas, goceng
- cat sisa pager depan rumah, gratis
- Kayu sisa lemari rusak di kantor, gratis
- kaso kecil dari tetangga sebelah, gratis
- ngeprint warna di kantor, gratis
- paku dan palu sisa sana sini, gratis
- cat kayu biar mengkilat, apalah namanya ituh, 15 rebu
- 1x makan siang, ix indomie dan 2 gelas es teh manis

note ;
- sebelumnya bikin meja menghabiskan 2 hari
- Bangku pake bangku rias istri (akhirnya ikhlas, setelah di yakinkan untuk anaknya) saya bikin meja nya kependekan, jadi gak bisa pake bangku normal hehehehehe
- strip garis pakai sticker kertas, jangan sampe ngecatnya kebanyakan, kalau terlalu basah, rembes dan garisnya jadi berleber. 1 x aja gak usah banyak lapis
- siapkan print2 kecil ( saya pakai gambar TNT dimana mana) untuk nutupin ketika nyabut sticker, catnya ke cabut juga. Alias nutup aib ngecat.
- Ngecat separo warna dan pake garis bukan niat artistik, tapi karena gak ada tangga buat ngecat sampe atas. jadi setengah ke atas masih cat lama, dan masih bersih.

semoga ruang belajar kakak, bermanfaat dan semakin rajin yaa...
ingat, belajar bukan cuma beresin buku sekolah buat besok doang.

dah beres... puas...

Link html ke FACEBOOK, INSTAGRAM dan TWEETER APPS di joomla

Problem = buka sosmed di desktop kebukanya via browser, bila di hp kebuka appnya, bila tidak ada app nya kebuka mobile web sosmed nya.

mungkin ada cara yang lebih baik dari ini, tapi ini cara saya, semoga bisa jadi alternative.
Kredit buat pembuat syntaxnya, saya hanya modif caranya saja.

Di footer saya buat 3 icon, fb, ig dan tweeter. mereka saya link kan ke sebuah article masing masing. dan di dalam nya saya kasih javascript buat redirect.

Teknik sebenernya= web pop up dulu, detect mobile nya atau tidak, lalu exekusi alamat app nya baru tutup lagi popupnya.

note:
- Bikin article di joomla kalau gak ngerti googling sendiri yah
- bikin link ke single article joomla kalau gak ngerti googling dulu
- Aktifkan script syntax di global config editor texnya dulu yah. cara nya googling dl ajah.
- Copas text, jangan lupa di toogle editor dl
- cara lihat id fb googling dahulu yah

di salah satu singgle articlenya copas kan berikut :


<p> </p>
<p> </p>
<script>// <![CDATA[
            window.onload = function() {
                var desktopFallback = "https://www.facebook.com/ariefwalikotaku/",
                mobileFallback = "https://www.facebook.com/ariefwalikotaku/",
                app = "fb://page/296227787155268";
                if( /Android|iPhone|iPad|iPod/i.test(navigator.userAgent) ) {
                    window.location = app;
                    window.setTimeout(function() {
                        window.location = mobileFallback;
                    }, 25);
                } else {
                    window.location = desktopFallback;
                }
                function killPopup() {
                    window.removeEventListener('pagehide', killPopup);
                }
                window.addEventListener('pagehide', killPopup);
            };
     
// ]]></script>

tinggal ganti nama account fb nya, dan di app di pergunakan id fb, bukan nama

untuk instagram :

mobileFallback = "https://www.instagram.com/arieftangerang2018/",
                app = "instagram://user?username=arieftangerang2018";

Untuk tweeter:

mobileFallback = "https://twitter.com/AriefWalikotaku/",
                app = "twitter://user?screen_name=AriefWalikotaku";

semoga bermanfaat....



Ganti domain dengan frame, joomla jadi tidak mobile responsive

Pada jaman dahulu, saya dapet project membuat website dengan joomla. Lalu saya hosting di pt A tanpa nama domain, karena nama domain sudah di daftarkan di pt B.

Singkat cerita, joomlanya berhasil dengan tampilan web dan mobile dengan plugin jl_brezz_free  yang gratisan. check di laptop keluar tampilan desktop, dan check di hp keluar tampilan mobile. beres.

Tinggal saatnya di forward domain nya. dan berhasil..... seharusnya. Ketika check di laptop tidak ada masalah, namun ketika check di HP kok yang muncul tampilan desk top bukan tampilan mobile. Lalu pusing selama 2 hari....

Kemaren 3 hari sudah berlalu, masih pusing. sekarang sudah bisa, dan saya perlu dokumentasikan sbb:

Penyebab Utama:

DNS forward dari pt. B menggunakan masking yang nota bene mengikutkan frame dalam memanggil alamat web nya. Sedang kan frame tersebut membuat css responsive joomla nya jadi tidak bisa mendetect versi mobile.

Solusi:
Matiin saja maskingnya.

Tapi......
Alamat web nya berubah jadi alamat ip si hosting. (kok ngono?). Akhirnya telp pt. A, kirain dia bisa bantu, ternyata teknik forwarding nya di serahkan ke pt.B. dan pt B hanya ada interface forwarding yang minimalis. dan saya tidak ada hosting di pt.B untuk manipulasi dan cobacoba. Di tawarin ke yang punya website gak mau tampilan seperti itu... wedeh. mentok.

Akhirnya....

Googling 1 harian.

dan mendapatkan triks....

Karena frame si penyebab masalah, dan frame nya tidak bisa di hilangin (mungkin bisa, ada yang pakai cara reload ulang web dengan atribut _top sehingga framenya hilang. tapi saya tidak jalan), berarti frame nya harus di akalin. dan ada interface di pt.B untuk nambahin tag meta html.

inti ngakalinnya, adalah tambahin coding yang di pakai untuk detect browser mobile nya joomla ke
tag meta (pintunya itu doang). Tetep pakai masking dan syntax nya adalah sbb:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />

beres.

semoga bermanfaat


Jumat, 20 Januari 2017

youtube channel mhuallee

game mobile


test game play

dingin dingin horror

z diary final game

SYNTAX HTML BIAR TETAP TERLIHAT DI BLOG

Ada masalah mendasar ketika posting, atau mau berbagi atau share syntax html atau pemrograman yang lain. Blog akan langsung menterjemahkan code tersebut dan browser akan menampilkan hasilnya langsung bukan berupa kode.

Padahal kode mentahnya yang sangat di butuhkan untuk copas.

Pastinya males ketik ulang satu satu dari atas ke bawah, mana kalau salah satu huruf jadinya syntax eror, salah satu capslock variable nya gak kepanggil, salah ke enter bisa berabe. Terus apalah apalah apalah. Intinya belajar programing itu nomor 1 adalah COPAS, nomor 2 baru ngertiin maksudnya, nomor 3 baru rubah variable ajah.

hehehehehehe

kembali ke masalah posting syntax html. misalkan

code seperti:

<h2>Langkah 1. Klik "Choose File" untuk pilih gambar jpg atau langsung foto <br></h2>
     
<form action="" method="post" enctype="multipart/form-data" id="something" class="uniForm" runat="server"  onsubmit="ShowLoading()"> 
<input name="new_image" id="new_image" size="30" type="file" class="fileUpload" /> <br /><br /><br /><br /><br /><br />
  <h2>Langkah 2. Klik SAVE IMAGE <br></h2>
    <button name="submit" type="submit" class="submitButton">Upload / Save Image</button>
  </form>

akan di tampilkan seperti ini:

   

Langkah 1. Klik "Choose File" untuk pilih gambar jpg atau langsung foto



   
 


-----------------------------------------------------

maka dari itu setahu saya ada beberapa cara yang saya anjurkan:
  1. Bila anda bloger programmer yang sering update syntax, maka modiflah html template blog anda biar gak ribet ribet terus setiap upload
  2. Tambahkan tag script atau tag pre
  3. Bila anda bloger copas atau programmer minim jam terbang kayak saya, parsing html syntax secara online merupakan pilihan termudah


beberapa contoh alamat parsing syntax html mudah:

  • http://www.blogcrowds.com/resources/parse_html.php
  • http://hilite.me/  (pakai warna warna)
  • https://gist.github.com/
  • http://pygments.org/


Semoga bermanfaat.


Upload foto dg kompresi di klient (PHP) bagian 3

Full Coding Upload foto dg kompresi di klient menggunakan PHP


ini syntax keseluruhan di halaman pertama



<style type="text/css">
<!--
body {
 margin-left: 0px;
 margin-top: 0px;
 margin-right: 0px;
 margin-bottom: 0px;
}
-->
</style>
<script type="text/javascript">
    function ShowLoading(e) {
        var div = document.createElement('div');
        var img = document.createElement('img');
        img.src = 'image/loading_bar.gif';
        div.innerHTML = "Loading...<br />";
        div.style.cssText = 'position: fixed; top: 160; left: 42%; z-index: 5000; width: 202px; text-align: center; background: #EDDBB0; border: 1px solid #000';
        div.appendChild(img);
        document.body.appendChild(div);
        return true;
        // These 2 lines cancel form submission, so only use if needed.
        //window.event.cancelBubble = true;
        //e.stopPropagation();
    }
</script>

<table width="100%" bgcolor="#444C4F" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<div align="center">
<img src="image/Header_Mobile.jpg" />
</div>
</td>
</tr>
</table>
<br />
<br />


<?php
include("lib/config.php");
//include("session.php");

$today = date("ymjgis");
//echo "tanggal hari ini : ".$today;

    if(isset($_POST['submit'])){
?>

<div align="center"> 
<h2>Langkah 3. Masukkan ruangan dan penjelasan (lalu klik save)</h2>
<form method="post" enctype="multipart/form-data"  action="terimaorder.php?simpandatanya=yes&name=<? echo $imagepath; ?>">
<table width="100%">
 <tr>
    <td bgcolor="#CCCCCC"><div align="right">Kode Work Order </div></td>
    <td>
      <input name="kodewo" type="text" value="<? echo $today; ?>"  size="25" maxlength="20" />
 </td>
 </tr>
 <tr>
    <td bgcolor="#CCCCCC"><div align="right">Ruangan:</div></td>
    <td>
      <input name="ruanganwo" type="text" value=""  size="50" maxlength="73" />
 </td>
 </tr>

 <tr>
    <td bgcolor="#CCCCCC"><div align="right">Penjelasan WO</div></td>
    <td>
    <textarea name="keteranganwo" cols="50" rows="5"></textarea>
 </td>
 </tr>

<tr>
<td colspan="2">
<!--  <p>&nbsp;</p>
  <p>klik disini untuk upload gambar:</p>
  <p>
   <input type="file" name="myFile">
   <a href="tambahgambarbaru.php"><img src="image/camera.png" border="0"></a>
   </p>
  
   -->
 
  <br>
   
    </td>
</tr>

</table>

















<p>
  <?
      $myFile = $_FILES["new_image"];
 
      if (isset ($_FILES['new_image'])){
          $imagename = $_FILES['new_image']['name'];
          $source = $_FILES['new_image']['tmp_name'];
          $target = "".$imagename;
        //  move_uploaded_file($source, $target);
          $imagepath = $imagename;
          $save = "upload/" . $imagepath; //This is the new file you saving
         // $file = $imagepath; //This is the original file di hp
          list($width, $height) = getimagesize($source) ;

          $tn = imagecreatetruecolor($width, $height) ;
          $image = imagecreatefromjpeg($source) ;
       //   $image = imagecreatefromjpeg($file) ;
        //  imagecopyresampled($tn, $image, 0, 0, 0, 0, $width, $height, $width, $height) ;
        //  imagejpeg($tn, $save, 70) ;
          $save = "upload/" . $imagepath; //This is the new file you saving
        //  $file = "upload/" . $imagepath; //This is the original file
         // list($width, $height) = getimagesize($file) ;
          list($width, $height) = getimagesize($source) ;
         
    if ( $width >=1024)
    { $modwidth = 1024; }
    else
    { $modwidth = $width; }
          //$modwidth = $width/2;
          $diff = $width / $modwidth;
         // $modheight = 185;
          $modheight = $height/$diff;
   
          $tn = imagecreatetruecolor($modwidth, $modheight) ;
        //  $image = imagecreatefromjpeg($file) ;
          $image = imagecreatefromjpeg($source) ;
         // $image = imagecreatefromjpeg($save) ;
          imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ;
          imagejpeg($tn, $save, 70) ;
   
   
   
        //echo "Large image: <img src='upload/".$imagepath."'><br>";
  //echo $imagepath;
        echo "<img src='upload/".$imagepath."'>";
      }
?>
</p>
     <input name="name" type="hidden" value="<? echo $imagepath; ?>"  />
    <input type="image" src="image/save.jpg" border="0" alt="Submit" />
</form>
</div>
<?  
  
  
  
  
    }
 else
 {

 ?>
<div align="center">   
    <h1>
   
   <!-- <a href="menu.php"><img src="image/backsmall.jpg" border="0" /></a>  <br /> -->
   
    Tambah work order baru <br />
   
   
    <?
$sqlcabangselect = " select * from cabang where idcabang = $cabang ";
$resultcabangselect = mysql_query($sqlcabangselect);
 while ($rs = mysql_fetch_array($resultcabangselect))
{
$namacabang=$rs['namacabang'];
echo $namacabang;
}
?>
 </h1>  
   
    <h2>Langkah 1. Klik "Choose File" untuk pilih gambar jpg atau langsung foto <br>
    </h2>
   
   
<form action="" method="post" enctype="multipart/form-data" id="something" class="uniForm" runat="server"  onsubmit="ShowLoading()"> 
<input name="new_image" id="new_image" size="30" type="file" class="fileUpload" /> <br /><br /><br /><br /><br /><br />
  <!--      <input type="image" src="image/save.jpg" border="0" alt="Submit" class="submitButton"/> -->
  <h2>Langkah 2. Klik SAVE IMAGE <br>
    </h2>
    <button name="submit" type="submit" class="submitButton">Upload / Save Image</button>

 
<? } ?>

 

---------------------------------------------------------------------------------------------

Yang ini untuk file simpen nama gambar ke data base:(terimaorder.php)

<?php
include("lib/config.php");
//include("session.php");

$today = date("ymjgis");
if ($simpandatanya==yes)
{
$sql1x = "  insert into wo (kodewo,ruanganwo,keteranganwo,gambarwo)
 values
 ('$kodewo','$ruanganwo','$keteranganwo','$name')
 ";
$result1x = mysql_query($sql1x);
//echo $sql1x ;

echo "<div align='center'><a href='progress.php'>data WO telah di simpan klick disini untuk lihat<br><img src='image/progress.jpg'  border='0' /></a></div> ";
}
?>

-----------------------------------------------------------------------------------------

semoga bermanfaat.

- lihat disini untuk kajian
- lihat disini untuk penjelasan syntax



Upload foto dg kompresi di klient (PHP) bagian 2

Coding Upload foto dg kompresi di klient menggunakan PHP


Mohon maaf saya lupa referensi yang sudah saya pergunakan agar modul ini bisa jadi, tapi saya tidak membuang syntax asli sebelum di modif, hanya di rem saja. Jaga jaga ada kebutuhan custom yg berbeda dengan yang saya miliki.


BUAT LAH FORM SELECT FILE SEDERHANA

code nya seperti ini:


<h2>Langkah 1. Klik "Choose File" untuk pilih gambar jpg atau langsung foto <br></h2>
     
<form action="" method="post" enctype="multipart/form-data" id="something" class="uniForm" runat="server"  onsubmit="ShowLoading()"> 
<input name="new_image" id="new_image" size="30" type="file" class="fileUpload" /> <br /><br /><br /><br /><br /><br />
  <h2>Langkah 2. Klik SAVE IMAGE <br></h2>
    <button name="submit" type="submit" class="submitButton">Upload / Save Image</button>
  </form>

 
 

note:
  • Intinya kita bikin sebuah form standard dengan input type nya file.
  • Enaknya bila menggunakan mobile, pilih file akan membuat popup feature selain pilih file. kita bisa menggunakan kamera secara langsung.
  • Action nya ada atribut form
  • saya tambahkan loading gif image sebagai indikator, biar terlihat progressnya.
  • Submitnya ke file ini juga tapi saya bikin seleksi kondisi sebelum submit atau sesudah submit (males kebanyakan file)


BIKIN LOADING ANIMASI

Problema user experience ketika ada upload gambar adalah tidak aware adanya proses uploading yang menyita waktu dan bandwith lebih lama dari sebelumnya. mereka sering refresh page, maka proses akan kacau bola ini terjadi. Maka loading progress sangat di butuhkan.

codenya seperti ini :


<script type="text/javascript">
    function ShowLoading(e) {
        var div = document.createElement('div');
        var img = document.createElement('img');
        img.src = 'image/loading_bar.gif';
        div.innerHTML = "Loading...<br />";
        div.style.cssText = 'position: fixed; top: 160; left: 42%; z-index: 5000; width: 202px; text-align: center; background: #EDDBB0; border: 1px solid #000';
        div.appendChild(img);
        document.body.appendChild(div);
        return true;
   }
</script>


note:
  • Taruh di paling atas file landing biar langsung terbaca
  • Masalah coding saya masih tumplex blex dari copas annya
  • Masalah tampilan edit saja di div.style.cssText
  • Gif nya saya buat sendiri pakai flash.




BUAT LANDING PAGE (DIFILE TERSEBUT SENDIRI JG TIDAK PAPA)

codenya seperti ini :


<p>
  <?
      $myFile = $_FILES["new_image"];

      if (isset ($_FILES['new_image'])){
          $imagename = $_FILES['new_image']['name'];
          $source = $_FILES['new_image']['tmp_name'];
          $target = "".$imagename;
        //  move_uploaded_file($source, $target);
          $imagepath = $imagename;
          $save = "upload/" . $imagepath; //This is the new file you saving
           // $file = $imagepath; //This is the original file di hp
          list($width, $height) = getimagesize($source) ;
          $tn = imagecreatetruecolor($width, $height) ;
          $image = imagecreatefromjpeg($source) ;
 //   $image = imagecreatefromjpeg($file) ;
          //  imagecopyresampled($tn, $image, 0, 0, 0, 0, $width, $height, $width, $height) ;
          //  imagejpeg($tn, $save, 70) ;
          $save = "upload/" . $imagepath; //This is the new file you saving
          //  $file = "upload/" . $imagepath; //This is the original file
          // list($width, $height) = getimagesize($file) ;
          list($width, $height) = getimagesize($source) ;
    if ( $width >=1024)
    { $modwidth = 1024; }
    else
    { $modwidth = $width; }
              //$modwidth = $width/2;
          $diff = $width / $modwidth;
         // $modheight = 185;
          $modheight = $height/$diff;
          $tn = imagecreatetruecolor($modwidth, $modheight) ;
          //  $image = imagecreatefromjpeg($file) ;
          $image = imagecreatefromjpeg($source) ;
           // $image = imagecreatefromjpeg($save) ;
          imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ;
          imagejpeg($tn, $save, 70) ;
          //echo "Large image: <img src='upload/".$imagepath."'><br>";
   //echo $imagepath;
        echo "<img src='upload/".$imagepath."'>";
      }
?>
</p>


note:
  • Syntax ajaib buat kompres file dahulu baru di upload
  • Syntax asli yang saya modif saya rem //
  • Saya membuat semua gambar menjadi width 1024, dan height nya proporsional seperti sebelumnya
  • Kompresi file atau resolusinya 70% dari aslinya
  • Sisanya di sesuaikan dengan kebutuhan
  • Dan syntax langsung naikkan file ke internet
  • Jangan lupa chmod folder yang di tuju
  • Lihat comment di belakang rem // untuk penjelasan


Kayaknya semua jelas yah….
Tinggal tambahkan fungsi apa lagi yang di kehendaki sebagai pelengkap. Tambahan yang saya tambahkan adalah:
  • Menyimpan nama file ke data base untuk di panggil lagi di querynya
  • File kompresi ini hanya berlaku untuk jpg, bmp dan gif non ani, bila mau melakukan handling dari file ini bisa saja di lakukan, tapi karena ini hanya prototype dan pakai kamer, jadi jpg sudah cukup
  • Sample foto seblum upload adalah 4 MB an, setelah naik ke internet sebesar 100kb an (sangat significan)
Kayak nya cukup untuk sekarang cara untuk kompresi file sebelum di upload yah…

untuk melihat kajian dan analisa klik here


Upload foto dg kompresi di klient (PHP) bagian 1

Kajian dan uji coba Upload foto dengan kompresi di klient menggunakan PHP


LATAR BELAKANG

Di suatu hari yang tenang, di mulai dengan research bikin prototipe aplikasi untuk management unit rumah tangga. Saya mendapat sebuah tugas untuk membuat system task management berbasis gambar atau foto kejadian dari sebuah unit yang harus ditindak lanjuti oleh unit lain. Unit lain pun bila sudah selesai pekerjaan harus mengupload foto tersebut kembali.

Tidak ada kata kata atau basa basi atau kalimat pembuka surat, pokoknya foto sebelum dan sesudah selesai. Bila ada status sedang di kerjakan dianggap belum selesai. Sadis sih sadis tapi mari di fokuskan untuk menjadi hal yang simple saja.



ANALISA

  1. Karena pengirim tugas bisa ada di mana saja: maka koneksi utama harus menggunakan media internet
  2. Setiap orang sudah menggunakan HP dengan kamera, maka komunikasi foto langsung dari gadget masing masing
  3. Pengguna adalah managerial yang sudah senior (sudah berumur) maka aplikasi harus di buat se sederhana mungkin
  4. Karena ini baru prototype lebih baik di kembangkan dengan web based dulu
  5. Karena management senior tidak familiar dengan app, maka web based lebih dipertimbangkan, karena tidak perlu instalasi
  6. Account app developernya harus di perbaharui, dan ada management yang menggunakan aple device, saya tidak punya apple id developer.  jadi web based juga jadi pemenangnya

YANG PERLU MENJADI PERTIMBANGAN

  1. Otoritas pengguna
  2. Pencegah spam
  3. Kompresi gambar, mengingat hp sekarang default size nya minimal 5 MB ubtuk kamera belakang dirasakan agak susah bila koneksi internet masih 3G
  4. User interface sederhana
  5. Tampilan web untuk mobile
  6. Free knowledge coding yg akan di gunakan = PHP dan MySQL

YANG DI MILIKI SEKARANG

  1. Code php untuk = upload download image standar di network local (bandwith besar)
  2. Hosting di internet ada sub domain yang bisa di pergunakan untuk uji coba.
  3. Waktu 3 hari untuk prototype

Kesimpulan sementara adalah saya harus Fokus untuk mengetahui cara kompresi gambar sebelum di naikkan ke internet.Pertimbangan utama adalah besar file yang langsung di foto dari hp adalah berukuran besar dan dirasakan sangat pelan pada saat upload sehingga seperti hang.

Sebelumnya yang saya tahu adalah melakukan kompresi atau resize image terjadi hanya ketika sudah naik ke internet. Tapi beberapa waktu lalu saya menemukan bahawa hal tersebut dapat di lakukan di sisi klient, mengingat processor handphone tidak dapat di anggap sebelah mata untuk memanipulasi gambar seperti ini cukup mumpuni.

Satu yang saya sesalkan, saya lupa link referensi yang saya dapatkan dan proses apa saja sampai modul ini jadi.

Sooooo… mari kita skip saja dan membahas contoh yang dapat di pergunakan sesuai kebutuhan.
di postingan berikutnya

NEXT PENJELASAN SYNTAX