kevin.legarreta
/
Proyecto_Oller


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220
							<!DOCTYPE html>
	
<style>

  .image {

	    display: block;
	    margin-left: auto;
	    margin-right: auto;
	    margin-top: 150px;
	    width: 50%;
	    position: sticky;
	}
  
  .floating-menu {
    font-family: sans-serif;
    border-width:5px;  
    border-style:solid;
    /*background: yellowgreen;*/
    padding: 5px;;
    width: 170px;
    z-index: 100;
    margin-left: left;
    margin-top: -500px;
  }
  
  .show_colors {
  	border: none;
    background-color: inherit;
    /*padding: 14px 28px;*/
    margin: 0 0.5em;
    font-size: 2.5em;
    cursor: pointer;
    display: inline-block;
  }
  .show_colors:hover {background: #eee}


  .colors {
  	border: none;
    background-color: inherit;
    margin: 0 0.5em;
    font-size: 1.5em;
    cursor: pointer;
    display: inline-block;
  }
  .colors:hover {background: #eee}

  .XRF {
    font-family: sans-serif;
    border-width:5px;  
    border-style:solid;
    display: none;
	/*padding: 5px;;*/
	width: 140px;
	margin-top: -190px;
	margin-left: 165px;
	}

  .FORS {
    font-family: sans-serif;
    border-width:5px;  
    border-style:solid;
    display: none;
	/*padding: 5px;;*/
	width: 140px;
	margin-top: -125px;
	margin-left: 165px;
	}


</style>

<html lang="en">

	
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

    <script type="text/javascript">

    	function Load(){
    		imageLoad();
    		create_colors();
    	}

    	function imageLoad(){
    		// var link = getUrlVars()["link"];
    		var link = "./nier.jpg"
    		var body = document.getElementById('image');
			var image = document.createElement('img');
			image.setAttribute("class", "image");
			image.src = link;
			body.appendChild(image);
    	}

    	function getUrlVars() {
		    var vars = {};
		    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
		        vars[key] = value;
		    });
		    return vars;
		}

    	function create_colors(){
    		var buttons = document.getElementById('XRFcolors');
			var newNode = document.createElement('button');
			newNode.setAttribute("class", "colors");
			newNode.appendChild(document.createTextNode('dynamic'));
			buttons.appendChild(newNode);

			var buttons = document.getElementById('FORScolors');
			var newNode = document.createElement('button');
			newNode.setAttribute("class", "colors");
			newNode.appendChild(document.createTextNode('dynamic'));
			buttons.appendChild(newNode);

			var fs = require("fs");
			var text = fs.readFileSync("~/Desktop/Proyecto_Oller/FORS&XRF/dummy_colors");
			text.toString().split(/\n/).forEach(function(line){
				console.log(line)
				// aqui va lo que esta arriba 
			});
    	}

		function show_XRF(){
		    var x = document.getElementById("XRFcolors");
		    var y = document.getElementById("FORScolors");
		    if (x.style.display === "none") {
		        x.style.display = "block";
		        y.style.display = "none";
		    } else {
		        x.style.display = "none";
		    }
		}

		function show_FORS(){
		    var x = document.getElementById("FORScolors");
		    var y = document.getElementById("XRFcolors");

		    if (x.style.display === "none") {
		        x.style.display = "block";
		        y.style.display = "none";
		    } else {
		        x.style.display = "none";
		    }
		}


    </script>

	<head>
		<!-- Required meta tags -->
	    <meta charset="utf-8">
	    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	    <!-- Link to CSS -->
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
		<link rel="stylesheet" type="text/css" href="css/style.css">
		<title>XRF & FORS</title>
		<!-- Collapse Navbar (needs some work) -->
		<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  			<a class="navbar-brand" href="#"><img src="https://upload.wikimedia.org/wikipedia/en/thumb/c/c8/Francisco_Oller.jpg/220px-Francisco_Oller.jpg" width="30" height="30" class="d-inline-block align-top" alt=""> Proyecto Oller</a>
  				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    				<span class="navbar-toggler-icon"></span>
  				</button>

  			<div class="collapse navbar-collapse" id="navbarSupportedContent">
	    		<ul class="navbar-nav mr-auto">
	      			<li class="nav-item active">
	        			<a class="nav-link" href="#">Home</a>
	      			</li>
			      	<li class="nav-item">
				    	<a class="nav-link" href="#">Link</a>
			      	</li>
	      			<li class="nav-item dropdown">
	        			<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
	          			Dropdown
	        			</a>
	        			<div class="dropdown-menu" aria-labelledby="navbarDropdown">
	          				<a class="dropdown-item" href="#">Action</a>
	          				<a class="dropdown-item" href="#">Another action</a>
	          				<div class="dropdown-divider"></div>
	          					<a class="dropdown-item" href="#">Something else here</a>
	        				</div>
	      			</li>
	      			<li class="nav-item">
	        			<a class="nav-link disabled" href="#">Disabled</a>
	      			</li>
    			</ul>
	    		<form class="form-inline my-2 my-lg-0">
	      			<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
	      			<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
	    		</form>
	  		</div>
		</nav>

	</head>
	<div id="image"></div>
	<body onload="Load();">

			<nav class="floating-menu">
				<button onclick="show_XRF();" class="show_colors">XRF</button>				
				<button onclick="show_FORS();" class="show_colors">FORS</button>
				<a href="/Users/spider/Desktop/Proyecto_Oller/MSI/msi.html"><button class="show_colors">MSI</button></a>
			</nav>

			<nav class="XRF" id="XRFcolors"></nav>
			<nav class="FORS" id="FORScolors"></nav>

			
	</body>


</html>