Skip to content

Instantly share code, notes, and snippets.

@likuilin
Last active October 4, 2019 21:13
Show Gist options
  • Save likuilin/f72acb4a92e51a28537c815bc2b3b11e to your computer and use it in GitHub Desktop.
Save likuilin/f72acb4a92e51a28537c815bc2b3b11e to your computer and use it in GitHub Desktop.
// ==UserScript==
// @name 391 Queue Map
// @version 0.1
// @author kuilin
// @match *://ece391test.web.illinois.edu/*
// @grant none
// @updateURL https://gist.githubusercontent.com/likuilin/f72acb4a92e51a28537c815bc2b3b11e/raw/ece391_queue_map.user.js
// ==/UserScript==
(function() {
'use strict';
const sidebar = document.querySelector(".container-fluid>.row>.col-md-3>.row");
const map = document.createElement("div");
map.className = "row";
// Shamelessly stolen from the course website tracker, with small modifications (viewBox, styling)
// Margin bottom is to fix bouncy scrollbar issue
map.innerHTML = `
<div class="col-md-12 mt-2" style="margin-bottom: 5rem">
<div class="card">
<div class="card-header">Map</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="" app-context="doc-2d" x="0px" y="0px" id="labtrack" viewBox="50 35 430 330">
<title/>
<desc/>
<defs/>
<g id="jvs-guides" transform="matrix(1 0 0 1 0 0)"/>
<g id="jvs-content" enable-background="new">
<g transform="matrix(1,0,0,1,0,0)" name="Layer" jvs-layer-color="#fb0094" class="jvs-layer selected">
<rect transform="matrix(1 0 0 1 35 35)" width="450" height="330" fill="#ececec" opacity="1" rx="0" y="0" x="0"/>
<!-- wall by door -->
<rect class="usage-info" id="ECEB-3026-01" transform="matrix(1 0 0 1 260 340)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-01-text" fill="#ececec" x="270" y="355" font-family="Ubuntu" font-size="15" font-weight="bold">01</text>
<rect class="usage-info" id="ECEB-3026-02" transform="matrix(1 0 0 1 320 340)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-02-text" fill="#ececec" x="330" y="355" font-family="Ubuntu" font-size="15" font-weight="bold">02</text>
<rect class="usage-info" id="ECEB-3026-03" transform="matrix(1 0 0 1 380 340)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-03-text" fill="#ececec" x="390" y="355" font-family="Ubuntu" font-size="15" font-weight="bold">03</text>
<rect class="usage-info" id="ECEB-3026-04" transform="matrix(1 0 0 1 440 340)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-04-text" fill="#ececec" x="450" y="355" font-family="Ubuntu" font-size="15" font-weight="bold">04</text>
<!-- row 1 -->
<rect class="usage-info" id="ECEB-3026-10" transform="matrix(1 0 0 1 140 280)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-10-text" fill="#ececec" x="150" y="295" font-family="Ubuntu" font-size="15" font-weight="bold">10</text>
<rect class="usage-info" id="ECEB-3026-09" transform="matrix(1 0 0 1 200 280)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-09-text" fill="#ececec" x="210" y="295" font-family="Ubuntu" font-size="15" font-weight="bold">09</text>
<rect class="usage-info" id="ECEB-3026-08" transform="matrix(1 0 0 1 260 280)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-08-text" fill="#ececec" x="270" y="295" font-family="Ubuntu" font-size="15" font-weight="bold">08</text>
<rect class="usage-info" id="ECEB-3026-07" transform="matrix(1 0 0 1 320 280)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-07-text" fill="#ececec" x="330" y="295" font-family="Ubuntu" font-size="15" font-weight="bold">07</text>
<rect class="usage-info" id="ECEB-3026-06" transform="matrix(1 0 0 1 380 280)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-06-text" fill="#ececec" x="390" y="295" font-family="Ubuntu" font-size="15" font-weight="bold">06</text>
<rect class="usage-info" id="ECEB-3026-05" transform="matrix(1 0 0 1 440 280)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-05-text" fill="#ececec" x="450" y="295" font-family="Ubuntu" font-size="15" font-weight="bold">05</text>
<rect class="usage-info" id="ECEB-3026-11" transform="matrix(1 0 0 1 140 255)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-11-text" fill="#ececec" x="150" y="270" font-family="Ubuntu" font-size="15" font-weight="bold">11</text>
<rect class="usage-info" id="ECEB-3026-12" transform="matrix(1 0 0 1 200 255)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-12-text" fill="#ececec" x="210" y="270" font-family="Ubuntu" font-size="15" font-weight="bold">12</text>
<rect class="usage-info" id="ECEB-3026-13" transform="matrix(1 0 0 1 260 255)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-13-text" fill="#ececec" x="270" y="270" font-family="Ubuntu" font-size="15" font-weight="bold">13</text>
<rect class="usage-info" id="ECEB-3026-14" transform="matrix(1 0 0 1 320 255)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-14-text" fill="#ececec" x="330" y="270" font-family="Ubuntu" font-size="15" font-weight="bold">14</text>
<rect class="usage-info" id="ECEB-3026-15" transform="matrix(1 0 0 1 380 255)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-15-text" fill="#ececec" x="390" y="270" font-family="Ubuntu" font-size="15" font-weight="bold">15</text>
<rect class="usage-info" id="ECEB-3026-16" transform="matrix(1 0 0 1 440 255)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-16-text" fill="#ececec" x="450" y="270" font-family="Ubuntu" font-size="15" font-weight="bold">16</text>
<!-- row 2 -->
<rect class="usage-info" id="ECEB-3026-22" transform="matrix(1 0 0 1 140 200)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-22-text" fill="#ececec" x="150" y="215" font-family="Ubuntu" font-size="15" font-weight="bold">22</text>
<rect class="usage-info" id="ECEB-3026-21" transform="matrix(1 0 0 1 200 200)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-21-text" fill="#ececec" x="210" y="215" font-family="Ubuntu" font-size="15" font-weight="bold">21</text>
<rect class="usage-info" id="ECEB-3026-20" transform="matrix(1 0 0 1 260 200)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-20-text" fill="#ececec" x="270" y="215" font-family="Ubuntu" font-size="15" font-weight="bold">20</text>
<rect class="usage-info" id="ECEB-3026-19" transform="matrix(1 0 0 1 320 200)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-19-text" fill="#ececec" x="330" y="215" font-family="Ubuntu" font-size="15" font-weight="bold">19</text>
<rect class="usage-info" id="ECEB-3026-18" transform="matrix(1 0 0 1 380 200)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-18-text" fill="#ececec" x="390" y="215" font-family="Ubuntu" font-size="15" font-weight="bold">18</text>
<rect class="usage-info" id="ECEB-3026-17" transform="matrix(1 0 0 1 440 200)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-17-text" fill="#ececec" x="450" y="215" font-family="Ubuntu" font-size="15" font-weight="bold">17</text>
<rect class="usage-info" id="ECEB-3026-23" transform="matrix(1 0 0 1 140 175)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-23-text" fill="#ececec" x="150" y="190" font-family="Ubuntu" font-size="15" font-weight="bold">23</text>
<rect class="usage-info" id="ECEB-3026-24" transform="matrix(1 0 0 1 200 175)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-24-text" fill="#ececec" x="210" y="190" font-family="Ubuntu" font-size="15" font-weight="bold">24</text>
<rect class="usage-info" id="ECEB-3026-25" transform="matrix(1 0 0 1 260 175)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-25-text" fill="#ececec" x="270" y="190" font-family="Ubuntu" font-size="15" font-weight="bold">25</text>
<rect class="usage-info" id="ECEB-3026-26" transform="matrix(1 0 0 1 320 175)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-26-text" fill="#ececec" x="330" y="190" font-family="Ubuntu" font-size="15" font-weight="bold">26</text>
<rect class="usage-info" id="ECEB-3026-27" transform="matrix(1 0 0 1 380 175)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-27-text" fill="#ececec" x="390" y="190" font-family="Ubuntu" font-size="15" font-weight="bold">27</text>
<rect class="usage-info" id="ECEB-3026-28" transform="matrix(1 0 0 1 440 175)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-28-text" fill="#ececec" x="450" y="190" font-family="Ubuntu" font-size="15" font-weight="bold">28</text>
<!-- row 3 -->
<rect class="usage-info" id="ECEB-3026-34" transform="matrix(1 0 0 1 140 120)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-34-text" fill="#ececec" x="150" y="135" font-family="Ubuntu" font-size="15" font-weight="bold">34</text>
<rect class="usage-info" id="ECEB-3026-33" transform="matrix(1 0 0 1 200 120)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-33-text" fill="#ececec" x="210" y="135" font-family="Ubuntu" font-size="15" font-weight="bold">33</text>
<rect class="usage-info" id="ECEB-3026-32" transform="matrix(1 0 0 1 260 120)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-32-text" fill="#ececec" x="270" y="135" font-family="Ubuntu" font-size="15" font-weight="bold">32</text>
<rect class="usage-info" id="ECEB-3026-31" transform="matrix(1 0 0 1 320 120)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-31-text" fill="#ececec" x="330" y="135" font-family="Ubuntu" font-size="15" font-weight="bold">31</text>
<rect class="usage-info" id="ECEB-3026-30" transform="matrix(1 0 0 1 380 120)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-30-text" fill="#ececec" x="390" y="135" font-family="Ubuntu" font-size="15" font-weight="bold">30</text>
<rect class="usage-info" id="ECEB-3026-29" transform="matrix(1 0 0 1 440 120)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-29-text" fill="#ececec" x="450" y="135" font-family="Ubuntu" font-size="15" font-weight="bold">29</text>
<rect class="usage-info" id="ECEB-3026-35" transform="matrix(1 0 0 1 140 95)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-35-text" fill="#ececec" x="150" y="110" font-family="Ubuntu" font-size="15" font-weight="bold">35</text>
<rect class="usage-info" id="ECEB-3026-36" transform="matrix(1 0 0 1 200 95)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-36-text" fill="#ececec" x="210" y="110" font-family="Ubuntu" font-size="15" font-weight="bold">36</text>
<rect class="usage-info" id="ECEB-3026-37" transform="matrix(1 0 0 1 260 95)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-37-text" fill="#ececec" x="270" y="110" font-family="Ubuntu" font-size="15" font-weight="bold">37</text>
<rect class="usage-info" id="ECEB-3026-38" transform="matrix(1 0 0 1 320 95)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-38-text" fill="#ececec" x="330" y="110" font-family="Ubuntu" font-size="15" font-weight="bold">38</text>
<rect class="usage-info" id="ECEB-3026-39" transform="matrix(1 0 0 1 380 95)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-39-text" fill="#ececec" x="390" y="110" font-family="Ubuntu" font-size="15" font-weight="bold">39</text>
<rect class="usage-info" id="ECEB-3026-40" transform="matrix(1 0 0 1 440 95)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-40-text" fill="#ececec" x="450" y="110" font-family="Ubuntu" font-size="15" font-weight="bold">40</text>
<!-- windows -->
<rect class="usage-info" id="ECEB-3026-44" transform="matrix(1 0 0 1 260 40)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-44-text" fill="#ececec" x="270" y="55" font-family="Ubuntu" font-size="15" font-weight="bold">44</text>
<rect class="usage-info" id="ECEB-3026-43" transform="matrix(1 0 0 1 320 40)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-43-text" fill="#ececec" x="330" y="55" font-family="Ubuntu" font-size="15" font-weight="bold">43</text>
<rect class="usage-info" id="ECEB-3026-42" transform="matrix(1 0 0 1 380 40)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-42-text" fill="#ececec" x="390" y="55" font-family="Ubuntu" font-size="15" font-weight="bold">42</text>
<rect class="usage-info" id="ECEB-3026-41" transform="matrix(1 0 0 1 440 40)" width="35" height="20" opacity="1" rx="0" y="0" x="0"/>
<text class="usage-info" id="ECEB-3026-41-text" fill="#ececec" x="450" y="55" font-family="Ubuntu" font-size="15" font-weight="bold">41</text>
</g>
</g>
</svg>
</div>
</div>
`;
sidebar.parentNode.insertBefore(map, sidebar.nextSibling);
document.querySelectorAll(".content .list-group-item").forEach(elem=>{
let machine = elem.querySelector(".col-md-3").innerText.match(/(\d+)\s*$/);
if (!machine || !machine.length) return;
machine = parseInt(machine.pop(), 10);
if (machine <= 0 || machine > 44 || isNaN(machine)) return;
machine = document.getElementById("ECEB-3026-" + machine.toString(10).padStart(2, 0));
if (!machine) return;
elem.addEventListener("mouseover", e=>(machine.style.fill = "red"));
elem.addEventListener("mouseout", e=>(machine.style.fill = ""));
});
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment