PANDUAJI.COM: Tutorial

, by Pandu Aji Wirawan

Tutorial

[Solved] How To Redirect HTTP to HTTPS Easily

No comments

, by Pandu Aji Wirawan

Tutorial

How To Change Wordpress Password via phpMyAdmin

No comments

, by Pandu Aji Wirawan

Tutorial

How To Download and Upgrading SJCAM SJ5000+ FIrmware

A few weeks ago i got experience during upgrading sjcam sj5000+ firmware. So, i decided to create video tutorial that explain how to update sjcam sj5000+ that you can get about $200. Half price for action cam like go pro.

When i was trying to update the firmware, i got problem because the firmware is not compatible. It make the camera on white blank screen. You can record and taking picture but nothing display in lcd. Just like you have an yi action cam. It make the LCD useless. Ok, let start the detail tutorial below.

Dowload SJCAM SJ5000 Firmware (17 Juni 2015)

Before updating the default firmware, you need to download the firmware first. You need to make sure that firmware on your sjcam is under 2.6, because the firmware that i've write here is for 2.6

SJCAM LCD Scren

Here you can found two firmware version that you can check, for 1.5" lcd and 1.54" lcd. If you confuse how to knowing sjcam lcd, just see the sjcam box and you will get information about your sjcam.

Attention :

Do at your own risk. I am not responsible if this tutorial make your cam broken. Because i do this tutorial and everything works fine.

How To Install / Update / Upgrade SJCAM

If you confuse how to install / update / upgrade your sjcam firmware, you can following this step.

Format your SD Card that use on the cam
Extract downloaded firmware
Move the SJCAM_FWUPDATE.bin into root folder of your SD Card
Plug the SD Card and Turn on the cam
Press mode button to get the menu
Select firmware menu
You will prompt about firmware update, press green button
Just wait the updating firmware. Make sure that your cam not turn off during updating
After upgrading, camera will be restart.

If your just got blank white screen after updating, dont worry. Because i also get it on the first update. just read this article till end to fix it.

Video Tutorial How To Upgrade SJCAM SJ5000 Firmware

[Solved] Blank White Screen SCJAM After Install Firmware

If you get problem after upgrading sjcam firmware you need to do this following step to make your lcd screen work again. Your camera is work fine, just the LCD not working. Its happen because you install wrong firmware

You need to do this step carefully. Or your lcd screen not work properly

Replace firmware on sd card with another firmware.
Turn on your sjcam sj5000 and wait till get blink lamp. After that, your camera ready on video mode
Press mode button 4 times. Do it slowly to make sure that your cam go to menu mode
Press up button once to move your cam into firmware update menu
Press shutter button to make your cam do firmware update
Press up button once to make sure your cam select green button
Press Shutter and wait about 5 minute. If you do it carefully your camera will be restarted and the lcd screen is back. Try again if the cam not restarted untill success.

I hope this tutorial can help you to solve the sjcam problem after upgrading the firmware. Don't forget to share this article to your friend that got problem after updating sjcam firmware.

No comments

, by Pandu Aji Wirawan

Software

Two Best HTML Editor on Ubuntu

No comments

, by Pandu Aji Wirawan

Tips and Trick

[SOLVED] How To Delete Multiple Contact on Android

No comments

, by Pandu Aji Wirawan

Tutorial

How To Install Chrome Browser on Ubuntu or Linux Mint Using Command Line

No comments

, by Pandu Aji Wirawan

Tutorial

How To Place Ads After Title Post on Blogger

How To Place Ads After Title Post on Blogger - On this post i want share about blogger tutorial. I am using blogger platform for this domain. I will share how to adding ad code after title. So the ads will be look like this. This tutorial special for the people who monetize their blog

Ads After Title

Why the ads placed after the title? Because this place is have high CTR and it will help you earn some money. Are you interest with this? If you don't know how to do it, please follow this instruction.

Getting Ad Code

The first step is getting your ad code from the publisher platform such as google adsense or the other platform. On this place, i prefer you are using 300 x 250 ads. Why? Because visitor can see this ads perfectly using pc or mobile phone. You don't need to use responsive ads. If you want it, up to you.

Create div for The Ads

Next step is create div for the ads. This div will help you to add space between ads and the content, so you don't violate the publisher guidelines. For example, see the code below

<<div class="ads"> Ad Code Here </div>

After that, your ads will be inside the div box called ads

Adding CSS for the Space

You just need to adding padding to the ads div so the ads will have space with the content of your page. You can using this css code for the ads

.ads{

padding: 10px 5px 10px 0px;

float:left;

}

Place the css code on the head of your blog template. If you want the ads on the right side, you can change the float to the right and need to change padding srtucture too.

Adding the Ad Code Into Blogger

Now, you need to find right place for this code on your blogger template. Open your template html and search for data:post.body . Maybe you will found more than one on the template.

After found data:post.body, you need to encode your ad code script. I am using html entities to encode the ad script. After encode the script, you will get like the image below

Encode Code

After encoding the ads code, place the code before data:post.body. so your code will be look like this.

adding ad code

If you template don't give commend for the ads code, just try every data:post.body on your template untill you get the ads showing on the right place.

I hope this simple blogger tutorial can help you get more earning for your blog.

No comments

, by Pandu Aji Wirawan

