HMD
How do I make an hmd?
What is a hmd? How do you make a hmd? This script and codes were developed by Sladix on 09 December 2022, Friday.
HMD - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>HMD</title> <link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Roboto'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id="game"> <p>You must survive</p> <a href="#" class="btn" onClick="game.init()">Start</a>
</div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
<script src='js/ynynvo.js'></script> <script src="js/index.js"></script>
</body>
</html>
HMD - Script Codes CSS Codes
body{ background:#111; color:white; font-family:'Roboto',sans-serif; text-align:center;
}
#choix{ padding: 0 10px; width: 980px; max-width: 100%; margin: 0 auto } #game{ text-align:center; } #game .resource{ display:inline-block; margin: 0 20px; } .btn{ color:white; padding: 5px; border:1px solid white; border-radius: 3px; text-decoration: none; } .choix img{ display: block; margin: 0 auto; } .btn.error{ color:red; border-color: red; } .btn + .btn{ margin-left: 5px } .btn span{ display:inline-block; vertical-align:middle; padding: 2px; font-size: 10px; border-radius: 2px; } span.d{ color:black; background: white; } span.m{ background: green; } span.h{ background: red; }
HMD - Script Codes JS Codes
function Choose(arr){ return arr[Math.floor(Math.random()*arr.length)];
}
function weightedChoose(spec) { var i, sum=0, r=Math.random(); for (i in spec) { sum += spec[i]; if (r <= sum) return i; }
}
function ChooseFrom(arr,min){ return arr[Math.floor(Math.random() * ((arr.length-1) - min + 1)) + min];
}
var GlobalSettings = { displayHints : false, winMessage : 'Congratulation', looseMessage : 'Game over'
}
// Bouger ça aussi si possible mais bon osef c'est juste des raiser d'events
// ptetre bundle ça dans un EventDispatcher(name,data)
function Reset(){ var event = new Event('reset'); document.dispatchEvent(event);
}
function Apply(id,what,evt){ var event = new CustomEvent('choose' , { detail : { choix : id , impact : what , el : evt} }); document.dispatchEvent(event);
}
/**
* Game Class
*/
function Game(){ this.paused = false; this.ticker = null; this.turnTime = 1000; this.tickables = []; this.resources = []; this.currentChoice = 0; this.container = document.getElementById('game'); this.ChoixL = []; this.ResourcesL = {} //this.resources.push(new Resource('Name','lightblue',startValue:int,isObjective:bool,tickable:str('-5'))); // Generate style for hints var self = this; document.addEventListener('choose', this.applyChoix.bind(this), false); document.addEventListener('win', this.win.bind(this), false); document.addEventListener('loose', self.gameover.bind(self), false); document.addEventListener('reset',this.reset.bind(this));
}
Game.prototype.addChoices = function(choices){ for(var c in choices){ var cc = choices[c]; this.addChoice(new Choix(cc.id,cc.text,cc.choices)); }
}
Game.prototype.addChoice = function(c){ this.ChoixL[c.id] = c;
}
Game.prototype.addResource = function(r){ this.ResourcesL[r.id] = r;
}
Game.prototype.win = function(evt){ $(this.container).empty().append('<h2>'+GlobalSettings.winMessage+'</h2><h3>'+WinMessages[evt.detail]+'</h3><a href="#" class="btn reset" onClick="Reset()">Restart</a>');
}
Game.prototype.init = function(){ this.tickables.length = 0; for(var r in this.ResourcesL){ if(this.ResourcesL[r].tickable){ this.addTickable(this.ResourcesL[r]); } } //UI $(this.container).empty(); var el = $('<div class="resources-container"></div>'); $(this.container).append(el); this.cContainer = $('<div id="choix"></div>'); this.currentChoice = 0; for(var r in this.ResourcesL){ this.ResourcesL[r].display(el); } $(this.container).append(this.cContainer); this.ChoixL["start"].display(this.cContainer);
}
Game.prototype.gameover = function(evt){ $(this.container).empty().append('<h2>'+GlobalSettings.looseMessage+'</h2><h3>'+LooseMessages[evt.detail]+'</h3><a href="#" class="btn reset" onClick="Reset()">Restart</a>');
}
Game.prototype.applyChoix = function(evt){ var params = evt.detail; var choice = this.ChoixL[params.choix].impacts[params.impact]; for(var e in choice.resourcesModifiers){ var d = choice.resourcesModifiers[e].split(':'); if(this.ResourcesL[d[0]]){ this.ResourcesL[d[0]].update(parseInt(d[1])); } } var specs = {}; var l = choice.nexts.length; choice.nexts.forEach((c)=>{ var v = c.split(':'); specs[v[0]] = (v[1])?parseFloat(v[1]):1/l; }); var next = weightedChoose(specs); //TICK this.tick(); $(this.cContainer).empty(); // Choisir la prochaine étape var c = this.ChoixL[next]; if(c){ c.display(this.cContainer); }
}
Game.prototype.tick = function(){ // Do game logic for(var t in this.tickables){ this.tickables[t].tick(); }
}
Game.prototype.addTickable = function(tickable){ this.tickables.push(tickable);
}
Game.prototype.reset = function(){ for(var r in this.ResourcesL){ this.ResourcesL[r].reset(); } this.init();
}
Game.prototype.start = function(){ this.paused = false; this.ticker = setInterval(this.tick,this.turnTime);
}
/**
* Resource Class
*/
function Resource(name,color,value,objective,tb,loosable){ this.amount = (value)?value:0; this.baseAmount = this.amount; this.size = (objective)?160:80; this.objective = (objective)?objective:false; this.fontSize = (this.objective)?50:20; this.textOffset = (this.objective)?-15:-5; this.name = name; this.color = (color)?color:"#ff0000"; this.tickable = (tb)?true:false; this.tickRate = parseInt(tb); this.tickRateModifier = 0; // On pourrait ajouter des effets pour que ça réduise/augmente plus vite this.id = this.name.substring(0,1).toLowerCase(); if(typeof loosable == "undefined") this.loosable = true; else this.loosable = loosable;
}
Resource.prototype.display = function(container){ var self = this; this.element = $('<div class="resource"><h3>'+this.name+'</h3></div>'); this.element.off().on('g.animation.complete',function(){ self.check(); }); this.element.Gauge({lineColor:this.color,value:this.amount,textColor:this.color,textOffset:this.textOffset,size:this.size,fontSize:this.fontSize}); this.element.Gauge('start'); $(container).append(this.element);
}
Resource.prototype.reset = function(){ this.amount = this.baseAmount; this.element.Gauge('setValue',this.amount);
}
Resource.prototype.tick = function(){ if(this.tickable){ this.update(this.tickRate); }
}
Resource.prototype.update = function(qty){ if(qty != 0) this.amount += qty; else this.amount = 0; this.element.Gauge('setValue',this.amount);
}
Resource.prototype.check = function(){ if(this.amount <= 0 && this.loosable && !this.objective){ var event = new CustomEvent('loose',{ "detail" : this.id }); setTimeout(function(){ document.dispatchEvent(event); },500); } if(this.amount >= 100 && this.objective){ var event = new CustomEvent('win',{ "detail" : this.id }); setTimeout(function(){ document.dispatchEvent(event); },500); }
}
/**
* Choix Class
*/
/*Exemple
* impacts : ['titre|modifs|requirements/next1;next2']
* new Choix('Vous voyez une femme devant vous',['Je la drogue|d:-5;h:+1|d:1','Je lui paye un verre|m:-1;h+1'])
*/
function Choix(id,text,impacts,requirements){ this.text = text; this.impacts = impacts; for(var i in this.impacts){ var str = this.impacts[i].split('/'); var impact = str[0].split('|'); var titre = impact[0]; if(impact[1]) var resourcesModifiers = impact[1].split(';'); var rqs = []; if(impact[2]){ rqs = impact[2].split(';') } var nexts = []; if(str[1]){ nexts = str[1].split(';') } this.impacts[i] = { titre : titre, resourcesModifiers : resourcesModifiers, requirements : rqs, nexts : nexts } } this.id = id; this.requirements = (requirements)?requirements.split(';'):[];
}
Choix.prototype.formatCosts = function(index){ var choice = this.impacts[index]; var html = ""; for(var e in choice.resourcesModifiers){ var d = choice.resourcesModifiers[e].split(':'); var sign = ''; if(parseInt(d[1]) > 0){ sign = '+'; }else{ sign = '-'; } html += "<span class='c_"+d[0]+"'>"+(sign)+"</span> "; } return html;
}
Choix.prototype.canBeDisplayed = function(){ if(this.requirements.length > 0){ for(var i in this.requirements){ var kv = this.requirements[i].split(':'); if(ResourcesL[kv[0]].amount < parseInt(kv[1])){ return false; } } } return true;
}
Choix.prototype.display = function(container){ var el = $('<div class="choix"><p>'+this.text+'</p></div>'); for(var i in this.impacts){ var canBeDisplayed = true; if(this.impacts[i].requirements.length > 0){ for(var r in this.impacts[i].requirements){ var res = this.impacts[i].requirements[r].split(':'); // WARNING, obj ref... bad !!! Move display method in Game object if(game.ResourcesL[res[0]].amount < res[1]) canBeDisplayed = false; } } if(canBeDisplayed){ var a = $('<a href="#" class="btn" onClick="Apply(\''+this.id+'\','+i+',this)">'+this.impacts[i].titre+((GlobalSettings.displayHints)?' '+this.formatCosts(i):'')+'</a>'); // el.append(a); } } container.append(el);
}
var WinMessages = { e: "You survived"
}
var LooseMessages = { t : "There is no time left, you drown in the flood", h : "You have no blood left in your veins"
}
GlobalSettings.looseMessage = "You died";
GlobalSettings.winMessage = "You lived";
var game = new Game();
game.addResource(new Resource('Bullets','yellow',20,false,false,false));
game.addResource(new Resource('Escape','green',0,true));
game.addResource(new Resource('Time','lightblue',100,false,"-1"));
game.addResource(new Resource('Health','red',100,false));
var choix = [ { id:"start", text:"You walk down a dark road, you see 2 shadows from a distance. They appear to be heading at you", choices:['Shoot at them|b:-5;e:+5;h:-5/encounter_1','Take the first street on your right|e:+2/flee_1'], requirements:"" }, { id:"encounter_1", text:"As you begin to shoot, you see the two shadows running. You hear gun shots too. After 10s of intense trigger pulling, you feel a scratch on your cheek, the bullet just miss you. The two shadows disapears to your left.", choices:['Follow them|e:+5/encounter_2','Continue straight|e:+2/start'], requirements:"" }, { id:"encounter_2", text:"here they are, standing in front of you", choices:['Full clip on these fuckers|b:0;e:+15;h:-10/building_1','U turn and run|h:-10;e:+10/flee_1'], requirements:"" }, { id:"flee_1", text:"You start to run, but as you approach a building, you hear a deep voice shouting orders.", choices:['You try to sneak into the building|e:+5/building_1','You put your finger on the trigger, aim precisely and take the shot|h:-10;b:0|b:1/corpse_1'], requirements:"" }, { id:"corpse_1", text:"You completely miss the fucker, he looks at you, and start walking toward you, he grab a knive and prepare hes attack", choices:['Try to parry|h:0'], requirements:"" }, { id:"corpse_2", text:"All those dead babies... what have you done ?!", choices:['Continue/end'], requirements:"" }, { id:"building_1", text:"You enter the building and are surrounded by dozens of armless babies crawling toward you", choices:['Shoot them all !|e:+5;h:-5;b:-5|b:5/corpse_2','You run like a MOFO|h:-10;b:-5/end'], requirements:"" }, { id:"end", text:"You see the man with the deep voice, he looks awful. You look at him in the eyes as he reach his gun", choices:['Shoot at him|b:-5|b:5/end_2','Throw him some dog poop|h:-10;b:-5;e:100'], requirements:"" }, { id:"end_2", text:"He shoot before you, you take the hit", choices:['Accept your fate|h:0'], requirements:"" }
]
game.addChoices(choix);
//game.init();
Developer | Sladix |
Username | Sladix |
Uploaded | December 09, 2022 |
Rating | 3 |
Size | 8,249 Kb |
Views | 8,096 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
Fibonacci color test | 2,310 Kb |
CSS Letter animations | 2,116 Kb |
Responsive Stack slider | 3,527 Kb |
Text reveal test | 2,423 Kb |
Visualizer tests | 3,361 Kb |
A Pen by Sladix | 3,349 Kb |
Canvas snake animation random bezier curve looped | 2,882 Kb |
Agent Chaos | 4,709 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
A Pen by Stan Williams | Stanssongs | 6,706 Kb |
React JS Movie Info App | MTushar | 4,870 Kb |
Shopping List | Markmurray | 6,015 Kb |
Lightrays v2 | Sinthetyc | 2,903 Kb |
Pure CSS Animated Photo Stack | Depthdev | 2,486 Kb |
Fireworks Show | Arianalynn | 3,048 Kb |
A Pen by panstable | Panstable | 2,940 Kb |
Scifi-style Interative Form | Aaronchuo | 4,566 Kb |
A Pen by Alex Bergin | Abergin | 3,347 Kb |
Fading gradient button | Insprd | 1,713 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!