Skip to content
Extraits de code Groupes Projets
Vérifiée Valider ae0822c9 rédigé par Kubat's avatar Kubat
Parcourir les fichiers

INSTANCE: Generate button from list

parent b6b4f0ce
Aucune branche associée trouvée
Aucune étiquette associée trouvée
2 requêtes de fusion!3Dev kubat,!2Base interface and system
Masquer les modifications d'espaces
En ligne Côte à côte
client/index.html
+ 4
− 2
Voir le fichier @ ae0822c9
...@@ -3,11 +3,13 @@ ...@@ -3,11 +3,13 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Lektor App</title> <title>Lektor App</title>
<script src="../style/jquery/jquery-3.5.1.js"></script>
<script src="../style/bootstrap-4.5.2-dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="../style/bootstrap-4.5.2-dist/css/bootstrap.min.css"> <link rel="stylesheet" href="../style/bootstrap-4.5.2-dist/css/bootstrap.min.css">
</head> </head>
<body> <body>
<!-- main file running the express app --> <!-- main file running the express app -->
<script src='./main.js' type='text/javascript'></script> <script src='./main.js' type='text/javascript'></script>
</body> </body>
</html> </html>
\ No newline at end of file
client/main.js
+ 2
− 2
Voir le fichier @ ae0822c9
...@@ -8,9 +8,9 @@ function launcher () { ...@@ -8,9 +8,9 @@ function launcher () {
var publicRouter = require('./routes/public.js'); var publicRouter = require('./routes/public.js');
app.set('views', __dirname + '/views'); app.set('views', `${__dirname}/views`);
app.set('view engine', 'ejs'); app.set('view engine', 'ejs');
app.use(express.static(__dirname + '/../style')); app.use(express.static(`${__dirname}/../style`));
app.use('/', publicRouter); app.use('/', publicRouter);
app.listen(port, () => { app.listen(port, () => {
......
instance/index.html
+ 5
− 6
Voir le fichier @ ae0822c9
...@@ -24,19 +24,18 @@ ...@@ -24,19 +24,18 @@
LektorApp Admin Interface LektorApp Admin Interface
</h2> </h2>
</div> </div>
<div id="headerBody" class="card-body text-center"> <div id="buttonPanelListLeft" class="card-body text-left"
<button id="closeButton" type="button" class="btn btn-outline-primary"> style="padding-top: 0px;padding-bottom: 0px;padding-right: 0px;padding-left: 0px;">
Quit LektorApp <!-- Will be generated on loading page --!>
</button>
</div> </div>
</div> </div>
</div> </div>
<div id="panelWrapper" class="row"> <div id="panelWrapper" class="row">
<div id="panelLeft" class="col panel"> <div id="panelLeft" class="col panel">
<!-- Will be generated on loading page --!>
</div> </div>
<div id="panelRight" class="col panel"> <div id="panelRight" class="col panel">
<!-- Will be generated on loading page --!>
</div> </div>
</div> </div>
</div> </div>
......
instance/main.js
+ 39
− 8
Voir le fichier @ ae0822c9
const { ipcRenderer } = require('electron'); const { ipcRenderer } = require('electron');
const logger = require('../common/logger.js'); const logger = require('../common/logger.js');
const karaJSON = require('../test/dummyKara.json'); const karaJSON = require('../test/dummyKara.json');
const buttonList = [
[ "left", "Play", "commandPlay" ],
[ "left", "Stop", "commandStop" ],
[ "right", "Quit LektorApp", "closeButton" ]
];
window.onload = function(){ window.onload = () => {
const closeApp = document.getElementById("closeButton"); createButtonList(buttonList);
closeApp.addEventListener('click', () => { karaList(karaJSON);
document.getElementById("closeButton").addEventListener('click', () => {
ipcRenderer.send('close-app') ipcRenderer.send('close-app')
}); });
karaList(karaJSON); document.getElementById("commandPlay").addEventListener('click', () => {
logger.debug("Command play !");
});
logger.debug("Window loaded"); logger.debug("Window loaded");
} }
function karaList(karas){ function createButtonList(list) {
var renderHtmlLeft = "";
var renderHtmlRight = "";
list.forEach( (btn) => {
if (btn[0] == "left") {
renderHtmlLeft = `${renderHtmlLeft}
<button id="${btn[2]}" type="button" class="btn btn-outline-primary">
${btn[1]}
</button>`;
logger.debug(`Create button for "${btn[1]}" with id "${btn[2]} at the left"`);
} else if (btn[0] == "right") {
renderHtmlRight = `${renderHtmlRight}
<button id="${btn[2]}" type="button" class="btn btn-outline-primary">
${btn[1]}
</button>`;
logger.debug(`Create button for "${btn[1]}" with id "${btn[2]} at the right"`);
}
});
document.getElementById("buttonPanelListLeft").innerHTML = renderHtmlLeft + renderHtmlRight;
}
function karaList(karas) {
var karaList = ""; var karaList = "";
var playingList = ""; var playingList = "";
karas.forEach(function(kara) { karas.forEach( (kara) => {
if(kara.author_name === "Sting"){ if (kara.author_name === "Sting") {
playingList += '<div class="card shadow" style="margin: 5px; border-radius: 10px; margin: 20px 0px 20px 0px;"><div class="card-body">' + kara.source_name + ' - ' + kara.song_name + '</div></div>'; playingList += '<div class="card shadow" style="margin: 5px; border-radius: 10px; margin: 20px 0px 20px 0px;"><div class="card-body">' + kara.source_name + ' - ' + kara.song_name + '</div></div>';
} }
karaList += '<div class="card shadow" style="margin: 5px; border-radius: 10px; margin: 20px 0px 20px 0px;"><div class="card-body">' + kara.source_name + ' - ' + kara.song_name + '</div></div>'; karaList += '<div class="card shadow" style="margin: 5px; border-radius: 10px; margin: 20px 0px 20px 0px;"><div class="card-body">' + kara.source_name + ' - ' + kara.song_name + '</div></div>';
......
instance/views/main.ejs 0 → 100644
+ 0
− 0
Voir le fichier @ ae0822c9
0% ou .
You are about to add 0 people to the discussion. Proceed with caution.
Terminez d'abord l'édition de ce message.
Veuillez vous inscrire ou vous pour commenter