Update admin menu
This commit is contained in:
parent
1a27b7d2ee
commit
a2d56ef56a
6 changed files with 69 additions and 55 deletions
7
front/dist/resources/html/gameMenu.html
vendored
7
front/dist/resources/html/gameMenu.html
vendored
|
@ -1,17 +1,16 @@
|
|||
<style>
|
||||
*{
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
cursor: url('../logos/cursor_normal.png'), auto !important;
|
||||
cursor: url('/resources/logos/cursor_normal.png'), auto;
|
||||
}
|
||||
* a, button, select{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer !important;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
#gameMenu button {
|
||||
background-color: black;
|
||||
color: white;
|
||||
border-radius: 7px;
|
||||
padding-bottom: 4px;
|
||||
min-width: 100px;
|
||||
}
|
||||
#gameMenu section {
|
||||
margin: 10px;
|
||||
|
@ -37,7 +36,7 @@
|
|||
<button id="sparkButton">Create map</button>
|
||||
</section>
|
||||
<section id="adminConsoleSection" hidden>
|
||||
<button id="adminConsoleButton">Admin con.</button>
|
||||
<button id="adminConsoleButton">Admin console</button>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
|
|
4
front/dist/resources/html/gameMenuIcon.html
vendored
4
front/dist/resources/html/gameMenuIcon.html
vendored
|
@ -1,10 +1,10 @@
|
|||
<style>
|
||||
*{
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
cursor: url('../logos/cursor_normal.png'), auto !important;
|
||||
cursor: url('/resources/logos/cursor_normal.png'), auto;
|
||||
}
|
||||
* a, button, select{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer !important;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
#menuIcon button {
|
||||
background-color: black;
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<style>
|
||||
*{
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
cursor: url('../logos/cursor_normal.png'), auto !important;
|
||||
cursor: url('/resources/logos/cursor_normal.png'), auto;
|
||||
}
|
||||
* a, button, select{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer !important;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
#gameQuality {
|
||||
background: #eceeee;
|
||||
|
|
43
front/dist/resources/style/style.css
vendored
43
front/dist/resources/style/style.css
vendored
|
@ -1,9 +1,9 @@
|
|||
*{
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
cursor: url('../logos/cursor_normal.png'), auto !important;
|
||||
cursor: url('/resources/logos/cursor_normal.png'), auto;
|
||||
}
|
||||
* a, button, select{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer !important;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
body{
|
||||
overflow: hidden;
|
||||
|
@ -112,7 +112,7 @@ video#myCamVideo{
|
|||
}
|
||||
/*btn animation*/
|
||||
.btn-cam-action div{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
position: absolute;
|
||||
border: solid 0px black;
|
||||
width: 44px;
|
||||
|
@ -299,7 +299,7 @@ body {
|
|||
right: -100px;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
animation: right .2s ease;
|
||||
}
|
||||
#cowebsite .close-btn img{
|
||||
|
@ -389,7 +389,7 @@ body {
|
|||
margin: 2%;
|
||||
flex-basis: 96%;
|
||||
transition: margin-left 0.2s, margin-right 0.2s, margin-bottom 0.2s, margin-top 0.2s, flex-basis 0.2s;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
/*flex-shrink: 2;*/
|
||||
}
|
||||
|
||||
|
@ -406,7 +406,7 @@ body {
|
|||
.sidebar > div {
|
||||
margin: 2%;
|
||||
transition: margin-left 0.2s, margin-right 0.2s, margin-bottom 0.2s, margin-top 0.2s, max-height 0.2s, max-width 0.2s;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
border-radius: 15px 15px 15px 15px;
|
||||
}
|
||||
|
||||
|
@ -437,7 +437,7 @@ body {
|
|||
margin: 1%;
|
||||
max-height: 96%;
|
||||
transition: margin-left 0.2s, margin-right 0.2s, margin-bottom 0.2s, margin-top 0.2s;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
|
||||
.chat-mode > div:hover {
|
||||
|
@ -473,7 +473,8 @@ body {
|
|||
min-height: 200px;
|
||||
max-height: 80%;
|
||||
top: -80%;
|
||||
left: 10%;
|
||||
/*left: 10%;*/
|
||||
left: 250px;
|
||||
background: #333333;
|
||||
z-index: 200;
|
||||
transition: all 0.1s ease-out;
|
||||
|
@ -530,7 +531,7 @@ body {
|
|||
margin-top: 6px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
padding: 0 5px;
|
||||
transition: all .5s ease;
|
||||
transform: rotateY(0);
|
||||
|
@ -554,7 +555,7 @@ body {
|
|||
|
||||
.main-console div.console:hover,
|
||||
.message-container div.clear:hover {
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
top: calc(100% + 5px);
|
||||
transform: scale(1.2) translateY(3px);
|
||||
}
|
||||
|
@ -587,7 +588,7 @@ body {
|
|||
transition: all .2s ease;
|
||||
}
|
||||
.main-console .btn-action .btn:hover{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
background-color: #ffda01;
|
||||
color: black;
|
||||
border: 1px solid black;
|
||||
|
@ -602,7 +603,7 @@ body {
|
|||
|
||||
.main-console .menu span {
|
||||
margin: 20px;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
|
||||
.main-console .menu span.active {
|
||||
|
@ -636,12 +637,14 @@ body {
|
|||
}
|
||||
.main-console section div.upload label img{
|
||||
height: 150px;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
.main-console section div.upload label img{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*audio html when audio message playing*/
|
||||
.main-container .audio-playing {
|
||||
position: absolute;
|
||||
|
@ -729,7 +732,7 @@ div.modal-report-user{
|
|||
right: 0;
|
||||
left: auto;
|
||||
top: 0;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin: 10px;
|
||||
|
@ -748,7 +751,7 @@ div.modal-report-user{
|
|||
transition: all .2s ease;
|
||||
}
|
||||
.modal-report-user button:hover{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
background-color: #ffda01;
|
||||
color: black;
|
||||
border: 1px solid black;
|
||||
|
@ -791,7 +794,7 @@ div.modal-report-user{
|
|||
}
|
||||
.discussion .active-btn{
|
||||
display: none;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
background-color: #2d2d2dba;
|
||||
|
@ -820,7 +823,7 @@ div.modal-report-user{
|
|||
right: 10px;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
.discussion .close-btn img{
|
||||
height: 15px;
|
||||
|
@ -845,7 +848,7 @@ div.modal-report-user{
|
|||
background-color: #ffffff69;
|
||||
padding: 5px;
|
||||
border-radius: 15px;
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
}
|
||||
|
||||
.discussion .participants .participant:hover{
|
||||
|
@ -878,7 +881,7 @@ div.modal-report-user{
|
|||
}
|
||||
|
||||
.discussion .participants .participant button.report-btn{
|
||||
cursor: url('../logos/cursor_pointer.png'), pointer;
|
||||
cursor: url('/resources/logos/cursor_pointer.png'), pointer;
|
||||
position: absolute;
|
||||
background-color: #2d2d2dba;
|
||||
right: 34px;
|
||||
|
|
|
@ -21,11 +21,11 @@ export class ConsoleGlobalMessageManager {
|
|||
|
||||
private readonly divMainConsole: HTMLDivElement;
|
||||
private readonly divMessageConsole: HTMLDivElement;
|
||||
private readonly divSettingConsole: HTMLDivElement;
|
||||
//private readonly divSettingConsole: HTMLDivElement;
|
||||
private readonly buttonMainConsole: HTMLDivElement;
|
||||
private readonly buttonSendMainConsole: HTMLImageElement;
|
||||
private readonly buttonAdminMainConsole: HTMLImageElement;
|
||||
private readonly buttonSettingsMainConsole: HTMLImageElement;
|
||||
//private readonly buttonAdminMainConsole: HTMLImageElement;
|
||||
//private readonly buttonSettingsMainConsole: HTMLImageElement;
|
||||
private activeConsole: boolean = false;
|
||||
private activeMessage: boolean = false;
|
||||
private activeSetting: boolean = false;
|
||||
|
@ -40,11 +40,12 @@ export class ConsoleGlobalMessageManager {
|
|||
this.divMainConsole.className = CLASS_CONSOLE_MESSAGE;
|
||||
this.divMessageConsole = document.createElement('div');
|
||||
this.divMessageConsole.className = 'message';
|
||||
this.divSettingConsole = document.createElement('div');
|
||||
this.divSettingConsole.className = 'setting';
|
||||
//this.divSettingConsole = document.createElement('div');
|
||||
//this.divSettingConsole.className = 'setting';
|
||||
this.buttonSendMainConsole = document.createElement('img');
|
||||
this.buttonSettingsMainConsole = document.createElement('img');
|
||||
this.buttonAdminMainConsole = document.createElement('img');
|
||||
this.buttonSendMainConsole.id = 'btn-send-message';
|
||||
//this.buttonSettingsMainConsole = document.createElement('img');
|
||||
//this.buttonAdminMainConsole = document.createElement('img');
|
||||
this.userInputManager = userInputManager;
|
||||
this.initialise();
|
||||
|
||||
|
@ -103,33 +104,33 @@ export class ConsoleGlobalMessageManager {
|
|||
}
|
||||
});
|
||||
|
||||
this.buttonAdminMainConsole.src = 'resources/logos/setting-yellow.svg';
|
||||
/*this.buttonAdminMainConsole.src = 'resources/logos/setting-yellow.svg';
|
||||
this.buttonAdminMainConsole.addEventListener('click', () => {
|
||||
window.open(ADMIN_URL, '_blank');
|
||||
});
|
||||
});*/
|
||||
|
||||
this.buttonSettingsMainConsole.src = 'resources/logos/monitor-yellow.svg';
|
||||
/*this.buttonSettingsMainConsole.src = 'resources/logos/monitor-yellow.svg';
|
||||
this.buttonSettingsMainConsole.addEventListener('click', () => {
|
||||
if(this.activeSetting){
|
||||
this.disabledSettingConsole();
|
||||
}else{
|
||||
this.activeSettingConsole();
|
||||
}
|
||||
});
|
||||
});*/
|
||||
|
||||
this.divMessageConsole.appendChild(typeConsole);
|
||||
|
||||
if(this.isAdmin) {
|
||||
/*if(this.isAdmin) {
|
||||
this.buttonMainConsole.appendChild(this.buttonSendMainConsole);
|
||||
this.buttonMainConsole.appendChild(this.buttonAdminMainConsole);
|
||||
this.createTextMessagePart();
|
||||
this.createUploadAudioPart();
|
||||
}
|
||||
this.buttonMainConsole.appendChild(this.buttonSettingsMainConsole);
|
||||
//this.buttonMainConsole.appendChild(this.buttonAdminMainConsole);
|
||||
}*/
|
||||
this.createTextMessagePart();
|
||||
this.createUploadAudioPart();
|
||||
//this.buttonMainConsole.appendChild(this.buttonSettingsMainConsole);
|
||||
|
||||
this.divMainConsole.appendChild(this.buttonMainConsole);
|
||||
this.divMainConsole.appendChild(this.divMessageConsole);
|
||||
this.divMainConsole.appendChild(this.divSettingConsole);
|
||||
//this.divMainConsole.appendChild(this.divSettingConsole);
|
||||
|
||||
const mainSectionDiv = HtmlUtils.getElementByIdOrFail<HTMLDivElement>('main-container');
|
||||
mainSectionDiv.appendChild(this.divMainConsole);
|
||||
|
@ -343,40 +344,50 @@ export class ConsoleGlobalMessageManager {
|
|||
}
|
||||
|
||||
activeMessageConsole(){
|
||||
this.activeMessage = true;
|
||||
if(this.activeSetting){
|
||||
this.disabledSettingConsole();
|
||||
if(!this.isAdmin){
|
||||
throw "User is not admin";
|
||||
}
|
||||
if(this.activeMessage){
|
||||
this.disabledMessageConsole();
|
||||
return;
|
||||
}
|
||||
this.activeMessage = true;
|
||||
this.active();
|
||||
this.divMessageConsole.classList.add('active');
|
||||
this.buttonMainConsole.hidden = false;
|
||||
this.buttonSendMainConsole.classList.add('active');
|
||||
//if button not
|
||||
try{
|
||||
HtmlUtils.getElementByIdOrFail('btn-send-message');
|
||||
}catch (e) {
|
||||
this.buttonMainConsole.appendChild(this.buttonSendMainConsole);
|
||||
}
|
||||
}
|
||||
|
||||
disabledMessageConsole(){
|
||||
this.activeMessage = false;
|
||||
this.disabled();
|
||||
this.buttonMainConsole.hidden = false;
|
||||
this.buttonMainConsole.hidden = true;
|
||||
this.divMessageConsole.classList.remove('active');
|
||||
this.buttonSendMainConsole.classList.remove('active');
|
||||
}
|
||||
|
||||
activeSettingConsole(){
|
||||
/*activeSettingConsole(){
|
||||
this.activeSetting = true;
|
||||
if(this.activeMessage){
|
||||
this.disabledMessageConsole();
|
||||
this.disabledSettingConsole();
|
||||
}
|
||||
this.active();
|
||||
this.divSettingConsole.classList.add('active');
|
||||
this.buttonSettingsMainConsole.classList.add('active');
|
||||
//this.buttonSettingsMainConsole.classList.add('active');
|
||||
}
|
||||
|
||||
disabledSettingConsole(){
|
||||
this.activeSetting = false;
|
||||
this.disabled();
|
||||
this.divSettingConsole.classList.remove('active');
|
||||
this.buttonSettingsMainConsole.classList.remove('active');
|
||||
}
|
||||
//this.buttonSettingsMainConsole.classList.remove('active');
|
||||
}*/
|
||||
|
||||
private getSectionId(id: string) : string {
|
||||
return `section-${id}`;
|
||||
|
|
|
@ -86,6 +86,7 @@ export class MenuScene extends Phaser.Scene {
|
|||
this.sideMenuOpened = false;
|
||||
this.closeGameQualityMenu()
|
||||
this.menuButton.getChildByID('openMenuButton').innerHTML = `<img src="/static/images/menu.svg">`;
|
||||
gameManager.getCurrentGameScene(this).ConsoleGlobalMessageManager.disabledMessageConsole();
|
||||
this.tweens.add({
|
||||
targets: this.menuElement,
|
||||
x: closedSideMenuX,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue