Skip to content

Commit 5ea469d

Browse files
64json64json
committed
place Scratch Paper at the footer of side menu
1 parent 6d451c1 commit 5ea469d

File tree

7 files changed

+90
-68
lines changed

7 files changed

+90
-68
lines changed

‎algorithm/category.json‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,7 @@
4545
"etc": {
4646
"name": "Uncategorized",
4747
"list": {
48-
"dp": "Dynamic Programming",
49-
"scratch_paper": "<i class='fa fa-code'></i> Scratch Paper"
48+
"dp": "Dynamic Programming"
5049
}
5150
}
5251
}

algorithm/etc/scratch_paper/scratch_paper/code.js renamed to algorithm/scratch_paper/code.js

File renamed without changes.

algorithm/etc/scratch_paper/scratch_paper/data.js renamed to algorithm/scratch_paper/data.js

File renamed without changes.

algorithm/etc/scratch_paper/desc.json renamed to algorithm/scratch_paper/desc.json

File renamed without changes.

‎css/stylesheet.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ button input {
105105
visibility: visible;
106106
}
107107

108-
.sidemenu #header {
108+
.sidemenu #footer {
109109
border-top: 2px solid rgb(44, 44, 44);
110110
}
111111

‎index.html‎

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@ <h3>
3636
<section class="sidemenu active">
3737
<div id="list">
3838
</div>
39-
<div id="header">
39+
<div id="footer">
40+
<button id="scratch-paper"><i class="fa fa-code"></i> Scratch Paper</button>
4041
<a href="https://github.com/parkjs814/AlgorithmVisualizer/wiki">
4142
<button><i class="fa fa-book"></i> Documentation</button>
4243
</a>
@@ -71,20 +72,6 @@ <h3>
7172
<section class="tab_container">
7273
<div class="tab active" id="tab_desc">
7374
<div class="wrapper">
74-
<h2 id="desc_title"></h2>
75-
<p id="desc_def"></p>
76-
<hr/>
77-
<h3>Application</h3>
78-
<ul id="desc_app"></ul>
79-
<hr/>
80-
<h3>Complexity</h3>
81-
<p>
82-
<strong>Time</strong> <span id="desc_time"></span><br/>
83-
<strong>Space</strong> <span id="desc_space"></span>
84-
</p>
85-
<hr/>
86-
<h3>Reference</h3>
87-
<ul id="desc_ref"></ul>
8875
</div>
8976
</div>
9077
<div class="tab module_container" id="tab_module">

‎js/script.js‎

