Skip to content

Commit 0110760

Browse files
risenWrisenW
committed
add auto heigth to code cell
1 parent d6d9e18 commit 0110760

3 files changed

Lines changed: 83 additions & 46 deletions

File tree

‎notebookjs/src/public/javascripts/index.js‎

Lines changed: 70 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -11,46 +11,66 @@ const editor = CodeMirror(document.getElementById('div-1'), {
1111
let vars_in_scope = {
1212
"div-1": editor
1313
}
14-
15-
function exec_cell(id, count) {
16-
17-
let global_scope = ("global", eval)(vars_in_scope[id].getValue())
18-
19-
if(Array.isArray(global_scope)){
20-
global_scope = print_val(global_scope)
14+
let __cells_count = 1
15+
16+
function exec_cell(c_id) {
17+
let id = c_id.split("_")[1]
18+
let count = c_id.split("-")[1]
19+
20+
try {
21+
let global_scope = ("global", eval)(vars_in_scope[id].getValue())
22+
if (Array.isArray(global_scope)) {
23+
global_scope = print_val(global_scope)
24+
}
25+
$(`#out_${id}`).html(global_scope || "");
26+
27+
count = parseInt(count) + 1
28+
let div_count = `div-${count}`
29+
30+
// if (!(div_count in vars_in_scope)) {
31+
// // add_new_code_cell(id, 'down')
32+
// // $("#container").append(
33+
// // `<div id=${div_count} class=""></div><br />
34+
// // <button style="color: black;" id=run_${div_count} class="run">Run</button>
35+
// // <div id=out_${div_count}></div><br />`
36+
// // )
37+
38+
// // let editor = CodeMirror(document.getElementById(`${div_count}`), {
39+
// // lineNumbers: true,
40+
// // tabSize: 2,
41+
// // mode: 'javascript',
42+
// // theme: 'monokai',
43+
// // extraKeys: {"Ctrl-Space": "autocomplete"},
44+
// // value: ''
45+
// // });
46+
47+
// // // editor.setSize(10, 10);
48+
49+
// // vars_in_scope[div_count] = editor;
50+
51+
// }
52+
53+
} catch (error) {
54+
$(`#out_${id}`).html(error)
2155
}
22-
$(`#out_${id}`).html(global_scope || "");
23-
24-
count = parseInt(count) + 1
25-
let div_count = `div-${count}`
26-
27-
if (!(div_count in vars_in_scope)) {
28-
$("#container").append(
29-
`<div id=${div_count} class=""></div><br />
30-
<button style="color: black;" id=run_${div_count} class="run">Run</button>
31-
<div id=out_${div_count}></div><br />`
32-
)
33-
34-
let editor = CodeMirror(document.getElementById(`${div_count}`), {
35-
lineNumbers: true,
36-
tabSize: 2,
37-
mode: 'javascript',
38-
theme: 'monokai',
39-
value: ''
40-
});
4156

57+
}
4258

43-
vars_in_scope[div_count] = editor;
59+
function add_new_code_cell(c_id, where) {
60+
__cells_count += 1
61+
let last_scope_id = parseInt(Object.keys(vars_in_scope).pop().split("-")[1])
62+
let id = c_id.split("-")[1]
4463

64+
if (where == "down") {
65+
where = "down"
66+
} else {
67+
where = "up"
4568
}
4669

47-
}
48-
49-
function add_new_code_cell(id, last_scope_id, where) {
5070
let new_id = parseInt(last_scope_id) + 1
5171
let parent_cell_id = `cell-${id}`
5272
let html = `
53-
<div class="row" style="margin-top: 50px;" id="cell-${new_id}">
73+
<div class="row" style="margin-top: 10px;" id="cell-${new_id}">
5474
<div class="col-md-1">
5575
<p id="cell-num" class="code_symbol">[${new_id}]</p>
5676
</div>
@@ -60,7 +80,7 @@ function add_new_code_cell(id, last_scope_id, where) {
6080
class="fas fa-play"></i>Run</button>
6181
<div class="btn-group" role="group" aria-label="Basic example">
6282
63-
<button type="button" id="add_code_down_btn-${new_id}" class="btn btn-info add-code">
83+
<button type="button" id="add_code_down_btn-${new_id}" class="btn btn-sm btn-info add-code">
6484
<i class="fas fa-sort-down" style="margin-top: -10px;"></i> Code
6585
</button>
6686
<button type="button" id="add_code_up_btn-${new_id}" class="btn btn-sm btn-info add-code">
@@ -81,7 +101,7 @@ function add_new_code_cell(id, last_scope_id, where) {
81101
82102
<button type="button" id="del_btn-${new_id}" class="btn btn-sm btn-danger del"><i
83103
class="fas fa-trash-alt"></i>
84-
Delete</button>
104+
</button>
85105
</div>
86106
87107
</div>
@@ -123,18 +143,25 @@ function add_new_text_cell(id, count) {
123143
}
124144

125145
function delete_cell(id) {
126-
row_id = `cell-${Number(id)}`
127-
var div_ele = document.getElementById(row_id);
128-
div_ele.parentNode.removeChild(div_ele);
146+
if (__cells_count == 1){
147+
document.getElementsByClassName("del").disable = true
148+
}else{
149+
row_id = `cell-${Number(id)}`
150+
var div_ele = document.getElementById(row_id);
151+
div_ele.parentNode.removeChild(div_ele);
152+
__cells_count -= 1
153+
}
154+
155+
129156

130157
}
131158

132159
$(document).on("click", "button.run", function () {
133-
let id = this.id.split("_")[1]
134-
let count = this.id.split("-")[1]
160+
// let id = this.id.split("_")[1]
161+
// let count = this.id.split("-")[1]
135162
// console.log(id);
136163
// console.log(count);
137-
exec_cell(id, count);
164+
exec_cell(this.id);
138165
})
139166

140167
$(document).on("click", "button.del", function () {
@@ -144,14 +171,15 @@ $(document).on("click", "button.del", function () {
144171
})
145172

146173
$(document).on("click", "button.add-code", function () {
147-
let last_cell_in_scope = parseInt(Object.keys(vars_in_scope).pop().split("-")[1])
148-
let id = this.id.split("-")[1]
174+
// let last_cell_in_scope = parseInt(Object.keys(vars_in_scope).pop().split("-")[1])
175+
// let id = this.id.split("-")[1]
149176

150177
let where;
151178
if (this.id.split("_").includes("down")) {
152179
where = "down"
153180
} else {
154181
where = "up"
155182
}
156-
add_new_code_cell(id, last_cell_in_scope, where)
183+
add_new_code_cell(this.id, where)
184+
// add_new_code_cell(id, last_cell_in_scope, where)
157185
})

‎notebookjs/src/public/stylesheets/style.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,13 @@ a {
1717

1818
.code_symbol{
1919
margin-left: 40px;
20+
}
21+
22+
.CodeMirror {
23+
border: 1px solid #eee;
24+
height: auto;
25+
}
26+
27+
.out-divs{
28+
height: auto;
2029
}

‎notebookjs/src/views/index.hbs‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,11 @@
1717
<div id="div-1" class="col-md-11">
1818
<div class="btn-group-horizontal">
1919
<button type="button" id="run_div-1" class="btn btn-sm btn-success run"><i
20-
class="fas fa-play"></i>Run</button>
20+
class="fas fa-play"></i> Run</button>
2121

2222
<div class="btn-group" role="group" aria-label="Basic example">
23-
<button type="button" id="add_code_down_btn-1" class="btn btn-info add-code">
24-
<i class="fas fa-sort-down" style="margin-top: -10px;"></i> Code
23+
<button type="button" id="add_code_down_btn-1" class="btn btn-sm btn-info add-code">
24+
<i class="fas fa-sort-down"></i> Code
2525
</button>
2626
<button type="button" id="add_code_up_btn-1" class="btn btn-sm btn-info add-code">
2727
<i class="fas fa-sort-up"></i> Code
@@ -41,7 +41,7 @@
4141

4242
<button type="button" id="del_btn-1" class="btn btn-sm btn-danger del"><i
4343
class="fas fa-trash-alt"></i>
44-
Delete</button>
44+
</button>
4545
</div>
4646

4747
</div>

0 commit comments

Comments
 (0)