Skip to content

Commit a4e6038

Browse files
author
minjk-bl
committed
Prevent typing to ticks label without location option
1 parent ea000e3 commit a4e6038

2 files changed

Lines changed: 51 additions & 5 deletions

File tree

‎html/m_visualize/seaborn.html‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -126,27 +126,35 @@
126126
<label>Ticks</label>
127127
<div class="vp-grid-col-p50">
128128
<input type="text" id="xticks" class="vp-input vp-state" placeholder="X ticks location: [0,1,2]" />
129-
<input type="text" id="xticks_label" class="vp-input vp-state" placeholder="X ticks label: ['a','b','c']" />
129+
<input type="text" id="xticks_label" class="vp-input vp-state"
130+
placeholder="X ticks label: ['a','b','c']"
131+
title="Enter ticks location to use label option" readonly/>
130132
</div>
131133
</div>
132134
<div class="vp-grid-col-95">
133135
<label for="xticks_rotate">Rotation</label>
134136
<input type="number" id="xticks_rotate" class="vp-input vp-state" placeholder="45" step="5" />
135137
</div>
136-
<label><input type="checkbox" id="removeXticks" class="vp-state"/><span>Remove X ticks</span></label>
138+
<div>
139+
<label><input type="checkbox" id="removeXticks" class="vp-state"/><span>Remove X ticks</span></label>
140+
</div>
137141
<label for="yticks" class="vp-tab-group-title">Y ticks</label>
138142
<div class="vp-grid-col-95">
139143
<label>Ticks</label>
140144
<div class="vp-grid-col-p50">
141-
<input type="text" id="yticks" class="vp-input vp-state" placeholder="Y ticks location" />
142-
<input type="text" id="yticks_label" class="vp-input vp-state" placeholder="Y ticks label" />
145+
<input type="text" id="yticks" class="vp-input vp-state" placeholder="Y ticks location: [0,1,2]" />
146+
<input type="text" id="yticks_label" class="vp-input vp-state"
147+
placeholder="Y ticks label: ['a','b','c']"
148+
title="Enter ticks location to use label option" readonly/>
143149
</div>
144150
</div>
145151
<div class="vp-grid-col-95">
146152
<label for="yticks_rotate">Rotation</label>
147153
<input type="number" id="yticks_rotate" class="vp-input vp-state" placeholder="45" step="5" />
148154
</div>
149-
<label><input type="checkbox" id="removeYticks" class="vp-state"/><span>Remove Y ticks</span></label>
155+
<div>
156+
<label><input type="checkbox" id="removeYticks" class="vp-state"/><span>Remove Y ticks</span></label>
157+
</div>
150158
</div>
151159
<div class="vp-tab-page vp-grid-box" data-type="info" style="display: none;">
152160
<label for="title" class="vp-bold">Title</label>

‎js/m_visualize/Seaborn.js‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -216,6 +216,36 @@ define([
216216
$(that.wrapSelector('#color')).prop('disabled', $(this).prop('checked') == false);
217217
});
218218

219+
// axes - ticks location
220+
$(this.wrapSelector('#xticks')).on('change', function() {
221+
let val = $(this).val();
222+
if (val !== '') {
223+
// enable xticks_label
224+
$(that.wrapSelector('#xticks_label')).prop('readonly', false);
225+
} else {
226+
// disable xticks_label
227+
$(that.wrapSelector('#xticks_label')).prop('readonly', true);
228+
}
229+
});
230+
$(this.wrapSelector('#yticks')).on('change', function() {
231+
let val = $(this).val();
232+
if (val !== '') {
233+
// enable yticks_label
234+
$(that.wrapSelector('#yticks_label')).prop('readonly', false);
235+
} else {
236+
// disable yticks_label
237+
$(that.wrapSelector('#yticks_label')).prop('readonly', true);
238+
}
239+
});
240+
241+
// axes - ticks label: inform user to type location option to use label
242+
$(this.wrapSelector('#xticks_label[readonly]')).on('click', function() {
243+
$(that.wrapSelector('#xticks')).focus();
244+
});
245+
$(this.wrapSelector('#yticks_label[readonly]')).on('click', function() {
246+
$(that.wrapSelector('#yticks')).focus();
247+
});
248+
219249
// preview refresh
220250
$(this.wrapSelector('#previewRefresh')).on('click', function() {
221251
that.loadPreview();
@@ -319,6 +349,14 @@ define([
319349
});
320350
$(page).find('#markerStyle').html(markerTag.toString());
321351

352+
// x, yticks label check
353+
if (this.state.xticks && this.state.xticks !== '') {
354+
$(page).find('#xticks_label').prop('readonly', false);
355+
}
356+
if (this.state.yticks && this.state.yticks !== '') {
357+
$(page).find('#yticks_label').prop('readonly', false);
358+
}
359+
322360
// preview sample count
323361
let sampleCountList = [30, 50, 100, 300, 500, 700, 1000];
324362
let sampleCountTag = new com_String();

0 commit comments

Comments
 (0)