Lines changed: 86 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -31,10 +31,10 @@ var initEditor = function (id) {
3131
};
3232
var dataEditor = initEditor('data');
3333
var codeEditor = initEditor('code');
34-
var lastDir = null;
34+
var lastFile = null;
3535
dataEditor.on('change', function () {
3636
var data = dataEditor.getValue();
37-
if (lastDir) cachedFile[lastDir].data = data;
37+
if (lastFile) cachedFile[lastFile].data = data;
3838
try {
3939
tm.deallocateAll();
4040
eval(data);
@@ -46,16 +46,28 @@ dataEditor.on('change', function () {
4646
});
4747
codeEditor.on('change', function () {
4848
var code = codeEditor.getValue();
49-
if (lastDir) cachedFile[lastDir].code = code;
49+
if (lastFile) cachedFile[lastFile].code = code;
5050
});
5151

5252
var cachedFile = {};
5353
var loading = false;
54+
var isScratchPaper = function (category, algorithm) {
55+
return category == null && algorithm == 'scratch_paper';
56+
};
57+
var getAlgorithmDir = function (category, algorithm) {
58+
if (isScratchPaper(category, algorithm)) return './algorithm/scratch_paper/';
59+
return './algorithm/' + category + '/' + algorithm + '/';
60+
};
61+
var getFileDir = function (category, algorithm, file) {
62+
if (isScratchPaper(category, algorithm)) return './algorithm/scratch_paper/';
63+
return './algorithm/' + category + '/' + algorithm + '/' + file + '/';
64+
};
5465
var loadFile = function (category, algorithm, file, explanation) {
5566
if (checkLoading()) return;
5667
$('#explanation').html(explanation);
5768

58-
var dir = lastDir = './algorithm/' + category + '/' + algorithm + '/' + file + '/';
69+
var dir = lastFile = getFileDir(category, algorithm, file);
70+
5971
if (cachedFile[dir] && cachedFile[dir].data !== undefined && cachedFile[dir].code !== undefined) {
6072
dataEditor.setValue(cachedFile[dir].data, -1);
6173
codeEditor.setValue(cachedFile[dir].code, -1);
@@ -87,64 +99,85 @@ var checkLoading = function () {
8799
}
88100
return false;
89101
};
90-
var loadAlgorithm = function (category, algorithm) {
91-
if (checkLoading()) return;
92-
$('#list > button').removeClass('active');
93-
$('[data-category="' + category + '"][data-algorithm="' + algorithm + '"]').addClass('active');
102+
var showDescription = function (data) {
103+
var $container = $('#tab_desc > .wrapper');
104+
$container.empty();
105+
for (var key in data) {
106+
if (key) $container.append($('<h3>').html(key));
107+
var value = data[key];
108+
if (typeof value === "string") {
109+
$container.append($('<p>').html(value));
110+
} else if (Array.isArray(value)) {
111+
var $ul = $('<ul>');
112+
$container.append($ul);
113+
value.forEach(function (li) {
114+
$ul.append($('<li>').html(li));
115+
});
116+
} else if (typeof value === "object") {
117+
var $ul = $('<ul>');
118+
$container.append($ul);
119+
for (var prop in value) {
120+
$ul.append($('<li>').append($('<strong>').html(prop)).append(' ' + value[prop]));
121+
}
122+
}
123+
}
124+
};
125+
var showAlgorithm = function (category, algorithm) {
126+
var $menu;
127+
var category_name;
128+
var algorithm_name;
129+
if (isScratchPaper(category, algorithm)) {
130+
$menu = $('#scratch-paper');
131+
category_name = '';
132+
algorithm_name = 'Scratch Paper';
133+
} else {
134+
$menu = $('[data-category="' + category + '"][data-algorithm="' + algorithm + '"]');
135+
category_name = list[category].name;
136+
algorithm_name = list[category].list[algorithm];
137+
}
138+
$('.sidemenu button').removeClass('active');
139+
$menu.addClass('active');
94140
$('#btn_desc').click();
95141

96-
$('#category').html(list[category].name);
97-
$('#algorithm, #desc_title').html(list[category].list[algorithm]);
142+
$('#category').html(category_name);
143+
$('#algorithm').html(algorithm_name);
98144
$('#tab_desc > .wrapper').empty();
99145
$('.files_bar').empty();
100146
$('#explanation').html('');
101-
lastDir = null;
147+
lastFile = null;
102148
dataEditor.setValue('');
103149
codeEditor.setValue('');
150+
};
151+
var showFiles = function (category, algorithm, files) {
152+
$('.files_bar').empty();
153+
var init = false;
154+
for (var file in files) {
155+
(function (file, explanation) {
156+
var $file = $('<button>').append(file).click(function () {
157+
loadFile(category, algorithm, file, explanation);
158+
$('.files_bar > button').removeClass('active');
159+
$(this).addClass('active');
160+
});
161+
$('.files_bar').append($file);
162+
if (!init) {
163+
init = true;
164+
$file.click();
165+
}
166+
})(file, files[file]);
167+
}
168+
};
169+
var loadAlgorithm = function (category, algorithm) {
170+
if (checkLoading()) return;
171+
showAlgorithm(category, algorithm);
172+
173+
var dir = getAlgorithmDir(category, algorithm);
104174

105-
var dir = './algorithm/' + category + '/' + algorithm + '/';
106175
$.getJSON(dir + 'desc.json', function (data) {
107176
var files = data.files;
108177
delete data.files;
109178

110-
var $container = $('#tab_desc > .wrapper');
111-
$container.empty();
112-
for (var key in data) {
113-
if (key) $container.append($('<h3>').html(key));
114-
var value = data[key];
115-
if (typeof value === "string") {
116-
$container.append($('<p>').html(value));
117-
} else if (Array.isArray(value)) {
118-
var $ul = $('<ul>');
119-
$container.append($ul);
120-
value.forEach(function (li) {
121-
$ul.append($('<li>').html(li));
122-
});
123-
} else if (typeof value === "object") {
124-
var $ul = $('<ul>');
125-
$container.append($ul);
126-
for (var prop in value) {
127-
$ul.append($('<li>').append($('<strong>').html(prop)).append(' ' + value[prop]));
128-
}
129-
}
130-
}
131-
132-
$('.files_bar').empty();
133-
var init = false;
134-
for (var file in files) {
135-
(function (file, explanation) {
136-
var $file = $('<button>').append(file).click(function () {
137-
loadFile(category, algorithm, file, explanation);
138-
$('.files_bar > button').removeClass('active');
139-
$(this).addClass('active');
140-
});
141-
$('.files_bar').append($file);
142-
if (!init) {
143-
init = true;
144-
$file.click();
145-
}
146-
})(file, files[file]);
147-
}
179+
showDescription(data);
180+
showFiles(category, algorithm, files);
148181
});
149182
};
150183
var list = {};
@@ -181,6 +214,9 @@ $.getJSON('./algorithm/category.json', function (data) {
181214
$('#powered-by').click(function () {
182215
$('#powered-by-list button').toggleClass('collapse');
183216
});
217+
$('#scratch-paper').click(function () {
218+
loadAlgorithm(null, 'scratch_paper');
219+
});
184220

185221
var sidemenu_percent;
186222
$('#navigation').click(function () {

0 commit comments

Comments
 (0)