Tutorial

[Solved] Warning: date() on PHP

No comments

, by Pandu Aji Wirawan

Tutorial

[SOLVED] GD Library Error for TimThumb

No comments

, by Pandu Aji Wirawan

Tutorial

How To Create Database Connection with PHP

I am still learn abou PHP programming, on this post i want share with you how to create database connection with php. With this connection, you can use to modify database with your php script. Let start simple tutorial create connection between php / website with database.

Create Database Connection with PHP

Let start with running localhost server, i am using Lampp on ubuntu. If you don't know, just follow my older post about how to install lampp on ubuntu. You can start lampp with this command on terminal

sudo /opt/lampp/lampp start

After the server running, open the phpmyadmin to create the database. You must set the database first before creating connection with it.

Create Database with phpMyadmin

After your server running, just open localhost/phpmyadmin to access database control panel. Create database on database menu. For example i am using mmbasik database.

Create Database

Create New User on Database

You can using default user root on the database, but i prefer to create user that only for this database. Administration user for one database. Open previlege menu to create new user role for new database that we've create on last step. Iam using simple password for testing

create user on database

After creating database, its time to create connection between database and php script.

Create Connection to Database

On this post I just focus on creating connection to database, so i let my database empty. If you want input some data on database, feel free.

Let start copying the script below and save with .php extension. for example (connection.php)

<?
mysql_connect("localhost","databaseusername","databasepassword");
$conn=mysql_select_db("databasename");
if($conn){
 echo "connect";
}else{
 echo "disconnect";
}>

After creating the script below, don't forget to place the script on the htdocs / www folder. If you are using xampp, the folder name is htdocs that place on /opt/lampp/htdocs.

Now lets runt the script on the browser with typing this address

http://localhost/connection.php

If your username, password and database name is correct you will get connect message. If what your enter on the that script is wrong, you will get disconnect message.

I hope you can use following this tutorial, if you have any question feel free to ask me on this comment section :)

Best Regrads

panduaji.com

No comments

, by Pandu Aji Wirawan

Blog Tips

How To Create Custom Domain on Blogger

How to Custom Domain Blogger - Blogger is a blogging platform that is currently owned by google. Each blog is using the engine bloggers will have subdomain *.blogspot.com. In this post, I want to share how to create custom domain blogger. For the pepole who are new to the blog world might be wondering, what the custom domain on blogger?

Blogger custom domain is a way to change the subdomain *.blogspot.com be the name of yourdomain.com or the other. Like panduaji.com, initially was panjiwa.blogspot.com. When you open panjiwa.blogspot.com you will redirec to www.panduaji.net. It is easier to remember and cool right :D?

Blogger Custom Domain

Before following this tutorial, there are several requirements that must be met. Here’s a list of requirements.

Must already have a blog on blogger
Should have bought the domain that you want to use. you can start with domain .com .net .info etc. it just need about $10 for a year.

Actually quite 2 points above to follow tutorial how to do blogger custom domain. If you do not have a

domain, you can buy at godady, namecheap and the other domain provider.

Setting Custom Domain Blogger

After buy a domain, let start set up custom domain on blogger. Open setting in blogger dashboard and select submenu basic. Add custom domain publishing, so you can enter your domain name on the box. You must adding www. on the front domain like the picture below

After you save it, you will get an error message like that. We have not been able to verify your authority to this domain. Error 12. You got this message because you haven't verified ownership of the domain. You must verify by adding DNS record on the domain settings that can be do through cpanel domain.

Change DNS Record Domain

Lets login into cpanel domain and manage DNS. open CNAME Records and enter the parameter that have provide by google to verify your domain. After you set up the CNAME, you will get like image below

After set CNAME record, we need to set A Name record. So the people who visit your naked domain like yourdomain.com will be redirect to www.yourdomain.com.

Hostname	Destination
blank	216.239.32.21
blank	216.239.34.21
blank	216.239.36.21
blank	216.239.38.21

After set it, wait about 1 - 3 hours and save the setting on the blogger. Let the server pointing new dns for your domain. If you don't know how to set it, please contact customer support of the domain.

Redirect Naked Domain Blogger

If you success save setting domain without error message, congratulations! your blog now can access with custom domain blogger. It means your domain pointing into google host. If you still can't save it, just waiting for 24 hours.

Let start redirect naked domain into www. sub domain. When you don't redirect the domain you must enter www.panduaji.com to open this page. But with redirect, you can enter panduaji.com and the site will be redirect into www.panduaji.com automatically.

I think, tutorial how to create custom domain on blogger is enough. I hope, this simple tutorial can help you to using custom domain on blogger. Cheers!

No comments

, by Pandu Aji Wirawan

internet

If Your Twitter Has Been Hacked! Read This First

Do you think that your Twitter account is hacked? You maybe said that when you feel that your account tweet, or retweet automatically. Any experience like that? If no, you don't need to so serious reading this article, but I think you need to know this. At least you can help you friends who have this kind of problem. So, this is the way. How to handle Twitter account which always tweet, follow, and retweet by itself?

Revoke Access

As I know, revoke access is the most effective way to handle auto tweet, auto follow, auto retweet, and others. In this part I will explain you how to revoke. This is a must to make your account free from hacking. After that I will explain you the reason.

Revoke App Twitter

Login to your Twitter account, via PC/laptop is recommended
Open Settings menu and choose Apps submenu
Revoke access the application that suspected or application that you won't need

The System

Many people don't know why their Twitter account automatically tweet something, follow unknown person, and retweet automatically. Some people assume that account is hacked. Big wrong! Although you change your password, you account still do the same things. Because you permit an application to read and write on your behalf. Have you ever visit link on Twitter that ask you to give access read and write on your account? The appearance is like this:

authorize twitter app

Do you know the meaning of authorize? If you press authorize button, it's mean that application (e.g.:free100follower) can do several points here:

Read tweet from your timeline
Know whoever you follow and follow others
Update your profile
Tweet for yourself

But this apllication can't access direct messgae and your password. So, it will useless when you change your password because it's nothing to do with your password.

Look the bold above. That's the chance you made for them by allowing the application to follow others and post on your behalf, whatever retweet, favourite, or pst a tweet. Auto retweet, follow, and the other will not happened if you choose cancel button.

This is the weakness of people who don't want to read the regulation first.

How can affected by spam application?

Usually spam links packaged to attract people open because they want to know about it and directly click authorize application. This spam application use certain condition to catch database. Like when BBM for Android booming.

I take the example BBM for Android, so many smartphone users who have Twitter account and waiting for BBM access on their Android. Whereas BBM ridiculed by Android and iOS users, but many Android and iOS users want install this application.

Finally appear links with url shortener that let users to download BBM for Android, after click the link you will see authorize page and after you do authorization you will enter the BBM official site that actually hasn't release yet. Some link also give download links to users so that they can directly download BBM for Android.

Otherwise, also package links with hot content. Like the experience of my junior on campus

My Junior Experience

So, if you ever experience it, it doesn't mean that the hacker has your password. But because you give chance to spam application. Although you change your password many times, as long as that spam application still on your account, your account still surprise you with tweet, retweet, and follow people you don't know.

Tips Preventing Spam Application

Here is the tips to minimize spam application trap:

Understand the applications which you give access in your account, don't give access to unidentified application. See the background of application you will install
Read first what's required by that application
Don't attracted to hot links that retweeted by thousands people, because maybe they are also suspected by spam application.

I Hope this post can help you recover your Twitter account. Don't forget share this to your friend so their account wouldn't be full of spam.

No comments

, by Pandu Aji Wirawan

Tool

Install Solaar Logitech Wireless Driver on Linux Ubuntu

Support Logitech M325 Mouse

Solaar is an application that you must install on Ubuntu when you use Logitech wireless device! Perhaps many people who didn’t know the name of application, I just found out a little while ago from OMGUbuntu. So the function of this application is to simplify Logitech management of hardware that is using wireless as a liaison. Incidentally, I use Logitech M325 mouse and just idly trying to install this application and trying some features. Here are some features that i can enjoy this moment. Solaar

Feature The are many features that you get during installation Solaar on Ubuntu, but only some features that can be used by Logitech M325 mouse.

Identification of the type of mouse with this solaar application, i can identify Logitech mouse that i use. Beside that you also can identify every mouse that are around you.
Pair and Unpair with this application, you can connect and turn off the connection with the device, although the unifying receiver is still stuck on the laptop. With Unpair, automatically regardless of where the device is located then it is not able to connect with laptop or your computer anymore.
Knowing the battery capacity is very important for me, because it can be used to keep the vigil when the battery will be exhausted. But it looks like my mouse battery will still endure in quite a long time.

It looks like just 3 features that i felt. For thoose interested in installing Solaar in Ubuntu, try the tutorial below

How to Instal Solaar Logitech Wireless Device on Ubuntu

For install solaar, the first you have to add ppa to repository, this is the way

sudo add-apt-repository ppa:daniel.pavel/solaar

After that upgrade and install Solaar on Ubuntu in a way

sudo apt-get update && sudo apt-get install solaar

If you are using Gnome Shell, follow this command

sudo apt-get update && sudo apt-get install solaar-gnome3

After Solaar installation process is complete, make sure you unplug the unifying receiver first, after that plug it in again. Ta da! Your mouse will be detected by Solaar when it is a Logitech mouse that already provided according to which there is in List Supported Device.

2 comments

, by Pandu Aji Wirawan

internet

How To Create Teleprompter Web Base IV

How To Create Teleprompter Web Base IV - On this last part we will add chat feature thatcan be used communicate between broadcsater and news author. This chat feature is made by Anant Gart from inscript.com, to use it we need a database with name of chat table. To create table as requested by this feature, we can go to localhost/phpmyadmin. After that, open teleprompter database and select sql menu.

Menu SQL

On run sql text area, enter the code below that will make table name with variable needed to use this chat feature

CREATE TABLE `chat` (
  `id` INTEGER UNSIGNED NOT NULL AUTO_INCREMENT,
  `from` VARCHAR(255) NOT NULL DEFAULT '',
  `to` VARCHAR(255) NOT NULL DEFAULT '',
  `message` TEXT NOT NULL,
  `sent` DATETIME NOT NULL DEFAULT '0000-00-00 00:00:00',
  `recd` INTEGER UNSIGNED NOT NULL DEFAULT 0,
  PRIMARY KEY (`id`)
)
ENGINE = InnoDB;

