From 061639a510b4806c850d252ab976017d53ab6541 Mon Sep 17 00:00:00 2001 From: Adam Beckingham Date: Mon, 19 Feb 2024 10:03:24 -0700 Subject: [PATCH 1/2] Add "Author" button to Prop and Avatar detail pages --- EditFullDive/Readme.txt | 7 +- EditFullDive/index.html | 6842 ++++++++++++++++++++------------------- EditFullDive/ui.js | 4887 ++++++++++++++++++++++++++++ 3 files changed, 8314 insertions(+), 3422 deletions(-) create mode 100644 EditFullDive/ui.js diff --git a/EditFullDive/Readme.txt b/EditFullDive/Readme.txt index 564f5c6..9aeace3 100644 --- a/EditFullDive/Readme.txt +++ b/EditFullDive/Readme.txt @@ -1,3 +1,4 @@ -Fulldive version will break with earch update, -and you'll have to check the gh page for a newer -edit versions~ \ No newline at end of file +Fulldive version will break with each update, +and you'll have to check the gh page for a new version~ + +Overhauls style, adds "author" button to prop and avatar detail pages. \ No newline at end of file diff --git a/EditFullDive/index.html b/EditFullDive/index.html index d831d3c..4ae1dec 100644 --- a/EditFullDive/index.html +++ b/EditFullDive/index.html @@ -1,3419 +1,3423 @@ - - - Chillout UI - - - - - -
- -
-

Welcome to ChilloutVR

- -
-
Shortcuts
-
-
- - Switch
-
- - Seated
- -
- - Flight
-
-
-
- - Respawn
-
- - Cam On
-
- - Adv Avtr
-
-
- -
- - Play/Pause
- -
-
- -
-
Debug Information
-
-
Ping:
-
[Ping]
-
-
-
FPS:
-
[FPS]
-
-
-
Version:
-
[Version]
-
- -
- -
-
Platform:
-
[Platform]
-
-
-
VR:
-
[InVR]
-
-
- -
-
News
-

Thank you for playing ChilloutVR in early access.

-

We are actively working on improvements regarding the platform.

-

Please mail us your feedback and ideas to team@abinteractive.net.

-
- -
-
Emotes
-
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
-
Toggle States (current Avatar)
-
-
Default
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
-
- -
-
Actions
-
-
Current Instance
-
Remove All Avatars
-
Remove All Props
-
Recalibrate
-
-
- -
-
Shortcuts
-
-
- - TTS
-
-
-
-
- -
-
Call
- -
No ongoing call
-
 
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
Friends
-
Avatars
-
Worlds
-
Props
-
-
00:00
-
Search
-
-
Unmute
-
Messages
-
Settings
- -
Exit
-
-
- - - - - + + + Chillout UI + + + + + +
+ +
+

Welcome to ChilloutVR

+ +
+
Shortcuts
+
+
+ + Switch
+
+ + Seated
+ +
+ + Flight
+
+
+
+ + Respawn
+
+ + Cam On
+
+ + Adv Avtr
+
+
+ +
+ + Play/Pause
+ +
+
+ +
+
Debug Information
+
+
Ping:
+
[Ping]
+
+
+
FPS:
+
[FPS]
+
+
+
Version:
+
[Version]
+
+ +
+ +
+
Platform:
+
[Platform]
+
+
+
VR:
+
[InVR]
+
+
+ +
+
News
+

Thank you for playing ChilloutVR in early access.

+

We are actively working on improvements regarding the platform.

+

Please mail us your feedback and ideas to team@abinteractive.net.

