Board is showing!
Signed-off-by: James Ketrenos <james_gitlab@ketrenos.com>
This commit is contained in:
James Ketrenos
commit
87457209ac
4
.babelrc
Normal file
4
.babelrc
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
"presets": [ "@babel/env", "@babel/preset-react" ],
|
||||
"plugins": [ "@babel/plugin-proposal-class-properties" ]
|
||||
}
|
||||
6
.gitignore
vendored
Normal file
6
.gitignore
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
!.gitignore
|
||||
!package.json
|
||||
node_modules
|
||||
package-lock.json
|
||||
dist/*
|
||||
|
||||
1
LICENSE
Normal file
1
LICENSE
Normal file
@ -0,0 +1 @@
|
||||
docs/solutions/hpc.png: https://www.intel.com/content/dam/www/public/us/en/images/photography-business/RWD/blue-server-room-16x9-dark.jpg.rendition.intel.web.320.180.jpg
|
||||
8
README.md
Normal file
8
README.md
Normal file
@ -0,0 +1,8 @@
|
||||
# Ketr Settlers
|
||||
|
||||
|
||||
```bash
|
||||
sudo apt-get install nodejs npm
|
||||
sudo -E npm install --global npm@latest
|
||||
```
|
||||
|
||||
6
assets/README.md
Normal file
6
assets/README.md
Normal file
@ -0,0 +1,6 @@
|
||||
# vtt.svg => vtt.png
|
||||
|
||||
```
|
||||
convert -background none -geometry 256x256 vtt.svg vtt.png
|
||||
```
|
||||
|
||||
BIN
assets/agama.png
Normal file
BIN
assets/agama.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 172 KiB |
BIN
assets/clpeak.png
Normal file
BIN
assets/clpeak.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
BIN
assets/down.png
Normal file
BIN
assets/down.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
assets/favicon-128.png
Normal file
BIN
assets/favicon-128.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
assets/favicon-152.png
Normal file
BIN
assets/favicon-152.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
assets/favicon-167.png
Normal file
BIN
assets/favicon-167.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
assets/favicon-180.png
Normal file
BIN
assets/favicon-180.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
assets/favicon-192.png
Normal file
BIN
assets/favicon-192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
assets/favicon-256.png
Normal file
BIN
assets/favicon-256.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
assets/favicon-32.png
Normal file
BIN
assets/favicon-32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
assets/link.png
Normal file
BIN
assets/link.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
assets/original/borders-1.6.jpg
Normal file
BIN
assets/original/borders-1.6.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 323 KiB |
BIN
assets/original/borders-1.6.png
Normal file
BIN
assets/original/borders-1.6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
BIN
assets/original/borders-2.1.jpg
Normal file
BIN
assets/original/borders-2.1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 305 KiB |
BIN
assets/original/borders-2.1.png
Normal file
BIN
assets/original/borders-2.1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 933 KiB |
BIN
assets/original/borders-3.2.jpg
Normal file
BIN
assets/original/borders-3.2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 339 KiB |
BIN
assets/original/borders-3.2.png
Normal file
BIN
assets/original/borders-3.2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 998 KiB |
BIN
assets/original/borders-4.3.jpg
Normal file
BIN
assets/original/borders-4.3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 316 KiB |
BIN
assets/original/borders-4.3.png
Normal file
BIN
assets/original/borders-4.3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 952 KiB |
BIN
assets/original/borders-5.4.jpg
Normal file
BIN
assets/original/borders-5.4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 306 KiB |
BIN
assets/original/borders-5.4.png
Normal file
BIN
assets/original/borders-5.4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 945 KiB |
BIN
assets/original/borders-5.6.jpg
Normal file
BIN
assets/original/borders-5.6.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 338 KiB |
BIN
assets/original/borders-5.6.png
Normal file
BIN
assets/original/borders-5.6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
assets/original/borders-6.5.jpg
Normal file
BIN
assets/original/borders-6.5.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 338 KiB |
BIN
assets/original/borders-6.5.png
Normal file
BIN
assets/original/borders-6.5.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 921 KiB |
BIN
assets/original/borders.jpg
Normal file
BIN
assets/original/borders.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 MiB |
BIN
assets/original/brick.png
Normal file
BIN
assets/original/brick.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 MiB |
BIN
assets/original/cards.jpg
Normal file
BIN
assets/original/cards.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.4 MiB |
BIN
assets/original/pieces-blue.jpg
Normal file
BIN
assets/original/pieces-blue.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
assets/original/pieces-orange.jpg
Normal file
BIN
assets/original/pieces-orange.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
BIN
assets/original/pieces-red.jpg
Normal file
BIN
assets/original/pieces-red.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
assets/original/pieces-white.jpg
Normal file
BIN
assets/original/pieces-white.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
assets/original/pieces.jpg
Normal file
BIN
assets/original/pieces.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
BIN
assets/original/pip-numbers.jpg
Normal file
BIN
assets/original/pip-numbers.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 338 KiB |
BIN
assets/original/pip-numbers.png
Normal file
BIN
assets/original/pip-numbers.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
assets/original/pip-ships.jpg
Normal file
BIN
assets/original/pip-ships.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 243 KiB |
BIN
assets/original/pip-ships.png
Normal file
BIN
assets/original/pip-ships.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 920 KiB |
BIN
assets/original/pips.jpg
Normal file
BIN
assets/original/pips.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
BIN
assets/original/placards.jpg
Normal file
BIN
assets/original/placards.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 MiB |
BIN
assets/original/robber.jpg
Normal file
BIN
assets/original/robber.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
BIN
assets/original/robber.png
Normal file
BIN
assets/original/robber.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 453 KiB |
BIN
assets/original/sheep.png
Normal file
BIN
assets/original/sheep.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 MiB |
BIN
assets/original/stone.png
Normal file
BIN
assets/original/stone.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
assets/original/tiles.jpg
Normal file
BIN
assets/original/tiles.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 MiB |
BIN
assets/original/tiles.png
Normal file
BIN
assets/original/tiles.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 MiB |
BIN
assets/original/wheat.png
Normal file
BIN
assets/original/wheat.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 MiB |
BIN
assets/original/wood.png
Normal file
BIN
assets/original/wood.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 MiB |
BIN
assets/solutions-all.png
Normal file
BIN
assets/solutions-all.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
assets/solutions-compute.png
Normal file
BIN
assets/solutions-compute.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
assets/solutions-media.png
Normal file
BIN
assets/solutions-media.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
assets/solutions-render.png
Normal file
BIN
assets/solutions-render.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
assets/up.png
Normal file
BIN
assets/up.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
BIN
assets/vtt-logo.png
Normal file
BIN
assets/vtt-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
assets/vtt.png
Normal file
BIN
assets/vtt.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
106
assets/vtt.svg
Normal file
106
assets/vtt.svg
Normal file
@ -0,0 +1,106 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="164.61722mm"
|
||||
height="164.61722mm"
|
||||
viewBox="0 0 164.61722 164.61722"
|
||||
version="1.1"
|
||||
id="svg8"
|
||||
inkscape:version="0.92.3 (2405546, 2018-03-11)"
|
||||
sodipodi:docname="vtt.svg">
|
||||
<defs
|
||||
id="defs2" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="0.35"
|
||||
inkscape:cx="-215.59086"
|
||||
inkscape:cy="198.94464"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1680"
|
||||
inkscape:window-height="1022"
|
||||
inkscape:window-x="1920"
|
||||
inkscape:window-y="30"
|
||||
inkscape:window-maximized="1"
|
||||
showborder="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0" />
|
||||
<metadata
|
||||
id="metadata5">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-24.31604,-50.492584)">
|
||||
<circle
|
||||
id="path144"
|
||||
cx="106.62465"
|
||||
cy="132.80119"
|
||||
r="82.308609"
|
||||
style="fill:none;stroke-width:0.42446816;fill-opacity:0" />
|
||||
</g>
|
||||
<g
|
||||
inkscape:groupmode="layer"
|
||||
id="layer3"
|
||||
inkscape:label="VTT"
|
||||
transform="translate(-24.31604,-50.492584)">
|
||||
<path
|
||||
style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.20466655px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="M 176.44869,92.448235 H 37.231088 L 106.81368,212.96877 170.41517,102.80776 h -21.05604 l -41.57207,72.00493 -41.385686,-71.68213 h -8.557439 l 49.505085,85.74532 45.65987,-79.08521 h 6.14499 L 107.24329,199.70246 49.418707,99.547343 H 172.31102 l 4.13767,-7.099108"
|
||||
id="path119"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="ccccccccccccccc" />
|
||||
<path
|
||||
style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.20466655px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="m 71.933034,103.33938 h 70.628246 l -17.93014,31.0559 h -8.31105 v 12.65503 l -5.20391,9.01343 v -27.50652 h 9.44344 L 131.30747,109.9414 H 75.752261 l -3.819227,-6.60202"
|
||||
id="path121"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="ccccccccccc" />
|
||||
<path
|
||||
style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.20466655px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="M 121.06801,114.04494 H 78.168531 l 11.81859,20.4704 h 7.97719 v 13.17726 l 4.980839,8.62706 v -27.69924 h -9.891019 l -4.32808,-7.49646 h 28.052009 z"
|
||||
id="path123"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:0.20674446"
|
||||
d="m 72.194752,152.70169 -34.565714,-59.885318 34.6174,-0.0523 c 19.039573,-0.0288 50.182242,-0.0288 69.205942,0 l 34.58855,0.0523 -1.87124,3.248672 -1.87123,3.248662 -61.56535,0.0592 -61.565357,0.0592 28.943428,50.132854 c 15.91888,27.57308 29.016799,50.15638 29.106469,50.18509 0.11699,0.0374 44.2921,-76.20298 51.49933,-88.88108 l 0.6839,-1.20302 -3.2682,0.005 -3.2682,0.005 -22.72613,39.38503 c -12.49938,21.66179 -22.79674,39.31284 -22.88303,39.22457 -0.0863,-0.0883 -10.871839,-18.72096 -23.967889,-41.40599 C 70.191373,124.19497 59.162256,105.09762 58.778275,104.44144 l -0.698147,-1.19305 4.134828,0.056 4.134828,0.056 20.649447,35.76679 c 11.3572,19.67174 20.711619,35.76679 20.787609,35.76679 0.076,0 9.45874,-16.16057 20.85057,-35.91237 l 20.71242,-35.91238 10.38699,-0.009 10.387,-0.009 -0.59386,0.98203 c -0.32663,0.54013 -14.52425,25.12463 -31.55026,54.63223 -17.02602,29.5076 -31.01554,53.71149 -31.08782,53.7864 -0.0723,0.0749 -15.685989,-26.8122 -34.697128,-59.74915 z"
|
||||
id="path156"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:0.20674446"
|
||||
d="m 111.20547,142.02151 v -13.33502 h 4.73565 4.73565 l 5.39625,-9.35518 5.39625,-9.35519 -27.7887,-0.0524 -27.788699,-0.0524 -1.777179,-3.07708 c -0.977447,-1.69239 -1.777177,-3.1341 -1.777177,-3.20379 0,-0.0697 15.730666,-0.12672 34.957045,-0.12672 19.35135,0 34.92627,0.0792 34.88812,0.17731 -0.0379,0.0975 -4.0229,7.02686 -8.85555,15.39853 l -8.78664,15.22122 -4.18658,0.004 -4.18657,0.004 v 6.35065 6.35064 l -2.40585,4.19332 c -1.32321,2.30633 -2.43963,4.19333 -2.48093,4.19333 -0.0413,0 -0.0751,-6.00076 -0.0751,-13.33502 z"
|
||||
id="path158"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:0.20674446"
|
||||
d="m 100.43183,151.68682 -2.147889,-3.66972 -0.10337,-6.82257 -0.10337,-6.82256 -4.03152,-0.0585 -4.03151,-0.0585 -5.74118,-9.9474 c -3.15765,-5.47107 -5.70792,-9.98066 -5.66726,-10.02131 0.0406,-0.0407 9.5328,-0.0502 21.09366,-0.0213 l 21.019749,0.0527 -2.01747,3.3523 -2.01747,3.35231 -14.09725,0.007 -14.097249,0.007 2.23974,3.87646 2.23975,3.87646 4.87988,0.0554 4.879879,0.0554 v 13.22791 c 0,7.27534 -0.0336,13.2279 -0.0746,13.2279 -0.041,0 -1.04116,-1.65137 -2.22251,-3.66971 z"
|
||||
id="path160"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.7 KiB |
30
index.html
Normal file
30
index.html
Normal file
@ -0,0 +1,30 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<link rel="icon" href="../assets/favicon-32.png" sizes="32x32">
|
||||
<link rel="icon" href="../assets/favicon-57.png" sizes="57x57">
|
||||
<link rel="icon" href="../assets/favicon-76.png" sizes="76x76">
|
||||
<link rel="icon" href="../assets/favicon-96.png" sizes="96x96">
|
||||
<link rel="icon" href="../assets/favicon-128.png" sizes="128x128">
|
||||
<link rel="icon" href="../assets/favicon-192.png" sizes="192x192">
|
||||
<link rel="icon" href="../assets/favicon-228.png" sizes="228x228">
|
||||
<style>
|
||||
body {
|
||||
background-image: linear-gradient(#090B1A, #131524);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
</style>
|
||||
<link href="https://fonts.googleapis.com/css?family=Droid+Sans|Oswald&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<noscript>
|
||||
This site requires JavaScript to run.
|
||||
</noscript>
|
||||
<script src="./dist/bundle.js"></script>
|
||||
<script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
56
package.json
Normal file
56
package.json
Normal file
@ -0,0 +1,56 @@
|
||||
{
|
||||
"name": "ketr.settlers",
|
||||
"version": "1.0.0",
|
||||
"description": "Settlers",
|
||||
"main": "index.html",
|
||||
"scripts": {
|
||||
"start": "webpack-dev-server --mode development --host 0.0.0.0 --config webpack.dev.js",
|
||||
"build": "webpack --config webpack.prod.js",
|
||||
"commit-build": "./commit-build.sh",
|
||||
"watch": "webpack --config webpack.prod.js --watch",
|
||||
"update": "./update.sh",
|
||||
"backend": "NODE_CONFIG_ENV='production' node server/app.js"
|
||||
},
|
||||
"repository": "ssh://git@gitlab.ketrenos.com/jketreno/ketr.settlers.git",
|
||||
"author": "James Ketrenos <james_settlers@ketrenos.com>",
|
||||
"license": "MIT",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"animakit-expander": "^2.1.4",
|
||||
"bluebird": "^3.5.5",
|
||||
"bootstrap": "^4.4.1",
|
||||
"config": "^3.1.0",
|
||||
"cookie-parser": "^1.4.4",
|
||||
"core-js": "^3.2.1",
|
||||
"googleapis": "^40.0.0",
|
||||
"jira-connector": "^2.10.0",
|
||||
"moment": "^2.24.0",
|
||||
"morgan": "^1.9.1",
|
||||
"node-gzip": "^1.1.2",
|
||||
"nodemailer": "^6.3.0",
|
||||
"react-app-polyfill": "^1.0.2",
|
||||
"react-bootstrap": "^1.0.0-beta.16",
|
||||
"react-date-range": "^1.0.0-beta",
|
||||
"react-markdown": "^4.2.2",
|
||||
"react-router-dom": "^5.0.1",
|
||||
"react-scroll": "^1.7.14",
|
||||
"react-syntax-highlighter": "^11.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.1.0",
|
||||
"@babel/core": "^7.1.0",
|
||||
"@babel/plugin-proposal-class-properties": "^7.4.4",
|
||||
"@babel/preset-env": "^7.1.0",
|
||||
"@babel/preset-react": "^7.0.0",
|
||||
"babel-loader": "^8.0.2",
|
||||
"css-loader": "^1.0.0",
|
||||
"file-loader": "^4.1.0",
|
||||
"react": "^16.8",
|
||||
"react-dom": "^16.8",
|
||||
"style-loader": "^0.23.0",
|
||||
"webpack": "^4.19.1",
|
||||
"webpack-cli": "^3.1.1",
|
||||
"webpack-dev-server": "^3.3.1",
|
||||
"webpack-merge": "^4.2.1"
|
||||
}
|
||||
}
|
||||
397
src/App.css
Executable file
397
src/App.css
Executable file
@ -0,0 +1,397 @@
|
||||
body {
|
||||
font-family: 'Droid Sans', 'Arial Narrow', Arial, sans-serif;
|
||||
}
|
||||
|
||||
#PCILOOKUP {
|
||||
margin: 1em;
|
||||
padding: 1em;
|
||||
position: relative;
|
||||
background-color: lightyellow;
|
||||
border: 1px solid #252525;
|
||||
}
|
||||
|
||||
#PCILOOKUP p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#PCIRESULTS {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
#PCIDEVICE {
|
||||
padding: 0.5em 1em;
|
||||
font-family: 'Courier New'
|
||||
}
|
||||
|
||||
#PCIBASH::before {
|
||||
content: '# ';
|
||||
}
|
||||
|
||||
#PCIBASH {
|
||||
margin-top: 0.5em;
|
||||
background-color: #fff;
|
||||
color: #040;
|
||||
font-weight: bold;
|
||||
white-space: pre-wrap;
|
||||
font-family: 'Courier New';
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
#PCIID {
|
||||
margin-left: 0.25em;
|
||||
padding: 0.1em;
|
||||
width: 4em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.MarkdownLoader {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.gitlab-banner {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
overflow: hidden;
|
||||
background-color: #252525;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
height: 1.5em;
|
||||
line-height: 0.9em;
|
||||
opacity: 0.25;
|
||||
transition: opacity 0.5s ease-out;
|
||||
text-decoration: none;
|
||||
padding: 0.25em 0.5em;
|
||||
}
|
||||
|
||||
.gitlab-banner:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.gitlab-banner a {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
font-variant: all-small-caps;
|
||||
}
|
||||
|
||||
.gitlab-banner:hover a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#spinner {
|
||||
display: none;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-left: -30px;
|
||||
margin-top: -30px;
|
||||
z-index: 100;
|
||||
background-image: url(../assets/vtt-logo.png);
|
||||
background-color: #0071C5;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.Logo {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
background-image: url(../assets/vtt.svg);
|
||||
background-color: #252525;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: 95% 95%;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#spinner.spin {
|
||||
display: inline-block;
|
||||
-webkit-animation:spin 1s linear infinite;
|
||||
-moz-animation:spin 1s linear infinite;
|
||||
animation:spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
|
||||
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
|
||||
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
|
||||
|
||||
.Header {
|
||||
background-color: #252525;
|
||||
color: #ffffff;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 20;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
flex-direction: column;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.Header .Group {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
padding-left: 1em;
|
||||
padding-right: calc(1em + 52px);
|
||||
background-color: #0071C5;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.Header .Group .Subtitle {
|
||||
font-size: 0.7em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.Header .Group .Heading {
|
||||
margin: 0 auto;
|
||||
width: calc(100% - 8em);
|
||||
max-width: 90em;
|
||||
}
|
||||
|
||||
.Header .Pages {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
margin: 0 auto;
|
||||
width: calc(100% - 8em);
|
||||
max-width: 90em;
|
||||
/* justify-content: space-between;*/
|
||||
font-size: 1.2em;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.Header .Pages .Link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0.5em 1em;
|
||||
border-bottom: 3px solid transparent;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.Header .Pages .Link.Highlight {
|
||||
border-bottom-color: #0071C5 !important;
|
||||
}
|
||||
|
||||
.Header .Pages .Link.Active,
|
||||
.Header .Pages .Link:hover {
|
||||
border-bottom-color: #003663;
|
||||
/*border-bottom-color: #00A7FF;*/
|
||||
}
|
||||
|
||||
a.Link {
|
||||
font-family: Oswald;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.Footer {
|
||||
position: fixed;
|
||||
background-color: #252525;
|
||||
color: #ffffff;
|
||||
height: 64px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
font-size: 0.9em;
|
||||
font-family: Droid Sans;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.Footer .Copyright {
|
||||
position: absolute;
|
||||
line-height: 64px;
|
||||
text-align: center;
|
||||
left: 64px;
|
||||
right: 64px;
|
||||
}
|
||||
|
||||
.Footer .Lizard {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 64px;
|
||||
right: 1em;
|
||||
background-image: url(../assets/agama.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 98% center;
|
||||
background-size: auto 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.Body {
|
||||
position: absolute;
|
||||
/* .Header's two 60px chunks */
|
||||
/*
|
||||
margin-top: 120px;
|
||||
*/
|
||||
/* .Footer's 64 px */
|
||||
/*
|
||||
margin-bottom: 64px;
|
||||
*/
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
box-sizing: border-box;
|
||||
background-image: linear-gradient(#090B1A, #131524);
|
||||
color: #ffffff;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.Body > * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.popup {
|
||||
position: fixed;
|
||||
display: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
padding: 5em;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.popped-up {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.Board {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
opacity: 1;
|
||||
transition: opacity 1.5s ease-in-out;
|
||||
}
|
||||
|
||||
.Board.NoBackground {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.Index {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #fff;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 12em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.Index > div {
|
||||
padding: 0.25em 0.5em;
|
||||
cursor: pointer;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.Index div.story {
|
||||
font-size: 0.9em;
|
||||
padding-left: 0.5em;
|
||||
}
|
||||
|
||||
.Index div.topic {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.Index .active {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.Index div.inactive:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.Main {
|
||||
display: inline-flex;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-image: url(../assets/vtt-logo.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
|
||||
.Main.NoBackground {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.Content {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
margin: 1em auto;
|
||||
width: calc(100% - 8em);
|
||||
max-width: 90em;
|
||||
color: black;
|
||||
z-index: 10;
|
||||
background-color: #fff;
|
||||
overflow-y: scroll;
|
||||
scroll-behavior: smooth;
|
||||
padding: 1.5em 1.5em 0 1.5em;
|
||||
box-sizing: border-box;
|
||||
transition: top 1s ease-in-out;
|
||||
top: -100%;
|
||||
}
|
||||
|
||||
.Content #MinBox {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
min-height: calc(100% - 2.5em);
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.OnScreen {
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.Markdown pre {
|
||||
max-width: 100ex;
|
||||
}
|
||||
|
||||
.Markdown h1 {
|
||||
margin-top: 1em;
|
||||
font-size: 1.0em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.Markdown h2 {
|
||||
margin-top: 0.8em;
|
||||
font-size: 1.0em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.Markdown h1:first-child,
|
||||
.Markdown h2:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.Markdown th {
|
||||
font-variant-caps: all-small-caps;
|
||||
font-size: 1.1em;
|
||||
font-weight: normal;
|
||||
padding: 0.25em 0.5em;
|
||||
}
|
||||
|
||||
.Markdown table {
|
||||
border-collapse: collapse;
|
||||
margin: 0 1em;
|
||||
}
|
||||
|
||||
.Markdown td {
|
||||
vertical-align: top;
|
||||
padding: 0.25em 0.5em;
|
||||
border: 1px solid #f0f0f0;
|
||||
}
|
||||
111
src/App.js
Executable file
111
src/App.js
Executable file
@ -0,0 +1,111 @@
|
||||
/* Polyfills for IE */
|
||||
import 'react-app-polyfill/ie11';
|
||||
import 'core-js/features/array/find';
|
||||
import 'core-js/features/array/includes';
|
||||
import 'core-js/features/number/is-nan';
|
||||
|
||||
/* App starts here */
|
||||
import React from "react";
|
||||
import { withRouter, NavLink, Route, Switch } from "react-router-dom";
|
||||
import Modal from "react-bootstrap/Modal";
|
||||
import Button from "react-bootstrap/Button";
|
||||
|
||||
import "bootstrap/dist/css/bootstrap.min.css";
|
||||
|
||||
import Board from "./Board.js";
|
||||
import './modest.css';
|
||||
import "./App.css";
|
||||
|
||||
class Header extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="Header">
|
||||
<div className="Group">
|
||||
<Logo/>
|
||||
<div className="Heading">
|
||||
<div className="Subtitle">Visual Technology Team</div>
|
||||
<div className="Title">Software Solutions</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="Pages">
|
||||
<NavLink className="Link" activeClassName="Highlight" key="drivers" to="/drivers">Drivers</NavLink>
|
||||
<NavLink className="Link" activeClassName="Highlight" key="solutions" to="/solutions">Solutions</NavLink>
|
||||
<NavLink className="Link" activeClassName="Highlight" key="technologies" to="/technologies">Technologies</NavLink>
|
||||
<NavLink className="Link" activeClassName="Highlight" key="releases" to="/releases">Releases</NavLink>
|
||||
<NavLink className="Link" activeClassName="Highlight" key="internal" to="/internal">Internal Info</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class Logo extends React.Component {
|
||||
render() {
|
||||
return <NavLink to="/"><div className="Logo"></div></NavLink>
|
||||
}
|
||||
}
|
||||
|
||||
class Footer extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.toggleDebug = this.toggleDebug.bind(this);
|
||||
}
|
||||
|
||||
toggleDebug() {
|
||||
if (window.location.search.match(/debug/)) {
|
||||
window.location.search = "";
|
||||
} else {
|
||||
window.location.search = "debug";
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="Footer">
|
||||
<div className="Lizard" onClick={this.toggleDebug}></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function noChange() {};
|
||||
|
||||
class App extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props.history.listen((location, action) => {});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const location = this.props.history.location.pathname;
|
||||
console.log(`App.mounted at ${location}`);
|
||||
}
|
||||
|
||||
hidePopup() {
|
||||
this.setState({
|
||||
modalShown: false
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
return (
|
||||
<div className="App" ref={ ref => (this.app = ref) }>
|
||||
{ /* <Header/> */ }
|
||||
<div className="Body">
|
||||
<Board/>
|
||||
</div>
|
||||
{ /* <Footer/> */ }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default withRouter(App);
|
||||
405
src/Board.js
Normal file
405
src/Board.js
Normal file
@ -0,0 +1,405 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
|
||||
const hexagonRatio = 1.1547005,
|
||||
tileHeight = 0.165,
|
||||
tileWidth = tileHeight * hexagonRatio;
|
||||
|
||||
const Tiles = (board) => {
|
||||
const tiles = [ {
|
||||
type: "wood", y: 0. / 4.
|
||||
}, {
|
||||
type: "wood", y: 1. / 4.
|
||||
}, {
|
||||
type: "wood", y: 2. / 4.
|
||||
}, {
|
||||
type: "wood", y: 3. / 4.
|
||||
}, {
|
||||
type: "wheat", y: 0. / 4.
|
||||
}, {
|
||||
type: "wheat", y: 1. / 4.
|
||||
}, {
|
||||
type: "wheat", y: 2. / 4.
|
||||
}, {
|
||||
type: "wheat", y: 3. / 4.
|
||||
}, {
|
||||
type: "stone", y: 0. / 4.
|
||||
}, {
|
||||
type: "stone", y: 1. / 4.
|
||||
}, {
|
||||
type: "stone", y: 2. / 4.
|
||||
}, {
|
||||
type: "sheep", y: 0. / 4.
|
||||
}, {
|
||||
type: "sheep", y: 1. / 4.
|
||||
}, {
|
||||
type: "sheep", y: 2. / 4.
|
||||
}, {
|
||||
type: "sheep", y: 3. / 4.
|
||||
}, {
|
||||
type: "brick", y: 0. / 4.
|
||||
}, {
|
||||
type: "brick", y: 1. / 4.
|
||||
}, {
|
||||
type: "brick", y: 2. / 4.
|
||||
}, {
|
||||
type: "robber", y: 0
|
||||
} ];
|
||||
|
||||
[ "robber", "brick", "wood", "sheep", "stone", "wheat" ].forEach((type) => {
|
||||
const image = new Image(),
|
||||
file = type + ".png";
|
||||
tiles.forEach((tile) => {
|
||||
if (tile.type == type) {
|
||||
tile.image = image;
|
||||
tile.x = 0;
|
||||
tile.pos = { x: 0, y: 0 };
|
||||
}
|
||||
});
|
||||
image.addEventListener("load", (event) => {
|
||||
console.log(`Done loading ${file}`);
|
||||
window.requestAnimationFrame(board.drawFrame);
|
||||
});
|
||||
image.addEventListener("error", (event) => {
|
||||
alert(`Error loading ${file}`);
|
||||
});
|
||||
image.src = `assets/original/${file}`;
|
||||
});
|
||||
|
||||
return tiles;
|
||||
};
|
||||
|
||||
const Pips = (board) => {
|
||||
const image = new Image(),
|
||||
file = 'pip-numbers.png';
|
||||
|
||||
let pips = [
|
||||
{ roll: 0, pips: 0, y: 3. / 6., x: 0. / 6. },
|
||||
{ roll: 5, pips: 4, y: 0. / 6., x: 0. / 6. },
|
||||
{ roll: 2, pips: 1, y: 0. / 6., x: 1. / 6. },
|
||||
{ roll: 6, pips: 5, y: 0. / 6., x: 2. / 6. },
|
||||
{ roll: 3, pips: 2, y: 0. / 6., x: 3. / 6. },
|
||||
{ roll: 8, pips: 5, y: 0. / 6., x: 4. / 6. },
|
||||
{ roll: 10, pips: 3, y: 0. / 6., x: 5. / 6. },
|
||||
{ roll: 9, pips: 4, y: 1. / 6., x: 0. / 6. },
|
||||
{ roll: 12, pips: 1, y: 1. / 6., x: 1. / 6. },
|
||||
{ roll: 11, pips: 2, y: 1. / 6., x: 2. / 6. },
|
||||
{ roll: 4, pips: 3, y: 1. / 6., x: 3. / 6. },
|
||||
{ roll: 8, pips: 5, y: 1. / 6., x: 4. / 6. },
|
||||
{ roll: 10, pips: 3, y: 1. / 6., x: 5. / 6. },
|
||||
{ roll: 9, pips: 4, y: 2. / 6., x: 0. / 6. },
|
||||
{ roll: 4, pips: 3, y: 2. / 6., x: 1. / 6. },
|
||||
{ roll: 5, pips: 4, y: 2. / 6., x: 2. / 6. },
|
||||
{ roll: 6, pips: 6, y: 2. / 6., x: 3. / 6. },
|
||||
{ roll: 3, pips: 2, y: 2. / 6., x: 4. / 6. },
|
||||
{ roll: 11, pips: 2, y: 2. / 6., x: 5. / 6. }
|
||||
];
|
||||
|
||||
image.addEventListener("load", (event) => {
|
||||
console.log(`Done loading ${file}`);
|
||||
window.requestAnimationFrame(board.drawFrame);
|
||||
});
|
||||
image.addEventListener("error", (event) => {
|
||||
alert(`Error loading ${file}`);
|
||||
});
|
||||
image.src = `assets/original/${file}`;
|
||||
|
||||
return {
|
||||
image: image,
|
||||
pips: pips
|
||||
};
|
||||
};
|
||||
|
||||
const Border = (board, border) => {
|
||||
const image = new Image(), file = border.file
|
||||
border.image = image;
|
||||
image.addEventListener("load", (event) => {
|
||||
console.log(`Done loading ${file}`);
|
||||
window.requestAnimationFrame(board.drawFrame);
|
||||
});
|
||||
image.addEventListener("error", (event) => {
|
||||
alert(`Error loading ${file}`);
|
||||
});
|
||||
image.src = `assets/original/${file}`;
|
||||
return border;
|
||||
};
|
||||
|
||||
function shuffle(array) {
|
||||
var currentIndex = array.length, temporaryValue, randomIndex;
|
||||
|
||||
// While there remain elements to shuffle...
|
||||
while (0 !== currentIndex) {
|
||||
|
||||
// Pick a remaining element...
|
||||
randomIndex = Math.floor(Math.random() * currentIndex);
|
||||
currentIndex -= 1;
|
||||
|
||||
// And swap it with the current element.
|
||||
temporaryValue = array[currentIndex];
|
||||
array[currentIndex] = array[randomIndex];
|
||||
array[randomIndex] = temporaryValue;
|
||||
}
|
||||
|
||||
return array;
|
||||
}
|
||||
|
||||
class Board extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.componentDidMount = this.componentDidMount.bind(this);
|
||||
this.updateDimensions = this.updateDimensions.bind(this);
|
||||
this.drawFrame = this.drawFrame.bind(this);
|
||||
this.drawBorders = this.drawBorders.bind(this);
|
||||
this.drawPips = this.drawPips.bind(this);
|
||||
this.mouseMove = this.mouseMove.bind(this);
|
||||
this.randomize = this.randomize.bind(this);
|
||||
|
||||
this.mouse = { x: 0, y: 0 };
|
||||
this.radius = 0.317;
|
||||
|
||||
this.pips = Pips(this);
|
||||
this.tiles = Tiles(this);
|
||||
|
||||
this.borders = [ {
|
||||
file: 'borders-1.6.png', left: "sheep", right: "bank"
|
||||
}, {
|
||||
file: 'borders-2.1.png', center: "sheep"
|
||||
}, {
|
||||
file: 'borders-3.2.png', left: "wheat", right: "bank"
|
||||
}, {
|
||||
file: 'borders-4.3.png', center: "wood"
|
||||
}, {
|
||||
file: 'borders-5.4.png', left: "sheep", right: "bank"
|
||||
}, {
|
||||
file: 'borders-6.5.png', center: "bank"
|
||||
} ].map((file) => {
|
||||
return Border(this, file);
|
||||
});
|
||||
|
||||
this.randomize();
|
||||
}
|
||||
|
||||
randomize() {
|
||||
this.borders = shuffle(this.borders);
|
||||
this.tiles = shuffle(this.tiles);
|
||||
window.requestAnimationFrame(this.drawFrame);
|
||||
}
|
||||
|
||||
mouseMove(event) {
|
||||
const rect = this.canvas.parentElement.getBoundingClientRect();
|
||||
/* Scale mouse.x and mouse.y relative to board */
|
||||
this.mouse.x = (event.clientX - rect.left) /
|
||||
(this.canvas.height / hexagonRatio) - 0.5 - tileHeight * 0.5,
|
||||
this.mouse.y = (event.clientY - rect.top) /
|
||||
(this.canvas.height / hexagonRatio) - 0.5 - tileHeight * 0.5;
|
||||
|
||||
let closest = null;
|
||||
|
||||
this.tiles.forEach((tile) => {
|
||||
const dX = tile.pos.x - this.mouse.x,
|
||||
dY = tile.pos.y - this.mouse.y;
|
||||
const distance = Math.sqrt(dX * dX + dY * dY);
|
||||
if (distance > tileHeight * 0.75) {
|
||||
return;
|
||||
}
|
||||
if (!closest || closest.distance > distance) {
|
||||
closest = {
|
||||
tile: tile,
|
||||
distance: distance
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (this.closest != closest) {
|
||||
this.closest = closest;
|
||||
}
|
||||
window.requestAnimationFrame(this.drawFrame);
|
||||
}
|
||||
|
||||
updateDimensions() {
|
||||
if (this.updateSizeTimer) {
|
||||
clearTimeout(this.updateSizeTimer);
|
||||
}
|
||||
|
||||
this.updateSizeTimer = setTimeout(() => {
|
||||
this.canvas.width = this.canvas.offsetWidth;
|
||||
this.canvas.height = this.canvas.offsetHeight;
|
||||
this.width = this.canvas.parentElement.clientWidth;
|
||||
this.height = this.canvas.parentElement.clientHeight;
|
||||
this.updateSizeTimer = 0;
|
||||
this.drawFrame();
|
||||
}, 250);
|
||||
}
|
||||
|
||||
drawFrame() {
|
||||
if (!this.canvas) {
|
||||
return;
|
||||
}
|
||||
|
||||
const ctx = this.canvas.getContext("2d");
|
||||
ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
|
||||
ctx.save();
|
||||
ctx.strokeStyle = 'white';
|
||||
ctx.filleStyle = 'rgba(0, 0, 0, 0)';
|
||||
|
||||
ctx.scale(this.canvas.height / hexagonRatio, this.canvas.height / hexagonRatio);
|
||||
ctx.translate(0.5 * hexagonRatio, 0.5 * hexagonRatio);
|
||||
ctx.lineWidth = 1. / this.canvas.height;
|
||||
|
||||
/* Board dimensions:
|
||||
* ________
|
||||
* /___1__| \
|
||||
* / / \6\
|
||||
* /2/ \ \
|
||||
* / / \/\
|
||||
* \/\ / /
|
||||
* \ \ /5/
|
||||
* \3\______/_/
|
||||
* \_|__4___/
|
||||
* 0 0.3 0.6 1
|
||||
*/
|
||||
|
||||
ctx.save();
|
||||
this.drawBorders(ctx);
|
||||
ctx.restore();
|
||||
|
||||
ctx.save();
|
||||
this.drawPips(ctx);
|
||||
ctx.restore();
|
||||
|
||||
if (this.closest) {
|
||||
ctx.strokeStyle = "red";
|
||||
ctx.beginPath();
|
||||
ctx.arc(this.closest.tile.pos.x, this.closest.tile.pos.y,
|
||||
tileHeight * 0.5, 0, Math.PI * 2.);
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
ctx.strokeStyle = "yellow";
|
||||
ctx.beginPath();
|
||||
ctx.arc(this.mouse.x, this.mouse.y,
|
||||
tileHeight * 0.5, 0, Math.PI * 2.);
|
||||
ctx.stroke();
|
||||
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
drawPips(ctx) {
|
||||
const image = this.pips.image, pipSize = 0.06;
|
||||
|
||||
function drawTile(tile, angle, radius) {
|
||||
tile.pos.x = Math.sin(angle) * radius;
|
||||
tile.pos.y = Math.cos(angle) * radius;
|
||||
const image = tile.image;
|
||||
ctx.save();
|
||||
ctx.rotate(angle);
|
||||
ctx.translate(0., radius);
|
||||
ctx.rotate(-angle + Math.PI * 1. / 6.);
|
||||
ctx.drawImage(image,
|
||||
tile.x * image.width, tile.y * image.height,
|
||||
image.width, image.height / 4.,
|
||||
-tileWidth * 0.5, -tileHeight * 0.5,
|
||||
tileWidth, tileHeight);
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
function drawPip(pip, angle, radius) {
|
||||
ctx.save();
|
||||
ctx.rotate(angle);
|
||||
ctx.translate(0., radius);
|
||||
ctx.rotate(-angle);
|
||||
ctx.drawImage(image,
|
||||
pip.x * image.width, pip.y * image.height,
|
||||
image.width / 6., image.height / 6.,
|
||||
-pipSize * 0.5, -pipSize * 0.5,
|
||||
pipSize, pipSize);
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
let angle,
|
||||
radius = this.radius,
|
||||
index = 1, pip;
|
||||
|
||||
/* Outer row */
|
||||
angle = 0;
|
||||
for (let i = 0; i < 12; i++) {
|
||||
angle -= Math.PI * 2. / 12.;
|
||||
if (this.tiles[i].type == "robber") {
|
||||
pip = this.pips.pips[0]
|
||||
} else {
|
||||
pip = this.pips.pips[index++];
|
||||
}
|
||||
drawTile(this.tiles[i], angle, radius - (i % 2) * 0.04);
|
||||
drawPip(pip, angle, radius - (i % 2) * 0.04);
|
||||
}
|
||||
|
||||
/* Middle row */
|
||||
angle = Math.PI * 2. / 12.;
|
||||
radius = this.radius * 0.5;
|
||||
for (let i = 12; i < 18; i++) {
|
||||
angle -= Math.PI * 2. / 6.;
|
||||
if (this.tiles[i].type == "robber") {
|
||||
pip = this.pips.pips[0]
|
||||
} else {
|
||||
pip = this.pips.pips[index++];
|
||||
}
|
||||
drawTile(this.tiles[i], angle, radius);
|
||||
drawPip(pip, angle, radius);
|
||||
}
|
||||
|
||||
/* Center */
|
||||
let i = 18;
|
||||
if (this.tiles[i].type == "robber") {
|
||||
pip = this.pips.pips[0]
|
||||
} else {
|
||||
pip = this.pips.pips[index++];
|
||||
}
|
||||
drawTile(this.tiles[i], 0, 0);
|
||||
drawPip(pip, 0, 0);
|
||||
}
|
||||
|
||||
drawBorders(ctx) {
|
||||
ctx.rotate(Math.PI);
|
||||
|
||||
const offset = 0.18;
|
||||
this.borders.forEach((border, index) => {
|
||||
ctx.translate(0, this.radius);
|
||||
|
||||
const image = border.image;
|
||||
|
||||
ctx.drawImage(image,
|
||||
-offset, 0,
|
||||
0.5, 0.5 * image.height / image.width);
|
||||
|
||||
ctx.translate(0, -this.radius);
|
||||
ctx.rotate(Math.PI * 2. / 6.);
|
||||
});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.start = new Date();
|
||||
|
||||
window.addEventListener("mousedown", this.randomize);
|
||||
window.addEventListener("mousemove", this.mouseMove);
|
||||
window.addEventListener("resize", this.updateDimensions);
|
||||
|
||||
this.updateDimensions();
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
if (this.updateSizeTimer) {
|
||||
clearTimeout(this.updateSizeTimer);
|
||||
this.updateSizeTimer = 0;
|
||||
}
|
||||
window.removeEventListener("mousedown", this.randomize);
|
||||
window.removeEventListener("mousemove", this.mouseMove);
|
||||
window.removeEventListener("resize", this.updateDimensions);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<canvas className="Board" ref={el => this.canvas = el}></canvas>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default Board;
|
||||
31
src/CodeBlock.js
Normal file
31
src/CodeBlock.js
Normal file
@ -0,0 +1,31 @@
|
||||
import React, { PureComponent } from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
|
||||
import { okaidia } from "react-syntax-highlighter/dist/esm/styles/prism";
|
||||
|
||||
class CodeBlock extends PureComponent {
|
||||
/* NOTE: the line-numbers plugin isn't working.
|
||||
* See https://betterstack.dev/blog/code-highlighting-in-react-using-prismjs/
|
||||
* for some clues on how to fix it. */
|
||||
static propTypes = {
|
||||
value: PropTypes.string.isRequired,
|
||||
language: PropTypes.string,
|
||||
plugins: PropTypes.arrayOf(PropTypes.string)
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
language: null,
|
||||
plugins: [ "line-numbers" ]
|
||||
};
|
||||
|
||||
render() {
|
||||
const { language, plugins, value } = this.props;
|
||||
return (
|
||||
<SyntaxHighlighter className="line-numbers" language={language} style={okaidia} plugins={plugins}>
|
||||
{value}
|
||||
</SyntaxHighlighter>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default CodeBlock;
|
||||
173
src/Contents.js
Normal file
173
src/Contents.js
Normal file
@ -0,0 +1,173 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
|
||||
import WaveBalls from "./WaveBalls.js";
|
||||
import AnimakitExpander from "animakit-expander";
|
||||
|
||||
import "./App.css";
|
||||
|
||||
const sections = [
|
||||
"Platforms",
|
||||
"Drivers",
|
||||
"Compute",
|
||||
"Media",
|
||||
"3D",
|
||||
"Solutions"
|
||||
];
|
||||
|
||||
class Header extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="Header">
|
||||
<Logo/>
|
||||
<div className="Pages">
|
||||
{
|
||||
sections.map((section) =>
|
||||
<div key={ section }>{ section }</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class Logo extends React.Component {
|
||||
render() {
|
||||
return <div className="Logo"></div>
|
||||
}
|
||||
}
|
||||
|
||||
class Footer extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="Footer">
|
||||
Copyright 2019 Intel Corporation
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class Body extends React.Component {
|
||||
static defaultProps = {
|
||||
topics: [ {
|
||||
title: "Agama",
|
||||
stories: [ {
|
||||
title: "About Agama",
|
||||
content: "Agama is the quarterly distribution of Intel graphics projects for Linux, packaged, validated, and made available from a single repository."
|
||||
}]
|
||||
}, {
|
||||
title: "Media",
|
||||
stories: [ {
|
||||
title: "About Media",
|
||||
content: "Media capabilities for Intel graphics cards on Linux are provided by Intel's Media packages."
|
||||
} ]
|
||||
}, {
|
||||
title: "Compute",
|
||||
stories: [ {
|
||||
title: "About Compute",
|
||||
content: "Compute capabilities for Intel graphics cards on Linux are provided by Intel's Open CL project: Neo."
|
||||
} ]
|
||||
}, {
|
||||
title: "3D",
|
||||
stories: [ {
|
||||
title: "About 3D",
|
||||
content: "3D capabilities for Intel graphics cards on Linux are provided by Mesa."
|
||||
} ]
|
||||
}, {
|
||||
title: "Solutions",
|
||||
stories: [ {
|
||||
title: "About Solutions",
|
||||
content: "Turn-key containers ready to rock."
|
||||
} ]
|
||||
} ]
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props.topics.forEach((topic) => {
|
||||
for (var i = 0; i < 10; i++) {
|
||||
topic.stories.push({
|
||||
title: "Title #" + (i + 1),
|
||||
content: "Content for #" + (i + 1)
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
this.topicClicked = this.topicClicked.bind(this);
|
||||
this.state = {
|
||||
topic: 0,
|
||||
story: 0
|
||||
}
|
||||
}
|
||||
|
||||
topicClicked(index) {
|
||||
this.setState({
|
||||
topic: index,
|
||||
story: 0
|
||||
});
|
||||
}
|
||||
|
||||
storyClicked(index) {
|
||||
this.setState({ story: index });
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
console.log("App.mounted");
|
||||
sections.forEach((section) => {
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const topic = this.props.topics[this.state.topic],
|
||||
story = topic.stories[this.state.story];
|
||||
|
||||
console.log(this.state.topic);
|
||||
return (
|
||||
<div className="Body">
|
||||
<div className="Page">
|
||||
<div className="Index" target="Content">
|
||||
{
|
||||
this.props.topics.map((topic, topicIndex) =>
|
||||
<div key={ "topic-" + topicIndex }>
|
||||
<div
|
||||
className={ "topic " + ((this.state.topic == topicIndex) ? "active" : "inactive") }
|
||||
onClick={() => this.topicClicked(topicIndex)}>{topic.title}</div>
|
||||
<AnimakitExpander expanded={ (this.state.topic == topicIndex) ? true : false }>
|
||||
{
|
||||
topic.stories.map((story, storyIndex) =>
|
||||
<div
|
||||
className={ "story " + ((this.state.topic == topicIndex && this.state.story == storyIndex) ? "active" : "inactive") }
|
||||
onClick={() => this.storyClicked(storyIndex)}
|
||||
key={ "story-" + topicIndex + "-" + storyIndex }>{story.title}</div>
|
||||
)
|
||||
}
|
||||
</AnimakitExpander>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
<div className="Content">
|
||||
<b>{ story.title }</b><br></br>
|
||||
<div>{story.content}</div>
|
||||
</div>
|
||||
</div>
|
||||
<WaveBalls/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class App extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="App">
|
||||
<Header/>
|
||||
<Body/>
|
||||
<Footer/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default App;
|
||||
190
src/WaveBalls.js
Executable file
190
src/WaveBalls.js
Executable file
@ -0,0 +1,190 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
|
||||
class WaveBalls extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.componentDidMount = this.componentDidMount.bind(this);
|
||||
this.updateDimensions = this.updateDimensions.bind(this);
|
||||
this.updatePositions = this.updatePositions.bind(this);
|
||||
this.updateFrame = this.updateFrame.bind(this);
|
||||
this.drawFrame = this.drawFrame.bind(this);
|
||||
this.mouseMove = this.mouseMove.bind(this);
|
||||
this.mouse = { x: 0, y: 0 };
|
||||
}
|
||||
|
||||
mouseMove(event) {
|
||||
const rect = this.canvas.parentElement.getBoundingClientRect();
|
||||
this.mouse.x = (event.clientX - rect.left) / this.width;
|
||||
this.mouse.y = (event.clientY - rect.top) / this.height;
|
||||
}
|
||||
|
||||
updateDimensions() {
|
||||
if (this.updateSizeTimer) {
|
||||
clearTimeout(this.updateSizeTimer);
|
||||
} else {
|
||||
const ctx = this.canvas.getContext("2d");
|
||||
ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
}
|
||||
|
||||
this.updateSizeTimer = setTimeout(() => {
|
||||
this.canvas.width = this.canvas.offsetWidth;
|
||||
this.canvas.height = this.canvas.offsetHeight;
|
||||
this.width = this.canvas.parentElement.clientWidth;
|
||||
this.height = this.canvas.parentElement.clientHeight;
|
||||
this.updateSizeTimer = 0;
|
||||
this.updateFrame();
|
||||
}, 250);
|
||||
}
|
||||
|
||||
/* Max framerate of 30FPS, regardless of display frame rate to prevent UX starvation.
|
||||
*
|
||||
* If a frame render has not been requested, request the frame to be drawn at the next
|
||||
* opportunity */
|
||||
updateFrame() {
|
||||
if (this.updateFrameTimeout || !this.canvas) {
|
||||
return;
|
||||
}
|
||||
|
||||
const isVisible = window.getComputedStyle(this.canvas).opacity != 0;
|
||||
/* If the WaveBalls are not faded completely out, update ball
|
||||
* positions and scheduel a render, which will then set a new
|
||||
* timeout for updateFrame().
|
||||
*
|
||||
* Otherwise schedule another a check in 250ms to see if the
|
||||
* window is now visible */
|
||||
if (isVisible) {
|
||||
this.updatePositions();
|
||||
window.requestAnimationFrame(this.drawFrame);
|
||||
} else {
|
||||
this.updateFrameTimeout = setTimeout(() => {
|
||||
this.updateFrameTimeout = 0;
|
||||
this.updateFrame();
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
drawFrame() {
|
||||
if (!this.canvas) {
|
||||
return;
|
||||
}
|
||||
|
||||
const ctx = this.canvas.getContext("2d");
|
||||
ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
|
||||
/* If the window is being resized, don't render balls as
|
||||
* they will have a distorted aspect ratio until the canvas
|
||||
* width re-snaps to the new dimensions */
|
||||
if (!this.updateSizeTimer) {
|
||||
this.balls.forEach((ball) => {
|
||||
ctx.beginPath();
|
||||
ctx.fillStyle = ball.color;
|
||||
ctx.arc(ball.pos.x, ball.pos.y, ball.size, 0, 2 * Math.PI);
|
||||
ctx.fill();
|
||||
});
|
||||
}
|
||||
|
||||
this.updateFrameTimeout = setTimeout(() => {
|
||||
this.updateFrameTimeout = 0;
|
||||
this.updateFrame();
|
||||
}, 1000 / 30);
|
||||
}
|
||||
|
||||
updatePositions() {
|
||||
if (!this.canvas) {
|
||||
return;
|
||||
}
|
||||
|
||||
const interval = 20000,
|
||||
alpha = ((Date.now() - this.start.getTime()) % interval) / interval,
|
||||
sun = { r: 0xFC, g: 0xD4, b: 0x40 },
|
||||
normal = { r: 197, g: 197, b: 197 },
|
||||
gravity = 0.5;
|
||||
|
||||
this.balls.forEach((ball) => {
|
||||
ball.alpha.x = ball.start - alpha;
|
||||
if (ball.alpha.x < 0.) {
|
||||
ball.alpha.x += 1.;
|
||||
}
|
||||
|
||||
ball.opacity.current = 0.5 * Math.cos(8. * (alpha - ball.opacity.start) * Math.PI);
|
||||
ball.pos.x = ball.alpha.x;
|
||||
ball.pos.y =
|
||||
(0.187 * Math.cos(2. * Math.PI * (alpha - ball.alpha.x)) +
|
||||
(0.5 + ball.offset + ball.alpha.y * Math.sin(4. * Math.PI * (alpha - ball.alpha.x)) * 0.5));
|
||||
|
||||
/* Gravity influence needs to ramp to 0 near alpha [0, 1] borders */
|
||||
const localGravity = gravity * (1. - Math.pow(Math.abs(ball.pos.x - 0.5) / 0.5, 2)),
|
||||
alphaDistance = 1. - Math.min(Math.sqrt(Math.pow(ball.pos.x - this.mouse.x, 2) + Math.pow(ball.pos.y - this.mouse.y, 2)), localGravity) / localGravity;
|
||||
if (alphaDistance > 0.) {
|
||||
ball.pos.x -= alphaDistance * alphaDistance * (ball.pos.x - this.mouse.x);
|
||||
ball.pos.y -= alphaDistance * alphaDistance * (ball.pos.y - this.mouse.y);
|
||||
ball.opacity.current += alphaDistance * (1 - ball.opacity.current);
|
||||
const rgba = [
|
||||
normal.r + (sun.r - normal.r) * alphaDistance,
|
||||
normal.g + (sun.g - normal.g) * alphaDistance,
|
||||
normal.b + (sun.b - normal.b) * alphaDistance,
|
||||
ball.opacity.current
|
||||
];
|
||||
ball.color = "rgba(" + rgba.join(",") + ")";
|
||||
} else {
|
||||
ball.color = "rgba(197,197,197," + ball.opacity.current + ")";
|
||||
}
|
||||
|
||||
ball.pos.x = ball.pos.x * (this.canvas.width + 64) - 32;
|
||||
ball.pos.y = ball.pos.y * (this.canvas.height + 64) - 32;
|
||||
});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.balls = [];
|
||||
this.start = new Date();
|
||||
|
||||
for (var i = 0; i < 100; i++) {
|
||||
let ball = {
|
||||
pos: {
|
||||
x: 0.,
|
||||
y: 0.
|
||||
},
|
||||
alpha: {
|
||||
x: 0.,
|
||||
y: (Math.random() * 0.7) - 0.35
|
||||
},
|
||||
start: Math.random(),
|
||||
offset: Math.pow(Math.random() - 0.5, 3),
|
||||
brightness: Math.floor(255 * Math.random()),
|
||||
opacity:{
|
||||
start: Math.random(),
|
||||
current: 0
|
||||
},
|
||||
size: 1 + Math.random() * 6
|
||||
};
|
||||
|
||||
this.balls.push(ball);
|
||||
}
|
||||
|
||||
this.updateDimensions();
|
||||
this.updatePositions();
|
||||
window.addEventListener("mousemove", this.mouseMove);
|
||||
window.addEventListener("resize", this.updateDimensions);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
if (this.updatePositionsTimer) {
|
||||
clearTimeout(this.updatePositionsTimer);
|
||||
this.updatePositionsTimer = 0;
|
||||
}
|
||||
if (this.updateSizeTimer) {
|
||||
clearTimeout(this.updateSizeTimer);
|
||||
this.updateSizeTimer = 0;
|
||||
}
|
||||
window.removeEventListener("mousemove", this.mouseMove);
|
||||
window.removeEventListener("resize", this.updateDimensions);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<canvas className="WaveBalls" ref={el => this.canvas = el}></canvas>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default WaveBalls;
|
||||
42
src/drivers.css
Executable file
42
src/drivers.css
Executable file
@ -0,0 +1,42 @@
|
||||
.tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-top-color: transparent;
|
||||
border-bottom-left-radius: 0.25em;
|
||||
border-bottom-right-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.tab-content p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.tab-content p:last-child {
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
.tab-content .Markdown table {
|
||||
min-width: 75%;
|
||||
margin: 1em 0 1em 0;
|
||||
}
|
||||
|
||||
.tab-content .Markdown table thead {
|
||||
background-color: #555;
|
||||
color: white;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tab-content .Markdown h1,
|
||||
.tab-content .Markdown h2,
|
||||
.tab-content .Markdown h3 {
|
||||
margin-top: 1em;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.tab-content .Markdown h3 {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.nav.nav-tabs {
|
||||
margin-top: 1em;
|
||||
}
|
||||
186
src/drivers.js
Executable file
186
src/drivers.js
Executable file
@ -0,0 +1,186 @@
|
||||
/* App starts here */
|
||||
import React, { useState, useEffect } from "react";
|
||||
import ReactMarkdown from "react-markdown/with-html";
|
||||
import CodeBlock from "./CodeBlock";
|
||||
import MarkdownLoader from "./markdown-loader";
|
||||
import Tabs from "react-bootstrap/Tabs";
|
||||
import Tab from "react-bootstrap/Tab";
|
||||
import Col from "react-bootstrap/Col";
|
||||
import Row from "react-bootstrap/Row";
|
||||
import { lookupIntelGPU } from "./intel-gpu-info";
|
||||
|
||||
import "./drivers.css";
|
||||
|
||||
import { intelGPUs } from './intel-gpu-info.js';
|
||||
|
||||
|
||||
class HardwareTable extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
}
|
||||
|
||||
render () {
|
||||
/* const GPUs = intelGPUs.filter((item) => {
|
||||
return item.
|
||||
})*/
|
||||
return (
|
||||
<>
|
||||
<Row>
|
||||
<ReactMarkdown className="Markdown" source="
|
||||
If you aren't sure which graphics product you have, you can use the [Identify Hardware](#identify-hardware) tool.
|
||||
"/>
|
||||
</Row>
|
||||
{ (this.props.device) && <Row><div> Filtering by { this.props.device } </div></Row> }
|
||||
<Row>
|
||||
<Col sm={3}>
|
||||
Graphics
|
||||
</Col>
|
||||
<Col sm={6}>
|
||||
test two
|
||||
</Col>
|
||||
</Row>
|
||||
</>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class OSPicker extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
console.log("OSPicker: " + props.device);
|
||||
this.clearFilter = this.clearFilter.bind(this);
|
||||
}
|
||||
|
||||
clearFilter() {
|
||||
if (window.clearFilter) {
|
||||
window.clearFilter();
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const id = parseInt("0x" + (this.props.device || "0")),
|
||||
device = lookupIntelGPU(id);
|
||||
let suffix;
|
||||
if (device) {
|
||||
switch (device.gen) {
|
||||
case 1:
|
||||
suffix = "st";
|
||||
break;
|
||||
case 2:
|
||||
suffix = "nd";
|
||||
break;
|
||||
default:
|
||||
suffix = "th";
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Tabs id="os-support-table">
|
||||
<Tab eventKey="linux" title="Linux">
|
||||
<MarkdownLoader src={ "drivers/overview.md" }/>
|
||||
<Tabs defaultActiveKey="ubuntu" id="os-distro-table">
|
||||
{/*<Tab eventKey="centos" title="CentOS">
|
||||
<Tabs defaultActiveKey="centos-8.0" id="os-distro-table">
|
||||
<Tab eventKey="centos-8.0" title="8.0">
|
||||
<MarkdownLoader src={ "drivers/centos-8.0.md" }/>
|
||||
</Tab>
|
||||
<Tab eventKey="centos-7.x" title="7.x">
|
||||
{ (device) &&
|
||||
<>
|
||||
<p><b>Hardware selected:</b> PCI device ID 8086:{ device.id.toString(16).replace(/0x/, "") } is
|
||||
a { device.gen }<sup>{ suffix }</sup> generation { device.name }. <button onClick={clearFilter}>clear</button>
|
||||
</p>
|
||||
</>
|
||||
} {
|
||||
(device && device.gen > 8) &&
|
||||
<ReactMarkdown renderers={{ code: CodeBlock }} className="Markdown" source="
|
||||
|
||||
Supported by CentOS 7.7.
|
||||
|
||||
CentOS should recognize this hardware and install the necessary drivers automatically.
|
||||
"/>
|
||||
} {
|
||||
(device && device.gen <= 8) &&
|
||||
<ReactMarkdown renderers={{ code: CodeBlock }} className="Markdown" source="
|
||||
|
||||
Not supported by CentOS 7.7. To use this hardware with CentOS 7.7 you will need a custom kernel.
|
||||
|
||||
**Recommended**: Use CentOS 8 or newer.
|
||||
"/>
|
||||
} { (!device) && <MarkdownLoader src={ "drivers/centos-7.md" }/> }
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</Tab>*/}
|
||||
<Tab eventKey="redhat" title="Red Hat">
|
||||
<Tabs defaultActiveKey="redhat-8.0" id="os-distro-table">{/*
|
||||
<Tab eventKey="redhat-8.1" title="8.1">
|
||||
<MarkdownLoader src={ "drivers/redhat-8.1.md" }/>
|
||||
</Tab>
|
||||
*/}<Tab eventKey="redhat-8.0" title="8.0">
|
||||
<MarkdownLoader src={ "drivers/redhat-8.0.md" }/>
|
||||
</Tab>
|
||||
<Tab eventKey="redhat-7.x" title="7.x">
|
||||
<MarkdownLoader src={ "drivers/redhat-7.md" }/>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</Tab>
|
||||
<Tab eventKey="suse" title="SUSE">
|
||||
<Tabs defaultActiveKey="suse-15-sp1" id="os-distro-table">
|
||||
<Tab eventKey="suse-15-sp1" title="15 SP1">
|
||||
<MarkdownLoader src={ "drivers/suse-15-sp1.md" }/>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</Tab>
|
||||
<Tab eventKey="ubuntu" title="Ubuntu">
|
||||
<Tabs defaultActiveKey="ubuntu-19.10" id="os-distro-table">
|
||||
<Tab eventKey="ubuntu-19.10" title="19.10 (eoan)">
|
||||
<MarkdownLoader src={ "drivers/ubuntu-eoan.md" }/>
|
||||
</Tab>
|
||||
<Tab eventKey="ubuntu-19.04" title="19.04 (disco)">
|
||||
<MarkdownLoader src={ "drivers/ubuntu-disco.md" }/>
|
||||
</Tab>
|
||||
<Tab eventKey="ubuntu-18.04" title="18.04 (bionic)">
|
||||
<MarkdownLoader src={ "drivers/ubuntu-bionic.md" }/>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</Tab>
|
||||
<Tab eventKey="other" title="Other...">
|
||||
<MarkdownLoader src={ "drivers/other.md" }/>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
</Tab>
|
||||
<Tab eventKey="windows" title="Windows">
|
||||
<MarkdownLoader src={ "drivers/windows.md" }/>
|
||||
</Tab>
|
||||
{/*<Tab eventKey="hardware" title="Hardware">
|
||||
<HardwareTable device={ this.props.device }/>
|
||||
</Tab>*/}
|
||||
</Tabs>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class Drivers extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
console.log("Drivers: " + props.device);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="Content OnScreen" id="Content">
|
||||
<ReactMarkdown renderers={{ code: CodeBlock }} className="Markdown" source="
|
||||
# Drivers for Intel graphics technology
|
||||
"/>
|
||||
{/*Select either the operating system you are looking for, or select Hardware to see a table of OS support.*/}
|
||||
<div id="MinBox">
|
||||
<OSPicker device={ this.props.device }/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Drivers;
|
||||
15
src/index.js
Normal file
15
src/index.js
Normal file
@ -0,0 +1,15 @@
|
||||
import React from "react";
|
||||
import { render } from "react-dom";
|
||||
import { BrowserRouter } from "react-router-dom";
|
||||
import App from "./App.js";
|
||||
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
console.log('DEVELOPMENT mode!');
|
||||
}
|
||||
|
||||
render(
|
||||
<BrowserRouter basename="/">
|
||||
<App/>
|
||||
</BrowserRouter>,
|
||||
document.getElementById("root")
|
||||
)
|
||||
296
src/intel-gpu-info.js
Normal file
296
src/intel-gpu-info.js
Normal file
@ -0,0 +1,296 @@
|
||||
"use strict";
|
||||
|
||||
/*
|
||||
* Device ID names derived from Mesa, which are licensed
|
||||
* under the terms of MIT license:
|
||||
*
|
||||
* https://gitlab.freedesktop.org/mesa/mesa/blob/master/docs/license.html
|
||||
*
|
||||
*/
|
||||
var intelGPUs=[];
|
||||
intelGPUs.push({id: 0x7121, family: "I810", name: "i8xx", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x7123, family: "I810_DC100", name: "i8xx", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x7125, family: "I810_E", name: "i8xx", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x1132, family: "I815", name: "i8xx", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x3577, family: "I830_M", name: "Intel(R) 830M", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x2562, family: "845_G", name: "Intel(R) 845G", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x3582, family: "I855_GM", name: "Intel(R) 852GM/855GM", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x2572, family: "I865_G", name: "Intel(R) 865G", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x2582, family: "I915_G", name: "Intel(R) 915G", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x258A, family: "E7221_G", name: "Intel(R) E7221G (i915)", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x2592, family: "I915_GM", name: "Intel(R) 915GM", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x2772, family: "I945_G", name: "Intel(R) 945G", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x27A2, family: "I945_GM", name: "Intel(R) 945GM", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x27AE, family: "I945_GME", name: "Intel(R) 945GME", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x29B2, family: "Q35_G", name: "Intel(R) Q35", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x29C2, family: "G33_G", name: "Intel(R) G33", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x29D2, family: "Q33_G", name: "Intel(R) Q33", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0xA011, family: "PNV_GM", name: "Intel(R) Pineview M", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0xA001, family: "PNV_G", name: "Intel(R) Pineview", gen: 0, gt: 0});
|
||||
intelGPUs.push({id: 0x29A2, family: "i965", name: "Intel(R) 965G", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2992, family: "i965", name: "Intel(R) 965Q", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2982, family: "i965", name: "Intel(R) 965G", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2972, family: "i965", name: "Intel(R) 946GZ", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2A02, family: "i965", name: "Intel(R) 965GM", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2A12, family: "i965", name: "Intel(R) 965GME/GLE", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2A42, family: "g4x", name: "Mobile Intel® GM45 Express Chipset", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2E02, family: "g4x", name: "Intel(R) Integrated Graphics Device", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2E12, family: "g4x", name: "Intel(R) Q45/Q43", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2E22, family: "g4x", name: "Intel(R) G45/G43", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2E32, family: "g4x", name: "Intel(R) G41", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2E42, family: "g4x", name: "Intel(R) B43", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x2E92, family: "g4x", name: "Intel(R) B43", gen: 4, gt: 0});
|
||||
intelGPUs.push({id: 0x0042, family: "ilk", name: "Intel(R) Ironlake Desktop", gen: 5, gt: 0});
|
||||
intelGPUs.push({id: 0x0046, family: "ilk", name: "Intel(R) Ironlake Mobile", gen: 5, gt: 0});
|
||||
intelGPUs.push({id: 0x0102, family: "snb_gt1", name: "Intel(R) Sandybridge Desktop", gen: 6, gt: 1});
|
||||
intelGPUs.push({id: 0x0112, family: "snb_gt2", name: "Intel(R) Sandybridge Desktop", gen: 6, gt: 2});
|
||||
intelGPUs.push({id: 0x0122, family: "snb_gt2", name: "Intel(R) Sandybridge Desktop", gen: 6, gt: 2});
|
||||
intelGPUs.push({id: 0x0106, family: "snb_gt1", name: "Intel(R) Sandybridge Mobile", gen: 6, gt: 1});
|
||||
intelGPUs.push({id: 0x0116, family: "snb_gt2", name: "Intel(R) Sandybridge Mobile", gen: 6, gt: 2});
|
||||
intelGPUs.push({id: 0x0126, family: "snb_gt2", name: "Intel(R) Sandybridge Mobile", gen: 6, gt: 2});
|
||||
intelGPUs.push({id: 0x010A, family: "snb_gt1", name: "Intel(R) Sandybridge Server", gen: 6, gt: 1});
|
||||
intelGPUs.push({id: 0x0152, family: "ivb_gt1", name: "Intel(R) Ivybridge Desktop", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0162, family: "ivb_gt2", name: "Intel(R) Ivybridge Desktop", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0156, family: "ivb_gt1", name: "Intel(R) Ivybridge Mobile", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0166, family: "ivb_gt2", name: "Intel(R) Ivybridge Mobile", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x015A, family: "ivb_gt1", name: "Intel(R) Ivybridge Server", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x016A, family: "ivb_gt2", name: "Intel(R) Ivybridge Server", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0402, family: "hsw_gt1", name: "Intel(R) Haswell Desktop", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0412, family: "hsw_gt2", name: "Intel(R) Haswell Desktop", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0422, family: "hsw_gt3", name: "Intel(R) Haswell Desktop", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0406, family: "hsw_gt1", name: "Intel(R) Haswell Mobile", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0416, family: "hsw_gt2", name: "Intel(R) Haswell Mobile", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0426, family: "hsw_gt3", name: "Intel(R) Haswell Mobile", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x040A, family: "hsw_gt1", name: "Intel(R) Haswell Server", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x041A, family: "hsw_gt2", name: "Intel(R) Haswell Server", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x042A, family: "hsw_gt3", name: "Intel(R) Haswell Server", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x040B, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x041B, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x042B, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x040E, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x041E, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x042E, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0C02, family: "hsw_gt1", name: "Intel(R) Haswell Desktop", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0C12, family: "hsw_gt2", name: "Intel(R) Haswell Desktop", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0C22, family: "hsw_gt3", name: "Intel(R) Haswell Desktop", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0C06, family: "hsw_gt1", name: "Intel(R) Haswell Mobile", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0C16, family: "hsw_gt2", name: "Intel(R) Haswell Mobile", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0C26, family: "hsw_gt3", name: "Intel(R) Haswell Mobile", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0C0A, family: "hsw_gt1", name: "Intel(R) Haswell Server", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0C1A, family: "hsw_gt2", name: "Intel(R) Haswell Server", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0C2A, family: "hsw_gt3", name: "Intel(R) Haswell Server", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0C0B, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0C1B, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0C2B, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0C0E, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0C1E, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0C2E, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0A02, family: "hsw_gt1", name: "Intel(R) Haswell Desktop", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0A12, family: "hsw_gt2", name: "Intel(R) Haswell Desktop", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0A22, family: "hsw_gt3", name: "Intel(R) Haswell Desktop", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0A06, family: "hsw_gt1", name: "Intel(R) Haswell Mobile", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0A16, family: "hsw_gt2", name: "Intel(R) Haswell Mobile", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0A26, family: "hsw_gt3", name: "Intel(R) Haswell Mobile", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0A0A, family: "hsw_gt1", name: "Intel(R) Haswell Server", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0A1A, family: "hsw_gt2", name: "Intel(R) Haswell Server", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0A2A, family: "hsw_gt3", name: "Intel(R) Haswell Server", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0A0B, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0A1B, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0A2B, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0A0E, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0A1E, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0A2E, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0D02, family: "hsw_gt1", name: "Intel(R) Haswell Desktop", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0D12, family: "hsw_gt2", name: "Intel(R) Haswell Desktop", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0D22, family: "hsw_gt3", name: "Intel(R) Haswell Desktop", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0D06, family: "hsw_gt1", name: "Intel(R) Haswell Mobile", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0D16, family: "hsw_gt2", name: "Intel(R) Haswell Mobile", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0D26, family: "hsw_gt3", name: "Intel(R) Haswell Mobile", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0D0A, family: "hsw_gt1", name: "Intel(R) Haswell Server", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0D1A, family: "hsw_gt2", name: "Intel(R) Haswell Server", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0D2A, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0D0B, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0D1B, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0D2B, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0D0E, family: "hsw_gt1", name: "Intel(R) Haswell", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0D1E, family: "hsw_gt2", name: "Intel(R) Haswell", gen: 7, gt: 2});
|
||||
intelGPUs.push({id: 0x0D2E, family: "hsw_gt3", name: "Intel(R) Haswell", gen: 7, gt: 3});
|
||||
intelGPUs.push({id: 0x0F31, family: "byt", name: "Intel(R) Bay Trail", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0F32, family: "byt", name: "Intel(R) Bay Trail", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0F33, family: "byt", name: "Intel(R) Bay Trail", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0157, family: "byt", name: "Intel(R) Bay Trail", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x0155, family: "byt", name: "Intel(R) Bay Trail", gen: 7, gt: 1});
|
||||
intelGPUs.push({id: 0x22B0, family: "chv", name: "Intel(R) HD Graphics (Cherrytrail)", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x22B1, family: "chv", name: "Intel(R) HD Graphics XXX (Braswell)", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x22B2, family: "chv", name: "Intel(R) HD Graphics (Cherryview)", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x22B3, family: "chv", name: "Intel(R) HD Graphics (Cherryview)", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x1602, family: "bdw_gt1", name: "Intel(R) Broadwell GT1", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x1606, family: "bdw_gt1", name: "Intel(R) Broadwell GT1", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x160A, family: "bdw_gt1", name: "Intel(R) Broadwell GT1", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x160B, family: "bdw_gt1", name: "Intel(R) Broadwell GT1", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x160D, family: "bdw_gt1", name: "Intel(R) Broadwell GT1", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x160E, family: "bdw_gt1", name: "Intel(R) Broadwell GT1", gen: 8, gt: 1});
|
||||
intelGPUs.push({id: 0x1612, family: "bdw_gt2", name: "Intel(R) HD Graphics 5600 (Broadwell GT2)", gen: 8, gt: 2});
|
||||
intelGPUs.push({id: 0x1616, family: "bdw_gt2", name: "Intel(R) HD Graphics 5500 (Broadwell GT2)", gen: 8, gt: 2});
|
||||
intelGPUs.push({id: 0x161A, family: "bdw_gt2", name: "Intel(R) Broadwell GT2", gen: 8, gt: 2});
|
||||
intelGPUs.push({id: 0x161B, family: "bdw_gt2", name: "Intel(R) Broadwell GT2", gen: 8, gt: 2});
|
||||
intelGPUs.push({id: 0x161D, family: "bdw_gt2", name: "Intel(R) Broadwell GT2", gen: 8, gt: 2});
|
||||
intelGPUs.push({id: 0x161E, family: "bdw_gt2", name: "Intel(R) HD Graphics 5300 (Broadwell GT2)", gen: 8, gt: 2});
|
||||
intelGPUs.push({id: 0x1622, family: "bdw_gt3", name: "Intel(R) Iris Pro 6200 (Broadwell GT3e)", gen: 8, gt: 3});
|
||||
intelGPUs.push({id: 0x1626, family: "bdw_gt3", name: "Intel(R) HD Graphics 6000 (Broadwell GT3)", gen: 8, gt: 3});
|
||||
intelGPUs.push({id: 0x162A, family: "bdw_gt3", name: "Intel(R) Iris Pro P6300 (Broadwell GT3e)", gen: 8, gt: 3});
|
||||
intelGPUs.push({id: 0x162B, family: "bdw_gt3", name: "Intel(R) Iris 6100 (Broadwell GT3)", gen: 8, gt: 3});
|
||||
intelGPUs.push({id: 0x162D, family: "bdw_gt3", name: "Intel(R) Broadwell GT3", gen: 8, gt: 3});
|
||||
intelGPUs.push({id: 0x162E, family: "bdw_gt3", name: "Intel(R) Broadwell GT3", gen: 8, gt: 3});
|
||||
intelGPUs.push({id: 0x1902, family: "skl_gt1", name: "Intel(R) HD Graphics 510 (Skylake GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x1906, family: "skl_gt1", name: "Intel(R) HD Graphics 510 (Skylake GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x190A, family: "skl_gt1", name: "Intel(R) Skylake GT1", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x190B, family: "skl_gt1", name: "Intel(R) HD Graphics 510 (Skylake GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x190E, family: "skl_gt1", name: "Intel(R) Skylake GT1", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x1912, family: "skl_gt2", name: "Intel(R) HD Graphics 530 (Skylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x1913, family: "skl_gt2", name: "Intel(R) Skylake GT2f", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x1915, family: "skl_gt2", name: "Intel(R) Skylake GT2f", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x1916, family: "skl_gt2", name: "Intel(R) HD Graphics 520 (Skylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x1917, family: "skl_gt2", name: "Intel(R) Skylake GT2f", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x191A, family: "skl_gt2", name: "Intel(R) Skylake GT2", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x191B, family: "skl_gt2", name: "Intel(R) HD Graphics 530 (Skylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x191D, family: "skl_gt2", name: "Intel(R) HD Graphics P530 (Skylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x191E, family: "skl_gt2", name: "Intel(R) HD Graphics 515 (Skylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x1921, family: "skl_gt2", name: "Intel(R) HD Graphics 520 (Skylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x1923, family: "skl_gt3", name: "Intel(R) Skylake GT3e", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x1926, family: "skl_gt3", name: "Intel(R) Iris Graphics 540 (Skylake GT3e)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x1927, family: "skl_gt3", name: "Intel(R) Iris Graphics 550 (Skylake GT3e)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x192A, family: "skl_gt4", name: "Intel(R) Skylake GT4", gen: 9, gt: 4});
|
||||
intelGPUs.push({id: 0x192B, family: "skl_gt3", name: "Intel(R) Iris Graphics 555 (Skylake GT3e)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x192D, family: "skl_gt3", name: "Intel(R) Iris Graphics P555 (Skylake GT3e)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x1932, family: "skl_gt4", name: "Intel(R) Iris Pro Graphics 580 (Skylake GT4e)", gen: 9, gt: 4});
|
||||
intelGPUs.push({id: 0x193A, family: "skl_gt4", name: "Intel(R) Iris Pro Graphics P580 (Skylake GT4e)", gen: 9, gt: 4});
|
||||
intelGPUs.push({id: 0x193B, family: "skl_gt4", name: "Intel(R) Iris Pro Graphics 580 (Skylake GT4e)", gen: 9, gt: 4});
|
||||
intelGPUs.push({id: 0x193D, family: "skl_gt4", name: "Intel(R) Iris Pro Graphics P580 (Skylake GT4e)", gen: 9, gt: 4});
|
||||
intelGPUs.push({id: 0x0A84, family: "bxt", name: "Intel(R) HD Graphics (Broxton)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x1A84, family: "bxt", name: "Intel(R) HD Graphics (Broxton)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x1A85, family: "bxt_2x6", name: "Intel(R) HD Graphics (Broxton 2x6)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5A84, family: "bxt", name: "Intel(R) HD Graphics 505 (Broxton)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5A85, family: "bxt_2x6", name: "Intel(R) HD Graphics 500 (Broxton 2x6)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5902, family: "kbl_gt1", name: "Intel(R) HD Graphics 610 (Kaby Lake GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5906, family: "kbl_gt1", name: "Intel(R) HD Graphics 610 (Kaby Lake GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x590A, family: "kbl_gt1", name: "Intel(R) Kabylake GT1", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5908, family: "kbl_gt1", name: "Intel(R) Kabylake GT1", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x590B, family: "kbl_gt1", name: "Intel(R) Kabylake GT1", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x590E, family: "kbl_gt1", name: "Intel(R) Kabylake GT1", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5913, family: "kbl_gt1_5", name: "Intel(R) Kabylake GT1.5", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5915, family: "kbl_gt1_5", name: "Intel(R) Kabylake GT1.5", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x5917, family: "kbl_gt2", name: "Intel(R) UHD Graphics 620 (Kabylake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x5912, family: "kbl_gt2", name: "Intel(R) HD Graphics 630 (Kaby Lake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x5916, family: "kbl_gt2", name: "Intel(R) HD Graphics 620 (Kaby Lake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x591A, family: "kbl_gt2", name: "Intel(R) HD Graphics P630 (Kaby Lake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x591B, family: "kbl_gt2", name: "Intel(R) HD Graphics 630 (Kaby Lake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x591D, family: "kbl_gt2", name: "Intel(R) HD Graphics P630 (Kaby Lake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x591E, family: "kbl_gt2", name: "Intel(R) HD Graphics 615 (Kaby Lake GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x5921, family: "kbl_gt2", name: "Intel(R) Kabylake GT2F", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x5923, family: "kbl_gt3", name: "Intel(R) Kabylake GT3", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x5926, family: "kbl_gt3", name: "Intel(R) Iris Plus Graphics 640 (Kaby Lake GT3e)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x5927, family: "kbl_gt3", name: "Intel(R) Iris Plus Graphics 650 (Kaby Lake GT3e)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x593B, family: "kbl_gt4", name: "Intel(R) Kabylake GT4", gen: 9, gt: 4});
|
||||
intelGPUs.push({id: 0x591C, family: "kbl_gt2", name: "Intel(R) Amber Lake (Kabylake) GT2", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x87C0, family: "kbl_gt2", name: "Intel(R) Amber Lake (Kabylake) GT2", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x87CA, family: "cfl_gt2", name: "Intel(R) Amber Lake (Coffeelake) GT2", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3184, family: "glk", name: "Intel(R) UHD Graphics 605 (Geminilake)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3185, family: "glk_2x6", name: "Intel(R) UHD Graphics 600 (Geminilake 2x6)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3E90, family: "cfl_gt1", name: "Intel(R) UHD Graphics 610 (Coffeelake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3E93, family: "cfl_gt1", name: "Intel(R) UHD Graphics 610 (Coffeelake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3E99, family: "cfl_gt1", name: "Intel(R) HD Graphics (Coffeelake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3E9C, family: "cfl_gt1", name: "Intel(R) HD Graphics (Coffeelake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3E91, family: "cfl_gt2", name: "Intel(R) UHD Graphics 630 (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3E92, family: "cfl_gt2", name: "Intel(R) UHD Graphics 630 (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3E96, family: "cfl_gt2", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3E98, family: "cfl_gt2", name: "Intel(R) UHD Graphics 630 (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3E9A, family: "cfl_gt2", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3E9B, family: "cfl_gt2", name: "Intel(R) UHD Graphics 630 (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3E94, family: "cfl_gt2", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3EA9, family: "cfl_gt2", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3EA5, family: "cfl_gt3", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT3)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x3EA6, family: "cfl_gt3", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT3)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x3EA7, family: "cfl_gt3", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT3)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x3EA8, family: "cfl_gt3", name: "Intel(R) HD Graphics (Coffeelake 3x8 GT3)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x3EA1, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Whiskey Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3EA4, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Whiskey Lake 3x8 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x3EA0, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Whiskey Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3EA3, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Whiskey Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x3EA2, family: "cfl_gt3", name: "Intel(R) UHD Graphics (Whiskey Lake 3x8 GT3)", gen: 9, gt: 3});
|
||||
intelGPUs.push({id: 0x9B21, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BA0, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BA2, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BA4, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BA5, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BA8, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BAA, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BAB, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9BAC, family: "cfl_gt1", name: "Intel(R) UHD Graphics (Comet Lake 2x6 GT1)", gen: 9, gt: 1});
|
||||
intelGPUs.push({id: 0x9B41, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BC0, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BC2, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BC4, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BC5, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BC6, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BC8, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BCA, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BCB, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BCC, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BE6, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x9BF6, family: "cfl_gt2", name: "Intel(R) UHD Graphics (Comet Lake 3x8 GT2)", gen: 9, gt: 2});
|
||||
intelGPUs.push({id: 0x5A49, family: "cnl_2x8", name: "Intel(R) HD Graphics (Cannonlake 2x8 GT0.5)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A4A, family: "cnl_2x8", name: "Intel(R) HD Graphics (Cannonlake 2x8 GT0.5)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A41, family: "cnl_3x8", name: "Intel(R) HD Graphics (Cannonlake 3x8 GT1)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A42, family: "cnl_3x8", name: "Intel(R) HD Graphics (Cannonlake 3x8 GT1)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A44, family: "cnl_3x8", name: "Intel(R) HD Graphics (Cannonlake 3x8 GT1)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A59, family: "cnl_4x8", name: "Intel(R) HD Graphics (Cannonlake 4x8 GT1.5)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A5A, family: "cnl_4x8", name: "Intel(R) HD Graphics (Cannonlake 4x8 GT1.5)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A5C, family: "cnl_4x8", name: "Intel(R) HD Graphics (Cannonlake 4x8 GT1.5)", gen: 10, gt: 1});
|
||||
intelGPUs.push({id: 0x5A50, family: "cnl_5x8", name: "Intel(R) HD Graphics (Cannonlake 5x8 GT2)", gen: 10, gt: 2});
|
||||
intelGPUs.push({id: 0x5A51, family: "cnl_5x8", name: "Intel(R) HD Graphics (Cannonlake 5x8 GT2)", gen: 10, gt: 2});
|
||||
intelGPUs.push({id: 0x5A52, family: "cnl_5x8", name: "Intel(R) HD Graphics (Cannonlake 5x8 GT2)", gen: 10, gt: 2});
|
||||
intelGPUs.push({id: 0x5A54, family: "cnl_5x8", name: "Intel(R) HD Graphics (Cannonlake 5x8 GT2)", gen: 10, gt: 2});
|
||||
intelGPUs.push({id: 0x8A50, family: "icl_8x8", name: "Intel(R) HD Graphics (Ice Lake 8x8 GT2)", gen: 11, gt: 2});
|
||||
intelGPUs.push({id: 0x8A51, family: "icl_8x8", name: "Intel(R) Iris(R) Plus Graphics (Ice Lake 8x8 GT2)", gen: 11, gt: 2});
|
||||
intelGPUs.push({id: 0x8A52, family: "icl_8x8", name: "Intel(R) Iris(R) Plus Graphics (Ice Lake 8x8 GT2)", gen: 11, gt: 2});
|
||||
intelGPUs.push({id: 0x8A53, family: "icl_8x8", name: "Intel(R) Iris(R) Plus Graphics (Ice Lake 8x8 GT2)", gen: 11, gt: 2});
|
||||
intelGPUs.push({id: 0x8A54, family: "icl_6x8", name: "Intel(R) Iris(R) Plus Graphics (Ice Lake 6x8 GT1.5)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A56, family: "icl_4x8", name: "Intel(R) UHD Graphics (Ice Lake 4x8 GT1)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A57, family: "icl_6x8", name: "Intel(R) HD Graphics (Ice Lake 6x8 GT1.5)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A58, family: "icl_4x8", name: "Intel(R) UHD Graphics (Ice Lake 4x8 GT1)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A59, family: "icl_6x8", name: "Intel(R) HD Graphics (Ice Lake 6x8 GT1.5)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A5A, family: "icl_6x8", name: "Intel(R) Iris(R) Plus Graphics (Ice Lake 6x8 GT1.5)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A5B, family: "icl_4x8", name: "Intel(R) HD Graphics (Ice Lake 4x8 GT1)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A5C, family: "icl_6x8", name: "Intel(R) Iris(R) Plus Graphics (Ice Lake 6x8 GT1.5)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A5D, family: "icl_4x8", name: "Intel(R) HD Graphics (Ice Lake 4x8 GT1)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x8A71, family: "icl_1x8", name: "Intel(R) HD Graphics (Ice Lake 1x8 GT0.5)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4500, family: "ehl_4x8", name: "Intel(R) HD Graphics (Elkhart Lake 4x8)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4571, family: "ehl_4x8", name: "Intel(R) HD Graphics (Elkhart Lake 4x8)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4551, family: "ehl_4x4", name: "Intel(R) HD Graphics (Elkhart Lake 4x4)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4541, family: "ehl_2x4", name: "Intel(R) HD Graphics (Elkhart Lake 2x4)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4E51, family: "ehl_4x4", name: "Intel(R) HD Graphics (Jasper Lake 4x4)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4E61, family: "ehl_4x6", name: "Intel(R) HD Graphics (Jasper Lake 4x6)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x4E71, family: "ehl_4x8", name: "Intel(R) HD Graphics (Jasper Lake 4x8)", gen: 11, gt: 1});
|
||||
intelGPUs.push({id: 0x9A40, family: "tgl_1x6x16", name: "Intel(R) Graphics (TGL GT2)", gen: 12, gt: 2});
|
||||
intelGPUs.push({id: 0x9A49, family: "tgl_1x6x16", name: "Intel(R) Graphics (TGL GT2)", gen: 12, gt: 2});
|
||||
intelGPUs.push({id: 0x9A59, family: "tgl_1x6x16", name: "Intel(R) Graphics (TGL GT2)", gen: 12, gt: 2});
|
||||
intelGPUs.push({id: 0x9A60, family: "tgl_1x2x16", name: "Intel(R) Graphics (TGL GT1)", gen: 12, gt: 1});
|
||||
intelGPUs.push({id: 0x9A68, family: "tgl_1x2x16", name: "Intel(R) Graphics (TGL GT1)", gen: 12, gt: 1});
|
||||
intelGPUs.push({id: 0x9A70, family: "tgl_1x2x16", name: "Intel(R) Graphics (TGL GT1)", gen: 12, gt: 1});
|
||||
intelGPUs.push({id: 0x9A78, family: "tgl_1x2x16", name: "Intel(R) Graphics (TGL GT1)", gen: 12, gt: 1});
|
||||
|
||||
function lookupIntelGPU(id) {
|
||||
var index = intelGPUs.findIndex(function(device) {
|
||||
return (id == device.id);
|
||||
});
|
||||
if (index) {
|
||||
return intelGPUs[index];
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export {
|
||||
lookupIntelGPU,
|
||||
intelGPUs
|
||||
};
|
||||
61
src/intel.js
Normal file
61
src/intel.js
Normal file
@ -0,0 +1,61 @@
|
||||
"use strict";
|
||||
|
||||
/* Convert a Date object to a work-week #, following Intel's
|
||||
* methodology with the exception that we list WW53'(xx) for
|
||||
* December dates that would be in WW01'(xx+1) */
|
||||
function intelDateToWW(date) {
|
||||
if (!(date instanceof Date)) {
|
||||
return "N/A: " + date;
|
||||
}
|
||||
var jan1 = new Date(date);
|
||||
jan1.setMonth(0, 1);
|
||||
var day = jan1.getDay();
|
||||
/* 0 = Sunday */
|
||||
|
||||
/* Determine the start of WW01 in # of seconds since
|
||||
* Jan 1, 1970 00:00 GMT */
|
||||
var time = (jan1.getTime() / 1000) - (24 * 60 * 60) * (day + 1);
|
||||
|
||||
/* Determine how far into the year the requested time
|
||||
* is with WW01 00:00 as the base. */
|
||||
var delta = (date.getTime() / 1000) - time;
|
||||
|
||||
var weeks = Math.ceil(delta / (24 * 60 * 60 * 7)),
|
||||
year = date.getFullYear();
|
||||
|
||||
if (weeks > 52) {
|
||||
weeks -= 52;
|
||||
year++;
|
||||
}
|
||||
|
||||
return "WW" + (weeks < 10 ? "0" : "") + weeks + "'" + (year % 100);
|
||||
}
|
||||
|
||||
/* Convert an Intel WW to the date of Friday of that work week */
|
||||
function intelWWToDate(workweek, startOfWeek) {
|
||||
if (!/^ww/i.exec(workweek)) {
|
||||
workweek = "ww" + workweek;
|
||||
}
|
||||
/* 1 2 3 */
|
||||
var parts = ("" + workweek).match(/^ww([0-9]+)\s*('([0-9]+))?$/i);
|
||||
if (!parts) {
|
||||
return "N/A: " + workweek;
|
||||
}
|
||||
var year = parseInt(parts[3] || new Date().getFullYear()),
|
||||
week = parseInt(parts[1].replace(/^0/, ""));
|
||||
if (year < 1000) {
|
||||
year += 2000;
|
||||
}
|
||||
|
||||
var jan1 = new Date(year, 0, 1, 0, 0, 0, 0);
|
||||
|
||||
/* Rebase the returned date to Friday in the target WW */
|
||||
jan1.setDate((week * 7) - (jan1.getDay() + (startOfWeek ? 5 : 1)));
|
||||
|
||||
return jan1;
|
||||
}
|
||||
|
||||
export default {
|
||||
intelDateToWW,
|
||||
intelWWToDate
|
||||
};
|
||||
49
src/internal.css
Normal file
49
src/internal.css
Normal file
@ -0,0 +1,49 @@
|
||||
#technologies-content .tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-top-color: transparent;
|
||||
border-bottom-left-radius: 0.25em;
|
||||
border-bottom-right-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.tab-content p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.tab-content p:last-child {
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
.tab-content .Markdown table {
|
||||
min-width: 75%;
|
||||
margin: 1em 0 1em 0;
|
||||
}
|
||||
|
||||
.tab-content .Markdown table thead {
|
||||
background-color: #555;
|
||||
color: white;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tab-content .Markdown h1,
|
||||
.tab-content .Markdown h2,
|
||||
.tab-content .Markdown h3 {
|
||||
margin-top: 1em;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.tab-content .Markdown h3 {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.nav.nav-tabs {
|
||||
margin-top: 1em;
|
||||
}
|
||||
82
src/internal.js
Normal file
82
src/internal.js
Normal file
@ -0,0 +1,82 @@
|
||||
/* App starts here */
|
||||
import React, { useState, useEffect } from "react";
|
||||
import Markdown from "react-markdown/with-html";
|
||||
import Nav from "react-bootstrap/Nav";
|
||||
import Col from "react-bootstrap/Col";
|
||||
import Row from "react-bootstrap/Row";
|
||||
import Tab from "react-bootstrap/Tab";
|
||||
import MarkdownLoader from "./markdown-loader.js";
|
||||
|
||||
import "./internal.css";
|
||||
|
||||
class TopicsPicker extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<Tab.Container id="topics-table" defaultActiveKey="running-internal">
|
||||
<Row>
|
||||
<Col sm={3}>
|
||||
<Nav variant="pills" className="flex-column">
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="running-internal">Running internal...</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="what-is-agama">What is Agama?</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="os-support-dates">OS Support Dates</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="zero-to-hero">'Web: Zero to Hero' slides</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="additional-info">Additional information</Nav.Link>
|
||||
</Nav.Item>
|
||||
</Nav>
|
||||
</Col>
|
||||
|
||||
<Col sm={9} id="topics-content">
|
||||
<Tab.Content>
|
||||
<Tab.Pane eventKey="running-internal">
|
||||
<MarkdownLoader src="topics/running-internal.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="what-is-agama">
|
||||
<MarkdownLoader src="topics/what-is-agama.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="os-support-dates">
|
||||
<MarkdownLoader src="topics/os-support-dates.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="zero-to-hero">
|
||||
<MarkdownLoader src="topics/zero-to-hero.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="additional-info">
|
||||
<MarkdownLoader src="topics/support.md"/>
|
||||
</Tab.Pane>
|
||||
</Tab.Content>
|
||||
</Col>
|
||||
</Row>
|
||||
</Tab.Container>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class Internal extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="Content OnScreen" id="Content">
|
||||
<div id="MinBox">
|
||||
<TopicsPicker/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Internal;
|
||||
83
src/markdown-loader.js
Executable file
83
src/markdown-loader.js
Executable file
@ -0,0 +1,83 @@
|
||||
/* App starts here */
|
||||
import React from "react";
|
||||
import ReactMarkdown from "react-markdown/with-html";
|
||||
import CodeBlock from "./CodeBlock";
|
||||
|
||||
class MarkdownLoader extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state= {
|
||||
src: props.src,
|
||||
loaded: "",
|
||||
loading: "",
|
||||
markdown: props.markdown ? props.markdown : "Loading..."
|
||||
};
|
||||
this.loadContent = this.loadContent.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.loadContent();
|
||||
}
|
||||
|
||||
componentDidUpdate(previous) {
|
||||
if (this.props.src != previous.src) {
|
||||
this.state.src = this.props.src;
|
||||
this.loadContent();
|
||||
}
|
||||
}
|
||||
|
||||
loadContent() {
|
||||
if (!this.state.src) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("Loading " + this.state.src, this.props.src);
|
||||
|
||||
this.state.loading = this.state.src;
|
||||
fetch(this.state.src.match(/^https?:\/\//) ? this.state.src : "./docs/" + this.state.src)
|
||||
.then((response) => {
|
||||
if (response.ok) {
|
||||
return response.text();
|
||||
} else {
|
||||
throw Error(response.statusText)
|
||||
}
|
||||
}).then((result) => {
|
||||
/* If 'result' doesn't already contain a link to the GitLab page, add it
|
||||
* to the end of the content. */
|
||||
this.setState({
|
||||
loading: null,
|
||||
loaded: this.state.loading,
|
||||
markdown: result
|
||||
});
|
||||
}, (error) => {
|
||||
this.setState({
|
||||
markdown: this.props.fallback ? this.props.fallback : [
|
||||
"# Error loading " + this.state.src,
|
||||
"",
|
||||
error.message
|
||||
].join("\n")
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const isDebug = window.location.search.match(/debug(=(y|t|1).*)?/);
|
||||
return (
|
||||
<div className="MarkdownLoader">
|
||||
<ReactMarkdown
|
||||
className="Markdown"
|
||||
escapeHtml={false}
|
||||
source={ this.state.markdown }
|
||||
renderers={{ code: CodeBlock }}
|
||||
/>
|
||||
{ (isDebug) &&
|
||||
<div className='gitlab-banner'>
|
||||
<a target="_new" href={"https://gitlab.devtools.intel.com/vtt/sws/osgc/agama-website/edit/master/docs/" + this.state.src }>edit on gitlab</a>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default MarkdownLoader;
|
||||
200
src/modest.css
Normal file
200
src/modest.css
Normal file
@ -0,0 +1,200 @@
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
background: transparent !important;
|
||||
color: #000 !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: Menlo, Monaco, "Courier New", monospace;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: .5rem;
|
||||
line-height: 1.25;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #3498db;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: #2980b9;
|
||||
}
|
||||
|
||||
.modest-no-decoration {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 32rem) and (max-width: 48rem) {
|
||||
html {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
.modest-p {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.3rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
.modest-h1,
|
||||
h2,
|
||||
.modest-h2,
|
||||
h3,
|
||||
.modest-h3,
|
||||
h4,
|
||||
.modest-h4 {
|
||||
margin: 1.414rem 0 .5rem;
|
||||
font-weight: inherit;
|
||||
line-height: 1.42;
|
||||
}
|
||||
|
||||
h1,
|
||||
.modest-h1 {
|
||||
margin-top: 0;
|
||||
font-size: 3.998rem;
|
||||
}
|
||||
|
||||
h2,
|
||||
.modest-h2 {
|
||||
font-size: 2.827rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
.modest-h3 {
|
||||
font-size: 1.999rem;
|
||||
}
|
||||
|
||||
h4,
|
||||
.modest-h4 {
|
||||
font-size: 1.414rem;
|
||||
}
|
||||
|
||||
h5,
|
||||
.modest-h5 {
|
||||
font-size: 1.121rem;
|
||||
}
|
||||
|
||||
h6,
|
||||
.modest-h6 {
|
||||
font-size: .88rem;
|
||||
}
|
||||
|
||||
small,
|
||||
.modest-small {
|
||||
font-size: .707em;
|
||||
}
|
||||
|
||||
/* https://github.com/mrmrs/fluidity */
|
||||
|
||||
img,
|
||||
canvas,
|
||||
iframe,
|
||||
video,
|
||||
svg,
|
||||
select,
|
||||
textarea {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700);
|
||||
|
||||
@import url(https://fonts.googleapis.com/css?family=Arimo:700,700italic);
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: Arimo, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
border-bottom: 2px solid #fafafa;
|
||||
margin-bottom: 1.15rem;
|
||||
padding-bottom: .5rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 8px solid #fafafa;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
6
src/releases.css
Executable file
6
src/releases.css
Executable file
@ -0,0 +1,6 @@
|
||||
#releases-content .tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
73
src/releases.js
Executable file
73
src/releases.js
Executable file
@ -0,0 +1,73 @@
|
||||
/* App starts here */
|
||||
import React, { useState, useEffect } from "react";
|
||||
import Markdown from "react-markdown/with-html";
|
||||
import Nav from "react-bootstrap/Nav";
|
||||
import Col from "react-bootstrap/Col";
|
||||
import Row from "react-bootstrap/Row";
|
||||
import Tab from "react-bootstrap/Tab";
|
||||
import MarkdownLoader from "./markdown-loader.js";
|
||||
|
||||
import "./releases.css";
|
||||
|
||||
class ReleasePicker extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<Tab.Container id="releases-table" defaultActiveKey="20q1.06">
|
||||
<Row>
|
||||
<Col sm={3}>
|
||||
<Nav variant="pills" className="flex-column">
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="20q1.06">2020-02-07</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="19q4.52">2019-12-14</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="19q4">2019-11-11</Nav.Link>
|
||||
</Nav.Item>
|
||||
</Nav>
|
||||
</Col>
|
||||
|
||||
<Col sm={9} id="releases-content">
|
||||
<Tab.Content>
|
||||
<Tab.Pane eventKey="20q1.06">
|
||||
<MarkdownLoader src="releases/releases-20Q1.06.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="19q4.52">
|
||||
<MarkdownLoader src="releases/releases-19Q4.52.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="19q4">
|
||||
<MarkdownLoader src="releases/releases-19Q4.md"/>
|
||||
</Tab.Pane>
|
||||
</Tab.Content>
|
||||
</Col>
|
||||
</Row>
|
||||
</Tab.Container>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class Releases extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="Content OnScreen" id="Content">
|
||||
<div id="MinBox">
|
||||
<Markdown source="
|
||||
Select the release below for information about the packages published.
|
||||
"/>
|
||||
<ReleasePicker/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Releases;
|
||||
197
src/solutions.css
Normal file
197
src/solutions.css
Normal file
@ -0,0 +1,197 @@
|
||||
.solution {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 90ex;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.solution-details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.solution-details .solution-categories {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.solution .Markdown {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
.solution-field {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.solution-field :first-child {
|
||||
width: 10em;
|
||||
}
|
||||
|
||||
.solution-field :last-child {
|
||||
flex-grow: 1
|
||||
}
|
||||
|
||||
.solution-back {
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
line-height: 1.1em;
|
||||
height: 1.1em;
|
||||
margin-bottom: 0.5em;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.solution-back:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.solutions-picker {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.solution-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 12em;
|
||||
height: 8em;
|
||||
border: 1px solid black;
|
||||
margin: 1em;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.solution-marque {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.solution-clone .Markdown {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.solution-overview {
|
||||
flex-grow: 10;
|
||||
}
|
||||
|
||||
.solution-image {
|
||||
flex-grow: 1;
|
||||
width: 10em;
|
||||
height: 6em;
|
||||
background: white;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left 50%;
|
||||
}
|
||||
|
||||
.solution-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 5em;
|
||||
padding: 0.5em;
|
||||
overflow: hidden;
|
||||
font-size: 0.8em;
|
||||
line-height: 1em;
|
||||
}
|
||||
|
||||
.solution-title {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
padding-bottom: 0.25em;
|
||||
}
|
||||
|
||||
|
||||
.solution-summary {
|
||||
flex-grow: 1;
|
||||
font-size: 0.9em;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.solution-card:hover {
|
||||
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.solution-category {
|
||||
border: 3px solid green;
|
||||
}
|
||||
|
||||
.solution-category-tab > .nav-item {
|
||||
display: flex;
|
||||
/*
|
||||
width: 8em;
|
||||
height: 8em;
|
||||
*/
|
||||
text-align: left;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
background-size: auto 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0.5em 0.5em;
|
||||
padding-left: 2em;
|
||||
min-width: 8em;
|
||||
}
|
||||
|
||||
.solution-category-tab .nav-item[data-rb-event-key=media] {
|
||||
background-image: url(../assets/solutions-media.png);
|
||||
}
|
||||
|
||||
.solution-category-tab .nav-item[data-rb-event-key=compute] {
|
||||
background-image: url(../assets/solutions-compute.png);
|
||||
}
|
||||
|
||||
.solution-category-tab .nav-item[data-rb-event-key=render] {
|
||||
background-image: url(../assets/solutions-render.png);
|
||||
}
|
||||
|
||||
.solution-category-tab .nav-item[data-rb-event-key=all] {
|
||||
background-image: url(../assets/solutions-all.png);
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-top-color: transparent;
|
||||
border-bottom-left-radius: 0.25em;
|
||||
border-bottom-right-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
p:last-child {
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
.Markdown table {
|
||||
min-width: 75%;
|
||||
margin: 1em 0 1em 0;
|
||||
}
|
||||
|
||||
.Markdown table thead {
|
||||
background-color: #555;
|
||||
color: white;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.Markdown h1,
|
||||
.Markdown h2,
|
||||
.Markdown h3 {
|
||||
margin-top: 1em;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.Markdown h3 {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.nav.nav-tabs {
|
||||
margin-top: 1em;
|
||||
}
|
||||
247
src/solutions.js
Normal file
247
src/solutions.js
Normal file
@ -0,0 +1,247 @@
|
||||
/* App starts here */
|
||||
import React, { useState, useEffect } from "react";
|
||||
import ReactMarkdown from "react-markdown/with-html";
|
||||
import CodeBlock from "./CodeBlock";
|
||||
import MarkdownLoader from "./markdown-loader";
|
||||
import Tab from "react-bootstrap/Tab";
|
||||
import Tabs from "react-bootstrap/Tabs";
|
||||
import Col from "react-bootstrap/Col";
|
||||
import Row from "react-bootstrap/Row";
|
||||
|
||||
import "./solutions.css";
|
||||
|
||||
const solutions = [ {
|
||||
category: "HPC",
|
||||
title: "intel-hpc-bench",
|
||||
asset: "hpc.png",
|
||||
summary: "HPC Benchmark workloads",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-hcp-bench"
|
||||
}, {
|
||||
category: "AI/ML",
|
||||
title: "intel-pytorch",
|
||||
asset: "intel-pytorch.png",
|
||||
summary: "basic pytorch container",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-pytorch"
|
||||
},/*
|
||||
{
|
||||
category: "compute",
|
||||
title: "intel-efficientnet",
|
||||
summary: "No summary provided",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-efficientnet"
|
||||
},
|
||||
{
|
||||
category: "compute",
|
||||
title: "intel-deepspeech",
|
||||
summary: "Container featuring the Mozilla DeepSpeech speech-to-text implementation in tensorflow.",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-deepspeech"
|
||||
},*/
|
||||
/*{
|
||||
category: "compute",
|
||||
title: "intel-deepvoice3",
|
||||
summary: "Deepvoice3 text to speech container using Intel GPU and deepspeech3 pytorch.",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-deepvoice3"
|
||||
},*/
|
||||
/*{
|
||||
category: "compute",
|
||||
title: "intel-rl",
|
||||
summary: "Intel reinforcement learning container",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-rl"
|
||||
},*/
|
||||
{
|
||||
category: "AI/ML,HPC",
|
||||
title: "intel-compute-clinfo",
|
||||
asset: "intel-compute-clinfo.png",
|
||||
summary: "Basic container installing OpenCL runtime; testing packages",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-compute-clinfo"
|
||||
},
|
||||
{
|
||||
category: "Media",
|
||||
title: "intel-media-ffmpeg",
|
||||
asset: "intel-media-ffmpeg.svg",
|
||||
summary: "Perform various media tests using ffmpeg",
|
||||
git: "https://gitlab.devtools.intel.com/vtt/sws/osgc/solutions/intel-media-ffmpeg"
|
||||
}
|
||||
];
|
||||
|
||||
class CategoryPicker extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
console.log("CategoryPicker");
|
||||
this.clearFilter = this.clearFilter.bind(this);
|
||||
}
|
||||
|
||||
clearFilter() {
|
||||
if (window.clearFilter) {
|
||||
window.clearFilter();
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const categories = [];
|
||||
solutions.forEach(solution => {
|
||||
solution.category.split(",").forEach(category => {
|
||||
if (categories.indexOf(category) != -1) {
|
||||
return;
|
||||
}
|
||||
categories.push(category);
|
||||
})
|
||||
});
|
||||
const tabs = categories.sort().map(category => (
|
||||
<Tab eventKey={category} key={category} title={category.replace(/^(.)/, "$1".toUpperCase())}>
|
||||
<SolutionsPicker onSolutionChanged={this.props.onSolutionChanged} filter={category}/>
|
||||
</Tab>
|
||||
));
|
||||
return (
|
||||
<Tabs id="solution-category-table" className="solution-category-tab" >
|
||||
{ tabs }
|
||||
<Tab eventKey="all" title="All" key="all">
|
||||
<SolutionsPicker onSolutionChanged={this.props.onSolutionChanged} filter="*"/>
|
||||
</Tab>
|
||||
<Tab eventKey="about" title="About" key="about">
|
||||
<MarkdownLoader className="Markdown" src="solutions/about.md"/>
|
||||
</Tab>
|
||||
</Tabs>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class SolutionsPicker extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
console.log("SolutionsPicker");
|
||||
}
|
||||
|
||||
render () {
|
||||
const solutionsContent = solutions
|
||||
.filter(solution => this.props.filter == "*" || solution.category == this.props.filter)
|
||||
.sort((A, B) => { return A.title.localeCompare(B.title) })
|
||||
.map((solution, i) => {
|
||||
return (
|
||||
<div key={"solution-" + i} className="solution-card"
|
||||
onClick={this.props.onSolutionChanged.bind(this, solution)}>
|
||||
<div className="solution-image"
|
||||
style={{backgroundImage:"url(./docs/solutions/" + solution.asset + ")"}}>
|
||||
</div>
|
||||
<div className="solution-info">
|
||||
<div className="solution-title">{solution.title}</div>
|
||||
<div className="solution-summary">{solution.summary}</div>
|
||||
</div>
|
||||
</div>
|
||||
)});
|
||||
|
||||
return (
|
||||
<div className="solutions-picker">
|
||||
{ solutionsContent }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class Solution extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
console.log("Solution: ", this.props.solution);
|
||||
}
|
||||
|
||||
formatString(string) {
|
||||
if (/^https?:\/\//.exec(string)) {
|
||||
return (<a href={string}>{string}</a>);
|
||||
} else {
|
||||
return string;
|
||||
}
|
||||
}
|
||||
|
||||
solutionContent(solution) {
|
||||
let markdownPath = "", basename = "";
|
||||
if (solution.git) {
|
||||
basename = solution.git.replace(/^.*\/([^/]+)$/, "$1");
|
||||
if (basename) {
|
||||
markdownPath = "solutions/" + basename + ".md";
|
||||
}
|
||||
}
|
||||
if (!basename) {
|
||||
return (<ReactMarkdown
|
||||
className="Markdown"
|
||||
escapeHtml={false}
|
||||
source="# git path must be provided"
|
||||
renderers={{ code: CodeBlock }} />);
|
||||
}
|
||||
return (<MarkdownLoader src={markdownPath} fallback={
|
||||
"# " + solution.title + " \n" +
|
||||
"Solution instructions not found. You can [file an issue](https://gitlab.devtools.intel.com/vtt/sws/osgc/agama-website/issues/new?" +
|
||||
"issue[title]=Content%20needed%20for%20docs%2F" + markdownPath +") to request it be created."
|
||||
}/>);
|
||||
}
|
||||
|
||||
render() {
|
||||
const solution = this.props.solution;
|
||||
|
||||
return (
|
||||
<div className="solution">
|
||||
<div className="solution-back" onClick={this.props.onBack}>Back</div>
|
||||
<div className="solution-details">
|
||||
<div className="solution-marque">
|
||||
<div className="solution-image"
|
||||
style={{backgroundImage:"url(./docs/solutions/" + solution.asset + ")"}}></div>
|
||||
<div className="solution-overview">
|
||||
<div className="solution-categories">{solution.category}</div>
|
||||
<div className="solution-title">{solution.title}</div>
|
||||
<div className="solution-summary">{solution.summary}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="solution-clone">
|
||||
<ReactMarkdown
|
||||
className="Markdown"
|
||||
renderers={{ code: CodeBlock }}
|
||||
source={[
|
||||
"## Clone",
|
||||
"```bash",
|
||||
"git clone " + solution.git,
|
||||
"```",
|
||||
"## Pull",
|
||||
"```bash",
|
||||
"docker pull amr-registry.caas.intel.com/vtt-osgc/solutions/" + solution.title,
|
||||
"```"
|
||||
].join("\n")}/>
|
||||
</div>
|
||||
</div>
|
||||
{ this.solutionContent(this.props.solution) }
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class Solutions extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
console.log("Solutions");
|
||||
this.state = {
|
||||
activeSolution: null
|
||||
};
|
||||
this.onSolutionChanged = this.onSolutionChanged.bind(this);
|
||||
}
|
||||
|
||||
onSolutionChanged(solution) {
|
||||
console.log("onSolutionChanged: " + solution);
|
||||
this.setState({
|
||||
activeSolution: solution
|
||||
});
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="Content OnScreen" id="Content">
|
||||
<div id="MinBox">
|
||||
<div>This site is a work in progress and under active development.</div>
|
||||
{
|
||||
this.state.activeSolution ?
|
||||
<Solution solution={this.state.activeSolution} onBack={this.onSolutionChanged.bind(this, null)}/> :
|
||||
<CategoryPicker onSolutionChanged={this.onSolutionChanged}/>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Solutions;
|
||||
49
src/technologies.css
Normal file
49
src/technologies.css
Normal file
@ -0,0 +1,49 @@
|
||||
#technologies-content .tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
border: 1px solid #d0d0d0;
|
||||
border-top-color: transparent;
|
||||
border-bottom-left-radius: 0.25em;
|
||||
border-bottom-right-radius: 0.25em;
|
||||
padding: 1em;
|
||||
padding-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.tab-content p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.tab-content p:last-child {
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
.tab-content .Markdown table {
|
||||
min-width: 75%;
|
||||
margin: 1em 0 1em 0;
|
||||
}
|
||||
|
||||
.tab-content .Markdown table thead {
|
||||
background-color: #555;
|
||||
color: white;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tab-content .Markdown h1,
|
||||
.tab-content .Markdown h2,
|
||||
.tab-content .Markdown h3 {
|
||||
margin-top: 1em;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.tab-content .Markdown h3 {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.nav.nav-tabs {
|
||||
margin-top: 1em;
|
||||
}
|
||||
90
src/technologies.js
Normal file
90
src/technologies.js
Normal file
@ -0,0 +1,90 @@
|
||||
/* App starts here */
|
||||
import React, { useState, useEffect } from "react";
|
||||
import Markdown from "react-markdown/with-html";
|
||||
import Nav from "react-bootstrap/Nav";
|
||||
import Col from "react-bootstrap/Col";
|
||||
import Row from "react-bootstrap/Row";
|
||||
import Tab from "react-bootstrap/Tab";
|
||||
import MarkdownLoader from "./markdown-loader.js";
|
||||
|
||||
import "./technologies.css";
|
||||
|
||||
class TechnologyPicker extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<Tab.Container id="technologies-table" defaultActiveKey="level-zero">
|
||||
<Row>
|
||||
<Col sm={3}>
|
||||
<Nav variant="pills" className="flex-column">
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="level-zero">Level-Zero</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="mediadriver">Media Driver</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="mediasdk">Media SDK</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="mesa">Mesa</Nav.Link>
|
||||
</Nav.Item>
|
||||
<Nav.Item>
|
||||
<Nav.Link eventKey="opencl">Open CL</Nav.Link>
|
||||
</Nav.Item>
|
||||
</Nav>
|
||||
</Col>
|
||||
|
||||
<Col sm={9} id="technologies-content">
|
||||
<Tab.Content>
|
||||
<Tab.Pane eventKey="default">
|
||||
<Markdown className="Markdown" source={[
|
||||
"# Technologies",
|
||||
"",
|
||||
"Providing the latest innovations on Intel graphics hardware requires coordination",
|
||||
"with several projects."
|
||||
].join("\n")}/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="level-zero">
|
||||
<MarkdownLoader src="technologies/level-zero.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="mediasdk">
|
||||
<MarkdownLoader src="technologies/mediasdk.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="mediadriver">
|
||||
<MarkdownLoader src="technologies/mediadriver.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="mesa">
|
||||
<MarkdownLoader src="technologies/mesa.md"/>
|
||||
</Tab.Pane>
|
||||
<Tab.Pane eventKey="opencl">
|
||||
<MarkdownLoader src="technologies/opencl.md"/>
|
||||
</Tab.Pane>
|
||||
</Tab.Content>
|
||||
</Col>
|
||||
</Row>
|
||||
</Tab.Container>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class Technologies extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="Content OnScreen" id="Content">
|
||||
<div id="MinBox">
|
||||
<TechnologyPicker/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Technologies;
|
||||
33
webpack.common.js
Normal file
33
webpack.common.js
Normal file
@ -0,0 +1,33 @@
|
||||
const path = require("path");
|
||||
const webpack = require("webpack");
|
||||
|
||||
module.exports = {
|
||||
entry: "./src/index.js",
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.(js|jsx)$/,
|
||||
exclude: /(node_modules|bower_components)/,
|
||||
loader: "babel-loader",
|
||||
options: { presets: ["@babel/env"] }
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: ["style-loader", "css-loader"]
|
||||
},
|
||||
{
|
||||
test: /\.(png|svg|jpg|md)$/,
|
||||
use: [ "file-loader" ]
|
||||
}
|
||||
]
|
||||
},
|
||||
resolve: {
|
||||
extensions: ["*", ".js", ".jsx"]
|
||||
},
|
||||
output: {
|
||||
path: path.resolve(__dirname, "dist/"),
|
||||
publicPath: "./dist/",
|
||||
filename: "bundle.js"
|
||||
}
|
||||
};
|
||||
|
||||
18
webpack.dev.js
Normal file
18
webpack.dev.js
Normal file
@ -0,0 +1,18 @@
|
||||
const path = require("path");
|
||||
const merge = require('webpack-merge')
|
||||
const common = require('./webpack.common.js');
|
||||
const webpack = require('webpack');
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: "development",
|
||||
devServer: {
|
||||
contentBase: path.join(__dirname, "/"),
|
||||
port: 8008,
|
||||
publicPath: "http://localhost:8008/dist/",
|
||||
hotOnly: true,
|
||||
disableHostCheck: true,
|
||||
historyApiFallback: true
|
||||
},
|
||||
plugins: [new webpack.HotModuleReplacementPlugin()]
|
||||
});
|
||||
|
||||
8
webpack.prod.js
Normal file
8
webpack.prod.js
Normal file
@ -0,0 +1,8 @@
|
||||
const merge = require('webpack-merge')
|
||||
const common = require('./webpack.common.js');
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: "production",
|
||||
devtool: 'source-map'
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user