How to Troubleshoot Apps for the Modern Connected Worker
Play search-videos-html
1. 1
CREATING YOUTUBE PLAYLIST
WITH JAVASCRIPT
You can try and download this web (54 KB) at address:
https://files.myopera.com/phanhung20/files/playSearchVideos.html
http://www.mediafire.com/download/icv9yy3w8w2pbbl/playSearchVideos.html
There are in the web “playSearchVideos.html” 171 existing embedded videos from "YouTube.com".
Using this web you can easily add more videos (250, 500, 750 or more) . And the time for this task is
only some minutes. This web helps us create more simple web for playing only videos continuously
,without search videos function.
Image 1 – Play a video clip in “Big Screen”, the button “1 h” was clicked
All existing and newly found videos can be played continuously one after another.
Some videos that are not allowed to watch as embedded are stored in "LIST OF NO PLAYABLE VIDEOS".
2. 2
1- TO WATCH VIDEOS CONTINUOSLY
Click "to Play All" button
Or click "to Play All" then click a song in list to begin with (for example, click "GIOVANNI MARRADI
AMAPOLA").
Click "1 h" button if you want to use our web in one hour. To test this function you can click "5 m" (5
minutes) button.
Click "End" if you want stop video immediately.
Click "to Play One" if you want to watch the current video until its end.
Image 2 – Play a video clip in “Normal Screen”, none of the time button was clicked
There are 669 videos found after three times of searching
(“Francis Goya”, “Fausto Papetti”, “Elvis Presley”)
3. 3
2- TO SEARCH NEW VIDEO
a- Type the name of conductor or the name of orchestra or singer then click S360 to search 360 videos.
b- Wait from 15 to 30 seconds until the percentage "(playable videos)/(all search) %" is shown
Repeat above the steps a, b three times, each time with another name of conductor, singer ...
The name can be absolutely exact. Because of it, I have created a list of "READY SEARCH TERMS". You
can click, for example "101 Strings Orchestra" then click the button "S240" or "S360" to search 240 or
360 videos about "101 Strings Orchestra".
Image 3 – To search video clips of “101 String Orchestra”:
Click “101 String Orchestra” in the list of “READY TERMS” then click “S360”.
Wait 15, 20 seconds until appearing of percentage (304/360 = 84%)
Sometimes (if total number of videos is little), percentage can’t be shown so you have to click the
button "Manually Add Links" to see links to found videos.
4. 4
3- WATCHING AND SELECTING VIDEOS
Click the first video that you see in the "LIST OF PLAYABLE VIDEOS".
Listen the song one after another. If you love some video, click "Select This Videos" button.
The selection of videos is time consuming. Because of that you can delay this task on the next day.
4- MAKING HTML FILE FOR YOUR WEB
Image 4 – Click the button “Make Web” to see HTML and javascript code
To select all the text:
select the first word (<!DOCTYPE), scroll down to the end,
press and hold Shift key and mouse-click after the last word (</html>)
5. 5
4- USING NOTEPAD
Click "Start", "All Programs", "Accessories", "Notepad" to open the program Notepad
In Notepad, click "Edit", "Paste" end you will see text of HTML.
If you do not understand HTML language, do not make any change in this text.
Image 4 – Open Notepad, Edit, Paste then File, Save as …
To save the text as HTML:
Click "File", "Save as" then select
"File name:" -> type the file name, for example, if you have searched "Paul Mauriat" then "Elvis Presley"
and "Franck Pourcel" you may type Mauriat-Elvis-Pourcel.html (REMEMBER: to have always .html after
the file name).
"Save as type:" -> always select "All files".
"Encoding:" -> always select "UTF-8".
Click "Save" button.
5- OPEN YOUR JUST CREATED HTML FILE TO CONTINUE SELECTING VIDEOS
11. 11
obj = document.getElementById("player1");
stID = "http://www.youtube.com/embed/" + vid[i] + "?autoplay=1";
obj.setAttribute("src",stID);
}
var c = 0; var j = 0;
function count(){
last = vid.length - 1;
c = c + 1;
obj = document.getElementById("showSeconds");
obj.value = c + " / dur:" + dur[j];
if(c>dur[j]){
if(j<=last){j=j+1; play(j)}
if (j>last){j=1;play(j)}
}
mytimer = setTimeout("count()",1000);
}
playAll = false;
function selectPlay(){
if (playAll == false){
playAll = true;
obj = document.getElementById("butPlay");
obj.setAttribute("value","to Play One");
count();
}
else{
clrTimer();
}
}
function clrTimer(){
if(playAll){
obj = document.getElementById("butPlay");
obj.setAttribute("value","to Play All");
clearTimeout(mytimer);
playAll = false;
}
}
12. 12
function backVideo(){
len = vid.length -1;
if(j>=2){j=j-1;play(j);}
if (j==1){play(j);alert("Begin Of List");}
}
function nextVideo(){
last = vid.length -1;
if(j<=last){j=j+1;play(j);}
if (j>last){j=1;play(j);}
}
function endVid(){
clrTimer();
st = "http://www.youtube.com/embed/Szi1JzY4z8M?autoplay=0";
obj = document.getElementById("player1");
obj.setAttribute("src",st);
obj = document.getElementById("vidTitle");
obj.innerHTML = 'PLAY ONE';
c = 0; j = 0;
}
function sec(m,s){
return m*60 + s;
}
function t(ti){
tit.push(ti);
}
function v(vi){
vid.push(vi);
}
function d(du){
dur.push(du);
}
function quit(){
if(playAll){
clearTimeout(mytimer);
}
}
//Creating three arrays
tit = []; vid = []; dur = [];
13. 13
k=0;
tit[k]="" ;
vid[k]="" ;dur[k]=0;
t("Tavaszi szellő - ( Giovanni Marradi Too Young )");
v("Szi1JzY4z8M"); d(169);
t("GIOVANNI MARRADI AMAPOLA");
v("M8x3jPGd3dI"); d(146);
t("Giovanni Marradi - Siempre em mi corazon,,,");
v("7xuBmx3F9kw"); d(167);
t("Green Sleeves By Billy Vaughn");
v("LGCTyl49qIw"); d(167);
t("ARRIVEDERCI ROMA-(-MAGICO PIANO G. MARRADI )");
v("NxvVKqIifW4"); d(234);
t("Love Is a Many Splendored Thing by Lawrence Welk, Billy Vaughn");
v("bsE0_as02Fc"); d(322);
t("arriverderci roma...instrumental-12-05-17-16_wmv.wmv");
v("4Tae8cnio-I"); d(203);
t("Maximo Spodek, cuando calienta el sol, instrumental");
v("SnUYmlia0B4"); d(128);
t("TRIO LOS PANCHOS, SIN TI, BOLERO, INSTRUMENTAL");
v("ro-gXCJWipE"); d(200);
t("ROMANTIC PIANO, CHIQUITITA , ABBA, RELAXING, INSTRUMENTAL, HD");
v("lHKVT696NGM"); d(247);
t("MAXIMO SPODEK / I JUST CALLED TO SAY I LOVE YOU / STEVIE WONDER / PIANO / INSTRUMENTAL");
v("0osmn_qb90Q"); d(256);
t("MAXIMO SPODEK, HISTORIA DE UN AMOR, BOLERO PIANO INSTRUMENTAL");
v("oUworiK6Buc"); d(252);
14. 14
t("ABRAZAME, JULIO IGLESIAS, INSTRUMENTAL");
v("q9TfsxH0MGo"); d(205);
t("MANHA DE CARNAVAL - HELMUT ZACHARIAS");
v("dgNI9p5-mpk"); d(183);
// ADD MORE VIDEOS CLIPS HERE
t("Stars on 45 - The Abba medley with NEW intro and outro - and 425 HD pictures!");
v("pkVQZNBNXOo"); d(502);
oldLength = vid.length;
curLength = oldLength;
function init(){
ss = '';
len = vid.length;
lentit = tit.length;
lendur = dur.length;
if(len != lentit || len != lendur || lendur!=lentit){
alert('vid = '+ len + 'n'+
'tit = '+ lentit + 'n'+
'dur = '+ lendur );
}
curLength = vid.length;
if(curLength == oldLength){
for (i=1;i<oldLength;i++){
ima = '<img src="http://img.youtube.com/vi/'+ vid[i] + '/default.jpg">'
xx = '<li><a href="#" onclick="j =' + i +'; play('
+ i+');">'+ tit[i]+ '</a><br><br>';
ss = ss + ima+'<br>'+xx;
}
obj = document.getElementById("list1a");
obj.innerHTML = '<ol><br>' + ss + '</ol>';
}
if(curLength > oldLength){
for (i=oldLength;i<curLength;i++){
ima = '<img src="http://img.youtube.com/vi/'+ vid[i] + '/default.jpg">'
yy = '<li><a href="#" onclick="j =' + i +'; play('
15. 15
+ i+');">'+ tit[i]+ '</a><br><br>';
ss = ss + ima+'<br>'+yy;
}
obj = document.getElementById("list1b");
obj.innerHTML = '<ol><br>' + ss + '</ol>';
}
}
function getWidth(){
xWidth = null;
if(window.screen != null)
xWidth = window.screen.availWidth;
if(window.innerWidth != null)
xWidth = window.innerWidth;
if(document.body != null)
xWidth = document.body.clientWidth;
return xWidth;
}
function getHeight() {
xHeight = null;
if(window.screen != null)
xHeight = window.screen.availHeight;
if(window.innerHeight != null)
xHeight = window.innerHeight;
if(document.body != null)
xHeight = document.body.clientHeight;
return xHeight;
}
function screenFull(){
if(bigScreen == true){
var wi = 835;
var hi = 480;
17. 17
document.getElementById("selectHTML").innerHTML = selectSt;
}
function formatSeconds(seconds){
var date = new Date(1970,0,1);
date.setSeconds(seconds);
return date.toTimeString().replace(/.*(d{2}:d{2}:d{2}).*/, "$1");
}
function tim(){ // this means time function
var d1=new Date();
var n1=d1.toTimeString();
n1 = n1.substring(0,8)
document.getElementById('clock').innerHTML=n1;
sss = secSinceMidnight();
if(sss == sec3){endVid();
document.getElementById('clockEnd').innerHTML=' STOP ';
alert('Time is up!n'+
'Click any song in the list to play this onen'+
'To watch continously click "to Play All", then click a song in list to begin');
}
timer2 = setTimeout('tim()',1000);
}
function secSinceMidnight(){
var now1 = new Date();
var hours = now1.getHours()*(60*60);
var minutes = now1.getMinutes()*60;
var seconds = now1.getSeconds();
return hours+minutes+seconds;
}
sec3 = 0; //Local variable;
function test(min){
sec1 = secSinceMidnight();
sec2 = min*60;
sec3 = sec1 + sec2;
resul = formatSeconds(sec3);
obj = document.getElementById("clockEnd");
18. 18
obj.innerHTML = resul;
}
function load1(){
init();
tim();
document.getElementById('oldLen').value = ''+ (oldLength-1);
document.getElementById('newLen').value = '0';
document.getElementById('curLen').value = ''+ (oldLength-1);
}
qHelp = 'QUICK HELPnn'+
'There are about 100 videos from "YouTube.com", embedded in this webnn'+
'Using this web you can easily add 250, 500, or 750 videos more. And the time for this task is only
some minutesnn'+
'Some videos that are not allowed to watch as embedded are recorded in "LIST OF NO PLAYABLE
VIDEOS"nn' +
'1- TO WATCH VIDEOS CONTINUOSLYnn'+
'Click "to Play All" buttonn'+
'Or click "to Play All" then click a song in list to begin with (for example, click "GIOVANNI MARRADI
AMAPOLA")nn'+
'Click "1 h" button if you want to use our web in one hour. To test this function you can click "5 m"
(5 minutes) buttonnn'+
'Click "End" if you want stop video immediatelynn'+
'Click "to Play One" if you want to watch the curent video until its endnn'+
'2- TO SEARCH NEW VIDEOnn'+
'a- Type the name of conductor or the name of orchestra or singer then click S360 to search 360
videosnn'+
'b- Wait from 15 to 30 seconds until the percentage'+
' "(playable videos)/(all search) %" is shownn'+
'Repeat above the steps a, b three times, each time with another name of conductor, singer
...nn'+
'The name can be absolutely exact. Because of it, I have created a list of "READY SEARCH TERMS".
You can click, for example "101 Strings Orchestra" then click the button "S240" or "S360" to search 240
or 360 videos about "101 Strings Orchestra"nn' +
'If percentage is not shown, you have to click "Manually Add Links"nn'+
'3- WATCHING AND SELECTING VIDEOSnn'+
19. 19
'Click the first video you see in the "LIST OF PLAYABLE VIDEOS"nn'+
'Listen the song one after another. If you love some video, click "Select This Videos" buttonnn' +
'The selecting videos process it time consuming. Because of that you can delay this task on the next
daynn'+
'4- MAKING HTML FILE FOR YOUR WEBnn'+
'Click "Make Web" button and you can see two HTML filesnn'+
'The "Web with selected videos" and the "Web is all new videos"nn'+
'Using mouse-drag to select all html file (from "<!DOCTYPE ..." to </html>)n'+
'Instead of "mouse drag" you can do like this: mouse-drag to select only the first word
"<!DOCTYPE", scroll down to the end of HTML file, press and hold the key button "Shift", mouse click
after ">" of the last word "<html>".nn'+
'4- USING NOTEPADnn'+
'Click "Start", "All Programs", "Accessories", "Notepad" to open the program Notepadnn'+
'In Notepad, click "Edit", "Paste" end you will see text of HTMLnn'+
'If you do not understand HTML language, do not make any change in this textnn'+
'To save the text as HTML:nn'+
'Click "File", "Save as" then select:nn'+
'"File name:" -> type the file name, for example, if you have searched "Paul Mauriat" then "Elvis
Presley" and "Franck Pourcel" you may type Mauriat-Elvis-Pourcel.html (REMEMBER: to have always
.html after the file name)nn'+
'"Save as type:" -> always select "All filesnn"'+
'"Encoding:" -> always select "UTF-8"nn'+
'Click "OK"nn'+
'5- OPEN YOUR JUST CREATED HTML FILE TO CONTINUE SELECTING VIDEOSnn'
function quickHelp(){
alert(qHelp);
}
function showHelp(){
qHelp1 = qHelp.replace(/n/g,'<br>');
document.getElementById("helpDiv").innerHTML = qHelp1;
}
