Steam Community :: Guide :: How to play Contradiction on Linux natively

Store Page

Contradiction - the all-video murder mystery adventure

All Discussions Screenshots Artwork Broadcasts Videos News Guides Reviews

Contradiction - the all-video murder mystery adventure > Guides > qew Nemo's Guides

Not enough ratings

How to play Contradiction on Linux natively

By qew Nemo

How to run and play Contradiction on Linux

Award

Created by

qew Nemo
In-Game
Nuclear Throne

Category: Modding or Configuration

Languages: English

Posted

Updated

18 Jul, 2019 @ 9:44am

21 Jul, 2019 @ 5:48am

317	Unique Visitors
6	Current Favorites

Guide Index

Overview

Step 1. Install electron.

Step 2-A. Edit index.html manually

Step 2-B. Apply edits to index.html automatically.

Step 3. Run the game.

Going fullscreen or resizing the window

Notes and known issues

Comments

Step 1. Install electron.

On Ubuntu (and its derivatives) you should be able to install the package nodejs and then use npm to install electron with the command

npm install -g electron

On Arch (and its derivatives) just install the package electron.

Step 2-A. Edit index.html manually

In its current state when you run the game through native electron all of the videos and some of the UI elements will be completely invisible due to what seems to be unspecified z-order values.

To make the game playable you need to edit the file steamapps/common/Contradiction/Windows/index.html. You can do it manually if you prefer or if the game changes after this guide's publication and using a patch doesn't work. If you want to try just applying a patch automatically scroll down to Step 2-B below.

Regardless of which method you choose you might want to back up index.html first. But if you somehow mess up, remember you can just revalidate the game files in Steam to get it to redownload the original version of this single file.

These are the edits you you have to make with their line numbers at the time of writing:
27: add "z-index:5"

div.vidbox{position:absolute;top:0%;left:0%;width:100%;height:100%}

⬇

div.vidbox{z-index:5;position:absolute;top:0%;left:0%;width:100%;height:100%}

50: add "z-index:5"

