talksik/DoEverythingBar
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

almost final

Browse Source 
problems with implementing skype call api with automatic button press
This commit is contained in:
Arjun Patel
2017-10-08 03:50:23 -07:00
parent 9c7cbb794b
commit 7e0f356838
7 changed files with 179 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files
images/check.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

images/guide-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.5 KiB

images/head.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.5 KiB

index.html
+28 -9
View File
@@ -3,6 +3,8 @@
<head> <head>
<title>DoEverythingBar</title> <title>DoEverythingBar</title>
<link rel="icon" href="images/head.png">
<link href="https://fonts.googleapis.com/css?family=Playfair+Display" rel="stylesheet">
<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script> <script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
@@ -10,26 +12,27 @@
<link rel="stylesheet" type="text/css" href="main.css"> <link rel="stylesheet" type="text/css" href="main.css">
</head> </head>
<body> <body spellcheck="false">
<button id="authorize-button" style="display: none;">Sign-In</button> <button id="authorize-button" style="display: none;">Sign-In</button>
<button id="signout-button" style="display: none;">Sign-Out</button> <button id="signout-button" style="display: none;">Sign-Out</button>
<button id="create-event" style="display: none;">Create-Event</button> <button id="create-event" style="display: none;">Create-Event</button>
<button id="SkypeButton_Call_justinkimchi77_1" style="display:none;"> <div id="SkypeButton_Call_justinkimchi77_1" style="display:none;">
<script type="text/javascript"> <script type="text/javascript">
//function skypeCall(userName) {
Skype.ui({ Skype.ui({
"name": "call", "name": "call",
"element": "SkypeButton_Call_justinkimchi77_1", "element": "SkypeButton_Call_justinkimchi77_1",
"participants": [""] "participants": ['justinkimchi77']
}); });
// }
</script> </script>
</button> </div>
<div class="container main-bg" id="content"> <div class="container main-bg" id="content">
<div class="row"> <div class="row">
<div class="col-xs-8 search-col"> <div class="col-xs-12 search-col">
<div id="search-cont"> <div id="search-cont" class="search-cont">
<div class="input-group stylish-input-group"> <div class="input-group stylish-input-group">
<input type="text" id="input" class="form-control" placeholder="Search" > <input type="text" id="input" class="form-control" placeholder="Search" >
<span class="input-group-addon"> <span class="input-group-addon">
@@ -42,6 +45,7 @@
</div> </div>
</div> </div>
</div> </div>
<image src="images/guide-icon.png" class="guide-icon" id="guide-icon">
<iframe <iframe
height="100%" height="100%"
@@ -52,6 +56,21 @@
</iframe> </iframe>
</div> </div>
<div class="guide-popup container">
<div id="cancelParent"><image class="cancelPop" src="images/error.png"></div>
<div class="row">
<div class="col-xs-4 cols">
<p class="text">gcal | googlecalendar<br><hr><br>mapsd | directions<br><hr><br>skype</p>
</div>
<div class="col-xs-8 cols" style="border-left: 1px solid white;">
<p class="text"><br><i>[mm/dd/yy] [00:00] [00:00]</i><br><hr><br><i>[address]</i> to <i>[address]</i> <i>[method of travel]</i><br><hr><br><i>[username]</i></p>
</div>
</div>
</div>
<div class="updateCont">
<image class="check" src="images/check.png">Added Event!</div>
<script type="text/javascript" src="google/maps.js"></script> <script type="text/javascript" src="google/maps.js"></script>
<script type="text/javascript" src="google/calendar.js"></script> <script type="text/javascript" src="google/calendar.js"></script>
<script type="text/javascript" src="main.js"></script> <script type="text/javascript" src="main.js"></script>
main.css
+96 -11
View File
@@ -9,8 +9,18 @@ body {
width: 100%; width: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: 'Playfair Display', serif;
}
.row {
margin: 0;
padding: 0;
width: 100%;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
} }
div.main-bg { div.main-bg {
background-image: url("images/main-bg.jpg"); background-image: url("images/main-bg.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
@@ -19,18 +29,25 @@ div.main-bg {
padding: 0; padding: 0;
height: 100%; height: 100%;
width: 100%; width: 100%;
/*border: 2px solid red;*/ }
.guide-icon {
margin: 0;
padding: 0;
position: fixed;
top: 15px;
left: 15px;
height: 20px;
width: 20px;
}
.search-col {
width:500px;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
} }
.search-col {
margin: 0;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
font-size: 30px;
}
.stylish-input-group .input-group-addon{ .stylish-input-group .input-group-addon{
background: white !important; background: white !important;
@@ -55,3 +72,71 @@ div.main-bg {
height: 15px; height: 15px;
width: 15px; width: 15px;
} }
.guide-popup {
position: fixed;
height: 280px;
width: 500px;
background-color:#dce2ed;
border-radius: 4px;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
color: black;
font-family: 'Playfair Display', serif;
border: .5px solid black;
display: none;
}
div.cols {
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
height: 260px;
top: 0;
}
p.text {
margin-top: 20px;
font-size: 15px;
}
#cancelParent {
margin: 0;
padding: 0;
position: fixed;
right: 5px;
top: 5px;
height: 20px;
width: 20px;
z-index: 10;
}
.cancelPop {
margin: 0;
padding: 0;
position: fixed;
right: 5px;
top: 5px;
height: 20px;
width: 20px;
}
.updateCont {
position: fixed;
font-weight: bold;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
text-align: center;
bottom: 0;
margin: 0;
padding: 0;
width: 120px;
color: green;
display: none;
}
.check {
margin-right: 5px;
height:15px;
width: 15px;
right:0;
top: 0;
}
main.js
+27 -9
View File
@@ -2,14 +2,25 @@ var enterBtn = document.getElementById("enter");
var authorizeButton = document.getElementById('authorize-button'); var authorizeButton = document.getElementById('authorize-button');
var signoutButton = document.getElementById('signout-button'); var signoutButton = document.getElementById('signout-button');
var guideIcon = document.getElementById('guide-icon');
guideIcon.addEventListener("click", function() {
$('.guide-popup').slideDown(500);
$('.cancelPop').fadeIn();
$('#cancelParent').click(function() {
console.log('hi');
$(this).fadeOut();
$('.cancelPop').fadeOut();
$('.guide-popup').fadeOut();
});
});
var runCommandBtn = document.getElementById('create-event'); var runCommandBtn = document.getElementById('create-event');
enterBtn.addEventListener("click", captureInput); enterBtn.addEventListener("click", captureInput);
window.addEventListener("keypress", function(e) { window.addEventListener("keypress", function(e) {
var key = e.which || e.keycode; var key = e.which || e.keycode;
if (key == 13) { if (key == 13) {
captureInput(); captureInput();
} }
}); });
var actualCommand = ''; var actualCommand = '';
var command = ''; var command = '';
@@ -18,7 +29,7 @@ var dict = {
"googlecalendar": makeEvent, "googlecalendar": makeEvent,
"mapsd": directionsURL, "mapsd": directionsURL,
"directions": directionsURL, "directions": directionsURL,
"skype": skypeCall "skype": 'buffer'
}; };
function error() { function error() {
@@ -42,7 +53,11 @@ function captureInput() {
console.log('actualCommand is empty!!'); console.log('actualCommand is empty!!');
error(); error();
} }
else if (command == "skype") {
console.log('launched skype app');
//skypeCall(actualCommand);
document.getElementById('SkypeButton_Call_justinkimchi77_1').click();
}
else if (gapi.auth2.getAuthInstance().isSignedIn.get()) { else if (gapi.auth2.getAuthInstance().isSignedIn.get()) {
console.log('already signed in'); console.log('already signed in');
runCommandBtn.addEventListener("click", runCommand); runCommandBtn.addEventListener("click", runCommand);
@@ -51,6 +66,9 @@ function captureInput() {
dict[command](actualCommand); dict[command](actualCommand);
} }
runCommandBtn.click(); runCommandBtn.click();
if (command == 'gcal') {
$('.updateCont').slideDown().fadeIn().delay(5000).fadeOut();
}
runCommandBtn.removeEventListener("click", runCommand); runCommandBtn.removeEventListener("click", runCommand);
} }
test.html
+28 -12
View File
@@ -1,18 +1,34 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head></head> <head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script></head>
<body> <body>
<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script> <script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>
<div id="SkypeButton_Call_justinkimchi77_1"> <div id="SkypeButton_Call_justinkimchi77_1">
<script type="text/javascript"> <script type="text/javascript">
Skype.ui({ var friend = "justinkimchi77";
"name": "call", function skypeCall(str) {
"element": "SkypeButton_Call_justinkimchi77_1", Skype.ui({
"participants": [""] "name": "call",
}); "element": "SkypeButton_Call_justinkimchi77_1",
</script> "participants": [str]
</div> });
}
skypeCall(friend);
jQuery('body').trigger("click");
</script>
</div>
</form>
<!--<div id="SkypeButton_Call_justinkimchi77_1">
<script type="text/javascript">
Skype.ui({
"name": "call",
"element": "SkypeButton_Call_justinkimchi77_1",
"participants": ["justinkimchi77"]
});
</script>
</div> --->
</body> </body>
</html> </html>