Efekt końcowy
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Samouczek: Conpeek SDK</title>
</head>
<body>
<video autoplay id="conpeek_plugin_video_box"></video><br>
<button type="button" id="CHAT" disabled onclick="onClickChatButton()">Chat</button><br>
<textarea id="conpeek_plugin_chat_message" rows="1" name="conpeek_plugin_chat_message" placeholder="Wpisz wiadomość..." style="height: 35px;"></textarea><br>
<input type="file" id="chatFilePicker">
<button type="button" onclick="onClickSendFileButton()">Wyślij Plik</button><br>
<input type="file" id="chatImageFilePicker" accept=".jpg,.jpeg,.png,.bmp">
<button type="button" onclick="onClickSendImageFileButton()">Wyślij Obraz</button><br>
<button type="button" onclick="onClickChangeMediaButton()">Zmień media</button><br>
<button type="button" onclick="onClickMuteButton()">Włącz wyciszenie mikrofonu</button><br>
<button type="button" onclick="onClickVideoButton()">Video</button><br>
<button type="button" onclick="onClickSwitchCameraButton()">Zmiana kamery</button><br>
<button type="button" onclick="onClickMuteVideoButton()">Wyłącz nadawanie obrazu</button><br>
<button type="button" onclick="onClickUnmuteVideoButton()">Włącz nadawanie obrazu</button><br>
<button type="button" onclick="onClickDTMFButton()">Wyślij DTMF</button><br>
<button type="button" onclick="onClickCallMe()">Zadźwoń do mnie</button><br>
<button type="button" onclick="onClickWebmessageButton()">Wyślij wiadomość WEB</button><br>
<script type="text/javascript" src="conpeek.js"></script>
<script type="text/javascript">
$conpeek.initialize({
url: 'https://example.conpeek.com',
plugin_id: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
media_tag: 'conpeek_plugin_video_box',
},
function (success, params) {
if (success) {
$conpeek.event.registerCallback("plugin_subscription", "ready", function () {
$conpeek.util.updateTargetData("Help Desk", function(success, body){
if(success) {
document.getElementById("CHAT").disabled = false
}
});
});
} else {
alert("Inicjalizacja nie powiodła się")
}
});
function onClickChatButton() {
$conpeek.dialog.connect({
media: ["chat"],
presentation: "John Doe",
destination: "Help Desk"
}, function () {
$conpeek.chat.send("Hello World!");
$conpeek.event.registerCallback("chat", "chat_message", function (data) {
console.log(data)
});
$conpeek.chat.registerDetectInput(document.getElementById ("conpeek_plugin_chat_message"));
}, function () {
alert("Tworzenie połączenia nie powiodło się");
});
};
function onClickSendFileButton() {
const chatFilePicker = document.getElementById('chatFilePicker');
$conpeek.dialog.uploadFile(chatFilePicker);
};
function onClickSendImageFileButton() {
const chatImageFilePicker = document.getElementById('chatImageFilePicker');
$conpeek.dialog.uploadImage(chatImageFilePicker);
};
function onClickChangeMediaButton() {
$conpeek.dialog.changeMedia(["audio"],
function () {
alert("Zmiana mediów powiodła się");
},
function () {
alert("Zmiana mediów nie powiodła się");
}
);
};
function onClickMuteButton() {
$conpeek.dialog.mute();
};
function onClickVideoButton() {
$conpeek.dialog.changeMedia(["video"],
function () {
alert("Zmiana mediów powiodła się");
},
function () {
alert("Zmiana mediów nie powiodła się");
}
);
};
function onClickSwitchCameraButton() {
$conpeek.dialog.switchCamera();
};
function onClickMuteVideoButton() {
$conpeek.dialog.muteVideo();
};
function onClickUnmuteVideoButton() {
$conpeek.dialog.videoUnmute();
};
function onClickDTMFButton() {
$conpeek.dialog.dtmf("3");
};
function onClickCallMeButton() {
$conpeek.callme.send({
target: "Help Desk",
contact_number: "48790XXX100",
name: "John",
process_date: "RANGE",
process_from_date: "2021-01-01",
process_from_time: 43200,
process_time: "RANGE",
process_from_time: 43200,
process_to_time: 52000
}, function () { alert("Powiodło się")
}, function () { alert("Nie powiodło się")
});
};
function onClickWebmessageButton() {
$conpeek.webmessage.send({
NIP: "8881717709",
email: "john.doe@conpeek.com",
message: "Hello, im looking for (...)",
name: "John",
terms_accept: "accept_terms"
},
"Help Desk",
"xyz",
function () { alert("Powiodło się")},
function () { alert("Nie powiodło się")
});
};
</script>
</body>
</html>