HMD

Developer
Sladix
Size
8,249 Kb
Views
8,096
  1. HMD Previews
  2. HMD HTML Codes
  3. HMD CSS Codes
  4. HMD JS Codes

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 Previews
IQ Test

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();
HMD - Script Codes
HMD - Script Codes
Home Page Home
Developer Sladix
Username Sladix
Uploaded December 09, 2022
Rating 3
Size 8,249 Kb
Views 8,096
Do you need developer help for HMD?

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!

Sladix (Sladix) Script Codes
Name
Fibonacci color test
CSS Letter animations
Responsive Stack slider
Text reveal test
Visualizer tests
A Pen by Sladix
Canvas snake animation random bezier curve looped
Agent Chaos
Create amazing art & images with AI!

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!