After the database is created, enter database with two users, broadcaster and author as username. In addition, it’s up to you to use your username as what, but you have to keep that in mind.

Add User

After username (at least two usernames). Next we need to enter a username and password of database on chat.php page. This section is located at the top of the file containing

define ('DBPATH','localhost');
define ('DBUSER','usernamedb');
define ('DBPASS','passworddb');
define ('DBNAME','namadb');

After username, password, and database name are set, next we will install this chat feature on the submit page. On the head, enter css link to pop up a chat using html code below

<link type="text/css" rel="stylesheet" media="all" href="css/chat.css" />
<link type="text/css" rel="stylesheet" media="all" href="css/screen.css" />

Next, enter menu to chat with newscaster, why newscaster? Because in this page is accessed by the news author. Here is the code for displaying chat menu with newscaster.

 <a href="javascript:void(0)" onclick="javascript:chatWith('penyiar')">Chat dengan Penyiar</a>

Next insert chat.php into php file submit by way of adding this php code.

<?php
include "chat.php";
$_SESSION['username'] = "penulis" //username penulis
?>

And don’t forget to include external javascript to enable this chat feature

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/chat.js"></script>

Here is the code that i use in submit.php file which serves as news author’s page for entering news data into database.

<html>
<head><title>User Input</title></head>
<link rel="stylesheet" type="text/css" href="form.css">
<link type="text/css" rel="stylesheet" media="all" href="css/chat.css" />
<link type="text/css" rel="stylesheet" media="all" href="css/screen.css" />
<body>
<h2>Input Teleprompter</h2>

<form class="form" method="post" action="addtele.php">  

    <p class="judul">  
        <input type="text" name="judul" id="judul" value="<?php echo isset($_POST['judul']) ? $_POST['judul'] : '';?>" />  
        <label for="judul">Judul</label>  
    </p>  

    <p class="acara">  
        <input type="acara" name="acara" id="acara" value="<?php echo isset($_POST['acara']) ? $_POST['acara'] : '';?>"/>  
        <label for="acara">Acara</label>  
    </p>  

    <p class="creator">  
        <input type="creator" name="creator" id="creator" value="<?php echo isset($_POST['creator']) ? $_POST['creator'] : '';?>" />  
        <label for="creator">Author</label>  
    </p>  

    <p class="isi">  
        <textarea name="isi" value="<?php echo isset($_POST['isi']) ? $_POST['isi'] : '';?>"></textarea>  
    </p>  

    <p class="submit">  
        <input type="submit" value="Kirim" />  
    </p>  

</form>  
 <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/chat.js"></script>
<?php
include "chat.php";
$_SESSION['username'] = "penulis" // Must be already set
?>
<a href="javascript:void(0)" onclick="javascript:chatWith('penyiar')">Chat dengan Penyiar</a>
</body>
</html>

Next we will add this chat feature into newscaster’s page. How to enter the chat feature on this page, the same way as how to enter chat feature on submit.php pages, therefore, Here is the final contents of index.php file i have.

<html>
<head>
<title>Teleprompter</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link type="text/css" rel="stylesheet" media="all" href="css/chat.css" />
<link type="text/css" rel="stylesheet" media="all" href="css/screen.css" />
</head>
<body>
<!-- Copyright Hannu Multanen 2005 - 2009 -->
<!-- www.cueprompter.com -->
<div id="badan">
 <div id="left">
 <table class="listberita">
 <tr><th>Pilihan Berita</th></tr>
 <?php                 
 include "koneksi.php";
 include "chat.php";
 $_SESSION['username'] = "penyiar";
 $sql = " SELECT * FROM input ORDER BY judul ";
 //echo $sql;   
 $sql = mysql_query($sql);
 while ($data=mysql_fetch_array($sql)){
 $d_id = $data["id"]; 
 $d_judul = $data["judul"];
 ?>
 <tr><td color="#FFFFFF"><a href="index.php?id=<?php echo $d_id;?>"><?php echo $d_judul;?></a></td></tr>
 <?php
 }
 ?> 
 </table>
 <br>
    <a href="javascript:void(0)" onclick="javascript:chatWith('penulis')">Chat dengan Penulis</a>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/chat.js"></script>
 </div>
 <div id="right">
  <table width="950px" cellpadding="0" cellspacing="0" border="0" bgcolor="#666666">
  <tr>
  <td class="control">
   <a href="Javascript:pgup()" class="control">PgUp^</a>
   &nbsp;
   <a href="Javascript:rverse()" class="control">&lt;&lt; REVERSE</a>&nbsp;
   <a href="Javascript:stop()" class="control">STOP <span class="stcontrol">||</span></a>&nbsp;
   <a href="Javascript:fward()" class="control">FORWARD &gt;&gt;</a>  
   &nbsp; &nbsp;&nbsp;&nbsp;
  </td>
  <td class="control">
   Speed:
  </td>
  <td class="control">
  <a href="#" onclick="step='1';scspeed='50'" class="control">1</a>&nbsp;
  <a href="#" onclick="step='2';scspeed='40'" class="control">2</a>&nbsp; 
  <a href="#" onclick="step='2';scspeed='30'" class="control">3</a>&nbsp;
  <a href="#" onclick="step='2';scspeed='20'" class="control">4</a>&nbsp;
  <a href="#" onclick="step='3';scspeed='30'" class="control">5</a>&nbsp;
  <a href="#" onclick="step='3';scspeed='15'" class="control">6</a>&nbsp;
  <a href="#" onclick="step='4';scspeed='15'" class="control">7</a>&nbsp;
  <a href="#" onclick="step='5';scspeed='5'" class="control">8</a>&nbsp;
  <a href="#"  onclick="step='10';scspeed='5'" class="control">9</a>
   &nbsp;&nbsp;&nbsp;
   Display mode:
  <a onclick="document.getElementById('prom').style.filter='none'" class="control">Norm</a>&nbsp;
  <a onclick="document.getElementById('prom').style.filter='flipH'" class="control">Mirror</a>&nbsp;&nbsp;&nbsp;
   (Press "F11" for full screen)
  </tr>
  <tr  class="vali">
  <td colspan="3" class="vali">&nbsp;
  </td>
  </tr>
  </table>