div.paths{opacity:0;color:#FFF;position:absolute;top:0px;left:0px;width:100%;height:100%;overflow:hidden;-webkit-transition-property:opacity;-webkit-transition-duration:0.3s;image-rendering:-webkit-optimize-contrast}

⬇

div.paths{z-index:5;opacity:0;color:#FFF;position:absolute;top:0px;left:0px;width:100%;height:100%;overflow:hidden;-webkit-transition-property:opacity;-webkit-transition-duration:0.3s;image-rendering:-webkit-optimize-contrast}

69: add "z-index:6"

div.butexrep{opacity:0;color:#FFF;position:absolute;font-size:120%;text-align:left;font-size:110%;bottom:5%;left:4%;background-color:rgba(0,0,0,0.5);border-style:solid;border-color:#333;border-width:2px;border-radius:5px;padding-top:0.6%;padding-bottom:0.6%;padding-left:0.9%;padding-right:0.9%;-webkit-transition-property:opacity;-webkit-transition-duration:0.4s}

⬇

div.butexrep{z-index:6;opacity:0;color:#FFF;position:absolute;font-size:120%;text-align:left;font-size:110%;bottom:5%;left:4%;background-color:rgba(0,0,0,0.5);border-style:solid;border-color:#333;border-width:2px;border-radius:5px;padding-top:0.6%;padding-bottom:0.6%;padding-left:0.9%;padding-right:0.9%;-webkit-transition-property:opacity;-webkit-transition-duration:0.4s}

202: add "z-index:7"

div.reptext{position:absolute;font-size:150%;top:0%;left:0%;height:100%;width:100%;text-align:center;-webkit-transition-property:opacity,top;-webkit-transition-duration:0.2s}

⬇

div.reptext{z-index:7;position:absolute;font-size:150%;top:0%;left:0%;height:100%;width:100%;text-align:center;-webkit-transition-property:opacity,top;-webkit-transition-duration:0.2s}

203: add "z-index:8"

div.repsel{position:absolute;background-color:#063;top:10%;height:10%;left:1%;width:98%;border-radius:200px;-webkit-transition-property:opacity,top,backgroundColor;-webkit-transition-duration:0.2s}

⬇

div.repsel{z-index:8;position:absolute;background-color:#063;top:10%;height:10%;left:1%;width:98%;border-radius:200px;-webkit-transition-property:opacity,top,backgroundColor;-webkit-transition-duration:0.2s}

206: add "z-index:7"

div.contrabox{font-size:110%;position:absolute;right:1.7%;top:5%;bottom:4%;width:28.8%;text-align:center;overflow:hidden;background-image:url('gfx/FlockContra.png');background-size:100% 100%}

⬇

div.contrabox{z-index:7;font-size:110%;position:absolute;right:1.7%;top:5%;bottom:4%;width:28.8%;text-align:center;overflow:hidden;background-image:url('gfx/FlockContra.png');background-size:100% 100%}

Step 2-B. Apply edits to index.html automatically.

If you don't want to make the edits manually you can try applying the patch I provide below. If the game hasn't changed since, it will just work™. If you've done all the edits described above manually, you don't need to do this.

Copy the following into a file named diff.txt and place it in the game folder (SteamApps/common/Contradiction/Windows)

27c27 < div.vidbox{position:absolute;top:0%;left:0%;width:100%;height:100%} --- > div.vidbox{z-index:5;position:absolute;top:0%;left:0%;width:100%;height:100%} 50c50 < div.paths{opacity:0;color:#FFF;position:absolute;top:0px;left:0px;width:100%;height:100%;overflow:hidden;-webkit-transition-property:opacity;-webkit-transition-duration:0.3s;image-rendering:-webkit-optimize-contrast} --- > div.paths{z-index:5;opacity:0;color:#FFF;position:absolute;top:0px;left:0px;width:100%;height:100%;overflow:hidden;-webkit-transition-property:opacity;-webkit-transition-duration:0.3s;image-rendering:-webkit-optimize-contrast} 69c69 < div.butexrep{opacity:0;color:#FFF;position:absolute;font-size:120%;text-align:left;font-size:110%;bottom:5%;left:4%;background-color:rgba(0,0,0,0.5);border-style:solid;border-color:#333;border-width:2px;border-radius:5px;padding-top:0.6%;padding-bottom:0.6%;padding-left:0.9%;padding-right:0.9%;-webkit-transition-property:opacity;-webkit-transition-duration:0.4s} --- > div.butexrep{z-index:6;opacity:0;color:#FFF;position:absolute;font-size:120%;text-align:left;font-size:110%;bottom:5%;left:4%;background-color:rgba(0,0,0,0.5);border-style:solid;border-color:#333;border-width:2px;border-radius:5px;padding-top:0.6%;padding-bottom:0.6%;padding-left:0.9%;padding-right:0.9%;-webkit-transition-property:opacity;-webkit-transition-duration:0.4s} 202,203c202,203 < div.reptext{position:absolute;font-size:150%;top:0%;left:0%;height:100%;width:100%;text-align:center;-webkit-transition-property:opacity,top;-webkit-transition-duration:0.2s} < div.repsel{position:absolute;background-color:#063;top:10%;height:10%;left:1%;width:98%;border-radius:200px;-webkit-transition-property:opacity,top,backgroundColor;-webkit-transition-duration:0.2s} --- > div.reptext{z-index:7;position:absolute;font-size:150%;top:0%;left:0%;height:100%;width:100%;text-align:center;-webkit-transition-property:opacity,top;-webkit-transition-duration:0.2s} > div.repsel{z-index:8;position:absolute;background-color:#063;top:10%;height:10%;left:1%;width:98%;border-radius:200px;-webkit-transition-property:opacity,top,backgroundColor;-webkit-transition-duration:0.2s} 206c206 < div.contrabox{font-size:110%;position:absolute;right:1.7%;top:5%;bottom:4%;width:28.8%;text-align:center;overflow:hidden;background-image:url('gfx/FlockContra.png');background-size:100% 100%} --- > div.contrabox{z-index:7;font-size:110%;position:absolute;right:1.7%;top:5%;bottom:4%;width:28.8%;text-align:center;overflow:hidden;background-image:url('gfx/FlockContra.png');background-size:100% 100%}

Then run the following command in the game directory to apply it:

patch -i diff.txt index.html

Step 3. Run the game.

To run the game you have to execute the following command in the game directory

electron index.html

Going fullscreen or resizing the window

Once it's running, maximize the window or make it fullscreen using your window manager.
If your window manager doesn't let you make any windows fullscreen press F11.
Once the window is of the desired size, press Ctrl+R.
The game visuals should now fill the entire window.

This restarts the whole game! So make sure to do it at the beginning or save your game beforehand.

You can set it to any size of your choosing that way, but be advised that if it doesn't conform to the 16:9 ratio the game was designed for the UI may end up looking awkward.
You can also access the functions controlling electron by holding Alt until the top menu appears and selecting options from there.

Notes and known issues

I'd done rather short testing before writing this guide but as far as I'm aware these changes are enough to make all of the game mechanics work.

8 Comments

< >

William Adama 29 Dec, 2021 @ 5:44am

The folder stucture for this game seems to have changed.
The index.html is now placed in the "package.nw" folder.
There is no windows directory anymore.

Also they seem to changed the index.html file because not all the entries you need to change are there anymore, or they have been moved to a different line.

Managed to change the "vidbox", "paths", "contrabox", "reptex", "repbox" lines.
However can't seem to find the "butexrep" or "repsel" lines.

Tried to run it in electron afterwards but only got the logo curscene, and the ui wont show up
only the lake video keep playing.

Has anyone gotten this to work recently?

Cementas 3 Jul, 2021 @ 11:42am

Awesome, thanks!

qew Nemo [author] 3 Jul, 2021 @ 6:06am

It seems to work in the current Proton, yeah.

Cementas 2 Jul, 2021 @ 11:55am

This is making me so confused. Why do you need the browser & editing of html? This article doesn't mention anything about trying out Proton. Did anyone try Proton?

VGJUNKY 9 Jul, 2020 @ 12:35pm

OMG TY SO MUCH <3 one of the best mystery games on steam and it broke my heart that I couldn't play it on linux and now I can :) also ty @Krellian for suggesting to just run it in firefox.

I simply followed step 2-B without installing electron.

Indvstrial Black 18 Apr, 2020 @ 4:31am

I couldn't get electron working but, it opened OK with firefox. Thanks for the info

lite 4 Mar, 2020 @ 12:44pm

Definitely not

Thunderforge 6 Nov, 2019 @ 7:26pm

Do you know if this method would allow playing Contradiction on macOS 10.15 Catalina as well (the Mac app is 32-bit, but the latest OS only runs 64-bit apps).

< >