+
+ +
+
Emotes
+
+
1
+
2
+
3
+
4
+
5
+
6
+
7
+
8
+
+
Toggle States (current Avatar)
+
+
Default
+
1
+
2
+
3
+
4
+
5
+
6
+
7
+
+
+ +
+
Actions
+
+
Current Instance
+
Remove All Avatars
+
Remove All Props
+
Recalibrate
+
+
+ +
+
Shortcuts
+
+
+ + TTS
+
+
+
+
+ +
+
Call
+ +
No ongoing call
+
 
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
Home
+
Friends
+
Avatars
+
Worlds
+
Props
+
+
00:00
+
Search
+
+
Unmute
+
Messages
+
Settings
+
Cursorlock
+ +
Exit
+
+
+ + + + + diff --git a/EditFullDive/ui.js b/EditFullDive/ui.js new file mode 100644 index 0000000..18e8cd6 --- /dev/null +++ b/EditFullDive/ui.js @@ -0,0 +1,4887 @@ +var categoriesLoaded = false; + +var canChangeTab = true; +var searchOpened = false; + +function changeTab(_id, _e){ + + var currentDate = new Date(); + + if (!canChangeTab) return; + + if (!categoriesLoaded){ + engine.trigger('CVRAppTaskRefreshCategories'); + } + + if(_e.className.includes('active')){ + + switch(_id){ + case 'friends': + if(friendList.length == 0 || (currentDate - lastFriendsUpdate > 300000)){ + refreshFriends(); + } + closeUserDetail(); + break; + case 'worlds': + if(worldList.length == 0){ + loadFilteredWorlds(); + //refreshWorlds(); + } + closeWorldDetail(); + closeInstanceDetail(); + break; + case 'avatars': + if(avatarList.length == 0 || (currentDate - lastAvatarsUpdate > 300000)){ + refreshAvatars(); + } + closeAvatarDetail(); + closeAvatarDetailFavorite(); + break; + case 'props': + if(propList.length == 0 || (currentDate - lastPropsUpdate > 300000)){ + refreshProps(); + } + break; + case 'messages': + engine.trigger('CVRAppActionRefreshInvites'); + break; + } + + return; + } + + var buttons = document.querySelectorAll('.toolbar-btn'); + for(var i=0; buttons[i]; i++){ + buttons[i].classList.remove('active'); + } + + document.getElementById('search-btn').classList.remove('active'); + + _e.classList.add('active'); + + var content = document.querySelectorAll('.content.in'); + for(var i=0; content[i]; i++){ + content[i].classList.remove('in'); + content[i].classList.add('out'); + } + setTimeout(hideTabs, 200); + + canChangeTab = false; + + var target = document.getElementById(_id); + target.classList.remove('hidden'); + target.classList.add('in'); + + switch(_id){ + case 'friends': + if(friendList.length == 0 || (currentDate - lastFriendsUpdate > 300000)){ + refreshFriends(); + } + break; + case 'worlds': + if(worldList.length == 0){ + refreshWorlds(); + } + break; + case 'avatars': + if(avatarList.length == 0 || (currentDate - lastWorldsUpdate > 300000)){ + refreshAvatars(); + } + break; + case 'props': + if(propList.length == 0 || (currentDate - lastPropsUpdate > 300000)){ + refreshProps(); + } + break; + case 'messages': + engine.trigger('CVRAppActionRefreshInvites'); + break; + case 'search': + if (!searchOpened) { + displayKeyboard(document.getElementById('globalSearch')); + searchOpened = true; + } + break; + } +} + +function hideTabs(){ + var content = document.querySelectorAll('.content.out'); + for(var i=0; content[i]; i++){ + content[i].classList.add('hidden'); + content[i].classList.remove('out'); + } + canChangeTab = true; +} + +function switchTab(_tabs, _contents, _content, _e){ + if(_e.className.includes('active')) return; + + var buttons = document.querySelectorAll(_tabs); + for(var i=0; buttons[i]; i++){ + buttons[i].classList.remove('active'); + } + _e.classList.add('active'); + var tabs = document.querySelectorAll('.active-overlay'); + for(var i=0; i < tabs.length; i++){ + tabs[i].innerHTML = ' '; + } + + var content = document.querySelectorAll(_contents); + for(var i=0; content[i]; i++){ + content[i].classList.remove('active'); + } + + document.querySelector(_content).classList.add('active'); + + switch(_content){ + case "#tab-content-avatars": + getUserDetailsTab(currentRequestedUserId, "avatars"); + break; + case "#tab-content-worlds": + getUserDetailsTab(currentRequestedUserId, "worlds"); + break; + case "#tab-content-props": + getUserDetailsTab(currentRequestedUserId, "props"); + break; + } + + switch(_content){ + case "#tab-content-avatars": + case "#tab-content-worlds": + case "#tab-content-props": + document.querySelector(_content + " .activityDataNone").classList.add("hidden"); + document.querySelector(_content + " .activityDataAvailable").classList.add("hidden"); + document.querySelector(_content + " .activityDataLoading").classList.remove("hidden"); + break; + } +} + +var scrollTarget = null; + +var mouseScrolling = false; +var pauseScrolling = false; + +var startY = 0; +var startScrollY = 0; +var oldY = 0; +var speedY = 0; + +var startX = 0; +var startScrollX = 0; +var oldX = 0; +var speedX = 0; + +var scrollWheelTarget = null; + +document.addEventListener('mousedown', function(e){ + let target = e.target; + let onclick = target.getAttribute("onclick"); + + if (onclick == null && !target.closest(".no-scroll")) { + scrollTarget = target.closest('.list-content'); + startY = e.clientY; + startX = e.clientX; + if (scrollTarget !== null) { + mouseScrolling = true; + startScrollY = scrollTarget.scrollTop; + startScrollX = scrollTarget.scrollLeft; + } else { + scrollTarget = target.closest('.scroll-content'); + if (scrollTarget !== null) { + mouseScrolling = true; + startScrollY = scrollTarget.scrollTop; + startScrollX = scrollTarget.scrollLeft; + } + } + } + + do { + if ((onclick = target.getAttribute("onclick"))) { + engine.call('CVRAppCallHapticFeedback'); + break; + } + } + while ((target = target.parentNode) && target.getAttribute); + +}); + +document.addEventListener('mousemove', function(e){ + if(scrollTarget !== null && mouseScrolling && !pauseScrolling){ + scrollTarget.scrollTop = startScrollY - e.clientY + startY; + scrollTarget.scrollLeft = startScrollX - e.clientX + startX; + speedY = e.clientY - oldY; + speedX = e.clientX - oldX; + oldY = e.clientY; + oldX = e.clientX; + + updateScrollView(scrollTarget); + } + + scrollWheelTarget = e.target.closest('.list-content'); + if(scrollWheelTarget == null){ + scrollWheelTarget = e.target.closest('.scroll-content'); + } +}); + +document.addEventListener('mouseup', function(e){ + mouseScrolling = false; + if(scrollTarget != null){ + startScrollY = scrollTarget.scrollTop; + startScrollX = scrollTarget.scrollLeft; + } +}); + +window.setInterval(function(){ + if(!mouseScrolling && scrollTarget != null && (Math.abs(speedY) > 0.01 || Math.abs(speedX) > 0.01) && !pauseScrolling){ + if(!scrollTarget.getAttribute("novertical")){ + speedY *= 0.95; + scrollTarget.scrollTop -= speedY; + } + + if(!scrollTarget.getAttribute("nohorizontal")){ + speedX *= 0.95; + scrollTarget.scrollLeft -= speedX; + } + + updateScrollView(scrollTarget); + }else if(!mouseScrolling && scrollTarget != null){ + scrollTarget = null; + } +}, 10); + +window.addEventListener('wheel', function(e){ + if(scrollWheelTarget != null){ + if(!scrollWheelTarget.getAttribute("novertical")){ + scrollWheelTarget.scrollTop += e.deltaY; + speedY = 0; + } + + if(!scrollWheelTarget.getAttribute("nohorizontal")){ + scrollWheelTarget.scrollLeft += e.deltaX; + speedX = 0; + } + + updateScrollView(scrollWheelTarget); + } + + e.preventDefault(); +}); + +function updateScrollView(_scrollview){ + var type = _scrollview.getAttribute("data-content-type"); + + if (_scrollview == null) return; + if (_scrollview.querySelector(".flex-list") == null) return; + + var rect = _scrollview.getBoundingClientRect(); + var rect2 = _scrollview.querySelector(".flex-list").getBoundingClientRect(); + + var offset = _scrollview.scrollTop + rect.height - rect2.height; + + if (offset > -600) loadNextWorldPage(); +} + +/* +window.addEventListener('click', function(e){ + if(e.target.closest('div').getAttribute('onclick') !== null) { + playSound("click"); + } +}); +*/ + +var lastAvatarsUpdate = new Date(); +var avatarList = []; +var lastWorldsUpdate = new Date(); +var worldList = []; +var lastFriendsUpdate = new Date(); +var friendList = []; + +function filterList(_list, _filter){ + var list = []; + + for(var i=0; _list[i]; i++){ + if(_list[i].FilterTags.split(',').includes(_filter) || _filter == ''){ + list.push(_list[i]); + } + } + + return list; +} + +function filterContent(_ident, _filter){ + var buttons = document.querySelectorAll('#'+_ident+' .filter-option'); + + for(var i=0; buttons[i]; i++){ + buttons[i].classList.remove('active'); + } + + var activeButton = document.querySelector('#'+_ident+' .filter-option.data-filter-'+_filter+''); + if(activeButton != null){ + activeButton.classList.add('active'); + } + + switch(_ident){ + case 'avatars': + var list = filterList(avatarList, _filter); + renderAvatars(list, true); + break; + case 'worlds': + //var list = filterList(worldList, _filter); + //renderWorlds(list); + worldFilter = _filter; + loadFilteredWorlds(); + //renderWorlds(list); + break; + case 'friends': + //var list = filterList(friendList, _filter); + //renderFriends(list); + filterFriendList(_filter); + break; + case 'props': + var list = filterList(propList, _filter); + renderProps(list, true); + break; + } +} + +//Avatars +function loadAvatars(_list){ + avatarList = _list; + + lastAvatarsUpdate = new Date(); + + renderAvatars(_list); +} + +function renderAvatars(_list, _forceRefresh){ + var contentList = document.querySelector('#avatars .list-content'); + + /*var html = '
'; + + for(var i=0; _list[i]; i++){ + + html += '
'+ + '
'+ + _list[i].AvatarName.makeSafe()+'
Details
'+ + '
Change Avatar
'; + } + + html += '
'; + + contentList.innerHTML = html;*/ + + if (_forceRefresh === true) cvr('#avatars .list-content .flex-list').innerHTML(''); + + for(var i=0; _list[i]; i++){ + if (cvr('#avatars .list-content .flex-list #avtr_'+_list[i].AvatarId+'').length == 0){ + AddAvatar(_list[i]); + } else { + UpdateAvatar(_list[i]); + } + } +} + +function AddAvatar(_avatar){ + var html = '
'+ + '
'+ + _avatar.AvatarName.makeSafe()+'
Details
'+ + '
Change Avatar
'; + + cvr('#avatars .list-content .flex-list').addHTML(html); +} + +function UpdateAvatar(_avatar){ + const avatarImgUrl = GetCachedImage(_avatar.AvatarImageCoui, _avatar.AvatarImageUrl); + cvr('#avatars .list-content .flex-list #avtr_'+_avatar.AvatarId+' .content-name').innerHTML(_avatar.AvatarName.makeSafe()); + if (cvr('#avatars .list-content .flex-list #avtr_'+_avatar.AvatarId+' .content-image').first().getAttribute('src') != avatarImgUrl) { + cvr('#avatars .list-content .flex-list #avtr_'+_avatar.AvatarId+' .content-image').attr('src', avatarImgUrl); + } +} + +function RemoveAvatar(_avatar){ + cvr('#avatars .list-content .flex-list #avtr_'+_avatar.AvatarId+'').remove(); +} + +engine.on('AddAvatar', function(_avatar){ + AddAvatar(_avatar); +}); + +engine.on('UpdateAvatar', function(_avatar){ + UpdateAvatar(_avatar); +}); + +engine.on('RemoveAvatar', function(_avatar){ + RemoveAvatar(_avatar); +}); + +//Worlds +var worldFilter = 'wrldactive'; +var worldsResetLoad = true; +var currentWorldPage = 0; +var MaximumWorldPage = 0; +var pageLoaded = false; + +function loadWorlds(_list){ + worldList = _list; + + renderWorlds(_list, worldsResetLoad); + + //worldsResetLoad = false; +} + +function loadNextWorldPage(){ + if(currentWorldPage < MaximumWorldPage && pageLoaded) { + pageLoaded = false; + engine.call("CVRAppCallLoadFilteredWorldsPaged", worldFilter, currentWorldPage + 1); + } +} + +function loadWorldsPaged(_list, _currentPage, _maxPage){ + worldList = _list; + + currentWorldPage = _currentPage; + MaximumWorldPage = _maxPage; + + renderWorlds(_list, _currentPage == 0); +} + +function renderWorlds(_list, _forceRefresh){ + var contentList = document.querySelector('#worlds .list-content'); + + /*var html = '
'; + + for(var i=0; _list[i]; i++){ + + html += '
'+ + '
'+ + _list[i].WorldName.makeSafe()+'
'+ + '
Details
'+ + '
'; + } + + html+= '
'; + + contentList.innerHTML = html;*/ + + if (_forceRefresh === true) { + cvr('#worlds .list-content .flex-list').innerHTML(''); + cvr('#worlds .list-content')[0].scrollTop = 0; + } + worldsResetLoad = false; + + for(var i=0; _list[i]; i++){ + if (cvr('#worlds .list-content .flex-list #wrld_'+_list[i].WorldId+'').length == 0){ + AddWorld(_list[i]); + } else { + UpdateWorld(_list[i]); + } + } + + pageLoaded = true; +} + +function AddWorld(_world){ + var html = '
'+ + '
'+(_world.UsersInPublic==0?"":_world.UsersInPublic)+'
'+ + _world.WorldName.makeSafe()+'
'+ + '
Details
'+ + '
'; + + cvr('#worlds .list-content .flex-list').addHTML(html); +} + +function UpdateWorld(_world){ + const worldImageUrl = GetCachedImage(_world.WorldImageCoui, _world.WorldImageUrl); + if (cvr('#worlds .list-content .flex-list #wrld_' + _world.WorldId + ' .content-image').first().getAttribute('src') != worldImageUrl) { + cvr('#worlds .list-content .flex-list #wrld_' + _world.WorldId + ' .content-image').attr('src', worldImageUrl); + } + cvr('#worlds .list-content .flex-list #wrld_'+_world.WorldId+' .content-name').innerHTML(_world.WorldName.makeSafe()); + cvr('#worlds .list-content .flex-list #wrld_'+_world.WorldId+' .content-count').innerHTML(_world.UsersInPublic==0?"":_world.UsersInPublic); + if (_world.UsersInPublic==0){ + cvr('#worlds .list-content .flex-list #wrld_'+_world.WorldId+' .content-count').attr("style", "display:none;"); + }else{ + cvr('#worlds .list-content .flex-list #wrld_'+_world.WorldId+' .content-count').attr("style", ""); + } +} + +function RemoveWorld(_world){ + cvr('#worlds .list-content .flex-list #wrld_'+_world.WorldId+'').remove(); +} + +engine.on('AddWorld', function(_world){ + AddWorld(_world); +}); + +engine.on('UpdateWorld', function(_world){ + UpdateWorld(_world); +}); + +engine.on('RemoveWorld', function(_world){ + RemoveWorld(_world); +}); + +//Friends +var userOnlineState = {}; +userOnlineState["tmp"] = false; +function loadFriends(_list){ + friendList = _list; + + lastFriendsUpdate = new Date(); + + for (var i=0; i < friendList.length; i++){ + friendList[i].FilterTags += ','+(friendList[i].UserIsOnline?'frndonline':'frndoffline'); + } + + renderFriends(_list); +} + +function updateUsersOnline(_list){ + for(var i=0; _list[i]; i++){ + userOnlineState["uo-" + _list[i].Id] = _list[i].IsOnline; + + cvr('#friends .list-content .flex-list #frnd_'+_list[i].Id).removeClass('frndonline').removeClass('frndoffline').addClass(userOnlineState["uo-" + _list[i].Id]?'frndonline':'frndoffline'); + cvr('#friends .list-content .flex-list #frnd_'+_list[i].Id+' .online-state').className('online-state '+(userOnlineState["uo-" + _list[i].Id]?'online':'offline')); + } + + filterFriendList(friendsFilter); +} + +function renderFriends(_list){ + var contentList = document.querySelector('#friends .list-content'); + + //var html = '
'; + + /*for(var i=0; _list[i]; i++){ + + html += '
'+ + '
'+ + '
'+ + _list[i].UserName.makeSafe()+'
Details
'+ + '
'; + }*/ + + //html+= '
'; + + //contentList.innerHTML = html; + + for(var i=0; _list[i]; i++){ + if (cvr('#friends .list-content .flex-list #frnd_'+_list[i].UserId+'').length == 0){ + AddFriend(_list[i]); + } else { + UpdateFriend(_list[i]); + } + } + + filterFriendList(friendsFilter); +} + +var friendsFilter = ""; + +function filterFriendList(_filter){ + friendsFilter = _filter; + if (_filter == ""){ + cvr('#friends .list-content .flex-list .friend').show(); + } else { + cvr('#friends .list-content .flex-list .friend').hide(); + cvr('#friends .list-content .flex-list .friend.'+_filter).show(); + } +} + +function AddFriend(_friend){ + if (userOnlineState["uo-" + _friend.UserId] !== undefined){ + _friend.UserIsOnline = userOnlineState["uo-" + _friend.UserId]; + } + + var html = '
'+ + '
'+ + '
'+ + _friend.UserName.makeSafe()+'
Details
'+ + '
'; + + cvr('#friends .list-content .flex-list').addHTML(html); +} + +function UpdateFriend(_friend){ + if (userOnlineState["uo-" + _friend.UserId] !== undefined){ + _friend.UserIsOnline = userOnlineState["uo-" + _friend.UserId]; + } + + const usrImageUrl = GetCachedImage(_friend.UserImageCoui, _friend.UserImageUrl); + cvr('#friends .list-content .flex-list #frnd_'+_friend.UserId).className('content-cell friend '+(_friend.UserIsOnline?'frndonline':'frndoffline')+' '+_friend.FilterTags.split(',').join(' ')); + cvr('#friends .list-content .flex-list #frnd_'+_friend.UserId+' .online-state').className('online-state '+(_friend.UserIsOnline?'online':'offline')); + if (cvr('#friends .list-content .flex-list #frnd_'+_friend.UserId+' .content-image').first().getAttribute('src') != usrImageUrl) { + cvr('#friends .list-content .flex-list #frnd_' + _friend.UserId + ' .content-image').attr('src', usrImageUrl); + } + cvr('#friends .list-content .flex-list #frnd_'+_friend.UserId+' .content-name').innerHTML(_friend.UserName.makeSafe()); +} + +function RemoveFriend(_friend){ + cvr('#friends .list-content .flex-list [data-id="'+_friend.UserId+'"]').remove(); +} + +engine.on('AddFriend', function(_friend){ + AddFriend(_friend); +}); + +engine.on('UpdateFriend', function(_friend){ + UpdateFriend(_friend); +}); + +engine.on('RemoveFriend', function(_friend){ + RemoveFriend(_friend); +}); + +//Categories +engine.on('LoadCategories', function(_categories){ + RenderCategories(_categories); + categoriesLoaded = true; +}); + +var categories = []; +categories[0] = []; +categories[1] = []; +categories[2] = []; +categories[3] = []; +categories[4] = []; +categories[500] = []; + +function RenderCategories(_categories){ + for (var i=0; i < _categories.length; i++){ + var category = _categories[i]; + categories[category.CategoryParent.value__][category.CategoryKey] = category; + } + + var html = ''; + for (var i in categories[0]){ + html += '
'+categories[0][i].CategoryClearTextName.makeSafe()+'
'; + if (categories[0][i].CategoryKey.length >= 50 && !window.avatarCategories.some(item => item.CategoryKey == categories[0][i].CategoryKey)) { + window.friendCategories.push(categories[0][i]); + } + } + document.querySelector('#friends .filter-content').innerHTML = html; + + html = ''; + for (var i in categories[1]){ + html += '
'+categories[1][i].CategoryClearTextName.makeSafe()+'
'; + } + //document.querySelector('#groups .filter-content').innerHTML = html; + + html = ''; + for (var i in categories[2]){ + html += '
'+categories[2][i].CategoryClearTextName.makeSafe()+'
'; + if (categories[2][i].CategoryKey.length >= 50 && !window.avatarCategories.some(item => item.CategoryKey == categories[2][i].CategoryKey)) { + window.worldCategories.push(categories[2][i]); + } + } + document.querySelector('#worlds .filter-content').innerHTML = html; + filterContent('worlds', 'wrldactive'); + + html = ''; + for (var i in categories[3]){ + html += '
'+categories[3][i].CategoryClearTextName.makeSafe()+'
'; + if (categories[3][i].CategoryKey.length >= 50 && !window.avatarCategories.some(item => item.CategoryKey == categories[3][i].CategoryKey)){ + window.avatarCategories.push(categories[3][i]); + } + } + document.querySelector('#avatars .filter-content').innerHTML = html; + + html = ''; + for (var i in categories[4]){ + html += '
'+categories[4][i].CategoryClearTextName.makeSafe()+'
'; + if (categories[4][i].CategoryKey.length >= 50 && !window.avatarCategories.some(item => item.CategoryKey == categories[4][i].CategoryKey)) { + window.propCategories.push(categories[4][i]); + } + } + document.querySelector('#props .filter-content').innerHTML = html; +} + + +//SearchResults +function filterSearch(_category){ + var resultsUsers = document.getElementById('searchResultsUsers'); + var resultsAvatars = document.getElementById('searchResultsAvatars'); + var resultsWorlds = document.getElementById('searchResultsWorlds'); + var resultsProps = document.getElementById('searchResultsProps'); + + switch(_category){ + case '': + resultsUsers.classList.remove('hidden'); + resultsAvatars.classList.remove('hidden'); + resultsWorlds.classList.remove('hidden'); + resultsProps.classList.remove('hidden'); + break; + case 'users': + resultsUsers.classList.remove('hidden'); + resultsAvatars.classList.add('hidden'); + resultsWorlds.classList.add('hidden'); + resultsProps.classList.add('hidden'); + break; + case 'avatars': + resultsUsers.classList.add('hidden'); + resultsAvatars.classList.remove('hidden'); + resultsWorlds.classList.add('hidden'); + resultsProps.classList.add('hidden'); + break; + case 'worlds': + resultsUsers.classList.add('hidden'); + resultsAvatars.classList.add('hidden'); + resultsWorlds.classList.remove('hidden'); + resultsProps.classList.add('hidden'); + break; + case 'props': + resultsUsers.classList.add('hidden'); + resultsAvatars.classList.add('hidden'); + resultsWorlds.classList.add('hidden'); + resultsProps.classList.remove('hidden'); + break; + } + + document.querySelector('#search .list-content').scrollTop = 0; +} +function loadSearch(){ + var term = document.getElementById('globalSearch').value; + engine.call('CVRAppCallSubmitSearch', term); +} + +var searchUsers = []; +var searchAvatars = []; +var searchWorlds = []; +var searchProps = []; + +function displaySearch(_results){ + var userCount = document.querySelector('#searchResultsUsers .result-count'); + var userCountSmall = document.querySelector('.data-filter-users .result-count'); + var userWrapper = document.querySelector('#searchResultsUsers .search-result-wrapper'); + var avatarCount = document.querySelector('#searchResultsAvatars .result-count'); + var avatarCountSmall = document.querySelector('.data-filter-avatars .result-count'); + var avatarWrapper = document.querySelector('#searchResultsAvatars .search-result-wrapper'); + var worldCount = document.querySelector('#searchResultsWorlds .result-count'); + var worldCountSmall = document.querySelector('.data-filter-worlds .result-count'); + var worldWrapper = document.querySelector('#searchResultsWorlds .search-result-wrapper'); + var propCount = document.querySelector('#searchResultsProps .result-count'); + var propCountSmall = document.querySelector('.data-filter-props .result-count'); + var propWrapper = document.querySelector('#searchResultsProps .search-result-wrapper'); + + searchUsers = []; + searchAvatars = []; + searchWorlds = []; + searchProps = []; + + for (var i=0; _results[i]; i++){ + switch(_results[i].ResultType){ + case "user": + searchUsers.push(_results[i]); + break; + case "world": + searchWorlds.push(_results[i]); + break; + case "avatar": + searchAvatars.push(_results[i]); + break; + case "prop": + searchProps.push(_results[i]); + break; + } + } + + userCount.innerHTML = searchUsers.length; + userCountSmall.innerHTML = searchUsers.length; + avatarCount.innerHTML = searchAvatars.length; + avatarCountSmall.innerHTML = searchAvatars.length; + worldCount.innerHTML = searchWorlds.length; + worldCountSmall.innerHTML = searchWorlds.length; + propCount.innerHTML = searchProps.length; + propCountSmall.innerHTML = searchProps.length; + + var userHtml = ''; + + for(var i=0; searchUsers[i]; i++){ + if(i%5 === 0){ + if(i !== 0){ + userHtml += ''; + } + userHtml += '
'; + } + + userHtml += '
'+ + '
'+ + '
'+ + searchUsers[i].ResultName.makeSafe()+'
Details
'+ + '
'; + } + + userWrapper.innerHTML = userHtml; + + + + var avatarHtml = ''; + + for(var i=0; searchAvatars[i]; i++){ + if(i%4 === 0){ + if(i !== 0){ + avatarHtml += '
'; + } + avatarHtml += '
'; + } + + avatarHtml += '
'+ + '
'+ + searchAvatars[i].ResultName.makeSafe()+'
Details
'+ + '
Change Avatar
'; + } + + avatarWrapper.innerHTML = avatarHtml; + + + + var worldHtml = ''; + + for(var i=0; searchWorlds[i]; i++){ + if(i%4 === 0){ + if(i !== 0){ + worldHtml += '
'; + } + worldHtml += '
'; + } + + worldHtml += '
'+ + '
'+ + searchWorlds[i].ResultName.makeSafe()+'
'+ + '
Details
'+ + '
'; + } + + worldWrapper.innerHTML = worldHtml; + + + + var propHtml = ''; + + for(var i=0; searchProps[i]; i++){ + if(i%4 === 0){ + if(i !== 0){ + propHtml += '
'; + } + propHtml += '
'; + } + + console.log(searchProps[i].ResultName); + console.log(searchProps[i].ResultName.makeSafe()); + + propHtml += '
'+ + '
'+ + searchProps[i].ResultName.makeSafe()+'
'+ + '
Details
'+ + '
Select Prop
'+ + '
Drop
'+ + '
'; + } + + propWrapper.innerHTML = propHtml; +} + +//Invites +engine.on('LoadInvites', function(_list){ + renderInvites(_list); +}); + +function renderInvites(_list){ + var html = ''; + + for(var i=0; _list[i]; i++){ + + html += '
'+ + ' '+ + '
'+ + '
'+_list[i].SenderUsername.makeSafe()+' invited you to join their session
'+_list[i].InstanceName.makeSafe()+'
'+ + '
'+ + '
'+ + '
'+ + ' '+ + ' Details
'+ + '
'+ + ' '+ + ' Accept
'+ + '
'+ + ' '+ + ' Deny
'+ + '
'+ + ' '+ + ' Silence
'+ + '
'; + } + + html+= ''; + + document.querySelector('#message-invites .message-list').innerHTML = html; + document.querySelector('.messages-invites > .filter-number').innerHTML = _list.length; +} + +function AddInvite(_invite){ + + var html = '
'+ + ' '+ + '
'+ + '
'+_invite.SenderUsername.makeSafe()+' invited you to join their session
'+_invite.InstanceName.makeSafe()+'
'+ + '
'+ + '
'+ + '
'+ + ' '+ + ' Details
'+ + '
'+ + ' '+ + ' Accept
'+ + '
'+ + ' '+ + ' Deny
'+ + '
'+ + ' '+ + ' Silence
'+ + '
'; + + cvr('#message-invites .message-list').addHTML(html); + document.querySelector('.messages-invites > .filter-number').innerHTML = cvr('#message-invites .message-list .message-invite').length; +} + +function UpdateInvite(_invite){ + //NOP +} + +function RemoveInvite(_invite){ + cvr('#invites .list-content .flex-list [data-id="'+_invite.InviteMeshId+'"]').remove(); +} + +engine.on('AddInvite', function(_invite){ + AddInvite(_invite); +}); + +engine.on('UpdateInvite', function(_invite){ + UpdateInvite(_invite); +}); + +engine.on('RemoveInvite', function(_invite){ + RemoveInvite(_invite); +}); + +//Settings +function switchSettingCategorie(_id, _e){ + var buttons = document.querySelectorAll('#settings .filter-option'); + var categories = document.querySelectorAll('#settings .settings-categorie'); + + for(var i = 0; i < buttons.length; i++){ + buttons[i].classList.remove('active'); + } + + for(var i = 0; i < categories.length; i++){ + categories[i].classList.remove('active'); + } + + _e.classList.add('active'); + + if (_id == "settings-audio") + { + LoadMicrophones(); + } + + if (_id == "settings-graphics") + { + LoadResolutions(); + } + + document.getElementById(_id).classList.add('active'); +} + +//Messages +function switchMessageCategorie(_id, _e){ + var buttons = document.querySelectorAll('#messages .filter-option'); + var categories = document.querySelectorAll('#messages .message-categorie'); + + for(var i = 0; i < buttons.length; i++){ + buttons[i].classList.remove('active'); + } + + for(var i = 0; i < categories.length; i++){ + categories[i].classList.remove('active'); + } + + _e.classList.add('active'); + + document.getElementById(_id).classList.add('active'); +} + +function loadMessages(_invites, _friendrequests, _votes, _systems, _dms){ + var html = ''; + for(var i=0; i < _invites.length; i++){ + html += displayMessageInvite(_invites[i]); + } + if(_invites.length == 0){ + html = '
'+ +'
'+ +' '+ +'
'+ +' No invites found.'+ +'
'+ +'
'+ +'
'; + } + document.querySelector('#message-invites .message-list').innerHTML = html; + document.querySelector('.messages-invites > .filter-number').innerHTML = _invites.length; + + html = ''; + for(i=0; i < _friendrequests.length; i++){ + html += displayMessageFriendRequest(_friendrequests[i]); + } + if(_friendrequests.length == 0){ + html = '
'+ +'
'+ +' '+ +'
'+ +' No friend requests found.'+ +'
'+ +'
'+ +'
'; + } + document.querySelector('#message-friendrequests .message-list').innerHTML = html; + document.querySelector('.message-friendrequests > .filter-number').innerHTML = _friendrequests.length; + + html = ''; + for(i=0; i < _votes.length; i++){ + html += displayMessageVote(_votes[i]); + } + if(_votes.length == 0){ + html = '
'+ +'
'+ +' '+ +'
'+ +' No votes found.'+ +'
'+ +'
'+ +'
'; + } + document.querySelector('#message-votes .message-list').innerHTML = html; + document.querySelector('.message-votes > .filter-number').innerHTML = _votes.length; + + html = ''; + for(i=0; i < _systems.length; i++){ + html += displayMessageSystem(_systems[i]); + } + if(_systems.length == 0){ + html = '
'+ +'
'+ +' '+ +'
'+ +' No system messages found.'+ +'
'+ +'
'+ +'
'; + } + document.querySelector('#message-system .message-list').innerHTML = html; + document.querySelector('.message-system > .filter-number').innerHTML = _systems.length; + + html = ''; + for(i=0; i < _dms.length; i++){ + html += displayMessageDM(_dms[i]); + } + if(_dms.length == 0){ + html = '
'+ +'
'+ +' '+ +'
'+ +' No direct messages found.'+ +'
'+ +'
'+ +'
'; + } + document.querySelector('#message-dm .message-list').innerHTML = html; + document.querySelector('.message-dm > .filter-number').innerHTML = _dms.length; +} + +function displayMessageInvite(_invite){ + return '
'+ +' '+ +'
'+ +'
'+_invite.SenderUsername.makeSafe()+' invited you to join their session
'+_invite.InstanceName.makeSafe()+'
'+ +'
'+ +'
'+ +'
'+ +' '+ +' Details
'+ +'
'+ +' '+ +' Accept
'+ +'
'+ +' '+ +' Deny
'+ +'
'+ +' '+ +' Silence
'+ +'
'; +} + +function displayMessageInviteRequest(_request){ + return '
'+ + ' '+ + '
'+ + '
'+_request.RequestMessage.makeSafe()+'
'+ + '
'+ + '
'+ + '
'+ + ' '+ + ' Details
'+ + '
'+ + ' '+ + ' Accept
'+ + '
'+ + ' '+ + ' Deny
'+ + '
'; +} + +function respondeInvite(_guid, _response){ + engine.call('CVRAppCallRespondToInvite', _guid, _response); +} + +function respondeInviteRequest(_guid, _response){ + engine.call('CVRAppCallRespondToInviteRequest', _guid, _response); +} + +function displayMessageFriendRequest(_friendrequest){ + return '
'+ +' '+ +'
'+ +'
'+_friendrequest.UserName.makeSafe()+' sent you a friend request
'+ +'
'+ +'
'+ +'
'+ +' '+ +' Profile
'+ +'
'+ +' '+ +' Accept
'+ +'
'+ +' '+ +' Deny
'+ +'
'; +} + +function displayMessageVote(_vote){ + return '
'+ +' '+ +'
'+ +'
'+getVoteTitle(_vote)+'
'+ +'
'+getVoteMessage(_vote)+'
'+ +'
'+ + getVoteAdditionalButtons(_vote)+ +'
'+ +' '+ +' Accept
'+ +'
'+ +' '+ +' Deny
'+ +'
'; +} + +engine.on('RemoveVote', function(VoteId){ + removeVote(VoteId); +}); + +function removeVote(_VoteId) { + var vote = document.getElementById("notification_vote_" + _VoteId); + if (vote) vote.parentNode.removeChild(vote); + + var votes = document.querySelectorAll(".message-content.message-vote"); + + // If there are no votes -> Reset the message saying there are no votes + if (votes.length === 0) { + loadMessagesSingle('votes', []); + } + // Otherwise just update the vote count number + else { + document.querySelector('.message-votes > .filter-number').innerHTML = votes.length; + } +} + +function getVoteTitle(_vote) { + switch (_vote.ReadableType) { + case 'Kick': + return `${_vote.StarterName} has started a votekick against ${_vote.Data}`; + default: + return _vote.ReadableType; + } +} + +function getVoteMessage(_vote) { + switch (_vote.ReadableType) { + default: + return ""; + } +} + +function getVoteImageSource(_vote) { + switch (_vote.ReadableType) { + case 'Kick': + return 'src="gfx/btn-kick.svg"'; + default: + return `data-loading-url="${GetCachedImage(_vote.ImageCoui, _vote.ImageUrl)}"`; + } +} + +function getVoteAdditionalButtons(_vote) { + switch (_vote.ReadableType) { + case 'Kick': + return '
'+ + ' '+ + ' Profile
'; + default: + return ""; + } +} + +function respondeVote(_guid, _response){ + engine.call('CVRAppCallRespondToVote', _guid, _response); +} + +function displayMessageSystem(_system){ + return '
'+ +' '+ +'
'+ +'
'+_system.HeaderText.makeSafe()+'
'+ +'
'+_system.LongText.makeSafe()+'
'+ +'
'+ +'
'+ +' '+ +' Okay
'+ +'
'+ +' '+ +' Dismiss
'+ +'
'; +} + +function respondeSystem(_guid, _response){ + engine.call('CVRAppCallRespondToSystem', _guid, _response); +} + +function displayMessageDM(_dm){ + return '
'+ +' '+ +'
'+ +'
Name
'+ +'
'+ +'
'+ +'
'+ +' '+ +' Chat
'+ +'
'; +} + +function loadMessagesSingle(_cat, _list){ + switch(_cat){ + case 'invites': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageInvite(_list[i]); + } + if(_list.length == 0){ + html = '
'+ + '
'+ + ' '+ + '
'+ + ' No invites found.'+ + '
'+ + '
'+ + '
'; + } + document.querySelector('#message-invites .message-list').innerHTML = html; + document.querySelector('.messages-invites > .filter-number').innerHTML = _list.length; + break; + case 'invite-requests': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageInviteRequest(_list[i]); + } + if(_list.length == 0){ + html = '
'+ + '
'+ + ' '+ + '
'+ + ' No invite requests found.'+ + '
'+ + '
'+ + '
'; + } + document.querySelector('#message-invite-requests .message-list').innerHTML = html; + document.querySelector('.messages-invite-requests > .filter-number').innerHTML = _list.length; + break; + case 'system-notifications': + var html = ''; + for(var i=0; i < _list.length; i++){ + //html += displayMessageInvite(_list[i]); + } + if(_list.length == 0){ + html = '
'+ + '
'+ + ' '+ + '
'+ + ' No System Notifications found.'+ + '
'+ + '
'+ + '
'; + } + document.querySelector('#message-system .message-list').innerHTML = html; + document.querySelector('.messages-system > .filter-number').innerHTML = _list.length; + break; + case 'friend-requests': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageFriendRequest(_list[i]); + } + if(_list.length == 0){ + html = '
'+ + '
'+ + ' '+ + '
'+ + ' No Friend Request found.'+ + '
'+ + '
'+ + '
'; + } + document.querySelector('#message-friendrequests .message-list').innerHTML = html; + document.querySelector('.message-friendrequests > .filter-number').innerHTML = _list.length; + break; + case 'votes': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageVote(_list[i]); + } + if(_list.length == 0){ + html = '
'+ + '
'+ + ' '+ + '
'+ + ' No votes found.'+ + '
'+ + '
'+ + '
'; + } + document.querySelector('#message-votes .message-list').innerHTML = html; + document.querySelector('.message-votes > .filter-number').innerHTML = _list.length; + break; + } +} + +var lastPropsUpdate = new Date(); +var propList = []; +//Props +function loadProps(_list){ + propList = _list; + + lastPropsUpdate = new Date(); + + renderProps(_list); +} + +function renderProps(_list, _forceRefresh){ + var contentList = document.querySelector('#props .list-content'); + + if (_forceRefresh === true) cvr('#props .list-content .flex-list').innerHTML(''); + + for(var i=0; _list[i]; i++){ + if (cvr('#props .list-content .flex-list #prp_'+_list[i].SpawnableId+'').length == 0){ + AddProp(_list[i]); + } else { + UpdateProp(_list[i]); + } + } +} + +function AddProp(_prop){ + const spawnableImageUrl = GetCachedImage(_prop.SpawnableImageCoui, _prop.SpawnableImageUrl); + var html = '
'+ + '
'+ + _prop.SpawnableName.makeSafe()+'
Details
'+ + '
Select Prop
'+ + '
Drop Prop
'; + + cvr('#props .list-content .flex-list').addHTML(html); +} + +function UpdateProp(_prop){ + const spawnableImageUrl = GetCachedImage(_prop.SpawnableImageCoui, _prop.SpawnableImageUrl); + if (cvr('#props .list-content .flex-list #prp_' + _prop.SpawnableId + ' .content-image').first().getAttribute('src') != spawnableImageUrl) { + cvr('#props .list-content .flex-list #prp_' + _prop.SpawnableId + ' .content-image').attr('src', spawnableImageUrl); + } + cvr('#props .list-content .flex-list #prp_'+_prop.SpawnableId+' .content-name').innerHTML(_prop.SpawnableName.makeSafe()); +} + +function RemoveProp(_prop){ + cvr('#props .list-content .flex-list #prp_'+_prop.SpawnableId+'').remove(); +} + +engine.on('AddProp', function(_prop){ + AddProp(_prop); +}); + +engine.on('UpdateProp', function(_prop){ + UpdateProp(_prop); +}); + +engine.on('RemoveProp', function(_prop){ + RemoveProp(_prop); +}); + +function SpawnProp(_uid){ + engine.call('CVRAppCallSpawnProp', _uid); +} +function SelectProp(_uid, _image, _name){ + engine.call('CVRAppCallSelectProp', _uid, _image, _name); +} +function DeletePropMode(){ + engine.trigger('CVRAppCallDeletePropMode'); +} +function ReloadAllAvatars(){ + engine.trigger('CVRAppActionReloadAllAvatars'); +} + +//World Details +function getWorldDetails(_uid){ + engine.call('CVRAppCallGetWorldDetails', _uid); + if(debug){ + loadWorldDetails({WorldName: 'Testworld', AdminTags: '', SafetyTags: 'SFW', AuthorName: 'Khodrin', AuthorGuid: 'AAAA', + Guid: 'AAAA', AuthorImageUrl: 'https://abis3.fra1.digitaloceanspaces.com/ProfilePictures/Khodrin.png', + WorldImageUrl: 'https://abis3.fra1.digitaloceanspaces.com/Worlds/b1d2ac7c-4074-4804-abd5-3fe2fe12680c.png', + WorldDescription: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vel tellus eget mauris vestibulum tempus at sed felis. Pellentesque vitae sapien non sapien sagittis ultrices sed quis odio. Quisque ac rutrum nunc. Nulla cursus volutpat lectus, eget consectetur enim fermentum eu. Etiam sodales posuere magna ac dictum. Phasellus laoreet purus sollicitudin pretium vehicula. Aenean ullamcorper in mauris ultrices ornare. Aliquam elementum lacus vel enim blandit, quis pretium urna fringilla. Aliquam sagittis venenatis mi et tristique. Mauris a pulvinar dolor. Nam nec pharetra erat, in molestie ipsum. Proin sed justo sed sem elementum faucibus non nec ex.', + UploadedAt: '2020-01-01', UpdatedAt: '2020-01-20', WorldSize: '20MB' + }, + [{Guid: 'AAAA', CurrentPlayerCount: 24, InstanceName: 'Sauerkraut der Zukunft#945623', InstanceRegion: 'EU'}], + []); + } +} + +var currentWorldDetails = {}; + +function loadWorldDetails(_data, _instances){ + window.worldCurrentCategories = _data.FilterTags.split(','); + currentWorldDetails = _data; + var detailPage = document.getElementById('world-detail'); + + document.querySelector('#world-detail h1').innerHTML = 'World: '+_data.WorldName.makeSafe(); + document.querySelector('.data-worldName').innerHTML = _data.WorldName.makeSafe(); + document.querySelector('.data-description').innerHTML = _data.WorldDescription.makeSafe(); + document.querySelector('.data-adminTags').innerHTML = _data.AdminTags.replace(/,/g, ' ').makeSafe(); + document.querySelector('.data-safetyTags').innerHTML = _data.SafetyTags.replace(/,/g, ' ').makeSafe(); + document.querySelector('.data-fileSize').innerHTML = _data.WorldSize; + document.querySelector('.data-uploaded').innerHTML = _data.UploadedAt; + document.querySelector('.data-updated').innerHTML = _data.UpdatedAt; + + if (_data.Compatibillity == 0){ + cvr('.world-legacy').show(); + } else { + cvr('.world-legacy').hide(); + } + + document.querySelector('.data-worldImage').src = GetCachedImage(_data.WorldImageCoui, _data.WorldImageUrl); + document.querySelector('.data-worldPreload').setAttribute('onclick', 'preloadWorld(\''+_data.WorldId+'\');'); + + document.querySelector('.data-worldExplore').setAttribute('onclick', 'changeWorld(\''+_data.WorldId+'\');'); + + document.querySelector('.data-worldSetHome').setAttribute('onclick', 'setHome(\''+_data.WorldId+'\');'); + + document.querySelector('.data-worldFavorite').setAttribute('onclick', 'favoriteWorld(\''+_data.WorldId+'\');'); + + document.querySelector('.data-worldAuthorImage').src = GetCachedImage(_data.AuthorImageCoui, _data.AuthorImageUrl); + document.querySelector('.data-authorName').innerHTML = _data.AuthorName.makeSafe(); + document.querySelector('.action-btn.data-author-profile').setAttribute('onclick', 'getUserDetails(\''+_data.AuthorId+'\');'); + + var html = ''; + + for(var i=0; i < _instances.length; i++){ + html += generateInstanceHTML(_instances[i]); + } + + if(_instances.length == 0){ + html = '
There are currently no open instances for this world
'; + } + + document.querySelector('.data-worldInstances').innerHTML = html; + + detailPage.classList.remove('hidden'); + detailPage.classList.add('in'); + SetElementToTop(detailPage); + + document.querySelector('#world-instance-create .btn-create').setAttribute('onclick', 'instancingCreateInstance(\''+_data.WorldId+'\');'); + hideCreateInstance(); +} + +function updateWorldDetailInstances(_instances){ + var html = ''; + + for(var i=0; i < _instances.length; i++){ + html += generateInstanceHTML(_instances[i]); + } + + if(_instances.length == 0){ + html = '
There are currently no open instances for this world
'; + } + + document.querySelector('.data-worldInstances').innerHTML = html; +} + +function addWorldDetailInstance(_instance){ + uiLoadingClose(); + + var instances = document.querySelectorAll('#world-detail .world-instance'); + + for(var i=0; i < instances.length; i++){ + instances[i].classList.remove('new'); + } + + var html = generateInstanceHTML(_instance, true); + document.querySelector('.data-worldInstances').insertAdjacentHTML('afterbegin', html); + + var empty = document.querySelector('.world-instances-empty-message'); + if(empty != null){ + empty.parentNode.removeChild(empty); + } + + setTimeout(function() { + showInstanceDetails(_instance.InstanceId) + }, 300); +} + +function generateInstanceHTML(_instance, _new){ + return '
'+ + '
'+ + '
'+_instance.CurrentPlayerCount+'
'+ + '
'+_instance.InstanceRegion+'
'+ + '
'+_instance.InstanceName.makeSafe()+'
'+ + '
'; +} + +function closeWorldDetail(){ + var detailPage = document.getElementById('world-detail'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +// Instance Creation +engine.on('LoadInstanceCreationSettings', function(typeValue, regionValue, ruleValue){ + setInitialCreateInstanceSettings(typeValue, regionValue, ruleValue); +}); + +function setInitialCreateInstanceSettings(typeValue, regionValue, ruleValue){ + let typeElementToActivate = document.querySelector(`.instancing-type-btn[data-instance-type-value="${typeValue}"]`); + if (!typeElementToActivate) typeElementToActivate = document.querySelector('.instancing-type-btn[data-instance-type-value="Public"]'); + instancingChangeType(typeElementToActivate); + + let regionElementToActivate = document.querySelector(`.region-select[data-instance-region-value="${regionValue}"]`); + if (!regionElementToActivate) regionElementToActivate = document.querySelector('.region-select[data-instance-region-value="0"]'); + instancingChangeRegion(regionElementToActivate); + + // let ruleElementToActivate = document.querySelector(`.rule-select[data-instance-rule-value="${ruleValue}"]`); + // if (!ruleElementToActivate) ruleElementToActivate = document.querySelector('.rule-select[data-instance-rule-value="SFW"]'); + // instancingChangeRule(ruleElementToActivate); +} + +function showCreateInstance(){ + const createInstance = document.getElementById('world-instance-create'); + createInstance.classList.remove('hidden'); + createInstance.classList.add('in'); +} + +function instancingChangeType(_e){ + document.getElementById('instancing-type').value = _e.attributes.getNamedItem('data-instance-type-value').value; + + const buttons = document.querySelectorAll('.instancing-type-btn'); + for(let i=0; buttons[i]; i++){ + buttons[i].classList.remove('active'); + } + + _e.classList.add('active'); +} + +function instancingChangeRegion(_e){ + document.getElementById('instancing-region').value = _e.attributes.getNamedItem('data-instance-region-value').value; + + const buttons = document.querySelectorAll('.region-select'); + for(let i=0; buttons[i]; i++){ + buttons[i].classList.remove('active'); + } + + _e.classList.add('active'); +} + +function instancingChangeRule(_e){ + document.getElementById('instancing-rule').value = _e.attributes.getNamedItem('data-instance-rule-value').value; + + const buttons = document.querySelectorAll('.rule-select'); + for(let i=0; buttons[i]; i++){ + buttons[i].classList.remove('active'); + } + + _e.classList.add('active'); +} + +function instancingCreateInstance(_uid){ + const type = document.getElementById('instancing-type').value; + const region = document.getElementById('instancing-region').value; + const rule = document.getElementById('instancing-rule').value; + + engine.call('CVRAppCallCreateInstance', _uid, type, region, rule); + hideCreateInstance(); + uiLoadingShow('Your instance is being created.'); +} + +function hideCreateInstance(){ + var createInstance = document.getElementById('world-instance-create'); + + createInstance.classList.remove('in'); + createInstance.classList.add('out'); + setTimeout(function(){ + createInstance.classList.add('hidden'); + createInstance.classList.remove('out'); + }, 200); +} +//World Categories +window.worldCategories = []; +window.worldCurrentCategories = []; +window.pickedWorldForCategorie = ''; +window.pickedWorldCategories = []; + +function favoriteWorld(_guid){ + window.pickedWorldForCategorie = _guid; + + var html = ''; + + for (var i=0; i < window.worldCategories.length; i++){ + if(window.worldCurrentCategories.includes(window.worldCategories[i].CategoryKey)){ + window.pickedWorldCategories[window.worldCategories[i].CategoryKey] = true; + html += '
'+window.worldCategories[i].CategoryClearTextName.makeSafe()+'
'; + }else{ + window.pickedWorldCategories[window.worldCategories[i].CategoryKey] = false; + html += '
'+window.worldCategories[i].CategoryClearTextName.makeSafe()+'
'; + } + } + + cvr('#world-detail .favorite-categories').innerHTML(html); + + cvr('#world-detail .favorite-category-selection').removeClass('hidden').addClass('in'); +} + +function closeWorldDetailFavorite(){ + var detailPage = document.querySelector('#world-detail .favorite-category-selection'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +function changeWorldCategory(_categoryIdentifier, _e){ + if (_e.classList.contains('checked')){ + var index = window.worldCurrentCategories.indexOf(_categoryIdentifier); + if (index > -1) { + window.worldCurrentCategories.splice(index, 1); + } + + window.pickedWorldCategories[_categoryIdentifier] = false; + _e.classList.remove('checked'); + }else{ + window.worldCurrentCategories.push(_categoryIdentifier); + + window.pickedWorldCategories[_categoryIdentifier] = true; + _e.classList.add('checked'); + } +} + +function sendWorldCategoryUpdate(){ + var categoryList = []; + + for (var k in window.pickedWorldCategories){ + if (window.pickedWorldCategories[k]){ + categoryList[categoryList.length] = k; + } + } + + engine.call("CVRAppCallUpdateWorldCategories", window.pickedWorldForCategorie, categoryList.join(',')); + closeWorldDetailFavorite(); +} + +//Instance Detail +function closeInstanceDetail(){ + var detailPage = document.getElementById('instance-detail'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +function showInstanceDetails(_uid){ + engine.call('CVRAppCallGetInstanceDetails', _uid); +} + +engine.on('LoadInstanceDetails', function (_instance) { + loadInstanceDetail(_instance); +}); + +function loadInstanceDetail(_instance){ + var detailPage = document.getElementById('instance-detail'); + closeAvatarSettings(); + + document.querySelector('#instance-detail h1').innerHTML = "Instance: "+_instance.InstanceName.makeSafe(); + + document.querySelector('#instance-detail .profile-image').src = GetCachedImage(_instance.Owner.UserImageCoui, _instance.Owner.UserImageUrl); + document.querySelector('#instance-detail .content-instance-owner h2').innerHTML = _instance.Owner.UserName.makeSafe(); + document.querySelector('#instance-detail .content-instance-owner h3').innerHTML = _instance.Owner.UserRank; + + document.querySelector('#instance-detail .profile-badge img').src = GetCachedImage(_instance.Owner.FeaturedBadgeImageCoui, _instance.Owner.FeaturedBadgeImageUrl); + document.querySelector('#instance-detail .profile-badge p').innerHTML = _instance.Owner.FeaturedBadgeName; + + document.querySelector('#instance-detail .profile-group img').src = GetCachedImage(_instance.Owner.FeaturedGroupImageCoui, _instance.Owner.FeaturedGroupImageUrl); + document.querySelector('#instance-detail .profile-group p').innerHTML = _instance.Owner.FeaturedGroupName.makeSafe(); + + document.querySelector('#instance-detail .profile-avatar img').src = GetCachedImage(_instance.Owner.CurrentAvatarImageCoui, _instance.Owner.CurrentAvatarImageUrl); + document.querySelector('#instance-detail .profile-avatar p').innerHTML = _instance.Owner.CurrentAvatarName.makeSafe(); + + + document.querySelector('#instance-detail .world-image').src = GetCachedImage(_instance.World.WorldImageCoui, _instance.World.WorldImageUrl) + document.querySelector('#instance-detail .world-image').setAttribute( + 'onclick', 'getWorldDetails(\''+_instance.World.WorldId+'\');'); + document.querySelector('#instance-detail .content-instance-world h2').innerHTML = _instance.World.WorldName.makeSafe(); + document.querySelector('#instance-detail .content-instance-world p').innerHTML = 'by '+_instance.World.AuthorName.makeSafe(); + document.querySelector('#instance-detail .content-instance-world p').setAttribute( + 'onclick', 'getUserDetails(\''+_instance.World.AuthorId+'\');'); + + + document.querySelector('#instance-detail .data-type').innerHTML = _instance.Privacy; + document.querySelector('#instance-detail .data-region').innerHTML = _instance.Region; + document.querySelector('#instance-detail .data-gamemode').innerHTML = _instance.GameMode; + document.querySelector('#instance-detail .data-maxplayers').innerHTML = _instance.MaxPlayer; + document.querySelector('#instance-detail .data-currplayers').innerHTML = _instance.CurrentPlayer; + + + document.querySelector('#instance-detail .instance-btn.joinBtn'). + setAttribute('onclick', 'joinInstance(\''+_instance.InstanceId+'\', \''+_instance.World.WorldId+'\');'); + document.querySelector('#instance-detail .instance-btn.portalBtn'). + setAttribute('onclick', 'dropInstancePortal(\''+_instance.InstanceId+'\');'); + + + var html = ''; + + for(var i=0; i < _instance.Users.length; i++){ + html += '
'+ + _instance.Users[i].UserName.makeSafe()+'
'; + } + + document.querySelector('#instance-detail .content-instance-players .scroll-content').innerHTML = html; + + document.querySelector('#instance-detail .content-instance-players .scroll-content').scrollTop = 0; + + detailPage.classList.remove('hidden'); + detailPage.classList.add('in'); + SetElementToTop(detailPage); +} + +//User Details +var currentRequestedUserId = ""; +function getUserDetails(_uid){ + engine.call('CVRAppCallGetUserDetails', _uid); + currentRequestedUserId = _uid; +} +function getUserDetailsTab(_uid, _tab){ + engine.call('CVRAppCallRequestUSerDetailsTab', _uid, _tab); +} +function setUserFriendNote(_uid, _note){ + engine.call('CVRAppCallSetUserFriendNote', _uid, _note); +} + +var PlayerData = {}; + +var userProfileMute; +var userProfileVolume; +var userProfilePlayerAvatarsBlocked; +var userProfileBundleVerifierBypass; +var userProfileAvatarBlocked; +var userProfilePropBlocked; + +function loadUserDetails(_data, _profile){ + currentRequestedUserId = _data.UserId; + window.friendCurrentCategories = _data.FilterTags.split(','); + PlayerData = _data; + var detailPage = document.getElementById('user-detail'); + + document.querySelector('#user-detail h1').innerHTML = 'Profile: '+_data.UserName.makeSafe(); + + document.querySelector('#user-detail .online-state').className = 'online-state '+(_data.OnlineState?'online':'offline'); + document.querySelector('#user-detail .profile-image').src = GetCachedImage(_data.UserImageCoui, _data.UserImageUrl); + document.querySelector('#user-detail .user-sidebar h2').innerHTML = _data.UserName.makeSafe(); + document.querySelector('#user-detail .user-sidebar h3').innerHTML = _data.UserRank; + + document.querySelector('#user-detail .profile-badge img').src = GetCachedImage(_data.FeaturedBadgeImageCoui, _data.FeaturedBadgeImageUrl); + document.querySelector('#user-detail .profile-badge p').innerHTML = _data.FeaturedBadgeName; + + document.querySelector('#user-detail .profile-group img').src = GetCachedImage(_data.FeaturedGroupImageCoui, _data.FeaturedGroupImageUrl); + document.querySelector('#user-detail .profile-group p').innerHTML = _data.FeaturedGroupName.makeSafe(); + + document.querySelector('#user-detail .profile-avatar img').src = GetCachedImage(_data.CurrentAvatarImageCoui, _data.CurrentAvatarImageUrl); + document.querySelector('#user-detail .profile-avatar p').innerHTML = _data.CurrentAvatarName.makeSafe(); + document.querySelector('#user-detail .profile-avatar img').setAttribute('onclick', 'GetAvatarDetails(\''+_data.CurrentAvatarId+'\');'); + + var friendBtn = document.querySelector('#user-detail .friend-btn'); + if(_data.IsFriend){ + friendBtn.setAttribute('onclick', 'unFriend(\''+_data.UserId+'\');'); + friendBtn.innerHTML = 'Unfriend'; + }else{ + friendBtn.setAttribute('onclick', 'addFriend(\''+_data.UserId+'\');'); + friendBtn.innerHTML = 'Add Friend'; + } + + var blockBtn = document.querySelector('#user-detail .block-btn'); + if(_data.IsBlocked){ + blockBtn.setAttribute('onclick', 'unBlock(\''+_data.UserId+'\');'); + blockBtn.innerHTML = 'Unblock'; + }else{ + blockBtn.setAttribute('onclick', 'block(\''+_data.UserId+'\');'); + blockBtn.innerHTML = 'Block'; + } + + /*var muteBtn = document.querySelector('#user-detail .mute-btn'); + if(_data.IsMuted){ + muteBtn.setAttribute('onclick', 'unMute(\''+_data.Guid+'\');'); + muteBtn.innerHTML = 'Unmute'; + }else{ + muteBtn.setAttribute('onclick', 'mute(\''+_data.Guid+'\');'); + muteBtn.innerHTML = 'Mute'; + }*/ + + var kickBtn = document.querySelector('#user-detail .kick-btn'); + kickBtn.setAttribute('onmousedown', 'kickUser(\''+_data.UserId+'\');'); + + var favoriteBtn = document.querySelector('#user-detail .fav-btn'); + favoriteBtn.setAttribute('onclick', 'favoriteFriend(\''+_data.UserId+'\');'); + + var voteKickBtn = document.querySelector('#user-detail .vote-btn'); + voteKickBtn.setAttribute('onclick', 'VoteKick(\''+_data.UserId+'\');'); + + var moderationView = document.querySelector('#user-detail .user-settings-dialog'); + + var userSettingsTools = '

User Settings

Back
'; + + userSettingsTools += '
\n' + + '
Players Avatar:
\n' + + '
\n' + + '
\n' + + '
\n' + + '
' + + userSettingsTools += '
\n' + + '
Current Avatar:
\n' + + '
\n' + + '
\n' + + '
\n' + + '
' + + userSettingsTools += '
\n' + + '
User Bundle Verifier:
\n' + + '
\n' + + '
\n' + + '
\n' + + '
' + + userSettingsTools += '
\n' + + '
Player Props:
\n' + + '
\n' + + '
\n' + + '
\n' + + '
' + + userSettingsTools += '
\n' + + '
Mute Player:
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + + userSettingsTools += '
\n' + + '
Voice Volume:
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + + userSettingsTools += '
\n' + + '
Reload Avatar
\n' + + '
' + + moderationView.innerHTML = userSettingsTools; + + userProfileMute = new inp_toggle(document.getElementById('SelfModerationMute')); + userProfileVolume = new inp_slider(document.getElementById('SelfModerationVolume')); + userProfilePlayerAvatarsBlocked = new inp_dropdown(document.getElementById('SelfModerationUsersAvatars')); + userProfileAvatarBlocked = new inp_dropdown(document.getElementById('SelfModerationAvatar')); + userProfileBundleVerifierBypass = new inp_dropdown(document.getElementById('SelfModerationBundleVerifierAvatar')); + userProfilePropBlocked = new inp_dropdown(document.getElementById('SelfModerationUsersProps')); + + moderationView.classList.add('hidden'); + + detailPage.classList.remove('hidden'); + detailPage.classList.add('in'); + SetElementToTop(detailPage); + + updateUserDetailsActivity(_data.Instance, _data.Users); + + switchTab('#user-detail .tab-btn', '#user-detail .tab-content', '#tab-content-activity', document.querySelector('#user-detail .tab-list .tab-btn.activity')); +} + +engine.on("LoadUserDetailsTab", function(_content, _tab){ + switch(_tab){ + case "avatars": + document.querySelector('#user-detail #tab-content-avatars .activityDataLoading').classList.add('hidden'); + if (_content.length == 0){ + document.querySelector('#user-detail #tab-content-avatars .activityDataNone').classList.remove('hidden'); + break; + } + var html = ""; + for (var i=0; i < _content.length; i++){ + html += "
"+escapeHtml(_content[i].Name)+"
Details
"; + } + document.querySelector('#user-detail #tab-content-avatars .activityDataAvailable').classList.remove('hidden'); + document.querySelector('#user-detail #tab-content-avatars .activityDataAvailable .scroll-content .flex-list').innerHTML = html; + break; + case "worlds": + document.querySelector('#user-detail #tab-content-worlds .activityDataLoading').classList.add('hidden'); + if (_content.length == 0){ + document.querySelector('#user-detail #tab-content-worlds .activityDataNone').classList.remove('hidden'); + break; + } + var html = ""; + for (var i=0; i < _content.length; i++){ + html += "
"+escapeHtml(_content[i].Name)+"
Details
"; + } + document.querySelector('#user-detail #tab-content-worlds .activityDataAvailable').classList.remove('hidden'); + document.querySelector('#user-detail #tab-content-worlds .activityDataAvailable .scroll-content .flex-list').innerHTML = html; + break; + case "props": + document.querySelector('#user-detail #tab-content-props .activityDataLoading').classList.add('hidden'); + if (_content.length == 0){ + document.querySelector('#user-detail #tab-content-props .activityDataNone').classList.remove('hidden'); + break; + } + var html = ""; + for (var i=0; i < _content.length; i++){ + html += "
"+escapeHtml(_content[i].Name)+"
Details
"; + } + document.querySelector('#user-detail #tab-content-props .activityDataAvailable').classList.remove('hidden'); + document.querySelector('#user-detail #tab-content-props .activityDataAvailable .scroll-content .flex-list').innerHTML = html; + break; + } +}); + +function showUserSettings(){ + var moderationView = document.querySelector('#user-detail .user-settings-dialog'); + moderationView.classList.remove('hidden'); + moderationView.classList.add('in'); +} + +function hideUserSettings(){ + var moderationView = document.querySelector('#user-detail .user-settings-dialog'); + moderationView.classList.remove('in'); + moderationView.classList.add('out'); + setTimeout(function(){ + moderationView.classList.add('hidden'); + moderationView.classList.remove('out'); + }, 200); +} + +function ReloadAvatar(_userId){ + engine.call('CVRAppCallReloadAvatar', _userId); +} + +function unFriend(_guid){ + uiConfirmShow("Unfriend", "Are you sure you want to remove this person from your friendslist?", "removeFriend", _guid); +} + +function addFriend(_guid){ + engine.call('CVRAppCallRelationsManagement', _guid, 'Add'); +} + +function acceptFriend(_guid){ + engine.call('CVRAppCallRelationsManagement', _guid, 'Accept'); +} + +function denyFriend(_guid){ + engine.call('CVRAppCallRelationsManagement', _guid, 'Deny'); +} + +function block(_guid){ + uiConfirmShow("Block", "Are you sure you want to Block this person?", "block", _guid); +} + +function unBlock(_guid){ + engine.call('CVRAppCallRelationsManagement', _guid, 'Unblock'); +} + +function ClearBundleVerifierCache(){ + engine.trigger('CVRAppActionBundleVerifierClearCache'); +} + +function kickUser(_guid){ + uiConfirmShow("Kick", "Are you sure you want to Kick this person? They won't be able to rejoin this instance for 1 Hour.", "actualKick", _guid); +} + +function updateUserDetailsActivity(_activity, _instanceUsers){ + if(_activity.IsInJoinableInstance == true && PlayerData.IsFriend && PlayerData.OnlineState) { + + const worldImage = document.querySelector('#tab-content-activity .player-instance-world-image'); + worldImage.src = GetCachedImage(_activity.WorldImageCoui, _activity.WorldImageUrl); + worldImage.onclick = () => showInstanceDetails(_activity.InstanceId); + + document.querySelector('#tab-content-activity .player-instance-details h2').innerHTML = _activity.WorldName.makeSafe(); + document.querySelector('#tab-content-activity .player-instance-details .data-gamemode').innerHTML = _activity.GameModeName.makeSafe(); + document.querySelector('#tab-content-activity .player-instance-details .data-maxplayers').innerHTML = _activity.MaxPlayer; + document.querySelector('#tab-content-activity .player-instance-details .data-currplayers').innerHTML = _activity.CurrentPlayer; + document.querySelector('#tab-content-activity .player-instance-details .data-instancedetails').onclick = () => showInstanceDetails(_activity.InstanceId); + + var html = ''; + + for (var i = 0; i < _instanceUsers.length; i++) { + html += '
' + + _instanceUsers[i].UserName.makeSafe() + '
'; + } + + document.querySelector('#tab-content-activity .player-instance-players .scroll-content').innerHTML = html; + + document.querySelector('#tab-content-activity .activityDataAvailable').className = 'activityDataAvailable'; + document.querySelector('#tab-content-activity .activityDataUnavailable').className = 'activityDataUnavailable hidden'; + document.querySelector('#tab-content-activity .activityDataPrivate').className = 'activityDataPrivate hidden'; + document.querySelector('#tab-content-activity .activityDataOffline').className = 'activityDataOffline hidden'; + document.querySelector('#tab-content-activity .activityDataNoInstance').className = 'activityDataNoInstance hidden'; + }else if(_activity.IsInJoinableInstance == true && PlayerData.IsFriend && PlayerData.OnlineState){ + document.querySelector('#tab-content-activity .activityDataAvailable').className = 'activityDataAvailable hidden'; + document.querySelector('#tab-content-activity .activityDataUnavailable').className = 'activityDataUnavailable hidden'; + document.querySelector('#tab-content-activity .activityDataPrivate').className = 'activityDataPrivate hidden'; + document.querySelector('#tab-content-activity .activityDataOffline').className = 'activityDataOffline'; + document.querySelector('#tab-content-activity .activityDataNoInstance').className = 'activityDataNoInstance hidden'; + }else if(_activity.IsInJoinableInstance == false && PlayerData.IsFriend && PlayerData.OnlineState && PlayerData.isConnected){ + document.querySelector('#tab-content-activity .activityDataAvailable').className = 'activityDataAvailable hidden'; + document.querySelector('#tab-content-activity .activityDataUnavailable').className = 'activityDataUnavailable hidden'; + document.querySelector('#tab-content-activity .activityDataPrivate').className = 'activityDataPrivate'; + document.querySelector('#tab-content-activity .activityDataOffline').className = 'activityDataOffline hidden'; + document.querySelector('#tab-content-activity .activityDataNoInstance').className = 'activityDataNoInstance hidden'; + }else if(!PlayerData.isConnected && PlayerData.IsFriend){ + document.querySelector('#tab-content-activity .activityDataAvailable').className = 'activityDataAvailable hidden'; + document.querySelector('#tab-content-activity .activityDataUnavailable').className = 'activityDataUnavailable hidden'; + document.querySelector('#tab-content-activity .activityDataPrivate').className = 'activityDataPrivate hidden'; + document.querySelector('#tab-content-activity .activityDataOffline').className = 'activityDataOffline hidden'; + document.querySelector('#tab-content-activity .activityDataNoInstance').className = 'activityDataNoInstance'; + }else{ + document.querySelector('#tab-content-activity .activityDataAvailable').className = 'activityDataAvailable hidden'; + document.querySelector('#tab-content-activity .activityDataUnavailable').className = 'activityDataUnavailable'; + document.querySelector('#tab-content-activity .activityDataPrivate').className = 'activityDataPrivate hidden'; + document.querySelector('#tab-content-activity .activityDataOffline').className = 'activityDataOffline hidden'; + document.querySelector('#tab-content-activity .activityDataNoInstance').className = 'activityDataNoInstance hidden'; + } + + var joinBtn = document.querySelector('#user-detail .join-btn'); + var inviteBtn = document.querySelector('#user-detail .invite-btn'); + var inviteRequestBtn = document.querySelector('#user-detail .invite-request-btn'); + + if(PlayerData.OnlineState && _activity.IsInJoinableInstance){ + if(_activity.InstanceId !== null){ + joinBtn.setAttribute('onclick', 'joinInstance(\''+_activity.InstanceId+'\', \''+_activity.WorldId+'\');'); + joinBtn.classList.remove('disabled'); + }else{ + joinBtn.setAttribute('onclick', ''); + joinBtn.classList.add('disabled'); + } + + inviteBtn.setAttribute('onclick', 'invitePlayer(\''+PlayerData.UserId+'\');'); + inviteBtn.classList.remove('disabled'); + }else if(PlayerData.IsFriend) { + joinBtn.setAttribute('onclick', ''); + joinBtn.classList.add('disabled'); + + inviteBtn.setAttribute('onclick', 'invitePlayer(\''+PlayerData.UserId+'\');'); + inviteBtn.classList.remove('disabled'); + }else{ + joinBtn.setAttribute('onclick', ''); + joinBtn.classList.add('disabled'); + + inviteBtn.setAttribute('onclick', ''); + inviteBtn.classList.add('disabled'); + } + + if (PlayerData.OnlineState && PlayerData.isConnected && PlayerData.IsFriend) { + inviteRequestBtn.setAttribute('onclick', 'requestInvite(\''+PlayerData.UserId+'\');'); + inviteRequestBtn.classList.remove('disabled'); + } else { + inviteRequestBtn.setAttribute('onclick', ''); + inviteRequestBtn.classList.add('disabled'); + } +} + +function closeUserDetail(){ + var detailPage = document.getElementById('user-detail'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +window.friendCategories = []; +window.friendCurrentCategories = []; +window.pickedFriendForCategorie = ''; +window.pickedFriendCategories = []; + +function favoriteFriend(_guid){ + window.pickedFriendForCategorie = _guid; + + var html = ''; + + for (var i=0; i < window.friendCategories.length; i++){ + if(window.friendCurrentCategories.includes(window.friendCategories[i].CategoryKey)){ + window.pickedFriendCategories[window.friendCategories[i].CategoryKey] = true; + html += '
'+window.friendCategories[i].CategoryClearTextName.makeSafe()+'
'; + }else{ + window.pickedFriendCategories[window.friendCategories[i].CategoryKey] = false; + html += '
'+window.friendCategories[i].CategoryClearTextName.makeSafe()+'
'; + } + } + + cvr('#user-detail .favorite-categories').innerHTML(html); + + cvr('#user-detail .favorite-category-selection').removeClass('hidden').addClass('in'); +} + +function closeFriendDetailFavorite(){ + var detailPage = document.querySelector('#user-detail .favorite-category-selection'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +function changeFriendCategory(_categoryIdentifier, _e){ + if (_e.classList.contains('checked')){ + var index = window.friendCurrentCategories.indexOf(_categoryIdentifier); + if (index > -1) { + window.friendCurrentCategories.splice(index, 1); + } + + window.pickedFriendCategories[_categoryIdentifier] = false; + _e.classList.remove('checked'); + }else{ + window.friendCurrentCategories.push(_categoryIdentifier); + + window.pickedFriendCategories[_categoryIdentifier] = true; + _e.classList.add('checked'); + } +} + +function sendFriendCategoryUpdate(){ + var categoryList = []; + + for (var k in window.pickedFriendCategories){ + if (window.pickedFriendCategories[k]){ + categoryList[categoryList.length] = k; + } + } + + engine.call("CVRAppCallUpdateFriendCategories", window.pickedFriendForCategorie, categoryList.join(',')); + closeFriendDetailFavorite(); +} + +function VoteKick(_guid){ + uiConfirmShow("Vote Kick", "Are you sure you want to start a Vote Kick for this person?", "voteKick", _guid); +} + +//Avatar Details +engine.on('LoadAvatarDetails', function(_AvatarDetails){ + displayAvatarDetails(_AvatarDetails); +}); + +window.avatarCategories = []; +window.avatarCurrentCategories = []; + +function displayAvatarDetails(_AvatarDetails){ + window.avatarCurrentCategories = _AvatarDetails.FilterTags.split(','); + var detailPage = document.getElementById('avatar-detail'); + + cvr('#avatar-detail h1').innerHTML(_AvatarDetails.AvatarName.makeSafe()); + cvr('#avatar-detail .avatar-image').attr('src', GetCachedImage(_AvatarDetails.AvatarImageCoui, _AvatarDetails.AvatarImageUrl)); + + cvr('#avatar-detail .author').innerHTML(_AvatarDetails.AuthorName.makeSafe()); + + cvr('#avatar-detail .privacy span').innerHTML(_AvatarDetails.IsPublic?'Public':'Private'); + cvr('#avatar-detail .uploaded span').innerHTML(_AvatarDetails.UploadedAt); + cvr('#avatar-detail .updated span').innerHTML(_AvatarDetails.UpdatedAt); + cvr('#avatar-detail .size span').innerHTML(_AvatarDetails.FileSize); + + cvr('#avatar-detail .description').innerHTML(_AvatarDetails.AvatarDesc.makeSafe()); + cvr('#avatar-detail .tags').innerHTML(_AvatarDetails.Tags.replace(/,/g, ' ').makeSafe()); + + cvr('#avatar-detail .author-btn').removeClass('disabled').attr('onclick', 'getUserDetails(\''+_AvatarDetails.AuthorId+'\');'); + + if (_AvatarDetails.IsPublic || _AvatarDetails.IsSharedWithMe || _AvatarDetails.IsMine){ + cvr('#avatar-detail .change-btn').removeClass('disabled').attr('onclick', 'changeAvatar("'+_AvatarDetails.AvatarId+'");'); + cvr('#avatar-detail .fav-btn').removeClass('disabled').attr('onclick', 'favoriteAvatar("'+_AvatarDetails.AvatarId+'");'); + }else{ + cvr('#avatar-detail .change-btn').addClass('disabled').attr('onclick', ''); + cvr('#avatar-detail .fav-btn').addClass('disabled').attr('onclick', ''); + } + + window.pickedAvatarCategories = []; + + detailPage.classList.remove('hidden'); + detailPage.classList.add('in'); + SetElementToTop(detailPage); +} + +function closeAvatarDetail(){ + var detailPage = document.getElementById('avatar-detail'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); + closeAvatarDetailFavorite(); +} + +window.pickedAvatarForCategorie = ''; +window.pickedAvatarCategories = []; + +function favoriteAvatar(_guid){ + window.pickedAvatarForCategorie = _guid; + + var html = ''; + + for (var i=0; i < window.avatarCategories.length; i++){ + if(window.avatarCurrentCategories.includes(window.avatarCategories[i].CategoryKey)){ + window.pickedAvatarCategories[window.avatarCategories[i].CategoryKey] = true; + html += '
'+window.avatarCategories[i].CategoryClearTextName.makeSafe()+'
'; + }else{ + window.pickedAvatarCategories[window.avatarCategories[i].CategoryKey] = false; + html += '
'+window.avatarCategories[i].CategoryClearTextName.makeSafe()+'
'; + } + } + + cvr('#avatar-detail .favorite-categories').innerHTML(html); + + cvr('#avatar-detail .favorite-category-selection').removeClass('hidden').addClass('in'); +} + +function closeAvatarDetailFavorite(){ + var detailPage = document.querySelector('#avatar-detail .favorite-category-selection'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +function changeAvatarCategory(_categoryIdentifier, _e){ + if (_e.classList.contains('checked')){ + var index = window.avatarCurrentCategories.indexOf(_categoryIdentifier); + if (index > -1) { + window.avatarCurrentCategories.splice(index, 1); + } + + window.pickedAvatarCategories[_categoryIdentifier] = false; + _e.classList.remove('checked'); + }else{ + window.avatarCurrentCategories.push(_categoryIdentifier); + + window.pickedAvatarCategories[_categoryIdentifier] = true; + _e.classList.add('checked'); + } +} + +function sendAvatarCategoryUpdate(){ + var categoryList = []; + + for (var k in window.pickedAvatarCategories){ + if (window.pickedAvatarCategories[k]){ + categoryList[categoryList.length] = k; + } + } + + engine.call("CVRAppCallUpdateAvatarCategories", window.pickedAvatarForCategorie, categoryList.join(',')); + closeAvatarDetailFavorite(); +} + +//Prop Details +function getPropDetails(_propId){ + engine.call("CVRAppCallGetPropDetails", _propId); +} + +engine.on('LoadPropDetails', function(_PropDetails){ + displayPropDetails(_PropDetails); +}); + +window.propCategories = []; +window.propCurrentCategories = []; + +function displayPropDetails(_PropDetails){ + window.propCurrentCategories = _PropDetails.FilterTags.split(','); + var detailPage = document.getElementById('prop-detail'); + + cvr('#prop-detail h1').innerHTML(_PropDetails.SpawnableName.makeSafe()); + cvr('#prop-detail .prop-image').attr('src', GetCachedImage(_PropDetails.SpawnableImageCoui, _PropDetails.SpawnableImageUrl)); + + cvr('#prop-detail .author').innerHTML(_PropDetails.AuthorName.makeSafe()); + + cvr('#prop-detail .data-propAuthorImage').src = GetCachedImage(_PropDetails.AuthorImageCoui, _PropDetails.AuthorImageUrl); + cvr('#prop-detail .data-authorName').innerHTML = _PropDetails.AuthorName.makeSafe(); + + cvr('#prop-detail .privacy span').innerHTML(_PropDetails.IsPublic?'Public':'Private'); + cvr('#prop-detail .uploaded span').innerHTML(_PropDetails.UploadedAt); + cvr('#prop-detail .updated span').innerHTML(_PropDetails.UpdatedAt); + cvr('#prop-detail .size span').innerHTML(_PropDetails.FileSize); + + cvr('#prop-detail .description').innerHTML(_PropDetails.SpawnableDesc.makeSafe()); + cvr('#prop-detail .tags').innerHTML(_PropDetails.Tags.replace(/,/g, ' ').makeSafe()); + + cvr('#prop-detail .author-btn').removeClass('disabled').attr('onclick', 'getUserDetails(\''+_PropDetails.AuthorId+'\');'); + + if (_PropDetails.IsPublic || _PropDetails.IsSharedWithMe || _PropDetails.IsMine){ + cvr('#prop-detail .drop-btn').removeClass('disabled').attr('onclick', 'SpawnProp("'+_PropDetails.SpawnableId+'");'); + cvr('#prop-detail .select-btn').removeClass('disabled').attr('onclick', 'SelectProp("'+_PropDetails.SpawnableId+'", "'+GetCachedImage(_PropDetails.SpawnableImageCoui, _PropDetails.SpawnableImageUrl)+'", "'+_PropDetails.SpawnableName.replace(/"/g, '-').makeSafe()+'");'); + cvr('#prop-detail .fav-btn').removeClass('disabled').attr('onclick', 'favoriteProp("'+_PropDetails.SpawnableId+'");'); + }else{ + cvr('#prop-detail .change-btn').addClass('disabled').attr('onclick', ''); + cvr('#prop-detail .select-btn').addClass('disabled').attr('onclick', ''); + cvr('#prop-detail .fav-btn').addClass('disabled').attr('onclick', ''); + } + + window.pickedPropCategories = []; + + detailPage.classList.remove('hidden'); + detailPage.classList.add('in'); + SetElementToTop(detailPage); +} + +function closePropDetail(){ + var detailPage = document.getElementById('prop-detail'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); + closePropDetailFavorite(); +} + +window.pickedPropForCategorie = ''; +window.pickedPropCategories = []; + +function favoriteProp(_guid){ + window.pickedPropForCategorie = _guid; + + var html = ''; + + for (var i=0; i < window.propCategories.length; i++){ + if(window.propCurrentCategories.includes(window.propCategories[i].CategoryKey)){ + window.pickedPropCategories[window.propCategories[i].CategoryKey] = true; + html += '
'+window.propCategories[i].CategoryClearTextName.makeSafe()+'
'; + }else{ + window.pickedPropCategories[window.propCategories[i].CategoryKey] = false; + html += '
'+window.propCategories[i].CategoryClearTextName.makeSafe()+'
'; + } + } + + cvr('#prop-detail .favorite-categories').innerHTML(html); + + cvr('#prop-detail .favorite-category-selection').removeClass('hidden').addClass('in'); +} + +function closePropDetailFavorite(){ + var detailPage = document.querySelector('#prop-detail .favorite-category-selection'); + detailPage.classList.remove('in'); + detailPage.classList.add('out'); + setTimeout(function(){ + detailPage.classList.add('hidden'); + detailPage.classList.remove('out'); + }, 200); +} + +function changePropCategory(_categoryIdentifier, _e){ + if (_e.classList.contains('checked')){ + var index = window.propCurrentCategories.indexOf(_categoryIdentifier); + if (index > -1) { + window.propCurrentCategories.splice(index, 1); + } + + window.pickedPropCategories[_categoryIdentifier] = false; + _e.classList.remove('checked'); + }else{ + window.propCurrentCategories.push(_categoryIdentifier); + + window.pickedPropCategories[_categoryIdentifier] = true; + _e.classList.add('checked'); + } +} + +function sendPropCategoryUpdate(){ + var categoryList = []; + + for (var k in window.pickedPropCategories){ + if (window.pickedPropCategories[k]){ + categoryList[categoryList.length] = k; + } + } + + engine.call("CVRAppCallUpdatePropCategories", window.pickedPropForCategorie, categoryList.join(',')); + closePropDetailFavorite(); +} + +//Ui Masseges e.g. alerts, coinfirms +var messageList = []; +var pushMessageList = []; + +function uiMessageActive(){ + var messageBoxes = document.querySelectorAll('.message-box'); + var messageActive = false; + + for(var i = 0; i < messageBoxes.length; i++){ + if(!messageBoxes[i].className.includes('hidden')){ + messageActive = true; + } + } + + return messageActive; +} + +function uiCheckForAdditionalMessage(){ + if (messageList.length === 0) { + return; + } + + var data = messageList.shift(); + switch(data.type){ + case 'alert': + uiAlertShow(data.headline, data.text, data.id); + break; + case 'confirm': + uiConfirmShow(data.headline, data.text, data.id, data.data); + break; + case 'alertTimed': + uiAlertTimedShow(data.headline, data.text, data.time, data.id); + break; + } +} + +function uiAlertShow(_headline, _text, _id){ + var alertBox = document.getElementById('alert'); + + // Check if the alert is already at the top of the buffer + if (messageList.length > 0 && messageList[0].headline === _headline && messageList[0].text === _text && messageList[0].id === _id) { + return; + } + + if(uiMessageActive()){ + messageList.push({ + type: 'alert', + headline: _headline, + text: _text, + id: _id + }); + return; + } + + alertBox.classList.remove('hidden'); + alertBox.classList.add('in'); + + alertBox.setAttribute('data-index', _id); + + document.querySelector('#alert h2').innerHTML = _headline.makeSafe(); + document.querySelector('#alert p').innerHTML = _text.makeSafe(); + SetElementToTop(alertBox); +} + +function uiAlertClose(){ + var alertBox = document.getElementById('alert'); + + var id = alertBox.getAttribute('data-index'); + + alertBox.classList.remove('in'); + alertBox.classList.add('out'); + setTimeout(function(){ + alertBox.classList.add('hidden'); + alertBox.classList.remove('out'); + + uiCheckForAdditionalMessage(); + }, 200); + + engine.call('CVRAppCallAlertClose', id); +} + +window.setInterval(updateUiAlertTime, 1000); +var currentAlertMessage = null; + +function updateUiAlertTime() { + var currentTime = new Date(); + if (currentAlertMessage && currentTime >= currentAlertMessage.deadline) { + uiAlertTimedClose(); + currentAlertMessage = null; + } else if (currentAlertMessage) { + var percent = ((currentTime.getTime() - currentAlertMessage.deadline.getTime() + 1000) / 1000) * 100; + document.querySelector('#alertTimed .message-time-bar').setAttribute('style', 'width:' + percent + '%;'); + } +} + +function uiAlertTimedShow(_headline, _text, _time, _id) { + + // filter out back-to-back duplicate messages + if (messageList.length > 0 && messageList[0].text === _text && messageList[0].id === _id) { + return; + } + + // temp deadline, to make sure queued notifications are also cleared if its been too long + var currentTime = new Date(); + var queueDeadline = new Date(currentTime.getTime() + _time * 3000); + + messageList.push({ + type: 'alertTimed', + headline: _headline, + text: _text, + time: _time, + deadline: queueDeadline, + id: _id + }); + + if (!uiMessageActive()) { + uiAlertNext(); + } +} + +function uiAlertNext() { + + // filter out expired messages + var currentTime = new Date(); + messageList = messageList.filter(message => !message.deadline || message.deadline > currentTime); + + if (messageList.length === 0) { + currentAlertMessage = null; + return; + } + + currentAlertMessage = messageList.shift(); + + // real deadline + var currentTime = new Date(); + currentAlertMessage.deadline = new Date(currentTime.getTime() + currentAlertMessage.time * 1000); + + var alertBox = document.getElementById('alertTimed'); + alertBox.classList.remove('hidden'); + alertBox.classList.add('in'); + alertBox.setAttribute('data-index', currentAlertMessage.id); + document.querySelector('#alertTimed h2').innerHTML = currentAlertMessage.headline.makeSafe(); + document.querySelector('#alertTimed p').innerHTML = currentAlertMessage.text.makeSafe(); + document.querySelector('#alertTimed .message-time-bar').setAttribute('style', 'width:0;'); +} + +function uiAlertTimedClose() { + var alertBox = document.getElementById('alertTimed'); + var id = alertBox.getAttribute('data-index'); + + alertBox.classList.remove('in'); + alertBox.classList.add('out'); + + setTimeout(function() { + alertBox.classList.add('hidden'); + alertBox.classList.remove('out'); + uiCheckForAdditionalMessage(); + }, 200); + + engine.call('CVRAppCallAlertClose', id); +} + +window.setInterval(updateUiPushTime, 1000); +var currentPushMessage = null; + +function updateUiPushTime() { + var currentTime = new Date(); + if (currentPushMessage && currentTime >= currentPushMessage.deadline) { + uiPushClose(); + } +} + +function uiPushShow(_text, _time, _id) { + + // filter out back-to-back duplicate messages + if (pushMessageList.length > 0 && pushMessageList[0].text === _text && pushMessageList[0].id === _id) { + return; + } + + // temp deadline, to make sure queued notifications are also cleared if its been too long + var currentTime = new Date(); + var queueDeadline = new Date(currentTime.getTime() + _time * 3000); + + pushMessageList.push({ + text: _text, + time: _time, + deadline: queueDeadline, + id: _id + }); + + if (!uiMessageActive()) { + uiPushNext(); + } +} + +function uiPushNext() { + + // filter out expired messages (cohtml is paused completely while closed) + var currentTime = new Date(); + pushMessageList = pushMessageList.filter(message => !message.deadline || message.deadline > currentTime); + + if (pushMessageList.length === 0){ + currentPushMessage = null; + return; + } + + currentPushMessage = pushMessageList.shift(); + + // real deadline + var currentTime = new Date(); + currentPushMessage.deadline = new Date(currentTime.getTime() + currentPushMessage.time * 1000); + + var alertBox = document.getElementById('push'); + + alertBox.classList.remove('hidden'); + alertBox.classList.add('in'); + alertBox.setAttribute('data-index', currentPushMessage.id); + document.querySelector('#push p').innerHTML = currentPushMessage.text.makeSafe(); + SetElementToTop(alertBox); +} + +function uiPushClose() { + var alertBox = document.getElementById('push'); + var id = alertBox.getAttribute('data-index'); + alertBox.classList.remove('in'); + alertBox.classList.add('out'); + + setTimeout(function() { + alertBox.classList.add('hidden'); + alertBox.classList.remove('out'); + uiPushNext(); + }, 200); + + engine.call('CVRAppCallAlertClose', id); +} + +function uiLoadingShow(_text){ + var loadingBox = document.getElementById('loading'); + + loadingBox.classList.remove('hidden'); + loadingBox.classList.add('in'); + + document.querySelector('#loading p').innerHTML = _text.makeSafe(); +} + +function uiLoadingClose(){ + var loadingBox = document.getElementById('loading'); + + loadingBox.classList.remove('in'); + loadingBox.classList.add('out'); + setTimeout(function(){ + loadingBox.classList.add('hidden'); + loadingBox.classList.remove('out'); + + uiCheckForAdditionalMessage(); + }, 200); +} + +function uiConfirmShow(_headline, _text, _id, _data){ + var alertBox = document.getElementById('confirm'); + + if(uiMessageActive()){ + messageList.push({ + type: 'confirm', + headline: _headline, + text: _text, + id: _id, + data: _data + }); + return; + } + + alertBox.classList.remove('hidden'); + alertBox.classList.add('in'); + + SetElementToTop(alertBox); + + alertBox.setAttribute('data-index', _id); + + if (_data !== undefined) // not specified when using ViewManager.TriggerConfirm + alertBox.setAttribute('data-storage', _data.makeSafe()); + + document.querySelector('#confirm h2').innerHTML = _headline.makeSafe(); + document.querySelector('#confirm p').innerHTML = _text.makeSafe(); +} + +window.uiConfirm = { + id: 0, + value: "", + data: "" +}; + +function uiConfirmClose(_value){ + var alertBox = document.getElementById('confirm'); + + var id = alertBox.getAttribute('data-index'); + var data = alertBox.getAttribute('data-storage'); + + alertBox.classList.remove('in'); + alertBox.classList.add('out'); + setTimeout(function(){ + alertBox.classList.add('hidden'); + alertBox.classList.remove('out'); + + uiCheckForAdditionalMessage(); + }, 200); + + window.uiConfirm.id = id; + window.uiConfirm.value = _value; + window.uiConfirm.data = data; + + var event = new CustomEvent("uiConfirm"); + window.dispatchEvent(event); + engine.call('CVRAppCallConfirmClose', id, _value, data); +} + +window.addEventListener("uiConfirm", function(){ + switch(window.uiConfirm.id){ + case "logout": + if(window.uiConfirm.value == 'true') { + engine.trigger('CVRAppTaskGameLogout'); + } + break; + case "removeFriend": + if(window.uiConfirm.value == 'true') { + engine.call('CVRAppCallRelationsManagement', window.uiConfirm.data, 'Unfriend'); + } + break; + case "block": + if(window.uiConfirm.value == 'true') { + engine.call('CVRAppCallRelationsManagement', window.uiConfirm.data, 'Block'); + } + break; + case "actualKick": + if(window.uiConfirm.value == 'true') { + engine.call('CVRAppCallKickUser', window.uiConfirm.data); + } + break; + case "voteKick": + if(window.uiConfirm.value == 'true') { + engine.call('CVRAppCallStartVoteKick', window.uiConfirm.data, ''); + } + break; + case "resetIK": + if(window.uiConfirm.value == 'true') { + resetIkSettingsEx(); + } + break; + case "resetSettings": + if(window.uiConfirm.value == 'true') { + engine.call('CVRAppActionSettingsReset'); + } + break; + } +}); + +function logout(){ + uiConfirmShow("Logout", "You will be logged out and the game will be closed. Are you sure?", "logout", ""); +} + +//Time Display +function checkTime(i) { + if (i < 10) { + i = "0" + i; + } + return i; +} + +function updateTime(){ + var today = new Date(); + var h = today.getHours(); + var m = today.getMinutes(); + + h = checkTime(h); + m = checkTime(m); + + if(game_settings && game_settings['GeneralClockFormat'] && game_settings['GeneralClockFormat'] != '24'){ + document.querySelector('.time-display').innerHTML = h%12+':'+m+' '+(h >= 12 ? 'PM' : 'AM'); + }else{ + document.querySelector('.time-display').innerHTML = h+':'+m; + } +} +updateTime(); +window.setInterval(updateTime, 1000); + +//Quick menu +function updateAnimationNames(_names){ + var emote1 = document.querySelector('.quick-menu-wrapper .emote-1'); + if(emote1) emote1.innerHTML = _names.emote1.makeSafe(); + + var emote2 = document.querySelector('.quick-menu-wrapper .emote-2'); + if(emote2) emote2.innerHTML = _names.emote2.makeSafe(); + + var emote3 = document.querySelector('.quick-menu-wrapper .emote-3'); + if(emote3) emote3.innerHTML = _names.emote3.makeSafe(); + + var emote4 = document.querySelector('.quick-menu-wrapper .emote-4'); + if(emote4) emote4.innerHTML = _names.emote4.makeSafe(); + + var emote5 = document.querySelector('.quick-menu-wrapper .emote-5'); + if(emote5) emote5.innerHTML = _names.emote5.makeSafe(); + + var emote6 = document.querySelector('.quick-menu-wrapper .emote-6'); + if(emote6) emote6.innerHTML = _names.emote6.makeSafe(); + + var emote7 = document.querySelector('.quick-menu-wrapper .emote-7'); + if(emote7) emote7.innerHTML = _names.emote7.makeSafe(); + + var emote8 = document.querySelector('.quick-menu-wrapper .emote-8'); + if(emote8) emote6.innerHTML = _names.emote8.makeSafe(); + + + var state1 = document.querySelector('.quick-menu-wrapper .state-1'); + if(state1) state1.innerHTML = _names.state1.makeSafe(); + + var state2 = document.querySelector('.quick-menu-wrapper .state-2'); + if(state2) state2.innerHTML = _names.state2.makeSafe(); + + var state3 = document.querySelector('.quick-menu-wrapper .state-3'); + if(state3) state3.innerHTML = _names.state3.makeSafe(); + + var state4 = document.querySelector('.quick-menu-wrapper .state-4'); + if(state4) state4.innerHTML = _names.state4.makeSafe(); + + var state5 = document.querySelector('.quick-menu-wrapper .state-5'); + if(state5) state5.innerHTML = _names.state5.makeSafe(); + + var state6 = document.querySelector('.quick-menu-wrapper .state-6'); + if(state6) state6.innerHTML = _names.state6.makeSafe(); + + var state7 = document.querySelector('.quick-menu-wrapper .state-7'); + if(state7) state7.innerHTML = _names.state7.makeSafe(); + + var state8 = document.querySelector('.quick-menu-wrapper .state-8'); + if(state8) state6.innerHTML = _names.state8.makeSafe(); +} + +//Calls to cohtml +function refreshAvatars(){ + engine.trigger('CVRAppTaskRefreshAvatars'); +} + +function refreshWorlds(){ + worldsResetLoad = true; + engine.trigger('CVRAppTaskRefreshWorlds'); +} + +function loadFilteredWorlds(){ + worldsResetLoad = true; + engine.call('CVRAppCallLoadFilteredWorldsPaged', worldFilter, 0); +} + +function refreshGameModes(){ + engine.trigger('CVRAppTaskRefreshGameModes'); +} + +function refreshFriends(){ + engine.trigger('CVRAppTaskRefreshFriends'); +} + +function refreshFeed(){ + engine.trigger('CVRAppTaskRefreshFeed'); +} + +function disconnect(){ + engine.trigger('CVRAppActionDisconnect'); +} + +function goHome(){ + engine.trigger('CVRAppActionGoHome'); +} + +function exit(){ + engine.trigger('CVRAppActionQuit'); +} + +function toggleMic(){ + engine.trigger('CVRAppActionMicToggle'); +} + +function toogleCamera(){ + engine.trigger('CVRAppActionCameraToggle'); +} +function tooglePathCamera(){ + engine.trigger('CVRAppActionPathCameraToggle'); +} + +function recalibrate(){ + engine.trigger('CVRAppActionRecalibrate'); +} + +function respawn(){ + engine.trigger('CVRAppActionRespawn'); +} + +function mediaPrev(){ + engine.trigger('CVRAppActionMediaPrev'); +} + +function mediaPlayPause(){ + engine.trigger('CVRAppActionMediaPlayPause'); +} + +function mediaStop(){ + engine.trigger('CVRAppActionMediaStop'); +} + +function mediaNext(){ + engine.trigger('CVRAppActionMediaNext'); +} + +function settingsReset(){ + uiConfirmShow("Reset All Settings", "Are you sure you want to Reset All Settings?", "resetSettings", ""); +} + +function toogleSeatedPlay(){ + engine.trigger('CVRAppActionToggleSeatedPlay'); +} + +function toggleFlight(){ + engine.trigger('CVRAppActionToggleFlight'); +} + +function autoCalibrateHeight(){ + engine.trigger('CVRAppActionAutoCalibrateHeight'); +} + +function mouseUnlock(){ + engine.trigger('CVRAppActionMouseUnlock'); +} + +function refreshProps(){ + engine.trigger('CVRAppActionRefreshProps'); +} + +function RemoveMyProps(){ + engine.trigger('CVRAppActionRemoveMyProps'); +} + +function RemoveAllProps(){ + engine.trigger('CVRAppActionRemoveAllProps'); +} + +function changeAvatar(_uid){ + engine.call('CVRAppCallChangeAvatar', _uid); +} + +function changeWorld(_uid){ + engine.call('CVRAppCallChangeWorld', _uid); +} + +function preloadWorld(_uid){ + engine.call('CVRAppCallPreloadWorld', _uid); +} + +function setHome(_uid){ + engine.call('CVRAppCallSetHomeWorld', _uid); +} + +function joinInstance(_uid, _world){ + engine.call('CVRAppCallJoinInstance', _uid, _world); +} +function invitePlayer(_uid){ + engine.call('CVRAppCallInvitePlayer', _uid); +} + +function requestInvite(_uid){ + engine.call('CVRAppCallRequestInvite', _uid); +} + +function playEmote(_id){ + engine.call('CVRAppCallPlayEmote', _id); +} + +function changeState(_id){ + engine.call('CVRAppCallChangeState', _id); +} + +function changeAnimatorParam(_name, _value){ + engine.call('CVRAppCallChangeAnimatorParam', _name, _value, 2); +} + +function changeGestureLeft(_id){ + engine.call('CVRAppCallChangeGestureLeft', _id); +} + +function changeGestureRight(_id){ + engine.call('CVRAppCallChangeGestureRight', _id); +} + +function dropInstancePortal(_instanceID){ + engine.call('CVRAppCallDropInstancePortal', _instanceID); +} + +function loadSettings(){ + engine.trigger('CVRAppActionLoadSettings'); +} + +function playSound(sound){ + engine.trigger('CVRAppCallPlayAudio', sound); +} + +function LoadMicrophones(){ + engine.trigger('CVRAppActionLoadMicrophones'); +} + +function LoadResolutions(){ + engine.trigger('CVRAppActionLoadResolutions'); +} + +function GetAvatarDetails(_guid){ + engine.call('CVRAppCallGetAvatarDetails', _guid); +} + +function ClearImageCache(){ + engine.call('CVRAppActionImageCacheClear'); +} + +var hasProcessedInfoFirstTime = false; +function updateGameDebugInformation(_info) +{ + var ping = document.querySelector('.game-debug-ping'); + if (ping) + ping.innerHTML = _info.Ping; + + var fps = document.querySelector('.game-debug-fps'); + if (fps) + fps.innerHTML = _info.Fps; + + var version = document.querySelector('.game-debug-version'); + if (version) + version.innerHTML = _info.Version; + + var platform = document.querySelector('.game-debug-platform'); + if (platform) + platform.innerHTML = _info.Platform; + + var inVr = document.querySelector('.game-debug-inVr'); + if (inVr) + { + if (_info.IsInVR) + inVr.innerHTML = "true"; + else + inVr.innerHTML = "false"; + } + + if (!hasProcessedInfoFirstTime) + { + hasProcessedInfoFirstTime = true; + + if (_info.IsInEditor) + { + var elementsToRemove = [ + "GraphicsFullscreenWrapper", + "GraphicsResolutionPresetsWrapper" + ]; + RemoveElementsByID(elementsToRemove); + } + + if (_info.Platform == "Android") + { + var elementsToRemove = [ + "subcategory-tobii-eye-tracking", + "subcategory-vive-face-tracking", + "subcategory-rich-presence", + "subcategory-pc-controls", + "subcategory-pc-controls-2", + "subcategory-pc-controls-3", + "subcategory-bundleverifier", + "subcategory-tsac", + "subcategory-audio-devices", + "content-filter-nsfw-wrapper-notice", + + "GraphicsFullscreenWrapper", + "GraphicsResolutionPresetsWrapper", + ]; + RemoveElementsByID(elementsToRemove); + + if (_info.IsInVR) + { + elementsToRemove = [ + "GraphicsFramerateTargetWrapper" + ]; + RemoveElementsByID(elementsToRemove); + } + } + } +} + +function RemoveElementsByID(_idList) +{ + for(var i=0; i < _idList.length; i++) + RemoveElementByID(_idList[i]); +} +function RemoveElementByID(_id) +{ + var entry = document.getElementById(_id); + if (entry) + entry.innerHTML = ""; +} + +//Advanced Avatar Settings +function showAvatarSettings(){ + engine.trigger('CVRAppActionLoadAvatarSettings'); +} + +function DisplayAvatarSettings(_list, _openPage){ + var contentElement = document.querySelector('#avatar-settings .list-content'); + var html = ''; + + for(var i=0; i < _list.length; i++){ + var entry = _list[i]; + + switch(entry.type){ + case 'toggle': + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'dropdown': + var settings = ''; + + for(var j=0; j < entry.optionList.length; j++){ + if(j != 0) settings += ','; + settings += j+':'+entry.optionList[j].makeParameterSafeFull(); + } + + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'colorpicker': + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'slider': + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'joystick2d': + html += '
\n' + + '
' + entry.name.makeSafe() + ':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'joystick3d': + html += '
\n' + + '
' + entry.name.makeSafe() + ':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'inputsingle': + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'inputvector2': + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + case 'inputvector3': + html += '
\n' + + '
'+entry.name.makeSafe()+':
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
\n' + + '
'; + break; + } + } + + if(_list.length == 0){ + html = "There are no advanced settings configured for this avatar."; + } + + contentElement.innerHTML = html; + + if (_openPage) { + var avatarSettings = document.getElementById('avatar-settings'); + avatarSettings.classList.remove('hidden'); + avatarSettings.classList.add('in'); + } + + for(var i=0; i < _list.length; i++){ + var entry = _list[i]; + + switch(entry.type){ + case 'toggle': + new inp_toggle(document.getElementById('AVS_'+entry.parameterName.makeSafe())); + break; + case 'dropdown': + new inp_dropdown(document.getElementById('AVS_'+entry.parameterName.makeSafe())); + break; + case 'colorpicker': + new inp_slider(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-r')); + new inp_slider(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-g')); + new inp_slider(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-b')); + break; + case 'slider': + new inp_slider(document.getElementById('AVS_'+entry.parameterName.makeSafe())); + break; + case 'joystick2d': + new inp_joystick(document.getElementById('AVS_'+entry.parameterName.makeSafe())); + break; + case 'joystick3d': + new inp_joystick(document.getElementById('AVS_'+entry.parameterName.makeSafe())); + new inp_sliderH(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-z')); + break; + case 'inputsingle': + new inp_number(document.getElementById('AVS_'+entry.parameterName.makeSafe())); + break; + case 'inputvector2': + new inp_number(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-x')); + new inp_number(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-y')); + break; + case 'inputvector3': + new inp_number(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-x')); + new inp_number(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-y')); + new inp_number(document.getElementById('AVS_'+entry.parameterName.makeSafe()+'-z')); + break; + } + } +} + +function closeAvatarSettings(){ + closeKeyboard(); + closeNumpad(); + var avatarSettings = document.getElementById('avatar-settings'); + avatarSettings.classList.remove('in'); + avatarSettings.classList.add('out'); + setTimeout(function(){ + avatarSettings.classList.add('hidden'); + avatarSettings.classList.remove('out'); + }, 200); +} + +function DisplayAvatarSettingsProfiles(_info){ + var html = ''; + + for(var i=0; i < _info.length; i++){ + html += '
\n' + + '
'+_info[i].makeSafe()+'
\n' + + '
S
\n' + + '
D
\n' + + '
'; + } + + document.getElementById('savedProfiles').innerHTML = html; +} + +function saveAdvAvtrProfileNew(){ + var profileName = document.getElementById('advAvtrProfileNameNew').value; + saveAdvAvtrProfile(profileName); + document.getElementById('advAvtrProfileNameNew').value = ""; +} +function loadAdvAvtrProfileDefault(){ + engine.trigger('CVRAppActionLoadAdvAvtrSettingsDefault'); +} +function saveAdvAvtrProfile(_name){ + engine.call('CVRAppCallSaveAdvAvtrSettingsProfile', _name); + uiPushShow("The Profile was saved", 2, 'advAvtrCnfSav'); +} +function loadAdvAvtrProfile(_name){ + engine.call('CVRAppCallLoadAdvAvtrSettingsProfile', _name); +} +var profileIndex = ""; +function deleteAdvAvtrProfile(_name){ + profileIndex = _name; + uiConfirmShow("Advanced Avatar Settings", 'Are you sure you want to delete the profile "'+ _name +'"', 'deleteAdvAvtrProfile', ''); +} +window.addEventListener("uiConfirm", function(e){ + if(window.uiConfirm.id == "deleteAdvAvtrProfile" && window.uiConfirm.value == 'true'){ + engine.call('CVRAppCallDeleteAdvAvtrSettingsProfile', profileIndex); + uiPushShow("The Profile was deleted", 2, 'advAvtrCnfDel'); + } +}); + +function vrInputChanged(_fullBodyActive){ + if (_fullBodyActive){ + cvr('#seatedPlayBtnHome').hide(); + cvr('#recalibrateBtnHome').show(); + } else { + cvr('#seatedPlayBtnHome').show(); + cvr('#recalibrateBtnHome').hide(); + } +} + +//Calls from cohtml +engine.on('LoadAvatars', function (_list) { + loadAvatars(_list); +}); + +engine.on('LoadWorlds', function (_list) { + loadWorlds(_list); +}); + +engine.on('LoadWorldsPaged', function (_list, _current, _max) { + loadWorldsPaged(_list, _current, _max); +}); + +engine.on('LoadFriends', function (_list) { + loadFriends(_list); +}); + +engine.on('UpdateUsersOnline', function (_list) { + updateUsersOnline(JSON.parse(_list)); +}); + +engine.on('LoadMessages', function(_invites, _friendrequests, _votes, _systems, _dms){ + loadMessages(_invites, _friendrequests, _votes, _systems, _dms); +}); + +engine.on('LoadMessagesSingle', function(_category, _list){ + loadMessagesSingle(_category, _list); +}); + +/*engine.on('LoadInvites', function(_list){ + loadMessagesSingle('invites', _list); +});*/ + +engine.on('LoadInviteRequests', function(_list){ + loadMessagesSingle('invite-requests', _list); +}); + +engine.on('LoadFriendRequests', function(_list){ + loadMessagesSingle('friend-requests', _list); +}); + +engine.on('AddInvites', function(_invite){ + addMessagesSingle('invites', [_invite]); +}); + +engine.on('AddFriendRequest', function(_friendRequest){ + addMessagesSingle('friend-requests', [_friendRequest]); +}); + +engine.on('AddVote', _vote => { + addMessagesSingle('votes', [_vote]); +}) + +engine.on('ImageCacheSizeUpdate', _cacheSizeStr => { + const cacheSpan = document.getElementById('ImageCacheUsedSize'); + cacheSpan.textContent = _cacheSizeStr; +}) + +function addMessagesSingle(_cat, _list){ + switch(_cat){ + case 'invites': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageInvite(_list[i]); + } + document.querySelector('#message-invites .message-list').innerHTML += html; + break; + case 'invite-requets': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageInviteRequest(_list[i]); + } + document.querySelector('#message-invite-requests .message-list').innerHTML += html; + break; + case 'system-notifications': + var html = ''; + for(var i=0; i < _list.length; i++){ + //html += displayMessageInvite(_list[i]); + } + document.querySelector('#message-system .message-list').innerHTML += html; + break; + case 'friend-requests': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageFriendRequest(_list[i]); + } + document.querySelector('#message-friendrequests .message-list').innerHTML += html; + break; + case 'votes': + var html = ''; + for(var i=0; i < _list.length; i++){ + html += displayMessageVote(_list[i]); + } + document.querySelector('#message-votes .message-list').innerHTML += html; + break; + } +} + +engine.on('LoadSystemNotifications', function(_list){ + addMessagesSingle('system-notifications', _list); +}); + +engine.on('LoadWorldDetails', function (_data, _instances) { + loadWorldDetails(_data, _instances); +}); + +engine.on('AddWorldDetailsInstance', function(_instance){ + addWorldDetailInstance(_instance); +}); + +engine.on('LoadUserDetails', function (_data, _profile) { + loadUserDetails(_data, _profile); +}); + +engine.on('alert', function (_headline, _text, _id) { + uiAlertShow(_headline, _text, _id); +}); +engine.on('alertTimed', function (_headline, _text, _time, _id) { + uiAlertTimedShow(_headline, _text, _time, _id); +}); +engine.on('push', function (_text, _time, _id) { + uiPushShow(_text, _time, _id); +}); + +engine.on('confirm', function (_headline, _text, _id) { + uiConfirmShow(_headline, _text, _id); +}); + +engine.on('loadingShow', function (_text) { + uiLoadingShow(_text); +}); + +engine.on('loadingClose', function () { + uiLoadingClose(); +}); + +engine.on('UpdateMute', function (_muted) { + if(!_muted){ + var buttons = document.querySelectorAll('.action-mute'); + for(var i=0 ; i < buttons.length; i++){ + buttons[i].innerHTML = 'Unmute
'; + } + }else{ + var buttons = document.querySelectorAll('.action-mute'); + for(var i=0 ; i < buttons.length; i++){ + buttons[i].innerHTML = 'Mute'; + } + } +}); + +engine.on('ChangeCameraStatus', function (_active) { + if(_active){ + document.querySelector('#home .action-camera').innerHTML = 'Cam Off'; + }else{ + document.querySelector('#home .action-camera').innerHTML = 'Cam On'; + } +}); + +engine.on('ChangePathCameraStatus', function (_active) { + if(_active){ + document.querySelector('#home .action-path-camera').innerHTML = 'PCam Off'; + }else{ + document.querySelector('#home .action-path-camera').innerHTML = 'PCam On'; + } +}); + +engine.on('UpdateSeated', function (_active) { + if (_active) + document.querySelector('#home .action-seated').classList.add('active'); + else + document.querySelector('#home .action-seated').classList.remove('active'); +}); + +engine.on('UpdateFlight', function (_active) { + if (_active) + document.querySelector('#home .action-flight').classList.add('active'); + else + document.querySelector('#home .action-flight').classList.remove('active'); +}); + +engine.on('ChangeGlobalNSFW', function(_enabled){ + var nsfwSettings = document.getElementById('content-filter-nsfw-wrapper'); + var nsfwSettingsAdditional = document.getElementById('content-filter-nsfw-wrapper-second'); + var nsfwSettingsProp = document.getElementById('content-filter-nsfw-wrapper-props'); + var nsfwSettingsAdditionalProp = document.getElementById('content-filter-nsfw-wrapper-second-props'); + var nsfwSettingsNotice = document.getElementById('content-filter-nsfw-wrapper-notice'); + + if(_enabled){ + nsfwSettings.style.display = 'block'; + nsfwSettingsAdditional.style.display = 'block'; + nsfwSettingsProp.style.display = 'block'; + nsfwSettingsAdditionalProp.style.display = 'block'; + nsfwSettingsNotice.style.display = 'none'; + }else{ + nsfwSettings.style.display = 'none'; + nsfwSettingsAdditional.style.display = 'none'; + nsfwSettingsProp.style.display = 'none'; + nsfwSettingsAdditionalProp.style.display = 'none'; + nsfwSettingsNotice.style.display = 'block'; + } +}); + +engine.on('UpdateAnimationNames', function(_names){ + updateAnimationNames(_names); +}); + +engine.on('UpdateGameDebugInformation', function(_info){ + updateGameDebugInformation(_info); +}); + +engine.on('ShowAvatarSettings', function(_info, _openPage){ + DisplayAvatarSettings(_info, _openPage); +}); + +engine.on('ShowAvatarSettingsProfiles', function(_info){ + DisplayAvatarSettingsProfiles(_info); +}); + +engine.on('LoadSpawnables', function (_list) { + //changeTab('props', document.getElementById('props-btn')); + loadProps(_list); +}); + +engine.on('vrInputChanged', function (_fullBody) { + vrInputChanged(_fullBody); +}); + +//General Input Types +var settings = []; +var game_settings = []; + +function saveSettings(){ + settings.forEach(function(_setting){ + engine.call('CVRAppCallSaveSetting', _setting.name, _setting.value()); + }); +} + +function inp_slider(_obj){ + this.obj = _obj; + this.minValue = parseFloat(_obj.getAttribute('data-min')); + this.maxValue = parseFloat(_obj.getAttribute('data-max')); + this.percent = 0; + this.value = parseFloat(_obj.getAttribute('data-current')); + this.saveOnChange = _obj.getAttribute('data-saveOnChange') == 'true'; + this.dragActive = false; + this.name = _obj.id; + this.type = _obj.getAttribute('data-type'); + this.continuousUpdate = _obj.getAttribute('data-continuousUpdate'); + this.stepSize = _obj.getAttribute('data-stepSize') || 0; + this.format = _obj.getAttribute('data-format') || '{value}'; + + var self = this; + + if (this.stepSize != 0) + this.value = Math.round(this.value / this.stepSize) * this.stepSize; + else + this.value = Math.round(this.value); + + this.valueLabelBackground = document.createElement('div'); + this.valueLabelBackground.className = 'valueLabel background'; + this.valueLabelBackground.innerHTML = this.format.replace('{value}', this.value); + this.obj.appendChild(this.valueLabelBackground); + + this.valueBar = document.createElement('div'); + this.valueBar.className = 'valueBar'; + this.valueBar.setAttribute('style', 'width: '+(((this.value - this.minValue) / (this.maxValue - this.minValue)) * 100)+'%;'); + this.obj.appendChild(this.valueBar); + + this.valueLabelForeground = document.createElement('div'); + this.valueLabelForeground.className = 'valueLabel foreground'; + this.valueLabelForeground.innerHTML = this.format.replace('{value}', this.value); + this.valueLabelForeground.setAttribute('style', 'width: '+(this.value == 0 ? 0 : (1.0 / ((this.value - this.minValue) / (this.maxValue - this.minValue)) * 100))+'%;'); + this.valueBar.appendChild(this.valueLabelForeground); + + this.mouseDown = function(_e){ + self.dragActive = true; + self.mouseMove(_e, false); + } + + this.mouseMove = function(_e, _write){ + if(self.dragActive){ + var rect = _obj.getBoundingClientRect(); + var start = rect.left; + var end = rect.right; + self.percent = Math.min(Math.max((_e.clientX - start) / rect.width, 0), 1); + var value = self.percent; + value *= (self.maxValue - self.minValue); + value += self.minValue; + if (self.stepSize != 0) { + value = Math.round(value / self.stepSize); + self.value = value * self.stepSize; + self.percent = (self.value - self.minValue) / (self.maxValue - self.minValue); + } + else + self.value = Math.round(value); + + self.valueBar.setAttribute('style', 'width: '+(self.percent * 100)+'%;'); + self.valueLabelForeground.setAttribute('style', 'width: '+(1.0 / self.percent * 100)+'%;'); + self.valueLabelBackground.innerHTML = self.valueLabelForeground.innerHTML = self.format.replace('{value}', self.value); + + if(self.type == 'avatar'){ + var color = self.name.substr(self.name.length - 2, self.name.length); + var name = self.name.replace('AVS_', '').replace(color, ''); + var preview = document.getElementById('AVS_PREV_' + name); + if(preview){ + var red = preview.getAttribute('data-r'); + var green = preview.getAttribute('data-g'); + var blue = preview.getAttribute('data-b'); + + switch(color){ + case '-r': + red = parseInt(self.value); + preview.setAttribute('data-r', red); + break; + case '-g': + green = parseInt(self.value); + preview.setAttribute('data-g', green); + break; + case '-b': + blue = parseInt(self.value); + preview.setAttribute('data-b', blue); + break; + } + + preview.setAttribute('style', 'background-color: rgba('+red+','+green+','+blue+',1);'); + } + } else { + var color = self.name.substr(self.name.length - 1, self.name.length); + var name = self.name.substr(0, self.name.length - 1); + var preview = document.getElementById('PREV_' + name); + if(preview){ + var red = preview.getAttribute('data-r'); + var green = preview.getAttribute('data-g'); + var blue = preview.getAttribute('data-b'); + + switch(color){ + case '-r': + case 'R': + red = parseInt(self.value); + preview.setAttribute('data-r', red); + break; + case '-g': + case 'G': + green = parseInt(self.value); + preview.setAttribute('data-g', green); + break; + case '-b': + case 'B': + blue = parseInt(self.value); + preview.setAttribute('data-b', blue); + break; + } + + preview.setAttribute('style', 'background-color: rgba('+red+','+green+','+blue+',1);'); + } + } + + if(self.saveOnChange && (_write === true || self.type == 'avatar' || self.continuousUpdate == 'true')){ + if(self.type == 'avatar'){ + changeAnimatorParam(self.name.replace('AVS_', ''), self.value / self.maxValue); + }else{ + engine.call('CVRAppCallSaveSetting', self.name, "" + self.value); + game_settings[self.name] = self.value; + self.displayImperial(); + } + } + } + } + + this.mouseUp = function(_e){ + self.mouseMove(_e, true); + self.dragActive = false; + } + + _obj.addEventListener('mousedown', this.mouseDown); + document.addEventListener('mousemove', this.mouseMove); + document.addEventListener('mouseup', this.mouseUp); + //_obj.addEventListener('mouseup', this.mouseUp); + + this.getValue = function(){ + return self.value; + } + + this.updateValue = function(value) { + if (self.stepSize != 0) + self.value = Math.round(value * self.stepSize) / self.stepSize; + else + self.value = Math.round(value); + self.percent = (self.value - self.minValue) / (self.maxValue - self.minValue); + self.valueBar.setAttribute('style', 'width: '+(self.percent * 100)+'%;'); + self.valueLabelForeground.setAttribute('style', 'width: '+(1.0 / self.percent * 100)+'%;'); + self.valueLabelBackground.innerHTML = self.valueLabelForeground.innerHTML = self.format.replace('{value}', self.value); + self.displayImperial(); + + if (self.type != "avatar"){ + var color = self.name.substr(self.name.length - 1, self.name.length); + var name = self.name.substr(0, self.name.length - 1); + var preview = document.getElementById('PREV_' + name); + if(preview){ + var red = preview.getAttribute('data-r'); + var green = preview.getAttribute('data-g'); + var blue = preview.getAttribute('data-b'); + + switch(color){ + case '-r': + case 'R': + red = parseInt(self.value); + preview.setAttribute('data-r', red); + break; + case '-g': + case 'G': + green = parseInt(self.value); + preview.setAttribute('data-g', green); + break; + case '-b': + case 'B': + blue = parseInt(self.value); + preview.setAttribute('data-b', blue); + break; + } + + preview.setAttribute('style', 'background-color: rgba('+red+','+green+','+blue+',1);'); + } + } + } + + this.displayImperial = function(){ + var displays = document.querySelectorAll('.imperialDisplay'); + for (var i = 0; i < displays.length; i++){ + var binding = displays[i].getAttribute('data-binding'); + if(binding == self.name){ + var realFeet = ((self.value * 0.393700) / 12); + var feet = Math.floor(realFeet); + var inches = Math.floor((realFeet - feet) * 12); + displays[i].innerHTML = feet + "'" + inches + ''''; + } + } + } + + return { + name: this.name, + value: this.getValue, + updateValue: this.updateValue + } +} + +var sliders = document.querySelectorAll('.inp_slider'); +for(var i = 0; i < sliders.length; i++){ + settings[settings.length] = new inp_slider(sliders[i]); +} + +function inp_dropdown(_obj){ + this.obj = _obj; + this.value = _obj.getAttribute('data-current'); + this.saveOnChange = _obj.getAttribute('data-saveOnChange') == 'true'; + this.options = _obj.getAttribute('data-options').split(','); + this.name = _obj.id; + this.opened = false; + this.keyValue = []; + this.type = _obj.getAttribute('data-type'); + + this.optionElements = []; + + var self = this; + + this.SelectValue = function(_e){ + self.value = _e.target.getAttribute('data-key'); + self.valueElement.innerHTML = _e.target.getAttribute('data-value'); + self.globalClose(); + + if (self.type == 'subcategory') { + var baseId = self.name + "-"; + + // Hide all + var allRelatedSettings = document.querySelectorAll('[id^="' + baseId + '"]'); + allRelatedSettings.forEach(function(settingDiv) { + settingDiv.style.display = 'none'; + }); + + // Show only the correct one + var contentIdToShow = baseId + self.valueElement.innerHTML; + var selectedContent = document.getElementById(contentIdToShow); + if (selectedContent) { + selectedContent.style.display = 'block'; + } + + console.log(baseId); + } + + if(self.saveOnChange){ + if(self.type == 'avatar'){ + changeAnimatorParam(self.name.replace('AVS_', ''), parseFloat(self.value)); + }else { + engine.call('CVRAppCallSaveSetting', self.name, self.value); + game_settings[self.name] = self.value; + } + } + } + + this.openClick = function(_e){ + if(self.obj.classList.contains('open')){ + self.obj.classList.remove('open'); + self.list.setAttribute('style', 'display: none;'); + }else{ + self.obj.classList.add('open'); + self.list.setAttribute('style', 'display: block;'); + self.opened = true; + window.setTimeout(function(){self.opened = false;}, 10); + } + } + + this.globalClose = function(_e){ + if(self.opened) return; + self.obj.classList.remove('open'); + self.list.setAttribute('style', 'display: none;'); + } + + this.list = document.createElement('div'); + this.list.className = 'valueList'; + + this.updateOptions = function(){ + self.list.innerHTML = ""; + for(var i = 0; i < self.options.length; i++){ + self.optionElements[i] = document.createElement('div'); + self.optionElements[i].className = 'listValue'; + var valuePair = Array.isArray(self.options[i])?self.options[i]:self.options[i].split(':'); + var key = ""; + var value = ""; + if(valuePair.length == 1){ + key = valuePair[0]; + value = valuePair[0]; + }else{ + key = valuePair[0]; + value = valuePair[1]; + } + self.keyValue[key] = value; + self.optionElements[i].innerHTML = value; + self.optionElements[i].setAttribute('data-value', value); + self.optionElements[i].setAttribute('data-key', key); + self.list.appendChild(self.optionElements[i]); + self.optionElements[i].addEventListener('mousedown', self.SelectValue); + } + + self.valueElement.innerHTML = self.keyValue[self.value]; + } + + this.valueElement = document.createElement('div'); + this.valueElement.className = 'dropdown-value'; + + this.updateOptions(); + + this.obj.appendChild(this.valueElement); + this.obj.appendChild(this.list); + this.valueElement.addEventListener('mousedown', this.openClick); + document.addEventListener('mousedown', this.globalClose); + + this.getValue = function(){ + return self.value; + } + + this.updateValue = function(value){ + self.value = value; + self.valueElement.innerHTML = self.keyValue[value]; + } + + this.setOptions = function(options){ + self.options = options; + } + + return { + name: this.name, + value: this.getValue, + updateValue: this.updateValue, + updateOptions: this.updateOptions, + setOptions: this.setOptions + } +} + +var dropdowns = document.querySelectorAll('.inp_dropdown'); +for(var i = 0; i < dropdowns.length; i++){ + settings[settings.length] = new inp_dropdown(dropdowns[i]); +} + +function inp_toggle(_obj){ + this.obj = _obj; + this.value = _obj.getAttribute('data-current'); + this.saveOnChange = _obj.getAttribute('data-saveOnChange') == 'true'; + this.name = _obj.id; + this.type = _obj.getAttribute('data-type'); + + var self = this; + + this.mouseDown = function(_e){ + self.value = self.value=="True"?"False":"True"; + self.updateState(); + } + + this.updateState = function(){ + self.obj.classList.remove("checked"); + if(self.value == "True"){ + self.obj.classList.add("checked"); + } + + if(self.saveOnChange){ + if(self.type == 'avatar'){ + changeAnimatorParam(self.name.replace('AVS_', ''), (self.value=="True"?1:0)); + }else{ + engine.call('CVRAppCallSaveSetting', self.name, self.value); + game_settings[self.name] = self.value; + } + } + } + + _obj.addEventListener('mousedown', this.mouseDown); + + this.getValue = function(){ + return self.value; + } + + this.updateValue = function(value){ + self.value = value; + + self.obj.classList.remove("checked"); + if(self.value == "True"){ + self.obj.classList.add("checked"); + } + } + + this.updateValue(this.value); + + return { + name: this.name, + value: this.getValue, + updateValue: this.updateValue + } +} + +var toggles = document.querySelectorAll('.inp_toggle'); +for(var i = 0; i < toggles.length; i++){ + settings[settings.length] = new inp_toggle(toggles[i]); +} + +function inp_joystick(_obj){ + this.obj = _obj; + this.value = _obj.getAttribute('data-current').split('|').map(parseFloat); + var rangeX = _obj.getAttribute('data-range-x').split('|').map(parseFloat); + var rangeY = _obj.getAttribute('data-range-y').split('|').map(parseFloat); + + this.minValue = [rangeX[0] || 0, rangeY[0] || 0]; + this.maxValue = [rangeX[1] || 1, rangeY[1] || 1]; + this.dragActive = false; + this.name = _obj.id; + this.type = _obj.getAttribute('data-type'); + this.caption = _obj.getAttribute('data-caption'); + this.saveOnChange = _obj.getAttribute('data-saveOnChange') == 'true'; + + var self = this; + + this.pointer = document.createElement('div'); + this.pointer.className = 'pointer'; + var initialPercentX = (this.value[0] - this.minValue[0]) / (this.maxValue[0] - this.minValue[0]); + var initialPercentY = (this.value[1] - this.minValue[1]) / (this.maxValue[1] - this.minValue[1]); + this.pointer.setAttribute('style', 'left: ' + (initialPercentX * 100) + '%; top: ' + ((1 - initialPercentY) * 100) + '%;'); + this.obj.appendChild(this.pointer); + + this.reset = function() { + self.value = _obj.getAttribute('data-current').split('|').map(parseFloat); + var percentX = (self.value[0] - self.minValue[0]) / (self.maxValue[0] - self.minValue[0]); + var percentY = (self.value[1] - self.minValue[1]) / (self.maxValue[1] - self.minValue[1]); + self.pointer.setAttribute('style', 'left: ' + (percentX * 100) + '%; top: ' + ((1 - percentY) * 100) + '%;'); + + if (self.saveOnChange) { + if (self.type == 'avatar') { + changeAnimatorParam(self.name.replace('AVS_', '') + '-x', self.value[0]); + changeAnimatorParam(self.name.replace('AVS_', '') + '-y', self.value[1]); + } else { + engine.call('CVRAppCallSaveSetting', self.name, "" + self.value); + game_settings[self.name] = self.value; + self.displayImperial(); + } + } + } + + this.mouseDown = function(_e){ + self.dragActive = true; + self.mouseMove(_e, false); + pauseScrolling = true; + } + + this.mouseMove = function(_e, _write){ + if(self.dragActive){ + var rect = _obj.getBoundingClientRect(); + var startLeft = rect.left; + var startTop = rect.top; + + var rawX = (_e.clientX - startLeft) / rect.width; + var rawY = 1 - (_e.clientY - startTop) / rect.height; + + self.value[0] = self.minValue[0] + rawX * (self.maxValue[0] - self.minValue[0]); + self.value[1] = self.minValue[1] + rawY * (self.maxValue[1] - self.minValue[1]); + self.value[0] = Math.min(Math.max(self.value[0], self.minValue[0]), self.maxValue[0]); + self.value[1] = Math.min(Math.max(self.value[1], self.minValue[1]), self.maxValue[1]); + + var percentX = (self.value[0] - self.minValue[0]) / (self.maxValue[0] - self.minValue[0]); + var percentY = (self.value[1] - self.minValue[1]) / (self.maxValue[1] - self.minValue[1]); + self.pointer.setAttribute('style', 'left: ' + (percentX * 100) + '%; top: ' + ((1 - percentY) * 100) + '%;'); + + if(self.saveOnChange && (_write === true || self.type == 'avatar')){ + if(self.type == 'avatar'){ + changeAnimatorParam(self.name.replace('AVS_', '')+'-x', self.value[0]); + changeAnimatorParam(self.name.replace('AVS_', '')+'-y', self.value[1]); + } else { + engine.call('CVRAppCallSaveSetting', self.name, "" + self.value); + game_settings[self.name] = self.value; + self.displayImperial(); + } + } + } + } + + this.mouseUp = function(_e){ + self.mouseMove(_e, true); + self.dragActive = false; + pauseScrolling = false; + } + + _obj.addEventListener('dblclick', this.reset); + _obj.addEventListener('mousedown', this.mouseDown); + document.addEventListener('mousemove', this.mouseMove); + document.addEventListener('mouseup', this.mouseUp); + + this.getValue = function(){ + return self.value; + } + + this.updateValue = function(value){ + self.value = value.map(Math.round); + var percent = [(self.value[0] - self.minValue[0]) / (self.maxValue[0] - self.minValue[0]), (self.value[1] - self.minValue[1]) / (self.maxValue[1] - self.minValue[1])]; + self.pointer.setAttribute('style', 'left: ' + (percent[0] * 100) + '%; top: ' + ((1 - percent[1]) * 100) + '%;'); + self.displayImperial(); + } + + this.displayImperial = function(){ + var displays = document.querySelectorAll('.imperialDisplay'); + for (var i = 0; i < displays.length; i++){ + var binding = displays[i].getAttribute('data-binding'); + if(binding == self.name){ + var realFeet = ((self.value[0] * 0.393700) / 12); + var feet = Math.floor(realFeet); + var inches = Math.floor((realFeet - feet) * 12); + displays[i].innerHTML = feet + "'" + inches + ''''; + } + } + } + + return { + name: this.name, + value: this.getValue, + updateValue: this.updateValue + } +} + +var joysticks = document.querySelectorAll('.inp_joystick'); +for(var i = 0; i < joysticks.length; i++){ + settings[settings.length] = new inp_joystick(joysticks[i]); +} + +function inp_sliderH(_obj){ + this.obj = _obj; + this.minValue = parseFloat(_obj.getAttribute('data-min')); + this.maxValue = parseFloat(_obj.getAttribute('data-max')); + this.percent = 0; + this.value = parseFloat(_obj.getAttribute('data-current')); + this.saveOnChange = _obj.getAttribute('data-saveOnChange') == 'true'; + this.dragActive = false; + this.name = _obj.id; + this.type = _obj.getAttribute('data-type'); + this.caption = _obj.getAttribute('data-caption'); + + var self = this; + + this.valueBar = document.createElement('div'); + this.valueBar.className = 'valueBar'; + this.valueBar.setAttribute('style', 'height: '+(((this.value - this.minValue) / (this.maxValue - this.minValue)) * 100)+'%;'); + this.obj.appendChild(this.valueBar); + + this.valueLabel = document.createElement('div'); + this.valueLabel.className = 'valueLabel'; + this.valueLabel.innerHTML = this.caption + Math.round(this.value); + this.obj.appendChild(this.valueLabel); + + this.mouseDown = function(_e){ + self.dragActive = true; + self.mouseMove(_e, false); + pauseScrolling = true; + } + + this.mouseMove = function(_e, _write){ + if(self.dragActive){ + var rect = _obj.getBoundingClientRect(); + var start = rect.top; + var end = rect.bottom; + self.percent = 1 - Math.min(Math.max((_e.clientY - start) / rect.height, 0), 1); + var value = self.percent; + value *= (self.maxValue - self.minValue); + value += self.minValue; + self.value = value; + + self.valueBar.setAttribute('style', 'height: '+(self.percent * 100)+'%;'); + self.valueLabel.innerHTML = self.caption + Math.round(self.value); + + if(self.saveOnChange && (_write === true || self.type == 'avatar')){ + if(self.type == 'avatar'){ + changeAnimatorParam(self.name.replace('AVS_', ''), self.value / self.maxValue); + }else{ + engine.call('CVRAppCallSaveSetting', self.name, "" + self.value); + game_settings[self.name] = self.value; + self.displayImperial(); + } + } + } + } + + this.mouseUp = function(_e){ + self.mouseMove(_e, true); + self.dragActive = false; + pauseScrolling = false; + } + + _obj.addEventListener('mousedown', this.mouseDown); + document.addEventListener('mousemove', this.mouseMove); + document.addEventListener('mouseup', this.mouseUp); + //_obj.addEventListener('mouseup', this.mouseUp); + + this.getValue = function(){ + return self.value; + } + + this.updateValue = function(value){ + self.value = value; + self.percent = (self.value - self.minValue) / (self.maxValue - self.minValue); + self.valueBar.setAttribute('style', 'height: '+(self.percent * 100)+'%;'); + self.valueLabel.innerHTML = self.caption + Math.round(self.value); + self.displayImperial(); + } + + this.displayImperial = function(){ + var displays = document.querySelectorAll('.imperialDisplay'); + for (var i = 0; i < displays.length; i++){ + var binding = displays[i].getAttribute('data-binding'); + if(binding == self.name){ + var realFeet = ((self.value * 0.393700) / 12); + var feet = Math.floor(realFeet); + var inches = Math.floor((realFeet - feet) * 12); + displays[i].innerHTML = feet + "'" + inches + ''''; + } + } + } + + return { + name: this.name, + value: this.getValue, + updateValue: this.updateValue + } +} + +var slidersH = document.querySelectorAll('.inp_sliderH'); +for(var i = 0; i < slidersH.length; i++){ + settings[settings.length] = new inp_sliderH(slidersH[i]); +} + +function inp_number(_obj){ + this.obj = _obj; + this.minValue = parseFloat(_obj.getAttribute('data-min')); + this.maxValue = parseFloat(_obj.getAttribute('data-max')); + this.value = parseFloat(_obj.getAttribute('data-current')); + this.saveOnChange = _obj.getAttribute('data-saveOnChange') == 'true'; + this.name = _obj.id; + this.type = _obj.getAttribute('data-type'); + this.caption = _obj.getAttribute('data-caption'); + this.mode = _obj.getAttribute('data-mode'); + + if(this.mode == "int"){ + this.obj.innerHTML = this.caption + ": " + this.value; + }else{ + this.obj.innerHTML = this.caption + ": " + this.value.toFixed(4); + } + + var self = this; + + this.mouseDown = function(_e){ + self.dragActive = true; + pauseScrolling = true; + displayNumpad(self); + } + + this.updateValue = function(_value, _write){ + self.value = Math.min(9999, Math.max(-9999, _value)); + + if(self.mode == "int"){ + _obj.innerHTML = self.caption + ": " + self.value; + }else{ + _obj.innerHTML = self.caption + ": " + self.value.toFixed(4); + } + + if(self.saveOnChange && (_write === true || self.type == 'avatar')){ + if(self.type == 'avatar'){ + changeAnimatorParam(self.name.replace('AVS_', ''), self.value); + }else{ + engine.call('CVRAppCallSaveSetting', self.name, "" + self.value); + game_settings[self.name] = self.value; + self.displayImperial(); + } + } + } + + this.mouseUp = function(_e){ + self.dragActive = false; + pauseScrolling = false; + } + + _obj.addEventListener('mousedown', this.mouseDown); + document.addEventListener('mouseup', this.mouseUp); + + this.getValue = function(){ + return self.value; + } + + this.getMode = function(){ + return self.mode; + } + + return { + name: this.name, + value: this.getValue, + updateValue: this.updateValue, + getMode: this.getMode + } +} + +var inputNumber = document.querySelectorAll('.inp_number'); +for(var i = 0; i < inputNumber.length; i++){ + settings[settings.length] = new inp_number(inputNumber[i]); +} + +function updateGameSettingsValue(_name, _value){ + for(var i = 0; i < settings.length; i++){ + if(settings[i].name == _name){ + settings[i].updateValue(_value); + game_settings[_name] = _value; + } + } +} + +engine.on('UpdateGameSettings', function(_name, _value){ + updateGameSettingsValue(_name, _value); +}); + +engine.on('UpdateGameSettingsBulk', function(_settings){ + for(var i = 0; i < _settings.length; i++){ + updateGameSettingsValue(_settings[i].Name, _settings[i].Value); + } +}); + +function updateDropDownOptions(_name, _options){ + var optionString = []; + + for(var i = 0; i < _options.length; i++){ + optionString[optionString.length] = [_options[i].key, _options[i].value]; + } + + for(i = 0; i < window.settings.length; i++){ + if(window.settings[i].name == _name){ + window.settings[i].setOptions(optionString); + window.settings[i].updateOptions(); + } + } +} + +engine.on('UpdateDropDownOptions', function(_name, _options){ + updateDropDownOptions(_name, _options); +}); + +function addSettingsValue(name, delta){ + for(var i = 0; i < settings.length; i++){ + if(settings[i].name == name){ + settings[i].updateValue(settings[i].value() + delta); + engine.call('CVRAppCallSaveSetting', name, '' + (settings[i].value() + delta)); + } + } +} + +var keyboardTarget; +var keyboardMaxLength = 0; + +function displayKeyboard(_e){ + var keyboard = document.getElementById('keyboard'); + var inVr = document.querySelector('.game-debug-inVr'); + + document.getElementById('keyoard-input').value = _e.value; + keyboardMaxLength = parseInt(_e.getAttribute("data-max-length")); + + keyboardTarget = _e; + + keyboard.classList.remove('hidden'); + keyboard.classList.add('in'); + + SetElementToTop(keyboard); + + // Only focus keyboard if not in VR + if (!inVr || (inVr && inVr.innerHTML !== "true")) { + document.getElementById('keyoard-input').focus(); + } +} + +function closeKeyboard(){ + keyboardClosed(); + var keyboard = document.getElementById('keyboard'); + keyboard.classList.remove('in'); + keyboard.classList.add('out'); + setTimeout(function(){ + // Only hide if it wasn't shown. Happens when closing the keyboard and the menu at the same time, because + // the timer doesn't run, and if we open the menu and the keyboard at the same time -> rip + if (!document.getElementById('keyboard').classList.contains('in')) { + keyboard.classList.add('hidden'); + } + keyboard.classList.remove('out'); + }, 200); +} + +var keyboardKeys = document.querySelectorAll('.keyboard-key'); +var keyboardModKeys = document.querySelectorAll('.keyboard-mod'); +var keyboardFuncKeys = document.querySelectorAll('.keyboard-func'); + +var keyMod = ""; +var modLock = false; + +for(var i=0; i < keyboardKeys.length; i++){ + keyboardKeys[i].addEventListener('mousedown', sendKey); +} + +for(var i=0; i < keyboardFuncKeys.length; i++){ + keyboardFuncKeys[i].addEventListener('mousedown', sendFuncKey); +} + +for(var i=0; i < keyboardModKeys.length; i++){ + keyboardModKeys[i].addEventListener('mousedown', sendModKey); +} + +function sendKey(_e){ + var input = document.getElementById('keyoard-input'); + if(keyboardMaxLength > 0 && input.value.length == keyboardMaxLength) return; + input.value += _e.target.textContent; + + if(!modLock && keyMod != ""){ + keyMod = ""; + + var list = document.querySelectorAll('#keyboard .active'); + for(var i=0; i < list.length; i++){ + list[i].classList.remove('active'); + } + + updateKeys(); + } +} + +document.getElementById('keyoard-input').addEventListener("keyup", function(e){ + if (e.key === 'Enter' || e.keyCode === 13) { + if (document.getElementById('keyboard').classList.contains('in')){ + var input = document.getElementById('keyoard-input'); + keyboardTarget.value = input.value; + closeKeyboard(); + var submit = keyboardTarget.getAttribute('data-submit'); + if(submit != null) { + eval(submit); + } + } + } else if (e.key === 'Escape' || e.keyCode === 27) { + if (document.getElementById('keyboard').classList.contains('in')){ + closeKeyboard(); + } + } +}); + +function sendFuncKey(_e){ + var input = document.getElementById('keyoard-input'); + var func = _e.target.getAttribute('data-key-func'); + + switch(func){ + case 'BACKSPACE': + input.value = input.value.substring(0, input.value.length - 1); + break; + case 'CLEAR': + input.value = ''; + break; + case 'ENTER': + keyboardTarget.value = input.value; + closeKeyboard(); + var submit = keyboardTarget.getAttribute('data-submit'); + if(submit != null) { + eval(submit); + } + break; + case 'BACK': + closeKeyboard(); + break; + case 'PASTE': + keyboardPasteFromClipboard(); + break; + } +} + +function sendModKey(_e){ + var mod = _e.target.getAttribute('data-key-mod'); + var lock = _e.target.getAttribute('data-key-mod-lock'); + + if(mod == null && lock != null){ + modLock = true; + mod = lock; + } + + if(mod == keyMod){ + keyMod = ""; + modLock = false; + + var list = document.querySelectorAll('#keyboard .active'); + for(var i=0; i < list.length; i++){ + list[i].classList.remove('active'); + } + }else{ + keyMod = mod; + _e.target.classList.add('active'); + } + updateKeys(); +} + +function updateKeys(){ + for(var i=0; i < keyboardKeys.length; i++){ + var value = keyboardKeys[i].getAttribute('data-key'); + var dataValue = keyboardKeys[i].getAttribute('data-key-' + keyMod); + keyboardKeys[i].textContent = dataValue!=null?dataValue:value; + } +} + +var numpadTarget; +var numpadHasDecimal = false; +var numpadDecimals = 0; +var hasPlaceholder = false; +var numpadMode = ""; + +function displayNumpad(_e){ + var numpad = document.getElementById('numpad'); + + numpadMode = _e.getMode(); + + if(numpadMode == "int"){ + document.getElementById('numpad-input').value = _e.getValue(); + }else{ + document.getElementById('numpad-input').value = _e.getValue().toFixed(4); + } + + document.getElementById('numpad-input').classList.add("placeholder"); + + numpadTarget = _e; + numpadHasDecimal = false; + numpadDecimals = 0; + hasPlaceholder = true; + + numpad.classList.remove('hidden'); + numpad.classList.add('in'); +} + +var numpadKeys = document.querySelectorAll('.numpadButton'); + +for(var i=0; i < numpadKeys.length; i++){ + numpadKeys[i].addEventListener('mousedown', sendNumpadKey); +} + +function sendNumpadKey(_e){ + var value = _e.target.getAttribute('data-value'); + var input = document.getElementById('numpad-input'); + var currentValue = parseFloat(input.value); + if (hasPlaceholder) currentValue = 0; + + switch(value){ + case 'back': + closeNumpad(); + break; + case 'clear': + input.value = 0; + input.classList.remove("placeholder"); + hasPlaceholder = false; + numpadHasDecimal = false; + numpadDecimals = 0; + break; + case '-': + currentValue *= -1; + input.value = currentValue; + break; + case 'enter': + numpadTarget.updateValue(currentValue); + closeNumpad(); + break; + case '.': + if(numpadMode != "int") { + if (!numpadHasDecimal) { + input.classList.remove("placeholder"); + hasPlaceholder = false; + numpadHasDecimal = true; + numpadDecimals = 1; + input.value = currentValue + "."; + } + } + break; + default: + input.classList.remove("placeholder"); + hasPlaceholder = false; + if(!numpadHasDecimal){ + currentValue = currentValue * 10 + parseInt(value); + input.value = currentValue; + }else{ + currentValue = currentValue + (parseInt(value) / Math.pow(10, numpadDecimals)); + if(numpadMode == "int") { + input.value = currentValue; + }else{ + input.value = currentValue.toFixed(Math.min(numpadDecimals, 4)); + } + numpadDecimals++; + } + break; + } +} + +function closeNumpad(){ + var numpad = document.getElementById('numpad'); + numpad.classList.remove('in'); + numpad.classList.add('out'); + setTimeout(function(){ + numpad.classList.add('hidden'); + numpad.classList.remove('out'); + }, 200); +} + +//Call Menu +function acceptCall(callId){ + engine.call("CVRAppCallAcceptCall", callId); +} + +function denyCall(callId){ + engine.call("CVRAppCallDenyCall", callId); +} + +function endCall(callId){ + engine.call("CVRAppCallEndCall", callId); +} + +engine.on("CallServiceCallIncoming", function(call){ + cvr('.call-profile').addClass('calling').attr('src', call.profimeImageUrl); + + cvr('.call-name').innerHTML(call.username.makeSafe()); + + cvr('.call-duration').innerHTML('Incoming Call'); + + cvr('.call-actions').innerHTML('
'+ + '
'); +}); + +engine.on("CallServiceCallStarted", function(call){ + cvr('.call-profile').removeClass('calling').attr('src', call.profimeImageUrl); + + cvr('.call-name').innerHTML(call.username.makeSafe()); + + cvr('.call-duration').innerHTML('00:00:00'); + + cvr('.call-actions').innerHTML('
'); +}); + +engine.on("CallServiceCallTimeUpdate", function(call){ + cvr('.call-duration').innerHTML(new Date(call.duration * 1000).toISOString().substr(11, 8)); +}); + +engine.on("CallServiceCallEnded", function(call){ + cvr('.call-profile').removeClass('calling').attr('src', ''); + + cvr('.call-actions').innerHTML(''); +}); + +function ShowCurrentInstanceDetails(){ + engine.trigger("CVRAppActionShowCurrentInstanceDetails"); +} + +function RemovePlayerAvatars(){ + engine.trigger("CVRAppActionClearAllAvatars"); +} + +function PanicMute(){ + engine.trigger("CVRAppActionMuteAllChannels"); +} + +engine.on("OpenInWorldKeyboard", function(previousValue){ + var worldInput = document.getElementById('world-ui-input'); + worldInput.value = previousValue; + + displayKeyboard(worldInput); +}); + +function OpenTTSKeyboard(){ + var ttsInput = document.getElementById('ttsinput'); + ttsInput.value = ""; + displayKeyboard(ttsInput); +} +engine.on("OpenTTSKeyboard", OpenTTSKeyboard); +function sendTTS(txt){ + engine.call('CVRAppCallSubmitTTS', txt); +} + +engine.on("updateKeyboardFromClipboard", function(content){ + var input = document.getElementById('keyoard-input'); + if(keyboardMaxLength > 0 && input.value.length == keyboardMaxLength) return; + input.value += content; +}); + +function keyboardPasteFromClipboard(){ + engine.trigger("CVRAppActionKeyboardPaste"); +} + +function keyboardClosed(){ + engine.trigger("CVRAppActionKeyboardClosed"); +} + +function sendToWorldUi(){ + var worldInput = document.getElementById('world-ui-input'); + + engine.call("CVRAppCallSendToWorldUi", worldInput.value); +} + +engine.on("RemoveNotification", function(type, id){ + var eid = ""; + switch (type) { + case "friendRequest": + eid = "notification_friend_request_"+id; + break; + case "invite": + eid = "notification_invite_"+id; + break; + case "vote": + eid = "notification_vote_"+id; + } + var element = document.getElementById(eid); + if (element) { + element.parentNode.removeChild(element); + } +}); + +function GenerateSupportCode(){ + engine.trigger("CVRAppActionGenerateSupportCode"); +} + +engine.on("DisplaySupportCode", function(code){ + cvr('#support-code-display').innerHTML(code).attr("onclick", "CopySupportCode('"+code+"');"); +}); + +function CopySupportCode(text){ + engine.call("CVRAppCallCopyToClipboard", text); +} + +engine.on("SwitchCategory", function(tab){ + changeTab(tab, cvr(".tab_btn_"+tab).first()); +}); + +engine.trigger('CVRAppActionNextSendFullFriendsList'); + +engine.on("LoadSearchResults", function(_results){ + displaySearch(_results); +}); + +var isLazyLoading = false; +function LazyLoadImages() { + + var images = document.querySelectorAll('img[data-loading-url]'); + + if (images.length > 0 && images[0].getAttribute('data-loading') != 'loading'){ + if (!isLazyLoading){ + engine.call('CVRAppCallUpdateLazyLoadingStatus', true); + isLazyLoading = true; + } + + let handledLazyImage = false; + + // Iterate images until we reach one that requires lazy loading + for (let i = 0; i < images.length; i++) { + + const imageUrl = images[i].getAttribute('data-loading-url'); + const isLazyLoadingImage = imageUrl.startsWith('http'); + + if (isLazyLoadingImage) { + // If already lazy loaded an image -> skip all other lazy loading images! + if (handledLazyImage) { + continue; + } + // Otherwise just mark as handled (so we can process the remaining non-lazy loading images) + else { + handledLazyImage = true; + } + } + + images[i].addEventListener('load', (event) => { + event.target.removeAttribute('loading'); + event.target.removeAttribute('data-loading-url'); + }); + + images[i].addEventListener('error', (event) => { + event.target.removeAttribute('loading'); + event.target.removeAttribute('data-loading-url'); + }); + + window.setTimeout(function(){ + images[i].removeAttribute('loading'); + images[i].removeAttribute('data-loading-url'); + }, 500); + + images[i].setAttribute('data-loading', 'loading'); + images[i].setAttribute('src', imageUrl); + } + + } else if (images.length == 0 && isLazyLoading){ + engine.call('CVRAppCallUpdateLazyLoadingStatus', false); + isLazyLoading = false; + } + + requestAnimationFrame(LazyLoadImages); +} +requestAnimationFrame(LazyLoadImages); + +function updateGameSettingsValueSave(_name, _value){ + for(var i = 0; i < settings.length; i++){ + if(settings[i].name == _name){ + settings[i].updateValue(_value); + engine.call('CVRAppCallSaveSetting', _name, _value); + game_settings[_name] = _value; + } + } +} + +function resetIkSettings(){ + uiConfirmShow("Reset IK Settings", "Are you sure you want to reset the IK settings?", "resetIK", ""); +} + +function resetIkSettingsEx(){ + updateGameSettingsValueSave("IKPitchYawShoulders", "True"); + updateGameSettingsValueSave("IKPlantFeet", "False"); + updateGameSettingsValueSave("IKHipPinned", "True"); + updateGameSettingsValueSave("IKStraightenNeck", "False"); + updateGameSettingsValueSave("IKHipShifting", "True"); + updateGameSettingsValueSave("IKPreStraightenSpine", "False"); + + updateGameSettingsValueSave("IKSpineRelaxIterations", "10"); + updateGameSettingsValueSave("IKMaxSpineAngleFwd", "30"); + updateGameSettingsValueSave("IKMaxSpineAngleBack", "30"); + updateGameSettingsValueSave("IKMaxNeckAngleFwd", "30"); + updateGameSettingsValueSave("IKMaxNeckAngleBack", "15"); + updateGameSettingsValueSave("IKNeckPriority", "2"); + updateGameSettingsValueSave("IKStraightSpineAngle", "15"); + updateGameSettingsValueSave("IKStraightSpinePower", "2"); +} + +function testWorldTransition(){ + engine.trigger("CVRAppCallTestTransition"); +} + +var globalZIndex = 5000; + +function SetElementToTop(_element){ + _element.style.zIndex = globalZIndex; + globalZIndex++; +} + +function GetCachedImage(coui, url) { + return coui ? coui : url; +} + +function switchMode(){ + engine.trigger("CVRAppCallSwitchMode"); +} \ No newline at end of file From 19915be5df41f44614a0316275de28e1da452040 Mon Sep 17 00:00:00 2001 From: Adam Beckingham Date: Mon, 19 Feb 2024 10:05:16 -0700 Subject: [PATCH 2/2] Update README.md --- README.md | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index a15e97c..126cec1 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,15 @@ -**There's two versions of edit;** +**There are two versions of the edit;**

- **For "lite" version:** + **"lite" version:**
+Changes UI style.
replace `ui.css` in `..\ChilloutVR\ChilloutVR_Data\StreamingAssets\Cohtml\UIResources\CVRTest\`
and Extract Everything from `gfx` folder to `..\ChilloutVR\ChilloutVR_Data\StreamingAssets\Cohtml\UIResources\CVRTest\gfx\`

- **For "full dive" version:**
+ **"full dive" version:**
+ Changes UI style and adds "Author" button to the prop and avatar detail pages.
Replace `ui.css` in `..\ChilloutVR\ChilloutVR_Data\StreamingAssets\Cohtml\UIResources\CVRTest\`,
`index.html` in `..\ChilloutVR\ChilloutVR_Data\StreamingAssets\Cohtml\UIResources\CVRTest\`,
and Extract Everything from `..\gfx\` folder to `..\ChilloutVR\ChilloutVR_Data\StreamingAssets\Cohtml\UIResources\CVRTest\gfx\`