<script language="JavaScript1.2">
var scspeed = 20
iens6=document.all||document.getElementById
ns4=document.layers
</script>
<div id="container">
<div id="contents">
</div>
 <div id="content" style="position:relative;width:100%;left:0;top:0;float:right;border:1px solid #CCC; z-index:-99">
<?php 

$id = $_GET['id'];

$sql = " SELECT * FROM input WHERE id = $id ";
//echo $sql;   
$sql = mysql_query($sql);
while ($data=mysql_fetch_array($sql)){
 $d_isi = $data["isi"]; 
}
?>
  <table cellpadding="0" cellspacing="0" border="0" width="100%">
   <tr>
    <td  id="prom" class="teks">
    <p><?php echo $d_isi;?></p></td>
   </tr>
  </table>
  <p class="cueprompter">disini tulisan kecil</p>
 </div>
</div>

</div>
<div>

<script type="text/javascript">
document.onkeyup = KeyCheck;
function KeyCheck(e){
 var KeyID = (window.event) ? event.keyCode : e.keyCode;
 switch(KeyID)
 {
case 112:
alert("nothing!!");}
}
</script>
<script language="JavaScript1.2">
var step=1
if (iens6){
 document.write('</div></div>')
 var contentobj=document.getElementById? document.getElementById("content") : document.all.content
 var contentheight=contentobj.offsetHeight
 if (document.getElementById&&!document.all){
     step=1
 }
}

else if(ns4){
 var contentobj=document.nscontainer.document.nscontent
 var contentheight=contentobj.clip.height
}
function fward() {
 if(window.scrolltimerup){
  clearTimeout(scrolltimerup)
 }
 if(iens6&&parseInt(contentobj.style.top)>=(contentheight*(-1)+100)){
  contentobj.style.top=parseInt(contentobj.style.top)-step
 }else if(ns4&&contentobj.top>=(contentheight*(-1)+100)){
  contentobj.top-=step
 }
 scrolltimerdown = setTimeout("fward()",scspeed)
}
function rverse() {
 if(window.scrolltimerdown){
  clearTimeout(scrolltimerdown)
 }
 if(iens6&&parseInt(contentobj.style.top)<=0){
  contentobj.style.top=parseInt(contentobj.style.top)+5
 }else if(ns4&&contentobj.top<=0){ 
  contentobj.top+=5
 }
 scrolltimerup = setTimeout("rverse()",scspeed) 
}

function stop() {
 if(window.scrolltimerup){
  clearTimeout(scrolltimerup)
 }
 if(window.scrolltimerdown){
  clearTimeout(scrolltimerdown)
 }
}

function pgup(){
 stop()
 if (iens6) {
  contentobj.style.top=0
 }
}

function getcontent_height(){
 contentheight=contentobj.offsetHeight
}
window.onload=getcontent_height

</script>
</body>

Anyone having problems with chat can be inputted but doesn’t show up anything? If you’re having the same problem with me, open chat.php file, then change the code below

if ($_GET['action'] == "chatheartbeat") { chatHeartbeat(); } 
if ($_GET['action'] == "sendchat") { sendChat(); } 
if ($_GET['action'] == "closechat") { closeChat(); } 
if ($_GET['action'] == "startchatsession") { startChatSession(); }

Change to

if (isset($_GET['action'])) { 
     if ($_GET['action'] == "chatheartbeat") { chatHeartbeat(); }  
     if ($_GET['action'] == "sendchat") { sendChat(); }  
     if ($_GET['action'] == "closechat") { closeChat(); }  
     if ($_GET['action'] == "startchatsession") { startChatSession(); }  
}

Already done? Teleprompter web base that you need to do is complete, with the chat feature for newscaster and author news, so they can communicate :D. Good luck with this tutorial.

No comments

, by Pandu Aji Wirawan

internet

How To Create Teleprompter Web Base III

Teleprompter Web Based

In this third parts, i will create a page that displays the results of the input from the author news, so that broadcasters can easily read news. For teleprompter web, I taken from the website cueprompter. I just added option menu of news which is already included by the author of news. So, news anchor can choose the news that will be read. Menu emerge from a database that is already made. For it file name is index.php. Before i create index.php, i created koneksi.php file that serves to connect to the database. This is the contents of koneksi.php file

