gta-modeview/index.html
2023-02-09 12:36:27 +01:00

168 lines
3.8 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<title>GTA Model Viewer</title>
<meta charset="utf-8">
<link rel="stylesheet" href="webgl.css" type="text/css">
</head>
<body>
<div class="viewer-panel">
<canvas id="glcanvas"></canvas>
<table class="ui" id="colors">
<!-- JS inserts colors here -->
</table>
<div class="frames-wrapper ui">
<ul id="frames">
<!-- JS inserts frames here -->
</ul>
</div>
<div class="custom-colors ui">
<input type="color" id="custom-color0">
<input type="color" id="custom-color1">
<input type="color" id="custom-color2">
<input type="color" id="custom-color3">
</div>
</div>
<div class="select-panel ui">
<div id="control">
<a id="game-select-iii" href="javascript: startVehicleViewerIII(defaultModel);">III</a> |
<a id="game-select-vc" href="javascript: startVehicleViewerVC(defaultModel);">VC</a> |
<a id="game-select-sa" href="javascript: startVehicleViewerSA(defaultModel);">SA</a>
</div>
<div class="objects-wrapper">
<select id="objects" size="25">
<!-- JS inserts models here -->
</select>
</div>
</div>
<ul class="bottom-links ui">
<li>Press I to toggle interface</li>
<li>|</li>
<li>
<a href="https://github.com/GTAmodding/modelviewjs" id="source-link" target="blank" rel="noopener">Source code</a>
</li>
</ul>
</body>
<script src="gl-matrix.js"></script>
<script src="gl-util.js"></script>
<script src="rw.js"></script>
<script src="rwrender.js"></script>
<script src="shaders.js"></script>
<script src="rwstream.js"></script>
<script src="main.js"></script>
<script src="loaddata.js"></script>
<script src="ui.js"></script>
<script>
var defaultModel = 'cheetah';
var initialGame = 'iii';
var initialModel = defaultModel;
var currentGame;
InitRW();
function
startVehicleViewerIII(model)
{
currentGame = 'iii';
DataDirPath = "iii/data";
ModelsDirPath = "iii/models";
TexturesDirPath = "iii/textures";
loadCar = loadCarIII;
loadVehicleViewer("default.ide", function() {
if(parseInt(model)) {
SelectModelByID(model);
}
else {
SelectModel(model);
}
uiSetCurrentGame("iii");
uiSetCurrentModel(CurrentModel.model);
});
}
function
startVehicleViewerVC(model)
{
currentGame = 'vc';
DataDirPath = "vc/data";
ModelsDirPath = "vc/models";
TexturesDirPath = "vc/textures";
loadCar = loadCarVC;
loadVehicleViewer("default.ide", function() {
if(parseInt(model)) {
SelectModelByID(model);
}
else {
SelectModel(model);
}
uiSetCurrentGame("vc");
uiSetCurrentModel(CurrentModel.model);
});
}
function
startVehicleViewerSA(model)
{
currentGame = 'sa';
DataDirPath = "sa/data";
ModelsDirPath = "sa/models";
TexturesDirPath = "sa/textures";
loadCar = loadCarSA;
loadVehicleViewer("vehicles.ide", function() {
if(parseInt(model)) {
SelectModelByID(model);
}
else {
SelectModel(model);
}
uiSetCurrentGame("sa");
uiSetCurrentModel(CurrentModel.model);
});
}
var hash = window.location.hash;
if(hash.length !== '') {
hash = hash.substring(1).toLowerCase();
var hashParts = hash.split('/');
if(['iii', 'vc', 'sa'].includes(hashParts[0])) {
initialGame = hashParts[0];
if(hashParts.length > 1) {
initialModel = hashParts[1];
}
}
else {
// Invalid location hash, reset it
window.location.hash = '';
if(window.history) {
history.replaceState(null, null, ' ');
}
}
}
if(initialGame === 'iii') {
startVehicleViewerIII(initialModel);
}
else if(initialGame === 'vc') {
startVehicleViewerVC(initialModel);
}
else if(initialGame === 'sa') {
startVehicleViewerSA(initialModel);
}
</script>
</html>