# IceCTF 2016## Solution By: Nullp0inter
# Spotlight Web 10ptsSomeone turned out the lights and now we can't find anything. Send halp! spotlight
# Solution:Obviously with around 1600 solves, not a lot of people need this but in case you do I figured I would include it for completeness' sake.The challenge sends you to spotlight.vuln.icec.tf, a mostly black page with a white circle that is supposed to be your "spotlight." If youtake a few minutes to search around you'll see some messages such as "not here", "the flag is close", etc. But we couldn't find the flag.So what do we do then? Well it's usually idea to "USE THE SOURCE, LUKE!." In Firefox you can easily do this with ctrl+U. The source is fairlysmall so I will post it here:
```html
<html>    <head>        <title>IceCTF 2016 - Spotlight</title>        <link rel="stylesheet" type="text/css" href="spotlight.css">    </head>    <body> 
        <canvas id="myCanvas" style="background-color:#222;">            Your browser does not support the HTML5 canvas tag.        </canvas>        <script src="spotlight.js"></script>    </body></html>```
So two things should pop out at you, the `spotlight.css` and the `spotlight.js` at the bottom. The css is just unlikely so I ignored that altogetherand went straight for the javascript file as that is what is making the spotlight on the page work in the first place and holds the messages. We clickon the `spotlight.js` to view the source for that and get:
```javascript/* * TODO: Remove debug log */
// Load the canvas contextconsole.log("DEBUG: Loading canvas context...");var canvas = document.getElementById('myCanvas');var context = canvas.getContext('2d');
// Make the canvas fill the screenconsole.log("DEBUG: Adjusting canvas size...");context.canvas.width  = window.innerWidth;context.canvas.height = window.innerHeight;
// Mouse listenerconsole.log("DEBUG: Adding mouse listener...");canvas.addEventListener('mousemove', function(evt) {    spotlight(canvas, getMousePos(canvas, evt));}, false);
console.log("DEBUG: Initializing spotlight sequence...");function spotlight(canvas, coord) {    // Load up the context    var context = canvas.getContext('2d');
    // Clear the canvas    context.clearRect(0,0,canvas.width, canvas.height);
    // Turn off the lights! Mwuhahaha >:3    context.fillRect(0,0,window.innerWidth,window.innerHeight);
    // Scatter around red herrings    context.font = "20px Arial";    context.fillText("Not here.",width(45),height(60));    context.fillText("Keep looking...",width(80),height(20));    context.fillText(":c",width(20),height(30));    context.fillText("Look closer!",width(75),height(80));    context.fillText("Almost there!",width(60),height(10));    context.fillText("Howdy!",width(10),height(90));    context.fillText("Closer...",width(30),height(80));    context.fillText("FLAG AHOY!!!!!!!!1",width(80),height(95));
    // Turn on the flash light    var grd = context.createRadialGradient(        coord.x, coord.y,  75,        coord.x, coord.y,  50);    grd.addColorStop(0,'rgba(255,255,255,0)');    grd.addColorStop(1,'rgba(255,255,255,.7)');
    context.fillStyle=grd;}
console.log("DEBUG: IceCTF{5tup1d_d3v5_w1th_th31r_l095}");
console.log("DEBUG: Loading up helper functions...");console.log("DEBUG:     * getMousePos(canvas, evt)");function getMousePos(canvas, evt) {    var rect = canvas.getBoundingClientRect();    return {        x:  evt.clientX - rect.left,        y:  evt.clientY - rect.top    };}
// Calculate height percentegesconsole.log("DEBUG:     * height(perc)");function height(perc){    var h = window.innerHeight;    return h * (perc / 100);}
// Calculate width percentegesconsole.log("DEBUG:     * width(perc)");function width(perc){    var w = window.innerWidth;    return w * (perc / 100);}console.log("DEBUG: Done.");
console.log("DEBUG: Ready for blast off!");```
Well what do you know, about halfway down we can see our flag:`IceCTF{5tup1d_d3v5_w1th_th31r_l095}`