<?php
mysql_connect("localhost","usernamedb","passdb");

mysql_select_db("namadatabase");

?>

I split page into two, each of page i give left id for left side and right id for right side. First i will discuss on the left side that i will give news list that can be selected by the broadcaster. Source of news that emerged came from news writter that submit through menuisi.php. ( Sections are discussed at Tutorial create a Teleprompter Web Base Part II).
This is html code for table that is used to showing a selection of news

<table class="listberita">
<tr><th>Pilihan Berita</th></tr>
        <tr><td> List berita muncul di sini</td></tr>
</table>

For retrieve news list of database, enter the code below in the table, but don’t put in the columns and rows.

<?php                
include "koneksi.php";
        $sql = " SELECT * FROM input ORDER BY judul ";
//echo $sql;   
$sql = mysql_query($sql);
while ($data=mysql_fetch_array($sql)){
$d_id = $data["id"];
$d_judul = $data["judul"];
?>

As for the displaying the news list that has been stored in the database, enter this code in the table rows

<tr><td color="#FFFFFF"><a href="index.php?id=<?php echo $d_id;?>"><?php echo $d_judul;?></a></td></tr>

Above code is in left id, as for right id i am using code from cuepropter.com

<table width="950px" cellpadding="0" cellspacing="0" border="0" bgcolor="#666666">
  <tr>
  <td class="control">
   <a href="Javascript:pgup()" class="control">PgUp^</a>
   &nbsp;
   <a href="Javascript:rverse()" class="control">&lt;&lt; REVERSE</a>&nbsp;
   <a href="Javascript:stop()" class="control">STOP <span class="stcontrol">||</span></a>&nbsp;
   <a href="Javascript:fward()" class="control">FORWARD &gt;&gt;</a>  
   &nbsp; &nbsp;&nbsp;&nbsp;
  </td>
  <td class="control">
   Speed:
  </td>
  <td class="control">
  <a href="#" onclick="step='1';scspeed='50'" class="control">1</a>&nbsp;
  <a href="#" onclick="step='2';scspeed='40'" class="control">2</a>&nbsp; 
  <a href="#" onclick="step='2';scspeed='30'" class="control">3</a>&nbsp;
  <a href="#" onclick="step='2';scspeed='20'" class="control">4</a>&nbsp;
  <a href="#" onclick="step='3';scspeed='30'" class="control">5</a>&nbsp;
  <a href="#" onclick="step='3';scspeed='15'" class="control">6</a>&nbsp;
  <a href="#" onclick="step='4';scspeed='15'" class="control">7</a>&nbsp;
  <a href="#" onclick="step='5';scspeed='5'" class="control">8</a>&nbsp;
  <a href="#"  onclick="step='10';scspeed='5'" class="control">9</a>
   &nbsp;&nbsp;&nbsp;
   Display mode:
  <a onclick="document.getElementById('prom').style.filter='none'" class="control">Norm</a>&nbsp;
  <a onclick="document.getElementById('prom').style.filter='flipH'" class="control">Mirror</a>&nbsp;&nbsp;&nbsp;
   (Press "F11" for full screen)
  </tr>
  <tr  class="vali">
  <td colspan="3" class="vali">&nbsp;
  </td>
  </tr>
  </table>


<script language="JavaScript1.2">
var scspeed = 20
iens6=document.all||document.getElementById
ns4=document.layers
</script>
<div id="container">
<div id="contents">
</div>
<div id="content" style="position:relative;width:100%;left:0;top:0;float:right;border:1px solid #CCC; z-index:-99">


  <table cellpadding="0" cellspacing="0" border="0" width="100%">
   <tr>
    <td  id="prom" class="teks">
    <p>Isi berita dari database</p></td>
   </tr>
  </table>
  <p class="cueprompter">disini tulisan kecil</p>
</div>
</div>


</div>
<div>


<script type="text/javascript">
document.onkeyup = KeyCheck;
function KeyCheck(e){
var KeyID = (window.event) ? event.keyCode : e.keyCode;
switch(KeyID)
{
case 112:
alert("nothing!!");}
}
</script>
<script language="JavaScript1.2">
var step=1
if (iens6){
document.write('</div></div>')
var contentobj=document.getElementById? document.getElementById("content") : document.all.content
var contentheight=contentobj.offsetHeight
if (document.getElementById&&!document.all){
     step=1
}
}

else if(ns4){
var contentobj=document.nscontainer.document.nscontent
var contentheight=contentobj.clip.height
}
function fward() {
if(window.scrolltimerup){
  clearTimeout(scrolltimerup)
}
if(iens6&&parseInt(contentobj.style.top)>=(contentheight*(-1)+100)){
  contentobj.style.top=parseInt(contentobj.style.top)-step
}else if(ns4&&contentobj.top>=(contentheight*(-1)+100)){
  contentobj.top-=step
}
scrolltimerdown = setTimeout("fward()",scspeed)
}
function rverse() {
if(window.scrolltimerdown){
  clearTimeout(scrolltimerdown)
}
if(iens6&&parseInt(contentobj.style.top)<=0){
  contentobj.style.top=parseInt(contentobj.style.top)+5
}else if(ns4&&contentobj.top<=0){ 
  contentobj.top+=5
}
scrolltimerup = setTimeout("rverse()",scspeed)
}

function stop() {
if(window.scrolltimerup){
  clearTimeout(scrolltimerup)
}
if(window.scrolltimerdown){
  clearTimeout(scrolltimerdown)
}
}

function pgup(){
stop()
if (iens6) {
  contentobj.style.top=0
}
}

function getcontent_height(){
contentheight=contentobj.offsetHeight
}
window.onload=getcontent_height


</script>

Enter this php code that serves to retrieve id of the database in div id content.

<?php 
$id = $_GET['id'];
$sql = " SELECT * FROM input WHERE id = $id ";
//echo $sql;   
$sql = mysql_query($sql);
while ($data=mysql_fetch_array($sql)){
$d_isi = $data["isi"];
}
?>

Enter php code below in the section where the content of news database is displayed

<?php echo $d_isi;?>

Are you confused by the row of code above? This is final file that i used

<html>
<head>
<title>Teleprompter</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<!-- Copyright Hannu Multanen 2005 - 2009 -->
<!-- www.cueprompter.com -->
<div id="badan">
<div id="left">
<table class="listberita">
<tr><th>Pilihan Berita</th></tr>
<?php                
include "koneksi.php";
$sql = " SELECT * FROM input ORDER BY judul ";
//echo $sql;   
$sql = mysql_query($sql);
while ($data=mysql_fetch_array($sql)){
$d_id = $data["id"];
$d_judul = $data["judul"];
?>
<tr><td color="#FFFFFF"><a href="index.php?id=<?php echo $d_id;?>"><?php echo $d_judul;?></a></td></tr>
<?php
}
?>
</table>
<br>
</div>
<div id="right">
  <table width="950px" cellpadding="0" cellspacing="0" border="0" bgcolor="#666666">
  <tr>
  <td class="control">
   <a href="Javascript:pgup()" class="control">PgUp^</a>
   &nbsp;
   <a href="Javascript:rverse()" class="control">&lt;&lt; REVERSE</a>&nbsp;
   <a href="Javascript:stop()" class="control">STOP <span class="stcontrol">||</span></a>&nbsp;
   <a href="Javascript:fward()" class="control">FORWARD &gt;&gt;</a>  
   &nbsp; &nbsp;&nbsp;&nbsp;
  </td>
  <td class="control">
   Speed:
  </td>
  <td class="control">
  <a href="#" onclick="step='1';scspeed='50'" class="control">1</a>&nbsp;
  <a href="#" onclick="step='2';scspeed='40'" class="control">2</a>&nbsp; 
  <a href="#" onclick="step='2';scspeed='30'" class="control">3</a>&nbsp;
  <a href="#" onclick="step='2';scspeed='20'" class="control">4</a>&nbsp;
  <a href="#" onclick="step='3';scspeed='30'" class="control">5</a>&nbsp;
  <a href="#" onclick="step='3';scspeed='15'" class="control">6</a>&nbsp;
  <a href="#" onclick="step='4';scspeed='15'" class="control">7</a>&nbsp;
  <a href="#" onclick="step='5';scspeed='5'" class="control">8</a>&nbsp;
  <a href="#"  onclick="step='10';scspeed='5'" class="control">9</a>
   &nbsp;&nbsp;&nbsp;
   Display mode:
  <a onclick="document.getElementById('prom').style.filter='none'" class="control">Norm</a>&nbsp;
  <a onclick="document.getElementById('prom').style.filter='flipH'" class="control">Mirror</a>&nbsp;&nbsp;&nbsp;
   (Press "F11" for full screen)
  </tr>
  <tr  class="vali">
  <td colspan="3" class="vali">&nbsp;
  </td>
  </tr>
  </table>

<script language="JavaScript1.2">
var scspeed = 20
iens6=document.all||document.getElementById
ns4=document.layers
</script>
<div id="container">
<div id="contents">
</div>
<div id="content" style="position:relative;width:100%;left:0;top:0;float:right;border:1px solid #CCC; z-index:-99">
<?php 
$id = $_GET['id'];
$sql = " SELECT * FROM input WHERE id = $id ";
//echo $sql;   
$sql = mysql_query($sql);
while ($data=mysql_fetch_array($sql)){
$d_isi = $data["isi"];
}
?>
  <table cellpadding="0" cellspacing="0" border="0" width="100%">
   <tr>
    <td  id="prom" class="teks">
    <p><?php echo $d_isi;?></p></td>
   </tr>
  </table>
  <p class="cueprompter">disini tulisan kecil</p>
</div>
</div>
</div>
<div>

<script type="text/javascript">
document.onkeyup = KeyCheck;
function KeyCheck(e){
var KeyID = (window.event) ? event.keyCode : e.keyCode;
switch(KeyID)
{
case 112:
alert("nothing!!");}
}
</script>
<script language="JavaScript1.2">
var step=1
if (iens6){
document.write('</div></div>')
var contentobj=document.getElementById? document.getElementById("content") : document.all.content
var contentheight=contentobj.offsetHeight
if (document.getElementById&&!document.all){
     step=1
}
}

else if(ns4){
var contentobj=document.nscontainer.document.nscontent
var contentheight=contentobj.clip.height
}
function fward() {
if(window.scrolltimerup){
  clearTimeout(scrolltimerup)
}
if(iens6&&parseInt(contentobj.style.top)>=(contentheight*(-1)+100)){
  contentobj.style.top=parseInt(contentobj.style.top)-step
}else if(ns4&&contentobj.top>=(contentheight*(-1)+100)){
  contentobj.top-=step
}
scrolltimerdown = setTimeout("fward()",scspeed)
}
function rverse() {
if(window.scrolltimerdown){
  clearTimeout(scrolltimerdown)
}
if(iens6&&parseInt(contentobj.style.top)<=0){
  contentobj.style.top=parseInt(contentobj.style.top)+5
}else if(ns4&&contentobj.top<=0){ 
  contentobj.top+=5
}
scrolltimerup = setTimeout("rverse()",scspeed)
}
function stop() {
if(window.scrolltimerup){
  clearTimeout(scrolltimerup)
}
if(window.scrolltimerdown){
  clearTimeout(scrolltimerdown)
}
}
function pgup(){
stop()
if (iens6) {
  contentobj.style.top=0
}
}
function getcontent_height(){
contentheight=contentobj.offsetHeight
}
window.onload=getcontent_height
</script>
</body>

Hopefully you guys are already understand with writings and the line of code above :D

No comments

, by Pandu Aji Wirawan

internet

How To Create Teleprompter Web Base I

How To Create Teleprompter Web Base Part I – The Teleprompter, what is it? The Teleprompter is a tool to read for people who are going to speak in public, usually in front of the camera as presenters of news, so the host doesn’t have to read the text many times. With the help of a teleprompter, they can read without being discovered while reading. On this Occasion I would like to write a tutorial step by step about how to create web based teleprompter. Why web based? Because coursework about internet broadcasting is indeed like this :D. An example of a demo can be seen at Telepropter Panduaji pages.
How To Create Teleprompter Web Base will be written on 4 parts:

The concept of the Teleprompter and how to create the database and tables.
Create data input page for author news.
Display a database in a web base teleprompter.
Add the Chat on a teleprompter.

The Teleprompter is used for radio broadcasts, it may also be used to television broadcast. Up To You! Immediately follow this series of tutorials :D

Teleprompter Web Base Concept

An news author input the news that should be read by an announcer over a page that contains a form for it. Then with a few php functions, results of the input by the news author is stored in a database. After that the announcer gets a news option that will be read. It’s up to news anchor will select which news. When author input the news, it will automatically appear a new news option in a new window the news anchor. Hopefully you guys understand with the explanation. Still confused? See picture below.

workflow

Teleprompter Concept

Before creating a database, make sure you’ve installed the server applications such as XAMPP or LAMPP. Use the others as well is up to you. Who do not yet know how to installing please check my post on how to install wordpress in ubuntu. In this article, i will discuss how to create the database and table that i would use to save the input.

Activate the first server application that you’ve installed, whether it’s XAMPP, LAMPP, or phptriad. It’s up to you. For using LAMPP in ubuntu just like me, can use the command

sudo /opt/lamp/lamp start

After that open a browser and enter the address of localhost/phpmyadmin. Select the database, and create a database with the name of the teleprompter (example)

create database

After the database is created, then we create a table that will be used to store each of the input entered by the author of the news. Remember, the author of the news unlike news anchor!! Open the telepropter database that we have created, then add create new table. Create a table with the name of input, in the table enter some parameters below

NAME	Type	Long	INDEX	AUTO_INCREMENT
id	int	10	PRIMARY	YES
judul	varchar	60	-	No
isi	text	-	-	No
acara	varchar	60	-	No
creator	varchar	60	-	No

After that choose storage engine to MyISAM, still confused? Following this screenshot

create database table

I Hope you understand with this first part tutorial and wait for the tutorial to make teleprompter web base only at Panduaji.com :D

No comments

, by Pandu Aji Wirawan

Pages

Downloading Android Studio for Ubuntu

Installing Android Studio on Ubuntu Machine

How To Redirect HTTP to HTTPS on Wordpress

Change Wordpress Password via phpMyadmin

Open phpMyAdmin

Change The Password of User

Dowload SJCAM SJ5000 Firmware (17 Juni 2015)

How To Install / Update / Upgrade SJCAM

Video Tutorial How To Upgrade SJCAM SJ5000 Firmware

[Solved] Blank White Screen SCJAM After Install Firmware

Best HTML Editor That I've Used on Ubuntu

How to Install Brackets on Ubuntu

How to Install Atom on Ubuntu

How To Delete Multiple Contact in Android KitKat

Install Google Chrome on Ubuntu / Linux Mint

Getting Ad Code

Create div for The Ads

Adding CSS for the Space

Adding the Ad Code Into Blogger

Search for date.timezone

Create Database Connection with PHP

Create Database with phpMyadmin

Create New User on Database

Create Connection to Database

Blogger Custom Domain

Setting Custom Domain Blogger

Change DNS Record Domain

Redirect Naked Domain Blogger

Revoke Access

The System

How can affected by spam application?

Tips Preventing Spam Application

How to Instal Solaar Logitech Wireless Device on Ubuntu

Teleprompter Web Base Concept

Teleprompter Concept

Flickr Images

Blog Archive

Popular Posts

Labels

My Business

Subscribe