Giter Club home page Giter Club logo

screenboard's Introduction

Hi , I'm Mayk Brito

Profile views

  • 🔥 Sênior Web Developer & Instructor focused on helping people start programming

  • 🔭 I’m currently working at Rocketseat

  • ▶️ I regularly post videos on youtube.com/maykbrito

  • 💬 Ask me about JavaScript, HTML, CSS, SQL, Node.JS

  • ⚡ Fun fact Oneye 😜

  • 👨‍💻 More at maykbrito.dev



Contact

codepen twitter linkedin instagram youtube

screenboard's People

Contributors

almirjakubaitis avatar davidlpc1 avatar dependabot[bot] avatar dioneijd avatar luishclaudino avatar maykbrito avatar rrogovski avatar thompsonemerson avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

screenboard's Issues

Teste do screenboard no linux

Olá,
Fiz o teste do programa no Linux Ubuntu 18.04.4 LTS e por incrível que pareça aparecia uma tela preta que eu podia desenhar. Continua após as imagens...
Captura de tela de 2020-05-06 00-22-41
Captura de tela de 2020-05-06 00-22-45

Tentei mexer em um monte de coisa com relação a opacidade e nada resolvia. Procurando na internet vi pessoas com o mesmo problema e uma solução que achei e deu certo foi a seguinte:
electron/electron#16809

Resultado:
Captura de tela de 2020-05-06 00-26-19

Então eu fiz algumas modificações para tirar as barras de rolagem (um problema que ocorre pois a barras laterais diminuem a tela e você pega medidas da tela como um todo), além disso criei comandos para minimizar e maximizar o screenboard(Ctrl+F11) e para limpar a tela (Ctrl + C)
Segue o meu repositório com as modificações:
https://github.com/luishclaudino/screenboard-for-linux

Clean screen

it would be interesting if there was a command to clear the screen, without having to close and open it again, something like Cmd+C.

consegui as shortcuts para windows

Consegui funcionar a shortcut de limpar a tela no windows com "CommandOrControl+F12", porém tive que incluir também as linha de codigo abaixo na function recreateWindow() - e ocultar o scroll no html css que ficava visível no windows:
(app.relaunch({ args: process.argv.slice(1).concat(['--relaunch']) })
app.exit(0)

Agora ficou igual ao mac! show! acho que me impolguei - Agora se está certo ou não já não sei 😁, só sei que funcionou kkk -

(Só que o problema de reiniciar a aplicação é que pelo menos no windows as cores personalizadas são resetadas)

Abraço!

2020-05-05

New Idea to "clear the canvas"

Clear the Canvas

I thought of a new solution so that instead of reloading the window it was possible to clean the canvas.

The big advantage is that by cleaning only the drawing, the chosen color settings remain, as well as the position of the controls if they are draggable. The code to 'Board.js' >

canvas.addEventListener('wheel', clearCanvas);

function clearCanvas() { 
    context.clearRect(0, 0, canvas.width, canvas.height);
    var w = canvas.width;
    canvas.width = 1;
    canvas.width = w;   
}

https://youtu.be/acKKYs66d_A

Windows screen clickable

Also I changed the css and add the body with 1% transparency - to makes the screen clickable in Windows - Issue reported in electron (electron/electron#1335)

body { background-color: rgba(255,255,255, 0.01); }

Testes com windows

Muito legal 👏. Parabéns pela ideia e simplicidade do uso! 👍 Fiz um teste no windows 10... a board não ficava sobreposta no windows... então ao clicar na tela alternava para a janela abaixo sem desenhar. Inicialmente achei que não funcionava. Fiz alguns testes e descobri que a transparência no css html impedia a seleção da tela para o desenho da caneta. Adicionei uma imagem com 1% de transparência e conseguir funcionar (até achar outra solução, pois png transparente me dá má recordações rs). Falta descobrir como fazer reiniciar a aplicação no windows, porque o Cmd F12 não funciona. Não sei nada sobre electron, mas fiquei doido para fuçar... Abraço!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.