6,16c6,12
<
---
>
>
>
>
Swipe Gesture Playground
> RJM Programming - November, 2019
> Try swipe gestures below, and we'll detect which type of swipe gesture.
>
18,26c14,19
< var ideas=['#d3cbb8,#6d6027', '#74ebd5,#acb6e5', '#f7b733,#fc4a1a', '#00f260,#0575e6', '#ffc0cb,#800080', '#f3f9a7,#cac531', '#605c3c,#3c3b3f', '#fffbd5,#b20a2c', '#03001e,#7303c0,#ec38bc,#fdeff9', '#ada996,#f2f2f2,#dbdbdb,#eaeaea'];
< var aname = '';
< var urlprefixes = ['//www.behindthename.com/name/~', '//thenamegame-generator.com/lyrics/~.html', '//en.geneanet.org/first-name/~', '//word.tips/words-for/~/?dictionary=wwf'];
< var asked = location.search.split('=')[1] ? true : false;
< var oname = location.search.split('name=')[1] ? decodeURIComponent(location.search.split('name=')[1].split('&')[0]) : '';
< urlprefixes[0] = location.search.split('array=')[1] ? (decodeURIComponent(location.search.split('array=')[1].split('&')[0]) + "//www.behindthename.com/name/~,//thenamegame-generator.com/lyrics/~.html,//en.geneanet.org/first-name/~,//word.tips/words-for/~/?dictionary=wwf").replace(/\[/g,'').replace(/\]/g,'').replace(/\"/g,'').replace(/\'/g,'').split(',')[0].replace('1','//www.behindthename.com/name/~').replace('2','//thenamegame-generator.com/lyrics/~.html').replace('3','//en.geneanet.org/first-name/~').replace('4','//word.tips/words-for/~/?dictionary=wwf') : '//www.behindthename.com/name/~';
< urlprefixes[1] = location.search.split('array=')[1] ? (decodeURIComponent(location.search.split('array=')[1].split('&')[0]) + "//www.behindthename.com/name/~,//thenamegame-generator.com/lyrics/~.html,//en.geneanet.org/first-name/~,//word.tips/words-for/~/?dictionary=wwf").replace(/\[/g,'').replace(/\]/g,'').replace(/\"/g,'').replace(/\'/g,'').split(',')[1].replace('1','//www.behindthename.com/name/~').replace('2','//thenamegame-generator.com/lyrics/~.html').replace('3','//en.geneanet.org/first-name/~').replace('4','//word.tips/words-for/~/?dictionary=wwf') : '//thenamegame-generator.com/lyrics/~.html';
< urlprefixes[2] = location.search.split('array=')[1] ? (decodeURIComponent(location.search.split('array=')[1].split('&')[0]) + "//www.behindthename.com/name/~,//thenamegame-generator.com/lyrics/~.html,//en.geneanet.org/first-name/~,//word.tips/words-for/~/?dictionary=wwf").replace(/\[/g,'').replace(/\]/g,'').replace(/\"/g,'').replace(/\'/g,'').split(',')[2].replace('1','//www.behindthename.com/name/~').replace('2','//thenamegame-generator.com/lyrics/~.html').replace('3','//en.geneanet.org/first-name/~').replace('4','//word.tips/words-for/~/?dictionary=wwf') : '//en.geneanet.org/first-name/~';
< urlprefixes[3] = location.search.split('array=')[1] ? (decodeURIComponent(location.search.split('array=')[1].split('&')[0]) + "//www.behindthename.com/name/~,//thenamegame-generator.com/lyrics/~.html,//en.geneanet.org/first-name/~,//word.tips/words-for/~/?dictionary=wwf").replace(/\[/g,'').replace(/\]/g,'').replace(/\"/g,'').replace(/\'/g,'').split(',')[3].replace('1','//www.behindthename.com/name/~').replace('2','//thenamegame-generator.com/lyrics/~.html').replace('3','//en.geneanet.org/first-name/~').replace('4','//word.tips/words-for/~/?dictionary=wwf') : '//word.tips/words-for/~/?dictionary=wwf';
---
> // Thanks to https://stackoverflow.com/questions/2264072/detect-a-finger-swipe-through-javascript-on-the-iphone-and-android
> document.addEventListener('touchstart', handleTouchStart, false);
> document.addEventListener('touchmove', handleTouchMove, false);
> //document.getElementById('mydiv').addEventListener('click', handleMouseStart, false);
> document.addEventListener('mousedown', handleMouseStart, false);
> document.addEventListener('mousemove', handleMouseMove, false);
30,105d22
< var wasone = -1;
<
< function randgrad() {
< if (wasone < 0) {
< wasone=Math.floor(Math.random() * ideas.length);
< document.getElementById('mydiv').className='s' + wasone;
< wasone=-1;
< }
< setTimeout(randgrad,5000);
< }
<
< function genask(msg) {
< var huhs=["1","2","3","4"];
< var wans="";
< var xans="";
< var ans=prompt(msg + " If you want to play the Name Game for your friend (who should turn away now), answer with Their First Name preceded by Swipe [Up, Down, Left, Right] URL ideas as per ['//www.behindthename.com/name/~', '//thenamegame-generator.com/lyrics/~.html', '//en.geneanet.org/first-name/~', '//word.tips/words-for/~/?dictionary=wwf'] is [1,2,3,4]", "[1,2,3,4] ");
< if (ans == null) { ans=""; }
< if (ans.indexOf('[') != -1 && ans.indexOf('] ') != -1) {
< if (ans.indexOf('[') != 0) { wans=ans.split('[')[0]; }
< xans='[' + ans.split('] ')[0].split('[')[eval(-1 + ans.split('] ')[0].split('[').length)] + "]";
< var xsd=ans.split('] ')[1];
< if (xsd.length > 1) {
< wans+=ans.split('] ')[1];
< } else {
< while (wans == '') {
< wans=prompt("What is your friend's first name?", "");
< if (wans == null) { location.href=document.URL.split('?')[0].split('#')[0]; wans=' '; }
< }
< }
< if (wans.trim() !='') { location.href=document.URL.split('?')[0].split('#')[0] + '?name=' + encodeURIComponent(wans) + '&array=' + encodeURIComponent(xans); }
< }
< }
<
< function doup(msg) {
< if (!asked && oname == '') {
< genask(msg);
< } else if (oname != '' && urlprefixes[0].indexOf('~') != -1) {
< document.title=msg;
< window.open(urlprefixes[0].replace('~', encodeURIComponent(oname)), '_blank', 'top=100,left=100,width=600,height=600');
< } else {
< alert(msg);
< }
< }
<
< function dodown(msg) {
< if (!asked && oname == '') {
< genask(msg);
< } else if (oname != '' && urlprefixes[1].indexOf('~') != -1) {
< document.title=msg;
< window.open(urlprefixes[1].replace('~', encodeURIComponent(oname)), '_blank', 'top=100,left=100,width=600,height=600');
< } else {
< alert(msg);
< }
< }
<
< function doleft(msg) {
< if (!asked && oname == '') {
< genask(msg);
< } else if (oname != '' && urlprefixes[2].indexOf('~') != -1) {
< document.title=msg;
< window.open(urlprefixes[2].replace('~', encodeURIComponent(oname)), '_blank', 'top=100,left=100,width=600,height=600');
< } else {
< alert(msg);
< }
< }
<
< function doright(msg) {
< if (!asked && oname == '') {
< genask(msg);
< } else if (oname != '' && urlprefixes[3].indexOf('~') != -1) {
< document.title=msg;
< window.open(urlprefixes[3].replace('~', encodeURIComponent(oname)), '_blank', 'top=100,left=100,width=600,height=600');
< } else {
< alert(msg);
< }
< }
118d34
<
142c58
<
---
>
146c62
< doleft('You swiped left.'); // alert('You swiped left');
---
> alert('You swiped left');
149c65
< doright('You swiped right.'); // alert('You swiped right');
---
> alert('You swiped right');
154c70
< doup('You swiped up.'); // alert('You swiped up');
---
> alert('You swiped up');
157c73
< dodown('You swiped down.'); // alert('You swiped down');
---
> alert('You swiped down');
163c79
< yDown = null;
---
> yDown = null;
166d81
<
191c106
< doleft('You moved mouse left.'); // alert('You moved mouse left');
---
> alert('You moved mouse left');
194c109
< doright('You moved mouse right.'); // alert('You moved mouse right');
---
> alert('You moved mouse right');
199c114
< doup('You moved mouse up.'); // alert('You moved mouse up');
---
> alert('You moved mouse up');
202c117
< dodown('You moved mouse down.'); // alert('You moved mouse down');
---
> alert('You moved mouse down');
207,208c122,123
< yDown = null;
< }
---
> yDown = null;
> }
210,239d124
<
<
< function onl() {
< if (!asked && oname == '') {
< document.getElementById('mydiv').innerHTML=("Swipe Gesture 👉 Playground
RJM Programming - November, 2019
Try swipe gestures below, and we'll detect which type of swipe gesture.
");
< document.getElementById('mydiv').style.paddingLeft='10px';
< document.getElementById('mydiv').style.border='2px solid orange';
< } else {
< document.getElementById('mydiv').innerHTML=("Swipe Gesture 👉 Game for " + oname + " ... Welcome!
RJM Programming - November, 2019
" + oname + ", try swipe gestures 👉 below to surprise yourself!.
");
< document.getElementById('mydiv').className='s7'; //.style.background='linear-gradient(90deg,#03001e,#7303c0,#ec38bc,#fdeff9) !important;';
< document.getElementById('mydiv').style.paddingLeft='10px';
< document.getElementById('mydiv').style.border='2px solid orange';
< setTimeout(randgrad,5000);
< }
< // Thanks to https://stackoverflow.com/questions/2264072/detect-a-finger-swipe-through-javascript-on-the-iphone-and-android
< document.addEventListener('touchstart', handleTouchStart, false);
< document.addEventListener('touchmove', handleTouchMove, false);
< //document.getElementById('mydiv').addEventListener('click', handleMouseStart, false);
< document.addEventListener('mousedown', handleMouseStart, false);
< document.addEventListener('mousemove', handleMouseMove, false);
< }
<
<
<
<
<
<
<