diff --git a/hashed/web/assets/js/d3.js b/hashed/web/assets/js/d3.js
diff --git a/hashed/web/assets/js/d3.layout.cloud.js b/hashed/web/assets/js/d3.layout.cloud.js
@@ -0,0 +1,383 @@
+(function(exports) {
+  function cloud() {
+    var size = [1000, 800],
+        text = cloudText,
+        font = cloudFont,
+        fontSize = cloudFontSize,
+        rotate = cloudRotate,
+        padding = cloudPadding,
+        spiral = archimedeanSpiral,
+        words = [],
+        timeInterval = Infinity,
+        event = d3.dispatch("word", "end"),
+        timer = null,
+        cloud = {};
+
+    cloud.start = function() {
+      var board = zeroArray((size[0] >> 5) * size[1]),
+          bounds = null,
+          n = words.length,
+          i = -1,
+          tags = [],
+          data = words.map(function(d, i) {
+        return {
+          text: text.call(this, d, i),
+          font: font.call(this, d, i),
+          rotate: rotate.call(this, d, i),
+          size: ~~fontSize.call(this, d, i),
+          padding: cloudPadding.call(this, d, i)
+        };
+      }).sort(function(a, b) { return b.size - a.size; });
+
+      if (timer) clearInterval(timer);
+      timer = setInterval(step, 0);
+      step();
+
+      return cloud;
+
+      function step() {
+        var start = +new Date,
+            d;
+        while (+new Date - start < timeInterval && ++i < n && timer) {
+          d = data[i];
+          d.x = (size[0] * (Math.random() + .5)) >> 1;
+          d.y = (size[1] * (Math.random() + .5)) >> 1;
+          cloudSprite(d, data, i);
+          if (place(board, d, bounds)) {
+            tags.push(d);
+            event.word(d);
+            if (bounds) cloudBounds(bounds, d);
+            else bounds = [{x: d.x + d.x0, y: d.y + d.y0}, {x: d.x + d.x1, y: d.y + d.y1}];
+            // Temporary hack
+            d.x -= size[0] >> 1;
+            d.y -= size[1] >> 1;
+          }
+        }
+        if (i >= n) {
+          cloud.stop();
+          event.end(tags, bounds);
+        }
+      }
+    }
+
+    cloud.stop = function() {
+      if (timer) {
+        clearInterval(timer);
+        timer = null;
+      }
+      return cloud;
+    };
+
+    cloud.timeInterval = function(x) {
+      if (!arguments.length) return timeInterval;
+      timeInterval = x == null ? Infinity : x;
+      return cloud;
+    };
+
+    function place(board, tag, bounds) {
+      var perimeter = [{x: 0, y: 0}, {x: size[0], y: size[1]}],
+          startX = tag.x,
+          startY = tag.y,
+          maxDelta = Math.sqrt(size[0] * size[0] + size[1] * size[1]),
+          s = spiral(size),
+          dt = Math.random() < .5 ? 1 : -1,
+          t = -dt,
+          dxdy,
+          dx,
+          dy;
+
+      while (dxdy = s(t += dt)) {
+        dx = ~~dxdy[0];
+        dy = ~~dxdy[1];
+
+        if (Math.min(dx, dy) > maxDelta) break;
+
+        tag.x = startX + dx;
+        tag.y = startY + dy;
+
+        if (tag.x + tag.x0 < 0 || tag.y + tag.y0 < 0 ||
+            tag.x + tag.x1 > size[0] || tag.y + tag.y1 > size[1]) continue;
+        // TODO only check for collisions within current bounds.
+        if (!bounds || !cloudCollide(tag, board, size[0])) {
+          if (!bounds || collideRects(tag, bounds)) {
+            var sprite = tag.sprite,
+                w = tag.width >> 5,
+                sw = size[0] >> 5,
+                lx = tag.x - (w << 4),
+                sx = lx & 0x7f,
+                msx = 32 - sx,
+                h = tag.y1 - tag.y0,
+                x = (tag.y + tag.y0) * sw + (lx >> 5),
+                last;
+            for (var j = 0; j < h; j++) {
+              last = 0;
+              for (var i = 0; i <= w; i++) {
+                board[x + i] |= (last << msx) | (i < w ? (last = sprite[j * w + i]) >>> sx : 0);
+              }
+              x += sw;
+            }
+            delete tag.sprite;
+            return true;
+          }
+        }
+      }
+      return false;
+    }
+
+    cloud.words = function(x) {
+      if (!arguments.length) return words;
+      words = x;
+      return cloud;
+    };
+
+    cloud.size = function(x) {
+      if (!arguments.length) return size;
+      size = [+x[0], +x[1]];
+      return cloud;
+    };
+
+    cloud.font = function(x) {
+      if (!arguments.length) return font;
+      font = d3.functor(x);
+      return cloud;
+    };
+
+    cloud.rotate = function(x) {
+      if (!arguments.length) return rotate;
+      rotate = d3.functor(x);
+      return cloud;
+    };
+
+    cloud.text = function(x) {
+      if (!arguments.length) return text;
+      text = d3.functor(x);
+      return cloud;
+    };
+
+    cloud.spiral = function(x) {
+      if (!arguments.length) return spiral;
+      spiral = spirals[x + ""] || x;
+      return cloud;
+    };
+
+    cloud.fontSize = function(x) {
+      if (!arguments.length) return fontSize;
+      fontSize = d3.functor(x);
+      return cloud;
+    };
+
+    cloud.padding = function(x) {
+      if (!arguments.length) return padding;
+      padding = d3.functor(x);
+      return cloud;
+    };
+
+    return d3.rebind(cloud, event, "on");
+  }
+
+  function cloudText(d) {
+    return d.text;
+  }
+
+  function cloudFont() {
+    return "serif";
+  }
+
+  function cloudFontSize(d) {
+    return Math.sqrt(d.value);
+  }
+
+  function cloudRotate() {
+    return (~~(Math.random() * 6) - 3) * 30;
+  }
+
+  function cloudPadding() {
+    return 1;
+  }
+
+  // Fetches a monochrome sprite bitmap for the specified text.
+  // Load in batches for speed.
+  function cloudSprite(d, data, di) {
+    if (d.sprite) return;
+    c.clearRect(0, 0, (cw << 5) / ratio, ch / ratio);
+    var x = 0,
+        y = 0,
+        maxh = 0,
+        n = data.length;
+    di--;
+    while (++di < n) {
+      d = data[di];
+      c.save();
+      c.font = ~~((d.size + 1) / ratio) + "px " + d.font;
+      var w = c.measureText(d.text + "m").width * ratio,
+          h = d.size << 1;
+      if (d.rotate) {
+        var sr = Math.sin(d.rotate * cloudRadians),
+            cr = Math.cos(d.rotate * cloudRadians),
+            wcr = w * cr,
+            wsr = w * sr,
+            hcr = h * cr,
+            hsr = h * sr;
+        w = (Math.max(Math.abs(wcr + hsr), Math.abs(wcr - hsr)) + 0x1f) >> 5 << 5;
+        h = ~~Math.max(Math.abs(wsr + hcr), Math.abs(wsr - hcr));
+      } else {
+        w = (w + 0x1f) >> 5 << 5;
+      }
+      if (h > maxh) maxh = h;
+      if (x + w >= (cw << 5)) {
+        x = 0;
+        y += maxh;
+        maxh = 0;
+      }
+      if (y + h >= ch) break;
+      c.translate((x + (w >> 1)) / ratio, (y + (h >> 1)) / ratio);
+      if (d.rotate) c.rotate(d.rotate * cloudRadians);
+      c.fillText(d.text, 0, 0);
+      c.restore();
+      d.width = w;
+      d.height = h;
+      d.xoff = x;
+      d.yoff = y;
+      d.x1 = w >> 1;
+      d.y1 = h >> 1;
+      d.x0 = -d.x1;
+      d.y0 = -d.y1;
+      x += w;
+    }
+    var pixels = c.getImageData(0, 0, (cw << 5) / ratio, ch / ratio).data,
+        sprite = [];
+    while (--di >= 0) {
+      d = data[di];
+      var w = d.width,
+          w32 = w >> 5,
+          h = d.y1 - d.y0,
+          p = d.padding;
+      // Zero the buffer
+      for (var i = 0; i < h * w32; i++) sprite[i] = 0;
+      x = d.xoff;
+      if (x == null) return;
+      y = d.yoff;
+      var seen = 0,
+          seenRow = -1;
+      for (var j = 0; j < h; j++) {
+        for (var i = 0; i < w; i++) {
+          var k = w32 * j + (i >> 5),
+              m = pixels[((y + j) * (cw << 5) + (x + i)) << 2] ? 1 << (31 - (i % 32)) : 0;
+          if (p) {
+            if (j) sprite[k - w32] |= m;
+            if (j < w - 1) sprite[k + w32] |= m;
+            m |= (m << 1) | (m >> 1);
+          }
+          sprite[k] |= m;
+          seen |= m;
+        }
+        if (seen) seenRow = j;
+        else {
+          d.y0++;
+          h--;
+          j--;
+          y++;
+        }
+      }
+      d.y1 = d.y0 + seenRow;
+      d.sprite = sprite.slice(0, (d.y1 - d.y0) * w32);
+    }
+  }
+
+  // Use mask-based collision detection.
+  function cloudCollide(tag, board, sw) {
+    sw >>= 5;
+    var sprite = tag.sprite,
+        w = tag.width >> 5,
+        lx = tag.x - (w << 4),
+        sx = lx & 0x7f,
+        msx = 32 - sx,
+        h = tag.y1 - tag.y0,
+        x = (tag.y + tag.y0) * sw + (lx >> 5),
+        last;
+    for (var j = 0; j < h; j++) {
+      last = 0;
+      for (var i = 0; i <= w; i++) {
+        if (((last << msx) | (i < w ? (last = sprite[j * w + i]) >>> sx : 0))
+            & board[x + i]) return true;
+      }
+      x += sw;
+    }
+    return false;
+  }
+
+  function cloudBounds(bounds, d) {
+    var b0 = bounds[0],
+        b1 = bounds[1];
+    if (d.x + d.x0 < b0.x) b0.x = d.x + d.x0;
+    if (d.y + d.y0 < b0.y) b0.y = d.y + d.y0;
+    if (d.x + d.x1 > b1.x) b1.x = d.x + d.x1;
+    if (d.y + d.y1 > b1.y) b1.y = d.y + d.y1;
+  }
+
+  function collideRects(a, b) {
+    return a.x + a.x1 > b[0].x && a.x + a.x0 < b[1].x && a.y + a.y1 > b[0].y && a.y + a.y0 < b[1].y;
+  }
+
+  function archimedeanSpiral(size) {
+    var e = size[0] / size[1];
+    return function(t) {
+      return [e * (t *= .1) * Math.cos(t), t * Math.sin(t)];
+    };
+  }
+
+  function rectangularSpiral(size) {
+    var dy = 4,
+        dx = dy * size[0] / size[1],
+        x = 0,
+        y = 0;
+    return function(t) {
+      var sign = t < 0 ? -1 : 1;
+      // See triangular numbers: T_n = n * (n + 1) / 2.
+      switch ((Math.sqrt(1 + 4 * sign * t) - sign) & 3) {
+        case 0:  x += dx; break;
+        case 1:  y += dy; break;
+        case 2:  x -= dx; break;
+        default: y -= dy; break;
+      }
+      return [x, y];
+    };
+  }
+
+  // TODO reuse arrays?
+  function zeroArray(n) {
+    var a = [],
+        i = -1;
+    while (++i < n) a[i] = 0;
+    return a;
+  }
+
+  var cloudRadians = Math.PI / 180,
+      cw = 1 << 11 >> 5,
+      ch = 1 << 11,
+      canvas,
+      ratio = 1;
+
+  if (typeof document !== "undefined") {
+    canvas = document.createElement("canvas");
+    canvas.width = 1;
+    canvas.height = 1;
+    ratio = Math.sqrt(canvas.getContext("2d").getImageData(0, 0, 1, 1).data.length >> 2);
+    canvas.width = (cw << 5) / ratio;
+    canvas.height = ch / ratio;
+  } else {
+    // node-canvas support
+    var Canvas = require("canvas");
+    canvas = new Canvas(cw << 5, ch);
+  }
+
+  var c = canvas.getContext("2d"),
+      spirals = {
+        archimedean: archimedeanSpiral,
+        rectangular: rectangularSpiral
+      };
+  c.fillStyle = "red";
+  c.textAlign = "center";
+
+  exports.cloud = cloud;
+})(typeof exports === "undefined" ? d3.layout || (d3.layout = {}) : exports);
diff --git a/hashed/web/assets/js/fb_insights.js b/hashed/web/assets/js/fb_insights.js
@@ -0,0 +1,37 @@
+function findHashtags(searchText) {
+    var regexp = /\#\w\w+\s?/g
+    result = searchText.match(regexp);
+    if (result) {
+        result.map(function(s) { return s.trim() });
+        return result;
+    } else {
+        return false;
+    }
+}
+
+function getImpressions (data, callback) {
+    FB.api(
+        "/" + data.id + "/insights/post_impressions",
+        'GET' , 
+        {fields: 'values'}, 
+        callback
+    );
+}
+
+function getComments(data) {
+    FB.api(
+        "/" + data + "/comments",
+        'GET' , 
+        {}, 
+        function (response) {
+            if(response.data.length > 0) {
+                for(i = 0 ; i < response.data.length ; i ++){
+                    thisData = response.data[i];
+                    if(detectLanguage(thisData.message) != "Thai" ) {
+
+                    }
+                }
+            }
+        }
+    );
+}
diff --git a/hashed/web/fb_insights.jsp b/hashed/web/fb_insights.jsp
@@ -0,0 +1,197 @@
+<%@page contentType="text/html" pageEncoding="UTF-8"%>
+<jsp:include page="testuser.jsp"/> 
+
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <jsp:include page="album_create.jsp"/> 
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="description" content="">
+        <meta name="author" content="">
+        <link rel="icon" href="../../favicon.ico">
+
+        <title>#IS434 Test</title>
+
+        <!-- Bootstrap core CSS -->
+        <link href="assets/css/bootstrap.min.css" rel="stylesheet">
+
+        <!-- Custom styles for this template -->
+        <link href="assets/css/hashed.css" rel="stylesheet">
+        <link href="assets/css/blockgrid.css" rel="stylesheet">
+        <link href="assets/css/bootstrap-select.css" rel="stylesheet">
+        <link href="assets/css/bootstrap-select.min.css" rel="stylesheet">
+    </head>
+    <body>
+        <script>
+            setTimeout(function(){
+                var wordCloudArr = [];
+                for(var tag in hashtagLibrary) {
+                    wordCloudArr.push({
+                        text: tag,
+                        size: hashtagLibrary[tag] / 4500
+                    });
+                }
+                createWordCloud(wordCloudArr);
+                $("#loadingscreen").fadeOut("slow");
+            }, 6000);
+            
+            var hashtagLibrary = {};
+            window.fbAsyncInit = function() {
+              FB.init({
+                appId      : '1531128673845258',
+                xfbml      : true,
+                version    : 'v2.4'
+              });
+              FB.login(function(response) {
+                if (response.authResponse) {
+                  runData(response);
+                }
+              });
+            };
+
+            (function(d, s, id){
+               var js, fjs = d.getElementsByTagName(s)[0];
+               if (d.getElementById(id)) {return;}
+               js = d.createElement(s); js.id = id;
+               js.src = "//connect.facebook.net/en_US/sdk.js";
+               fjs.parentNode.insertBefore(js, fjs);
+            }(document, 'script', 'facebook-jssdk'));
+
+            function runData(response) {
+                hashtagLibrary = {};
+                FB.api(
+                    "/258437627628348/feed?limit=100",
+                    'GET' , 
+                    {}, 
+                    dummyRunData
+                );
+            }
+            
+            function dummyRunData (response) {
+                runData2(response);
+            }
+            var msg = "";
+            function runData2(response) {
+                for(i = 0 ; i < response.data.length ; i ++){
+                    thisData = response.data[i];
+                    if(typeof thisData != "undefined" && typeof thisData.message != "undefined" && thisData.message.indexOf("#")>-1) {
+                        msg = thisData.message;
+                        getImpressions(thisData, runData3);
+                    }
+                    // getComments(thisData.id);
+                }
+                if (typeof response.paging != "undefined" && response.paging.next != "undefined"){
+                    FB.api(response.paging.next, runData2);
+                }
+            }
+
+            function runData3(resp) {
+                runData4 (resp.data[0].values[0].value);
+            }
+            
+            function runData4 (imp) {
+                hashtags = findHashtags(msg);
+                for(j = 0 ; j < hashtags.length ; j++) {
+                    tag = hashtags[j].replace(/[^A-Za-z]+/g, '');
+                    if(tag in hashtagLibrary) {
+                        hashtagLibrary[tag] = hashtagLibrary[tag] + imp;
+                    } else {
+                        hashtagLibrary[tag] = imp;
+                    }
+                }
+            }
+        </script> 
+
+        <% session.setAttribute("location", "explore");%>
+
+        <div class="container-fluid">
+            <div class="row">
+
+                <%@include file="sidebar.jsp"%> 
+
+                <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
+                    <div style="position: absolute; left: 0px; top: 20px; width: 980px; height: 550px; background-color: white; z-index: 2;" id="loadingscreen">
+                        <img src="assets/images/Loading.gif" alt="Processing" style="display: block; margin: 0 auto;width:100px;margin-top:200px;">
+                    </div>
+                    <div id="mainbody" style="width: 980px; height: 505px; position: relative;">
+
+                    </div>
+                </div><!-- End of main -->
+            </div><!-- End of row -->
+        </div> <!-- End of container -->
+
+
+
+        <!-- Bootstrap core JavaScript
+        ================================================== -->
+        <!-- Placed at the end of the document so the pages load faster -->
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+        <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script> 
+        <script src="assets/js/bootstrap.min.js"></script>
+        <script src="assets/js/bootstrap-select.min.js"></script>
+        <script src="assets/js/jquery.lazyload.min.js" type="text/javascript"></script>
+        <script src="assets/js/spin.min.js" type="text/javascript"></script>
+        <script src="assets/js/bloxhover.jquery.min.js" type="text/javascript"></script>
+        <script src="assets/js/cld-min.js"></script>
+        <script src="assets/js/fb_insights.js"></script>
+        <script src="assets/js/d3.js"></script>
+        <script src="assets/js/d3.layout.cloud.js"></script>
+        <script>
+            $(window).scroll(function() {
+                if ($(this).scrollTop() > 50) {
+                    $('#back-to-top').fadeIn();
+                } else {
+                    $('#back-to-top').fadeOut();
+                }
+            });
+            // scroll body to 0px on click
+            $('#back-to-top').click(function() {
+                $('#back-to-top').tooltip('hide');
+                $('body,html').animate({
+                    scrollTop: 0
+                }, 800);
+                return false;
+            });
+
+            $('#back-to-top').tooltip('show');
+            var span_counter = $("#searchHeader span").length + 1;
+            var image_counter = 1;
+        </script>
+
+        <script>
+            var fill = d3.scale.category20();
+            function createWordCloud(wordArr) {
+                d3.layout.cloud()
+                    .words(wordArr)
+                    .rotate(function() { return ~~(Math.random() * 2) * 90; })
+                    .font("Impact")
+                    .fontSize(function(d) { return d.size; })
+                    .on("end", draw)
+                    .start();
+            }
+            
+            function draw(words) {
+              d3.select("#mainbody").append("svg")
+                .attr({
+                    "width": '1000px',
+                    "height": '550px'
+                })
+                .append("g")
+                  .attr("transform", "translate(480,220)")
+                .selectAll("#mainbody")
+                  .data(words)
+                .enter().append("text")
+                  .style("font-size", function(d) { return d.size + "px"; })
+                  .style("font-family", "Impact")
+                  .style("fill", function(d, i) { return fill(i); })
+                  .attr("text-anchor", "middle")
+                  .attr("transform", function(d) {
+                    return "translate(" + [d.x, d.y+30] + ")rotate(" + d.rotate + ")";
+                  })
+                  .text(function(d) { return d.text; });
+            }
+        </script>
+    </body>
+</html>
diff --git a/hashed/web/index.jsp b/hashed/web/index.jsp
@@ -1,3 +1,6 @@
+<%
+    boolean fail = session.getAttribute("fail")!=null ? true : false;
+%>
 <!DOCTYPE html>
 <html lang="en">
     <head>
