Repository: vispy/vispy

Issue:
Window transparency issue in molecular_viewer.py
On my Windows 10 machine with a GeForce GTX 1080 Ti (Driver version 430.39) there are serious issues in the visualization of the molecular_viewer.py example code (/examples/demo/gloo/molecular_viewer.py).

The background of the image is black no matter what; but wherever there is any color, the color takes on a strange transparency, where you can see through the display window if the window is superimposed over non-black backgrounds.

Additionally, if you introduce code to take screenshots, the screenshots always show a black background with pure white molecule images.
![image](https://user-images.githubusercontent.com/1059029/58190470-d18bd500-7c79-11e9-89f7-4b26cb0abac6.png)
The image exhibits the undesirable behavior. You can see the shape of my (black) console window placed *behind* the display window.


Discussion:
This is a known issue for past versions of vispy. This should be fixed in vispy 0.6.0+ but it has yet to be released. Please try installing vispy from github (may require a valid C compiler) and see if this changes anything for you.
Installing and using 0.6.0 does resolve the issue with the active display, but the saved _screenshot images still display the molecules as being completely white with a black background.
```
res = _screenshot()
vispy_file.write_png('test_screenshot.png', res)
```
This results in black&white images.
Can you take a screenshot with your system (not vispy) and show me what the window looks like for you? It looks broken for me too where all of the molecules look mostly white.

@kmuehlbauer if you have a couple minutes if you could also run this on your system and let me know how it looks. Here's mine on OSX with PyQt5 and Python 3.7:

![image](https://user-images.githubusercontent.com/1828519/58253259-a236a000-7d2d-11e9-9d7d-9ff9564f1c46.png)

@djhoese This is a screenshot with my OpenSuse LEAP15 system and latest vispy github master.
![Screenshot_20190523_144315](https://user-images.githubusercontent.com/5821660/58253707-4d187f80-7d69-11e9-9ffc-af484142944f.png)

```
Platform: Linux-4.12.14-lp150.12.61-default-x86_64-with-glibc2.10
Python:   3.7.1 | packaged by conda-forge | (default, Feb 18 2019, 01:42:00)  [GCC 7.3.0]
NumPy:    1.16.2
Backend:  PyQt5
pyqt4:    None
pyqt5:    ('PyQt5', '5.6', '5.6.2')
pyside:   None
pyside2:  None
pyglet:   None
glfw:     glfw (3, 2, 1)
sdl2:     sdl2 0.9.6
wx:       None
egl:      None
osmesa:   OSMesa
_test:    None

GL version:  '4.6.0 NVIDIA 390.87'
MAX_TEXTURE_SIZE: 16384
```

conda-forge environment

@kmuehlbauer what version of python? PyQt5? numpy?
On the latest version of master, I obtain the following by system screenshot:

![image](https://user-images.githubusercontent.com/18143289/58253636-2e19ed80-7d69-11e9-9c68-f965f6a24d0f.png)

```
Platform: Linux-4.19.42-1-MANJARO-x86_64-with-arch-Manjaro-Linux
Python:   3.6.8 |Anaconda, Inc.| (default, Dec 30 2018, 01:22:34)  [GCC 7.3.0]
NumPy:    1.16.2
Backend:  PyQt5
pyqt4:    None
pyqt5:    ('PyQt5', '5.12.1', '5.12.2')
pyside:   None
pyside2:  None
pyglet:   pyglet 1.3.2
glfw:     None
sdl2:     None
wx:       None
egl:      None
osmesa:   OSMesa
_test:    None

GL version:  '3.0 Mesa 19.0.4'
MAX_TEXTURE_SIZE: 16384
```

*kmuehlbauer was faster for the screenshot!*
Added `vispy.sys_info()` output below my screenshot...
I get the proper results with PyQt4 on OSX. With PyQt5 I get the super faded results I showed above with Python 3.6 or 3.7. Hhhmmm great.
The following I get when using vispy's `_screenshot` and `write_png`. 
![test_screenshot](https://user-images.githubusercontent.com/5821660/58254284-b64cc280-7d6a-11e9-8d48-29175c7a044b.png)

With `_screenshot`  and `write_png`:
```py
if __name__ == '__main__':
    mvc = Canvas()
    from vispy.gloo.util import _screenshot
    from vispy.io import write_png
    res = _screenshot()
    write_png('test_screenshot.png', res)
    app.run()
```
I obtain the following:

![image](https://user-images.githubusercontent.com/18143289/58255520-720ef180-7d6d-11e9-999a-1cb00d210945.png)
**EDIT:** Now I use `_screenshot()` instead of `render()`
@GuillaumeFavelier `render` is not recommended. There is an example of `_screenshot` further up, but I'm not sure where people are putting it in the example code. It comes from `from vispy.gloo.util import _screenshot` (we really need to make this public).
@GuillaumeFavelier Do you have an Nvidia GPU?
@moridinamael Same question.
I have indeed an Nvidia GTX960M but I don't use it.
```sh
$ lspci | grep VGA
$ 00:02.0 VGA compatible controller: Intel Corporation Skylake GT2 [HD Graphics 520] (rev 07)
```
Ok, I have an AMD/ATI GPU in my mid-2015 macbook:

```
GL version:  '2.1 ATI-2.9.26'
```

I'm going to ask a coworker to try this example on their newer macbook and see what they get.

Edit: But it definitely seems like something wrong with the new PyQt5 usage (or maybe PyQt5 was always a problem with this).
Bizarrely, if I manually modify the image captured by _screenshot by setting all of the 4th entries in the arrays to 255, then the captured and saved screenshot looks good. Thought this information might be useful.
@moridinamael Very interesting. If I change the shader in the code to:


```
$ git diff
diff --git a/examples/demo/gloo/molecular_viewer.py b/examples/demo/gloo/molecular_viewer.py
index 0a424b32..e6576736 100644
--- a/examples/demo/gloo/molecular_viewer.py
+++ b/examples/demo/gloo/molecular_viewer.py
@@ -87,8 +87,8 @@ void main()
     // GPU drivers...
     float specular = clamp(pow(abs(dot(normal, K)), 40.), 0.0, 1.0);
     vec3 v_light = vec3(1., 1., 1.);
-    gl_FragColor.rgb = (.15*v_color + .55*diffuse * v_color
-                        + .35*specular * v_light);
+    gl_FragColor.rgba = vec4(.15*v_color + .55*diffuse * v_color
+                        + .35*specular * v_light, 1.0);
 }
 """
```

Then mine works fine (haven't tried screenshot yet).
I verify that the problem is entirely solved by your modification to the shader code. Both screenshots and realtime display are now perfect.
@moridinamael Great! Now I just need to make a pull request. However, I have very little time the next 3 weeks and if I do have time it is unlikely that I'll fix this issue specifically. If anyone else has time to make a pull request for this I'll gladly merge it.

Resolving patch:
diff --git a/examples/demo/gloo/molecular_viewer.py b/examples/demo/gloo/molecular_viewer.py
--- a/examples/demo/gloo/molecular_viewer.py
+++ b/examples/demo/gloo/molecular_viewer.py
@@ -87,8 +87,8 @@
     // GPU drivers...
     float specular = clamp(pow(abs(dot(normal, K)), 40.), 0.0, 1.0);
     vec3 v_light = vec3(1., 1., 1.);
-    gl_FragColor.rgb = (.15*v_color + .55*diffuse * v_color
-                        + .35*specular * v_light);
+    gl_FragColor.rgba = vec4(.15*v_color + .55*diffuse * v_color
+                        + .35*specular * v_light, 1.0);
 }
 """
 


Test patch: