-
Notifications
You must be signed in to change notification settings - Fork 0
/
scripts.js
245 lines (235 loc) · 11.6 KB
/
scripts.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
//Creating code mirror instance
var textArea = document.getElementById("outputTextArea");
var CodeMirrorInstance = CodeMirror.fromTextArea(textArea,{mode : "text/x-python",readOnly : true});
function addLine(type){
const lines = {
var : '<div id="varNO" class="line item"><span class="line_handle">drag_indicator</span><input onchange="setVariableLists(); writeCode();" type="text" name="variables" class="oneChar form-control" maxlength="1"><span>est un(e)</span><select class="form-control" onchange="writeCode()"><option value="int">Entier</option><option value="float">Flottant</option><option value="str">Chaine de charactère</option></select><button onclick="delLine($(this))" class="button-control remove-button">×</button></div>',
input : '<div id="inputNO" class="line item"><span class="line_handle">drag_indicator</span><span>Demander </span><select class="form-control var-list" onchange="writeCode()"></select><button onclick="delLine($(this))" class="button-control remove-button">×</button></div>',
process : '<div id="processNO" class="line item"><span class="line_handle">drag_indicator</span><select class="form-control var-list" id="process1Var" onchange="writeCode()"></select><span>Prend la valeur</span><input type="text" name="calculus" class="form-control short process-element" onchange="writeCode(); checkVariable($(this))"><select class="form-control process-element" onchange="writeCode(); deleteIfNull($(this))"><option value=""></option><option value="+">+</option><option value="-">-</option><option value="*">×</option><option value="/">÷</option><option value="**">^</option></select><input type="text" name="calculus" class="form-control short process-element" onchange="writeCode(); checkVariable($(this))"><button onclick="addProcessElement($(this).parent()); writeCode();" class="button-control element-adder">+</button><button onclick="delLine($(this))" class="button-control remove-button">×</button></div>',
output : '<div id="outputNO" class="line item"><span class="line_handle">drag_indicator</span><span>Afficher </span><input type="text" class="form-control" onchange="writeCode()"><select class="form-control swicher" onchange="swichOutputMode($(this).parent())"><option value="text">Texte</option><option value="var">Variable</option></select><button onclick="delLine($(this))" class="button-control remove-button">×</button></div>'
}
$("#"+type).append(lines[type]);
var newId = getNewId(type);
$("#"+type+"NO").attr("id", newId);
setVariableLists($("#" + newId));
writeCode();
}
function getNewId(type){
var no = -1
for(var i = 1; i <= getLinesNumber(type); i++){
if($("#" + type + i).val() == undefined){
no = i;
}
}
if(no == -1){ //If no is still undefined
no = getLinesNumber(type)+1;
}
return type+no
}
function delLine(line){
line.parent().fadeOut(100,function(){
line.parent().remove();
setVariableLists()
writeCode()
});
}
function delLastLine(type){
var nbrLine = $("#"+type+" .line").length
if (nbrLine > 2) { //S'il y a plus de 2 ligne on supprime la dernière
$("#"+type + nbrLine).remove();
}
else if(nbrLine == 2){ //Si il y en a 2 on supprime juste la dernière et la croix
$("#"+type + nbrLine).remove();
$("#"+type +" .remove-button").remove();
}
if (type == 'var') {
setVariableLists(undefined) //TODO : mettre en 2ieme argument la variable quil faut supprimer
}
writeCode()
}
function getValues(type,formType){
var arrayReturned = []
var tempValue
for (var i = 0; i < getLinesNumber(type) ; i++) {
tempValue = $("#"+get_line_id(i,type)+" "+formType).val()
if (tempValue != "") {
arrayReturned.push(tempValue)
}
}
return arrayReturned
}
function setVariableLists(element, variable){ //TODO : mettre en 2ieme argument la variable quil faut supprimer
if (element == undefined) {
$(".var-list option").remove()
for (var i = 0; i < getValues('var','input').length; i++) {
$(".var-list").append('<option value="'+getValues('var','input')[i]+'">'+getValues('var','input')[i]+'</option>')
}
} else if(element != undefined && variable == undefined){
element.children(".var-list").children("option").remove()
for (var i = 0; i < getValues('var','input').length; i++) {
element.children(".var-list").append('<option value="'+getValues('var','input')[i]+'">'+getValues('var','input')[i]+'</option>')
}
}
}
function getLinesNumber(type){
return $("#"+ type + " .line").length
}
function writeCode(){
CodeMirrorInstance.setValue("") //We clean the output
//Variables & input
for(var i = 0; i < getLinesNumber("var") ; i++){ //For each variable
if ($("#" + get_line_id(i,"var") + " input").val() && $("#" + get_line_id(i,"var") + " input").val() != '') {
if (getValues("input","select").includes($("#" + get_line_id(i,"var") + " input").val())) {//if element is input list
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + $("#" + get_line_id(i,"var") + " input").val() + " = "+ $("#" + get_line_id(i,"var") + " select").val() + "(input('Entrez "+ $("#" + get_line_id(i,"var") + " input").val() +" :')) \n")
} else{
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + $("#" + get_line_id(i,"var") + " input").val() + " = " + $("#" + get_line_id(i,"var") + " select").val() + "() \n")
}
$("#" + get_line_id(i,"var") + " input").attr("value",$("#" + get_line_id(i,"var") + " input").val());
}
}
//Process
for(var i = 0; i < getLinesNumber("process") ; i++){ //Foreach process element
if(get_var_type($("#" + get_line_id(i,"process") + " select").val()) == "str" && $("#" + get_line_id(i,"process") + " .text-element").length == 0){
//If its a string, then string input
$('#'+get_line_id(i,"process") + ' .process-element, #' + get_line_id(i,"process") + ' .element-adder').remove()
$('#'+get_line_id(i,"process")).append(" <input type=\"text\" class=\"process-element text-element form-control\" onchange=\"writeCode()\"></input>")
inputType = 'str'
}
else if(get_var_type($("#" + get_line_id(i,"process") + " select").val()) != "str" && $("#" + get_line_id(i,"process") + " .short").length == 0){
//if not a string
$('#'+get_line_id(i,"process") + ' .process-element').remove()
$('#'+get_line_id(i,"process")).append(' <input type="text" name="calculus" class="form-control short process-element" onchange="writeCode(); checkVariable($(this))"><select class="form-control process-element" onchange="writeCode(); deleteIfNull($(this))"><option value=""></option><option value="+">+</option><option value="-">-</option><option value="*">×</option><option value="/">÷</option><option value="**">^</option></select><input type="text" name="calculus" class="form-control short process-element" onchange="writeCode(); checkVariable($(this))"><button onclick="addProcessElement($(this).parent()); writeCode();" class="button-control element-adder">+</button>');
}
if($("#" + get_line_id(i,"process") + " select").val() && $("#" + get_line_id(i,"process") + " select").val() != null){
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + $("#" + get_line_id(i,"process") + " select").val() + " = ") // To improve
if(get_var_type($("#" + get_line_id(i,"process") + " select").val()) == 'str'){
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + '"' + $("#" + get_line_id(i,"process") + " .process-element").val() + '"')
}
else{
for (var j = 0; j < $("#"+ get_line_id(i,"process") + " .process-element").length ; j++) {
/*$($("#process" + i + " .process-element")[j])*/
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + $($("#" + get_line_id(i,"process") + " .process-element")[j]).val())
}
}
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + "\n")
}
}
//Output
for(var i = 0; i < getLinesNumber("output") ; i++){ //foreach output element
if($('#' + get_line_id(i,"output") + ' input').length == 1 //If it's text
&& $('#' + get_line_id(i,"output") + ' input').val()
&& $('#' + get_line_id(i,"output") + ' input').val() != "")
{
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + "print('"+ $('#' + get_line_id(i,"output") + ' input').val() + "') \n")
}
else if($('#' + get_line_id(i,"output") + ' select').length == 2 //Else if it's a variable
&& $('#' + get_line_id(i,"output") + ' select').val() != null)
{
CodeMirrorInstance.setValue(
CodeMirrorInstance.getValue() + "print("+ $('#' + get_line_id(i,"output") + ' select').val() + ") \n")
}
}
}
function toggleMenu(){
if ($( window ).scrollTop() > $("header").outerHeight()) {
$("nav").css({
top: 0
})
} else{
$("nav").css({
top: $("header").outerHeight()-$( window ).scrollTop() //Makes the menu stick the header
})
}
$("nav").animate({
left: parseInt($("nav").css('left'),10) == 0 ? -$("nav").outerWidth() : 0
});
}
function deleteIfNull(list){
if (list.val() == "") {
if (list.next().is("input")) {
list.next().remove()
}
list.remove()
}
}
function checkVariable(input){
if (!(getValues("var","input").includes(input.val())) && isNaN(input.val()) && input.val() != ""){
input.css({
color:"red",
fontWeight: "bold"
});
input.attr("title","Cette variable n'a pas été déclarée");
}
else{
input.css({
color:"black",
fontWeight: "normal"
});
input.attr("title","");
}
}
function addProcessElement(line){
var lastElement = $(last_of_array($("#" + $(line).attr('id') + " .process-element")))
if (lastElement.is("select")) {
$('<input type="text" name="calculus" class="form-control short process-element" onchange="writeCode(); checkVariable($(this))">').insertBefore("#" + $(line).attr('id') + " .element-adder");
} else{
$('<select class="form-control process-element" onchange="writeCode(); deleteIfNull($(this))"><option value=""></option><option value="+">+</option><option value="-">-</option><option value="*">×</option><option value="/">÷</option><option value="**">^</option></select>'
).insertBefore("#" + $(line).attr('id') + " .element-adder");
}
}
function swichOutputMode(line){
if($('#' + $(line).attr('id') + ' input').length == 1){
$('#' + $(line).attr('id') + ' input').remove()
$($('#' + $(line).attr('id') + ' span')[1]).after('<select class="form-control var-list" onchange="writeCode()"></select>')
} else if($('#' + $(line).attr('id') + ' select').length == 2){
$('#' + $(line).attr('id') + ' select')[0].remove()
$($('#' + $(line).attr('id') + ' span')[1]).after('<input type="text" class="form-control" onchange="writeCode()" width="">')
}
setVariableLists()
writeCode()
}
$(function() {
//Making elements tiles sortable
$('.element').sortable({
handle: ".line_handle"
});
//Making sure everithing is coordinated in the ouput
$("#output .swicher").val("text")
$('.CodeMirror').height($('#inputForm').outerHeight()-2)
setVariableLists();
writeCode();
$("nav").css({
top: $("header").outerHeight()-$( window ).scrollTop() //Makes the menu stick the header
})
$(".line-adder").outerHeight($(".line-adder").outerWidth()) //Chrome bug
});
$( ".element" ).sortable({
update: function( event, ui ) {writeCode();}
});
$( window ).resize(function() {
$("nav").css({
top: $("header").outerHeight()
})
$('.CodeMirror').height($('#inputForm').outerHeight()-2)
});
$( window ).scroll(function() {
if ($( window ).scrollTop() > $("header").outerHeight()) {
$("nav").css({
top: 0
})
} else{
$("nav").css({
top: $("header").outerHeight()-$( window ).scrollTop() //Makes the menu stick the header
})
}
});
function last_of_array(array){return array[array.length-1]}
function get_line_id(index, type){return $("#"+type).sortable("toArray")[index]}
function get_var_type(varName){return $("input[value=" + varName + "]").parent().children("select").val()}