@@ -7,7 +10,7 @@
         <meta name="description" content="">
         <meta name="author" content="">
 
-        <title>#hashed</title>
+        <title>#IS434</title>
 
         <!-- Bootstrap core CSS -->
         <link href="assets/css/bootstrap.min.css" rel="stylesheet">
@@ -17,25 +20,49 @@
     </head>
 
     <body>
-        <% String currentURL = request.getRequestURL().toString();
-        String loginURL = "";
-        if (currentURL.indexOf("localhost") != -1){
-            session.setAttribute("environment", "development");
-            loginURL = "https://api.instagram.com/oauth/authorize/?client_id=ae09aaad138048e9a144317336a003f7&redirect_uri=http://localhost:8084/hashed/LoginServlet&response_type=code";
-        } else {
-            session.setAttribute("environment", "staging");
-            loginURL = "https://api.instagram.com/oauth/authorize/?client_id=bb635ec0a55d4a8e8c24b858e6e60a75&redirect_uri=http://hashed-g2t9.rhcloud.com/LoginServlet&response_type=code";
-        }%>
-
         <div class="container">
             <div class="intro-main">
-                <img class="logo img-responsive center-block" src="assets/images/hashedpink-logo.png"/>
-                <p class="header">Sharing and tagging. Made easier.</p>
+                <img class="logo img-responsive center-block" src="assets/images/pings_side.jpg"/>
+                <p class="header">Social Analytics. Made Easier.</p>
                 <p class="sub-header">
