Skip to content

Commit

Permalink
🔥 add frame customizado
Browse files Browse the repository at this point in the history
  • Loading branch information
@saulotarsobc
saulotarsobc committed Mar 28, 2023
1 parent ff7599b commit 62ff89c
Show file tree
Hide file tree
Showing 6 changed files with 104 additions and 43 deletions.
15 changes: 10 additions & 5 deletions src/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ const createWindow = () => {
minWidth: 360,
maxWidth: 360,
height: 500,
frame: false,
autoHideMenuBar: true,
webPreferences: {
nodeIntegration: true,
Expand Down Expand Up @@ -76,7 +77,7 @@ autoUpdater.on("update-available", () => {
});

autoUpdater.on("download-progress", (prog) => {
console.log(prog)
// console.log(prog);
});

autoUpdater.on("update-downloaded", () => {
Expand All @@ -85,11 +86,15 @@ autoUpdater.on("update-downloaded", () => {
});

/* code */
setTimeout(() => {
autoUpdater.checkForUpdates();
}, 2000);
ipcMain.on('appControl', (event, { command }) => {
switch (command) {
case 0: main.minimize(); break;
case 1: main.isMaximized() ? main.restore() : main.maximize(); break;
case 2: app.quit(); break;
};
});

ipcMain.on('addImage', (event, args) => {
ipcMain.on('addImage', () => {
dialog
.showOpenDialog({
properties: ["openFile"], filters: [
Expand Down
2 changes: 1 addition & 1 deletion src/view/css/main.min.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion src/view/css/main.min.css.map
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

26 changes: 26 additions & 0 deletions src/view/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,32 @@
<body>
<section id="home">

<div id="app_control">
<div id="window_title">
SC Image on Second Screen
</div>
<div id="window_control">
<div id="min">
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-node-minus" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M11 4a4 4 0 1 0 0 8 4 4 0 0 0 0-8zM6.025 7.5a5 5 0 1 1 0 1H4A1.5 1.5 0 0 1 2.5 10h-1A1.5 1.5 0 0 1 0 8.5v-1A1.5 1.5 0 0 1 1.5 6h1A1.5 1.5 0 0 1 4 7.5h2.025zM1.5 7a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1zM8 8a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5A.5.5 0 0 1 8 8z"/>
</svg> -->
</div>

<div id="max">
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-node-plus" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M11 4a4 4 0 1 0 0 8 4 4 0 0 0 0-8zM6.025 7.5a5 5 0 1 1 0 1H4A1.5 1.5 0 0 1 2.5 10h-1A1.5 1.5 0 0 1 0 8.5v-1A1.5 1.5 0 0 1 1.5 6h1A1.5 1.5 0 0 1 4 7.5h2.025zM11 5a.5.5 0 0 1 .5.5v2h2a.5.5 0 0 1 0 1h-2v2a.5.5 0 0 1-1 0v-2h-2a.5.5 0 0 1 0-1h2v-2A.5.5 0 0 1 11 5zM1.5 7a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1z"/>
</svg> -->
</div>

<div id="clo">
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-circle" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
<path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
</svg> -->
</div>
</div>
</div>

<div class="controls_1">
<div id="add_img">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor" class="bi bi-node-plus"
Expand Down
16 changes: 14 additions & 2 deletions src/view/js/first.js
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,26 @@
/* elemento html */
const add_img = document.getElementById('add_img'),
midias_list = document.getElementById('midias_list'),
drop = document.getElementById('drop')
drop = document.getElementById('drop'),
min = document.getElementById('min'),
max = document.getElementById('max'),
clo = document.getElementById('clo');
/* elemento html */

/* window control */
min.addEventListener('click', () => appControl(0));
max.addEventListener('click', () => appControl(1));
clo.addEventListener('click', () => appControl(2)
);
const appControl = (command) => ipcRenderer.send('appControl', { command });
/* window control */

/* drag and drop */
drop.addEventListener('dragover', (e) => {
e.stopPropagation();
e.preventDefault();
});

drop.addEventListener('drop', (e) => {
e.stopPropagation();
e.preventDefault();
Expand Down Expand Up @@ -119,7 +131,7 @@ const showImg = (id) => {
.catch(e => {
console.log('erro ao buscar imagem', e)
})
}
};

/* init */
carregarImgsOnDb();
86 changes: 52 additions & 34 deletions src/view/scss/home.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,52 @@ section#home {
flex-direction: column;
align-items: center;
justify-content: center;
// padding: 3px;

// overflow: hidden;
padding: 3px;
#app_control {
height: 25px;
width: 100%;
background-color: #161616;

display: flex;
align-items: center;
justify-content: space-between;
padding: 5px;

z-index: 2;

#window_title {
-webkit-app-region: drag;
width: 100%;
}

#window_control {
height: 16px;
width: 75px;

display: flex;
align-items: center;
justify-content: space-between;

div {
height: 18px;
width: 18px;
border-radius: 50%;
}

#min {
background-color: #ffff6b;
}

#max {
background-color: #6060ff;
}

#clo {
background-color: #ff6666;
}
}
}

.controls_1 {
// height: 30px;
Expand All @@ -30,17 +73,16 @@ section#home {
#add_img {
height: 40px;
min-width: 100px;
cursor: pointer;

display: flex;
align-items: center;
justify-content: center;

border-radius: 5px;
background: linear-gradient(225deg, #2f2f2f, #383838);
box-shadow: -7px 7px 14px #232323,
7px -7px 14px #454545;
box-shadow: -7px 7px 14px #232323, 7px -7px 14px #454545;

cursor: pointer;
}

#drop {
Expand All @@ -53,19 +95,16 @@ section#home {

border-radius: 5px;
background: linear-gradient(225deg, #2f2f2f, #383838);
box-shadow: -7px 7px 14px #232323,
7px -7px 14px #454545;
box-shadow: -7px 7px 14px #232323, 7px -7px 14px #454545;
}

}

#midias_list {
width: 100%;

height: calc(100vh - 40px);
height: calc(100vh - 40px - 20px);
overflow: scroll;
border-radius: 4px;

padding: 0 20px;

.item {
Expand All @@ -84,7 +123,6 @@ section#home {
box-shadow: 3px -3px 18px #161616, -3px 3px 18px #5a5a5a;

.nome {
// text-align: center;
font-size: 12px;
text-align: center;
}
Expand All @@ -98,7 +136,8 @@ section#home {

.wrap {
display: flex;

align-items: center;
justify-content: space-around;
padding: 0 3px;

.img {
Expand All @@ -107,9 +146,6 @@ section#home {
align-items: center;
justify-content: center;




img {
border: 1px solid #707070;
border-radius: 4px;
Expand All @@ -126,10 +162,7 @@ section#home {
align-items: center;
justify-content: space-around;
padding: 5px 0;

width: 140px;

// background-color: rebeccapurple;
width: 150px;

.play_deletar {
height: 50px;
Expand All @@ -142,14 +175,11 @@ section#home {
align-content: center;
justify-content: center;


border-radius: 50%;
background-color: rebeccapurple;
background: linear-gradient(45deg, #323232, #3c3c3c);
box-shadow: 3px -3px 18px #161616, -3px 3px 18px #5a5a5a;

// font-size: 60px;

text-align: center;

svg {
Expand All @@ -159,18 +189,6 @@ section#home {
height: 100%;
}
}

// .play {
// // background-color: #a9f56b;
// // width: 150px;
// padding: 5px;
// text-align: center;
// }

// .deletar {
// padding: 5px;
// text-align: center;
// }
}
}
}
Expand Down

0 comments on commit 62ff89c

Please sign in to comment.