Update admin menu

This commit is contained in:
Gregoire Parant 2020-12-16 18:52:11 +01:00
parent 1a27b7d2ee
commit a2d56ef56a
6 changed files with 69 additions and 55 deletions

View file

@ -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>

View file

@ -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;

View file

@ -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;

View file

@ -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;

View file

@ -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}`;

View file

@ -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,