-                    A place where simplicity meets functionality, sharing and searching photos from Instagram has never been easier. 
-                    Within seconds, you will be sharing photos with the people you care about. Experience a whole new way of looking at photos with hashed.
+                    <div id="legend">
+                        <legend class="">Administrator Login</legend>
+                    </div>    
+                    <div class="row">
+                        <div
+                            class="fb-like"
+                            data-share="true"
+                            data-width="450"
+                            data-show-faces="true">
+                        </div>
+                        <% if(fail){ %>
+                        <div class="col-lg-8 col-lg-offset-2">
+                            <div class="alert alert-danger" role="alert">
+                                <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
+                                <span class="sr-only">Error:</span>
+                                Invalid Username/Password
+                            </div>
+                        </div>
+                        <% } %>
+                        <form id="login-form" action="LoginServlet" method="post" role="form" style="display: block;">
+                            <div class="col-lg-8 col-lg-offset-2">
+                                <div class="form-group">
+                                    <input type="text" name="username" id="username" tabindex="1" class="form-control" placeholder="Username" value="">
+                                </div>
+                                <div class="form-group">
+                                    <input type="password" name="password" id="password" tabindex="2" class="form-control" placeholder="Password">
+                                </div>
+                            </div>
+                            <div class="form-group">
+                                <div class="row">
+                                    <div class="col-sm-6 col-sm-offset-3">
+                                        <input type="submit" name="login-submit" id="login-submit" tabindex="4" class="form-control btn btn-login" value="Log In">
+                                    </div>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
                 </p>
-                <a href="<%=loginURL%>"><img class="sign-in" src="assets/images/signin-btn.png"/></a>    
             </div>
         </div><!-- /.container -->
 

diff --git a/hashed/web/index2.jsp b/hashed/web/index2.jsp
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="description" content="">
+        <meta name="author" content="">
+
+        <title>#hashed</title>
+
+        <!-- Bootstrap core CSS -->
+        <link href="assets/css/bootstrap.min.css" rel="stylesheet">
+
+        <!-- Custom styles for this template -->
+        <link href="assets/css/hashed.css" rel="stylesheet">
+    </head>
+
+    <body>
+        <% String currentURL = request.getRequestURL().toString();
+        String loginURL = "";
+        if (currentURL.indexOf("localhost") != -1){
+            session.setAttribute("environment", "development");
+            loginURL = "https://api.instagram.com/oauth/authorize/?client_id=ae09aaad138048e9a144317336a003f7&redirect_uri=http://localhost:8084/hashed/LoginServlet&response_type=code";
+        } else {
+            session.setAttribute("environment", "staging");
+            loginURL = "https://api.instagram.com/oauth/authorize/?client_id=bb635ec0a55d4a8e8c24b858e6e60a75&redirect_uri=http://hashed-g2t9.rhcloud.com/LoginServlet&response_type=code";
+        }%>
+
+        <div class="container">
+            <div class="intro-main">
+                <img class="logo img-responsive center-block" src="assets/images/hashedpink-logo.png"/>
+                <p class="header">Sharing and tagging. Made easier.</p>
+                <p class="sub-header">
+                    A place where simplicity meets functionality, sharing and searching photos from Instagram has never been easier. 
+                    Within seconds, you will be sharing photos with the people you care about. Experience a whole new way of looking at photos with hashed.
+                </p>
+                <a href="<%=loginURL%>"><img class="sign-in" src="assets/images/signin-btn.png"/></a>    
+            </div>
+        </div><!-- /.container -->
+
+        <!-- Bootstrap core JavaScript
+        ================================================== -->
+        <!-- Placed at the end of the document so the pages load faster -->
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+        <script src="assets/js/bootstrap.min.js"></script>
+    </body>
+</html>
diff --git a/hashed/web/is434.jsp b/hashed/web/is434.jsp
@@ -1,4 +1,5 @@
 <%@page contentType="text/html" pageEncoding="UTF-8"%>
+<jsp:include page="testuser.jsp"/> 
 
 <!DOCTYPE html>
 <html lang="en">
@@ -54,12 +55,6 @@
         <script src="assets/js/bloxhover.jquery.min.js" type="text/javascript"></script>
 
         <script>
-            //Document Ready
-            $(document).ready(function() {
-                displayPopular();
-
-            });
-
             $(window).scroll(function() {
                 if ($(this).scrollTop() > 50) {
                     $('#back-to-top').fadeIn();

diff --git a/hashed/web/sidebar.jsp b/hashed/web/sidebar.jsp
@@ -1,6 +1,3 @@
-<%@page import="controllers.AppController"%>
-<%@page import="controllers.AlbumController"%>
-<%@page import="models.User"%>
 <div class="col-sm-3 col-md-2 sidebar hidden-xs">
     <ul class="nav nav-sidebar">
         <li class="nav-logo"> 
@@ -11,30 +8,40 @@
             </span>
         </li>
     </ul>
-
+    <%
+        String url = request.getRequestURL().toString();
+    %>
     <div class="section_holder">
         <ul class="nav nav-sidebar">
-            <li class="active">Overview</li>
+            <li class="<%if(url.indexOf("is434.jsp")>=0){%>active<%}%>">
+                <a href="is434.jsp">Overview</a>
+            </li>
         </ul>
     </div>
     <div class="section_holder">
         <ul class="nav nav-sidebar">
-            <li>Facebook Insights</li>
+            <li class="<%if(url.indexOf("insights")>=0){%>active<%}%>">
+                <a href="fb_insights.jsp">Facebook Insights</a>
+            </li>
         </ul>
     </div>
     <div class="section_holder">
         <ul class="nav nav-sidebar">
-            <li>Instagram</li>
+            <li class="<%if(url.indexOf("instagram")>=0){%>active<%}%>">
+                <a href="instagram.jsp">Instagram</a>
+            </li>
         </ul>
     </div>
     <div class="section_holder">
         <ul class="nav nav-sidebar">
-            <li>Forum Crawling</li>
+            <li class="<%if(url.indexOf("forum")>=0){%>active<%}%>">
+                <a href="forum.jsp">Forum Crawling</a>
+            </li>
         </ul>
     </div>
     <div id="user_menu">
-        <div id="current_user_avatar"><img class="member_image img-rounded" src="">
-            <a id="current_user" class="overflow-ellipsis" href="index.jsp"></a>
+        <div id="current_user_avatar"><img class="member_image img-rounded" src="assets/images/anonymousUser.jpg">
+            <a id="current_user" class="overflow-ellipsis" href="is434.jsp">Administrator</a>
             <i class="glyphicon glyphicon-log-out sidebarmenuicon" data-toggle="modal" data-target="#logoutModal"></i>
         </div>
     </div>

diff --git a/hashed/web/testuser.jsp b/hashed/web/testuser.jsp
@@ -0,0 +1,3 @@
+<%if (session.getAttribute("pass")==null || (Integer)session.getAttribute("pass")!=123456){
+    response.sendRedirect("index.jsp");
+}%>