').html(event.location));
17 | return element;
18 | }
19 |
20 | // Show the current week during the semester and the first week of class otherwise.
21 | function calendarStartDate() {
22 | if (moment().isBefore(moment(endDate)) && moment().isAfter(moment(startDate))) {
23 | return moment();
24 | }
25 | return startDate;
26 | }
27 |
28 | $(document).ready(function() {
29 | $('#office-hours').fullCalendar({
30 | eventDataTransform: transform,
31 | eventRender: render,
32 | defaultView: $(window).width() >= 768 ? 'agendaWeek' : 'agendaDay',
33 | allDaySlot: false,
34 | slotEventOverlap: false,
35 | hiddenDays: [],
36 | height: "auto",
37 | minTime: "08:00:00",
38 | maxTime: "24:00:00",
39 | defaultDate: calendarStartDate(),
40 | googleCalendarApiKey: apiKey,
41 | eventSources: [
42 | {
43 | googleCalendarId: officeHoursCalendarId,
44 | cache: true,
45 | color: '#0072c1'
46 | },
47 | {
48 | googleCalendarId: instructorOfficeHoursCalendarId,
49 | cache: true,
50 | color: '#004090'
51 | },
52 | {
53 | googleCalendarId: lecturesCalendarId,
54 | cache: true,
55 | color: '#c1d6e3',
56 | textColor: '#000'
57 | }
58 | ]
59 | });
60 |
61 | $('#weekly').fullCalendar({
62 | eventDataTransform: transform,
63 | eventRender: render,
64 | defaultView: $(window).width() >= 768 ? 'agendaWeek' : 'agendaDay',
65 | allDaySlot: false,
66 | slotEventOverlap: false,
67 | weekends: true,
68 | height: "auto",
69 | minTime: "08:00:00",
70 | maxTime: "24:59:00",
71 | defaultDate: calendarStartDate(),
72 | googleCalendarApiKey: apiKey,
73 | eventSources: [
74 | {
75 | googleCalendarId: sectionsCalendarId,
76 | cache: true,
77 | color: '#0072c1'
78 | },
79 | {
80 | googleCalendarId: lecturesCalendarId,
81 | cache: true,
82 | color: '#c1d6e3',
83 | textColor: '#000'
84 | },
85 | ]
86 | });
87 | });
88 |
--------------------------------------------------------------------------------
/assets/js/config.js:
--------------------------------------------------------------------------------
1 | /* Start/end date of semester. Make sure to change utils.py as well */
2 | var startDate = '2020-08-26', endDate = '2020-12-04';
3 |
4 | /* Calendar Specification */
5 | var officeHoursCalendarId = 'c_qbhh4qrvvd5lhgnrikeh8tqhos@group.calendar.google.com';
6 | var instructorOfficeHoursCalendarId = '';
7 | var lecturesCalendarId = 'c_49p44snsa9d2roc3fv0j0h31no@group.calendar.google.com';
8 | var sectionsCalendarId = 'c_e61er5dri18gquei9i7uq9okbs@group.calendar.google.com';
9 |
--------------------------------------------------------------------------------
/assets/js/dark-mode.js:
--------------------------------------------------------------------------------
1 |
2 | // this is an easter egg so the code is intentionally messy
3 | // it activates CS 61A Dark Mode: https://github.com/PerpetualPanda/lambda-dark
4 |
5 | var a = '';
6 | var b = -770055275;
7 | document.addEventListener('keydown', function (e) {
8 | a += ("" + e.keyCode);
9 | if (a.split('').reduce((a,b)=>{a=((a<<5)-a)+b.charCodeAt(0);return a&a},0) === b) {
10 | var node = document.createElement('style');
11 | node.innerHTML = 'body{background-color:#0c0c0c;color:#ddd}code,kbd,pre,samp{background-color:#222;border:0;color:#ddd !important}p,li,ul,cite{color:#ddd}input,select{color:#ddd !important;background-color:#222 !important;border:1px solid #333 !important}.dropdown-menu{background-color:#222 !important}.dropdown-menu a{color:#ddd !important}.dropdown-menu a:hover{background-color:#444 !important}.fc-today{background:#222 !important}#office-hours td,#weekly td{border:1px solid #333 !important}#office-hours th,#office-hours tr,#weekly th,#weekly tr{border:0}.resource tr,.resource td,.resource th{background-color:#111 !important;border:1px solid #333 !important}.table-bordered{background-color:#111 !important;border:1px solid #333 !important}h1,h2,h3,h4,.navbar{color:#ddd}h1{color:#fff}header h1{color:#fff}blockquote{background-color:rgba(123,241,252,0.15)}::selection{background:#009fc0}::-moz-selection{background:#009fc0}.forecast a{background-color:rgba(255,255,255,0.5)}.announcement .header{color:#ddd}.announcement .prev:hover,.announcement .next:hover{color:#ddd}.topic header .exam-header a{color:#ddd}.topic header .glyphicon{color:#ddd}.line{border:5.5px solid #222}.due{background-color:#333}.past .event,.active .event{color:#ddd}.staffer ul{color:#ddd}table#calendar td{border:1px solid #333}table#calendar tr:not(:first-child){background-color:#111}table#calendar td.even{background-color:#222}table#calendar tr:hover td:not(.weeknum){background-color:#222}.navbar .special-box.special-box:hover{background-color:#ddd}.sidebar li{background-color:transparent !important}.sidebar li>a{background-color:transparent !important}.btn-outline{background-color:transparent}.hljs{display:block;overflow-x:auto;background:inherit;-webkit-text-size-adjust:none}.hljs,.hljs-list .hljs-built_in{color:#0149a8}.hljs-header,.hljs-important,.hljs-javadoctag,.hljs-keyword,.hljs-request,.hljs-title{font-weight:bold}.hljs-chunk,.hljs-comment{color:#738191}.hljs-addition,.hljs-argument,.hljs-blockquote,.hljs-built_in,.hljs-filename,.hljs-header,.hljs-link_label,.hljs-literal,.hljs-name,.hljs-parent,.hljs-string,.hljs-tag,.hljs-title,.hljs-value{color:#4993fc}.hljs-attr_selector,.hljs-attribute,.hljs-bullet,.hljs-decorator,.hljs-deletion,.hljs-doctype,.hljs-javadoc,.hljs-link_url,.hljs-phony,.hljs-pi,.hljs-pragma,.hljs-preprocessor,.hljs-prompt,.hljs-regexp,.hljs-shebang,.hljs-sqbracket,.hljs-string .hljs-variable,.hljs-subst,.hljs-symbol,.hljs-xmlDocTag,.hljs-yardoctag{color:#497fcc}';
12 | document.body.appendChild(node);
13 | }
14 | });
15 |
16 |
17 |
--------------------------------------------------------------------------------
/assets/js/flowchart-data.js:
--------------------------------------------------------------------------------
1 | /*
2 | Each object in the array represents a single high level category for the flowchart.
3 | The "resources" attribute contains the resources that will be displayed when the category is selected.
4 | */
5 | resourceData = [
6 | {
7 | "name": "fundamentals",
8 | "type": "category",
9 | "description": "I feel shaky about a topic and want to brush up on the fundamentals.",
10 | "resources": [
11 | {
12 | "name": "CS61A Textbook",
13 | "type": "resource",
14 | "href": "http://composingprograms.com/"
15 | },
16 | {
17 | "name": "Sequoia's Book",
18 | "type": "resource",
19 | "href": "https://sequoia-tree.github.io/"
20 | },
21 | {
22 | "name": "Guides and Practice Problems by Topic",
23 | "type": "resource",
24 | "href": "/resources.html#resource-start"
25 | }
26 | ]
27 | },
28 | {
29 | "name": "challenge",
30 | "type": "category",
31 | "description": "I feel comfortable with Discussion and Lab questions for a topic, and want more challenging practice.",
32 | "resources": [
33 | {
34 | "name": "Exam Questions on ____ in each Topic section",
35 | "type": "resource",
36 | "href": "/resources.html#resource-start"
37 | }
38 | ]
39 | },
40 | {
41 | "name": "exams",
42 | "type": "category",
43 | "description": "I am interested in studying for exams in general.",
44 | "resources": [
45 | {
46 | "name": "Studying Guide",
47 | "type": "resource",
48 | "href": "/articles/studying.html"
49 | },
50 | {
51 | "name": "Past Exams",
52 | "type": "resource",
53 | "href": "/resources.html#past-exams"
54 | },
55 | {
56 | "name": "Midterm 1 Guides and Practice Problems",
57 | "type": "resource",
58 | "href": "/resources.html#midterm-1"
59 | },
60 | {
61 | "name": "Midterm 2 Guides and Practice Problems",
62 | "type": "resource",
63 | "href": "/resources.html#midterm-2"
64 | },
65 | {
66 | "name": "Final Guides and Practice Problems",
67 | "type": "resource",
68 | "href": "/resources.html#final-exam"
69 | },
70 | {
71 | "name": "Sequoia's Book",
72 | "type": "resource",
73 | "href": "https://sequoia-tree.github.io/"
74 | },
75 | ]
76 | },
77 | {
78 | "name": "stuck",
79 | "type": "category",
80 | "description": "I am studying, but feel like I am not improving.",
81 | "resources": [
82 | {
83 | "name": "See \"Advice\" section",
84 | "type": "resource",
85 | "href": "/resources.html#advice"
86 | }
87 | ]
88 | }
89 | ]
90 |
--------------------------------------------------------------------------------
/assets/js/flowchart.js:
--------------------------------------------------------------------------------
1 | /*
2 | This file creates a flowchart from the data in ./flowchart-data.js imported as resourceData.
3 | Each category in resourceData contains a "description" correlating to a challenge a student may potentially face
4 | and an array of resources that could be helpful
5 | Each resource has a "name" and "href" that links to the location of the resource.
6 |
7 | The flowchart object is the core view that remains on the page at all times
8 | Nodes can be added with flowchart.add(
)
9 | Nodes can be removed with flowchart.remove()
10 | Styling of the flowchart and nodes must be done in this file rather than a .css file
11 | Most styles are added in the flowchart constructor - any valid css can be used
12 | Node dimensions and positions are controlled by the global vars at the top of the file
13 |
14 | cytoscape API documentation: http://js.cytoscape.org/#core
15 | */
16 |
17 | var rows = 2;
18 | var boxWidth = 250;
19 | var boxHeight = 75;
20 | var xOffset = 25;
21 | var yOffset = 50;
22 |
23 | var flowchart = window.flowchart = cytoscape({
24 | container: document.getElementById('flowchart'),
25 |
26 | boxSelectionEnabled: false,
27 | autoungrabify: true,
28 | autounselectify: true,
29 | zoomingEnabled: false,
30 | panningEnabled: true,
31 |
32 | style: [
33 | {
34 | selector: 'node',
35 | style: {
36 | 'shape': 'square',
37 | 'content': 'data(description)',
38 | 'text-valign': 'center',
39 | 'text-halign': 'center',
40 | 'font-size': '15px',
41 | 'font-family': 'Work Sans, sans-serif',
42 | 'color': '#ecf0f1',
43 | 'background-color': '#0072c1',
44 | 'width': 'data(width)',
45 | 'height': 'data(height)',
46 | 'text-wrap': 'wrap',
47 | 'text-max-width': '230px',
48 | 'padding': '0px',
49 | 'overlay-padding': 0,
50 | 'overlay-opacity': 0,
51 | }
52 | },
53 | {
54 | selector: 'core',
55 | style: {
56 | 'active-bg-opacity': 0,
57 | }
58 | }
59 | ]
60 | });
61 |
62 | displayResourceCategories();
63 |
64 | //Create and add nodes for each category in resourceData
65 | function displayResourceCategories() {
66 | flowchart.remove("node[id > '']") //remove all current nodes.
67 | cols = Math.ceil(resourceData.length / rows);
68 | nodes = []
69 | for (var i = 0; i < resourceData.length; i++) {
70 | var category = resourceData[i]
71 | var n = {
72 | group: "nodes",
73 | data: {
74 | id: category.name,
75 | type: category.type,
76 | index: i,
77 | description: category.description,
78 | width: boxWidth,
79 | height: boxHeight
80 | },
81 | position: { x: ((boxWidth/2) + xOffset) + (280*(i % cols)),
82 | y: yOffset + (100* Math.floor(i/cols))
83 | }
84 | }
85 | nodes.push(n)
86 | }
87 | flowchart.add(nodes)
88 | flowchart.reset();
89 | }
90 |
91 | //Create and add nodes for the selected category
92 | function displayResource(category) {
93 | flowchart.remove("node[id > '']") //remove all current nodes.
94 | resources = resourceData[category].resources
95 | cols = Math.ceil(resources.length / rows);
96 | nodes = []
97 | for (var i = 0; i < resources.length; i++) {
98 | var resource = resources[i]
99 | var n = {
100 | group: "nodes",
101 | data: {
102 | description: resource.name,
103 | type: resource.type,
104 | href: resource.href,
105 | width: boxWidth,
106 | height: boxHeight
107 | },
108 | position: { x: ((boxWidth/2) + xOffset) + (280*(i % cols)),
109 | y: yOffset + (100* Math.floor(i/cols))
110 | }
111 | }
112 | nodes.push(n)
113 | }
114 | backNode = {
115 | group: "nodes",
116 | data: {
117 | id: 'back', //make index?
118 | description: '< Back',
119 | type: 'back',
120 | width: '70px',
121 | height: '30px'
122 | },
123 | position: { x: (70/2) + xOffset, // 1/2 of width + offset since boxes position is based on center of rectangle.
124 | y: yOffset + (90 * rows)
125 | }
126 |
127 | }
128 | nodes.push(backNode)
129 | flowchart.add(nodes)
130 | }
131 |
132 | //Event handler for clicking nodes
133 | //Resource: redirect to resource location
134 | //Category: display resources for the category
135 | //Back: return to primary view containing all categories
136 | flowchart.on('tap', 'node', function(){
137 | if (this.data('type') === "resource") {
138 | href = this.data('href')
139 | try { // your browser may block popups
140 | window.open( href, href.charAt(0) === '/' ? '_self' : '');
141 | } catch(e){ // fall back on url change
142 | href.charAt(0) === '/' ? window.location.replace(href) : window.location.href = this.data('href');
143 | }
144 | } else if (this.data('type') === "category"){
145 | displayResource(this.data('index'));
146 | } else if (this.data('type') === 'back') {
147 | displayResourceCategories();
148 | }
149 | });
150 |
151 | flowchart.on('mouseover', 'node', function (evt) {
152 | $('html,body').css('cursor', 'pointer');
153 | evt.target.style('color', '#ffffff');
154 | evt.target.style('background-color', '#B0C4DE');
155 | } );
156 |
157 | flowchart.on('mouseout', 'node', function (evt) {
158 | $('html,body').css('cursor', 'default');
159 | evt.target.style('color', '#ecf0f1');
160 | evt.target.style('background-color', '#0072c1');
161 | });
--------------------------------------------------------------------------------
/assets/js/sketchy.js:
--------------------------------------------------------------------------------
1 | // A little library that adds a sketching button to the nav bar.
2 | // Once clicked, you can draw on a canvas on top of the page,
3 | // and then click again to hide the canvas.
4 |
5 | var makeSketchCanvas = function () {
6 | // Max canvas area (in pixels) before drawing is disabled
7 | // https://stackoverflow.com/questions/6081483/maximum-size-of-a-canvas-element
8 | const canvasMaxArea = 16e6;
9 |
10 | const activePointers = new Map();
11 |
12 | // Create the canvas and bind events
13 | const $canvas = $("