web.cpp

#include "web.h"


void web_setup ()
{
   
    HeapSelectIram abc;
    set_theme(1);

    //Create tabs
    configurations = ESPUI.addControl(ControlType::Tab, "Configurations", "Configurations");
    new_syringe = ESPUI.addControl(ControlType::Tab, "Nouvelle Seringue", "Nouvelle seringue");
    features = ESPUI.addControl(ControlType::Tab, "Caracteristiques du pousse-seringue", "Caracteristiques du pousse-seringue");

    //***ABOVE***//
    
    //***Syringe-pump***//
    status_syringe_pump = ESPUI.label("Etat du pousse-seringue :", ControlColor::None, "A l'arrêt");

    stop_syringe_pump = ESPUI.addControl(ControlType::Button, "Mise en marche", "\u26D4", ControlColor::None, status_syringe_pump, stop_syringe_pump_callback, (void*)19);

    //***Syringe-filled***//
    status_syringe_filled_placement = ESPUI.label("Etat de la seringue :", ControlColor::None, "Enlevée");

    syringe_filled_placement = ESPUI.addControl(ControlType::Switcher, "Mise en marche", "Arrêt", ControlColor::None, status_syringe_filled_placement, syringe_filled_placement_callback, (void*)19);

    ESPUI.addControl(ControlType::Separator, "", "", ControlColor::None);

    //***Limit-switch***//
    status_limit_switch = ESPUI.label("Etat du capteur de fin de course:", ControlColor::None, "Off");

    //***Initialisation***//
    calibration = ESPUI.button("Callibration", calibration_callback, ControlColor::None, "\u21E4");

    fast_backward = ESPUI.button("Initialisation", fast_backward_callback, ControlColor::None, "\u2BC7 \u2BC7");
    slow_backward = ESPUI.addControl(ControlType::Button, "Initialisation", "\u2BC7", ControlColor::None, fast_backward, slow_backward_callback);
    slow_forward = ESPUI.addControl(ControlType::Button, "Initialisation", "\u2BC8", ControlColor::None, fast_backward, slow_forward_callback);
    fast_forward =  ESPUI.addControl(ControlType::Button, "Initialisation", "\u2BC8 \u2BC8", ControlColor::None, fast_backward, fast_forward_callback);

    confirm_initialisation = ESPUI.button("Valider l'initialisation", confirm_initialisation_callback, ControlColor::None, "\u2714");




    ESPUI.addControl(ControlType::Separator, "", "", ControlColor::None);

    //Exchange_values_wanted
    initial_volume_mL_label =ESPUI.addControl( ControlType::Label, "Caractéristiques de la seringue : ", "Volume initial contenu dans la seringue : ", ControlColor::None);
    initial_volume_mL =  ESPUI.addControl( ControlType::Number, "Volume initial contenu dans la seringue : ", "0", ControlColor::None, initial_volume_mL_label, initial_volume_mL_callback, (void*)19);
    number_max_min(0, 500, initial_volume_mL);

    volume_exchange_mL_label = ESPUI.addControl(ControlType::Label, "Configuration de l'échange", "Volume à échanger en mL", ControlColor::None, initial_volume_mL_label);
    volume_exchange_mL = ESPUI.addControl(ControlType::Number,"Configuration de l'échange", "0", ControlColor::None, initial_volume_mL_label, volume_exchange_mL_callback, (void*)19);
    number_max_min(0, 500, volume_exchange_mL);

    exchange_throughtput_uL_per_sec_label = ESPUI.addControl(ControlType::Label, "Configuration de l'échange", "Débit de l'échange en uL/sec", ControlColor::None, initial_volume_mL_label);
    exchange_throughtput_uL_per_sec = ESPUI.addControl(ControlType::Number,"Configuration de l'échange", "0", ControlColor::None, initial_volume_mL_label, exchange_throughtput_uL_per_sec_callback, (void*)19);
    number_max_min(0, 500, exchange_throughtput_uL_per_sec);

    label_push_pull_choice = ESPUI.addControl(ControlType::Label, "Injection ou Aspiration", "Injection", ControlColor::None, initial_volume_mL_label);
    switch_push_pull_choice = ESPUI.addControl(ControlType::Switcher, "Injection ou Aspiration", "Injection", ControlColor::None, initial_volume_mL_label, switch_push_pull_choice_callback, (void*)19);
    ESPUI.updateSwitcher(switch_push_pull_choice, true); //pour mettre a "Injection" par défaut au début


    start_exchange = ESPUI.addControl(ControlType::Button, "Start exchange", "\xF0\x9F\x8F\x81", ControlColor::None, initial_volume_mL_label, start_exchange_callback, (void*)19);


    //Remaning_values
    label_remaining_volume_mL = ESPUI.label("Caractéristiques de l'échange en cours", ControlColor::None, "Volume restant en mL");
    remaining_volume_mL = ESPUI.addControl(ControlType::Slider, "Volume", "0", ControlColor::None, label_remaining_volume_mL, remaining_volume_mL_callback, (void*)19);
   
    label_remaining_time_sec = ESPUI.addControl( ControlType::Label, "Caractéristiques de l'échange en cours", "Temps restant en sec", ControlColor::None, label_remaining_volume_mL);
    remaining_time_sec = ESPUI.addControl(ControlType::Slider, "Temps", "0", ControlColor::None, label_remaining_volume_mL, remaining_time_sec_callback, (void*)19);



    ESPUI.sliderContinuous = true;


    //Configurations

    //Choice_of_syringe_model

    syringe_selection = ESPUI.addControl(ControlType::Select, "Choix de la seringue :", "", ControlColor::None, configurations, syringe_selection_callback);
    select_syringe_maj(configurations);

    syringe_volume_mL_value = 5;
    syringe_volume_mL_string = "Volume total: " + std::to_string(syringe_volume_mL_value) + "mL";
    syringe_volume_mL =ESPUI.addControl( ControlType::Label, "Caractéristiques de la seringue : ", syringe_volume_mL_string.c_str() , ControlColor::None, configurations);

    syringe_diameter_mm_value = 5;
    syringe_diameter_mm_string = "internal diameter : " + std::to_string(syringe_diameter_mm_value) + "mm";
    syringe_diameter_mm =ESPUI.addControl( ControlType::Label, "Caractéristiques de la seringue : ", syringe_diameter_mm_string.c_str(), ControlColor::None, syringe_volume_mL);


    choose_syringe = ESPUI.addControl(ControlType::Button, "Choisir cette seringue", "\u2714", ControlColor::None, syringe_selection, choose_syringe_callback, (void*)19);
  
    select_value = "BD_10mL";


    ESPUI.addControl(ControlType::Separator, "", "", ControlColor::None, configurations);
   

    //New_syringe
    name_new_syringe_label = ESPUI.addControl(ControlType::Label, "Nouvelle seringue", "Nom de la seringue :", ControlColor::None, new_syringe);
    name_new_syringe = ESPUI.addControl(ControlType::Text, "Nouvelle seringue", "", ControlColor::None, name_new_syringe_label, name_new_syringe_callback);
    
    internal_diameter_mm_new_syringe_label =ESPUI.addControl(ControlType::Label, "Nouvelle seringue", "Diamètre interne de la seringue en mm :", ControlColor::None, name_new_syringe_label);
    internal_diameter_mm_new_syringe = ESPUI.addControl(ControlType::Number, "Diamètre interne de la seringue en mm", "5", ControlColor::None, name_new_syringe_label, internal_diameter_mm_new_syringe_callback);
    internal_diameter_mm_new_syringe_value = 5;
    number_max_min(0, 500, internal_diameter_mm_new_syringe);

    total_volume_mL_new_syringe_label =ESPUI.addControl(ControlType::Label, "Nouvelle seringue", "Volume total de la seringue en mL :", ControlColor::None, name_new_syringe_label);
    total_volume_mL_new_syringe = ESPUI.addControl(ControlType::Number, "Volume total de la seringue en mL", "5", ControlColor::None, name_new_syringe_label, total_volume_mL_new_syringe_callback);
    total_volume_mL_new_syringe_value = 5;
    number_max_min(0, 500, total_volume_mL_new_syringe);

    ESPUI.addControl(ControlType::Separator, "Je suis là", "", ControlColor::None, name_new_syringe_label);

    add_syringe = ESPUI.addControl(ControlType::Button, "Ajouter la seringue", "\u2714", ControlColor::None, new_syringe, add_syringe_callback, (void*)19);


    //Features
    syringe_pump_length_mm_value  = ESPUI.addControl(ControlType::Number, "Longueur totale du pousse-seringue", "50", ControlColor::None, features, syringe_pump_length_mm_callback);
    
    lead_screw_pitch_mm = ESPUI.addControl(ControlType::Number, "Avance par tour", "0.7", ControlColor::None, features, number_callback);
    
    clockwise_equals_push_label = ESPUI.addControl(ControlType::Label, "Sens de rotation du moteur", "Horaire = Injection", ControlColor::None, features);
    clockwise_equals_push = ESPUI.addControl(ControlType::Switcher, "Sens de rotation du moteur", "Horaire =", ControlColor::None, clockwise_equals_push_label, clockwise_equals_push_callback);
    ESPUI.updateSwitcher(clockwise_equals_push, true); //set "Horaire = Injection" at the beginning


    

    //Begin
    set_initial_style();
    ESPUI.begin("ESPUI Control");
}


/************CALLBACK_METHODS****************/

//GENERAL CALLBACKS//
void number_callback(Control* sender, int type)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the number controller via the serial port.
***/
{
    Serial.println("Type: number");
    Serial.println(String("Value: ") + String(sender->value));
    Serial.println(String("ID: ") + sender->id);
    Serial.println("");
}


//SPECIFIC CALLBACKS//

//***ABOVE***//

void stop_syringe_pump_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Linking the switch of the syringe pump status and the actions.
***/
{(void)param; //Avoid the unused Warning
    style_syringe_pump_off();

    Serial.println("Syringe_pump stopped");
    Serial.println(String("ID: ") + sender->id);
    Serial.println("");

}

void syringe_filled_placement_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Linking the switch of the syringe filled status(placed or not) and the actions.
***/
{(void)param; //Avoid the unused Warning
    switch (value)
    {
    case S_ACTIVE:
        style_syringe_filled_placement_on();
        break;

    case S_INACTIVE:
        style_syringe_filled_placement_off();
        break;
    }

    Serial.println("Syringe_filled_placement");
    Serial.println(String("Value: ") + String(sender->value));
    Serial.println(String("ID: ") + sender->id);
    Serial.println("");
}

void calibration_callback (Control *sender, int type) 
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Enable the syringe-pump calibration and change the style appropriately.
***/
{
    if((type == B_UP)) {

        syringe_filled.go_to_zero();
        ESPUI.print(status_syringe_pump, "En marche");
        style (status_syringe_pump, 1);
        style (stop_syringe_pump, 1);
    }
    
    Serial.println("Calibration");
    Serial.println(String("Value: ") + String(sender->type));
    Serial.println(String("ID: ") + sender->id);
    Serial.println("");
}

void fast_backward_callback (Control *sender, int type) 
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : 
***/
{
    switch (type)
    {
    case B_DOWN:

        syringe_filled.reset_position();
        syringe_filled.move_to_mm(-50);
        syringe_filled.set_speed_mm_per_sec(50);

        break;

    case B_UP:
        
        style_syringe_pump_off();

        break;
    }

    serial_print ("Fast_backward", sender);

}

void fast_forward_callback (Control *sender, int type) 
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : 
***/
{

    switch (type)
    {
    case B_DOWN:

        Serial.printf("Forward 10 steps"); 
        syringe_filled.reset_position();
        syringe_filled.move_to_mm(50);
        syringe_filled.set_speed_mm_per_sec(50);

        break;

    case B_UP:
        
        style_syringe_pump_off();

        break;
    }

    serial_print ("Fast_forward", sender);
}

void slow_backward_callback (Control *sender, int type) 
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : 
***/
{
    switch (type)
    {
    case B_DOWN:

        syringe_filled.reset_position();
        syringe_filled.move_to_mm(-50);
        syringe_filled.set_speed_mm_per_sec(0.5);

        break;

    case B_UP:
        
        style_syringe_pump_off();

        break;
    }

    serial_print ("Slow_backward", sender);

}

void slow_forward_callback (Control *sender, int type) 
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : 
***/
{
    switch (type)
    {
    case B_DOWN:

        syringe_filled.reset_position();
        syringe_filled.move_to_mm(50);
        syringe_filled.set_speed_mm_per_sec(0.5);

        break;

    case B_UP:
        
        style_syringe_pump_off();

        break;
    }
    
    serial_print ("Slow_forward", sender);
}

void confirm_initialisation_callback (Control *sender, int type) 
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : 
***/
{
    switch (type)
    {
    case B_DOWN:

        syringe_filled.reset_position();

        break;

    case B_UP:

        break;
    }
    
    serial_print ("Confirm_initialisation", sender);
}


void volume_exchange_mL_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Enable to choose the volume that woud be exchanged.
***/
{(void)param; //Avoid the unused Warning

    syringe_filled.set_exchange_volume_mL(atof(sender->value.c_str()));
    syringe_filled.write_Json ();


    serial_print ("Volume_exchange (sender->value)", sender);

    Serial.println("Volume_exchange (json value)");
    Serial.println(String("Value: ") + String(syringe_filled.get_exchange_volume_mL()));
    Serial.println("");
    
}

void exchange_throughtput_uL_per_sec_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Enable to choose the volume that woud be exchanged.
***/
{(void)param; //Avoid the unused Warning
    syringe_filled.set_exchange_throughput_uL_per_sec(atof(sender->value.c_str()));
    syringe_filled.write_Json ();

    serial_print ("Exchange_throughtput (sender->value)", sender);

    Serial.println("Exchange_throughtput (json value)");
    Serial.println(String("Value: ") + String(syringe_filled.get_exchange_throughput_uL_per_sec()));
    Serial.println("");

}


void switch_push_pull_choice_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Change the label_push_pull_choice to display the choice.
            Change the style of the controller involved.
***/
{(void)param; //Avoid the unused Warning

    switch (value)
    {
    case S_ACTIVE:
        syringe_filled.set_push(true);
        syringe_filled.write_Json ();
        ESPUI.print(label_push_pull_choice, "Injection");

        break;

    case S_INACTIVE:

        syringe_filled.set_push(false);
        syringe_filled.write_Json ();
        ESPUI.print(label_push_pull_choice, "Aspiration");

        break;
    }
    syringe_filled.write_Json();

    serial_print ("Push_pull_choice (sender->value)", sender);

    Serial.println("Push_pull_choice (json value)");
    Serial.println(String("Value: ") + String(syringe_filled.get_push()));
    Serial.println("");
}

void remaining_volume_mL_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Linking the display with the current volume remaining.
***/
{(void)param; //Avoid the unused Warning
    ESPUI.updateSlider(remaining_volume_mL, syringe_filled.get_remaining_volume_mL());
}


void remaining_time_sec_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Linking the display with the current time remaining for the exchange.
***/
{(void)param; //Avoid the unused Warning
    float remaining_time_sec_value = syringe_filled.get_remaining_volume_mL()/syringe_filled.get_exchange_throughput_uL_per_sec();
    ESPUI.updateSlider(remaining_time_sec, remaining_time_sec_value);
}

void start_exchange_callback (Control* sender, int value, void* param)
{(void)param; //Avoid the unused Warning

    syringe_filled.start_exchange();
    style_syringe_pump_on();

    serial_print ("Exchange start", sender);
}

//configurations  = Configurations


void initial_volume_mL_callback (Control* sender, int value, void* param)
{(void)param; //Avoid the unused Warning
    syringe_filled.set_remaining_volume_mL((sender->value).toFloat());
    syringe_filled.write_Json();


    serial_print ("syringe_initial_volume (sender->value)", sender);

    Serial.println("syringe_initial_volume (json value)");
    Serial.println(String("Value: ") + String(syringe_filled.get_remaining_volume_mL()));
    Serial.println("");


}

void choose_syringe_callback (Control* sender, int value, void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the button state via the serial port.
***/
{(void)param; //Avoid the unused Warning
    switch (value)
    {
    case B_DOWN:

        //syringe_volume_mL_value = 2; //Mettre la valeur associé au nom choisit du select
        syringe_volume_mL_value = syringe.get_syringe_database()[select_value]["total_volume_mL"];
        syringe_volume_mL_string = "Volume total: " + std::to_string(syringe_volume_mL_value) + "mL";
        ESPUI.print(syringe_volume_mL, syringe_volume_mL_string.c_str());

        //syringe_diameter_mm_value = 1; //Mettre la valeur associé au nom choisit du select
        syringe_diameter_mm_value = syringe.get_syringe_database()[select_value]["internal_diameter_mm"];
        syringe_diameter_mm_string = "internal diameter : " + std::to_string(syringe_diameter_mm_value) + "mm";
        ESPUI.print(syringe_diameter_mm, syringe_diameter_mm_string.c_str());

        break;

    case B_UP:
        break;
    }
    serial_print ("choose_syringe", sender);

    serial_print ("name_new_syringe (sender->value)", sender);
  
    Serial.println("Volume_total (json value)");
    Serial.println(String("Value: ") + String((syringe.get_syringe_database()[syringe_filled.get_name_syringe()]["total_volume_mL"]).as<const char*>()));
    Serial.println("");

    Serial.println("internal_diameter (json value)");
    Serial.println(String("Value: ") + String(syringe.get_syringe_database()[syringe_filled.get_name_syringe()]["internal_diameter"].as<const char*>()));
    Serial.println("");

}

void name_new_syringe_callback(Control* sender, int type)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the new syringe name chosen via the serial port.
***/
{
    name_new_syringe_value = sender->value;

    serial_print ("name_new_syringe (sender->value)", sender);

}

void total_volume_mL_new_syringe_callback(Control* sender, int type)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the new syringe name chosen via the serial port.
***/
{
    total_volume_mL_new_syringe_value = sender->value;

    serial_print ("total_volume_new_syringe", sender);

}

void internal_diameter_mm_new_syringe_callback(Control* sender, int type)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the new syringe name chosen via the serial port.
***/
{
    internal_diameter_mm_new_syringe_value = sender->value,

    serial_print ("internal_diameter_new_syringe", sender);

}

void add_syringe_callback (Control* sender, int value,  void* param)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the button state via the serial port.
            Enable to save data in the syringe_json file.
***/
{(void)param; //Avoid the unused Warning
    switch (value)
    {
    case B_DOWN:
        syringe.set_syringe(name_new_syringe_value, total_volume_mL_new_syringe_value.toFloat(), internal_diameter_mm_new_syringe_value.toFloat());
        syringe.write_Json();

        ESPUI.addControl(ControlType::Option, name_new_syringe_value.c_str(), name_new_syringe_value.c_str(), ControlColor::None, syringe_selection);

        break;

    case B_UP:
        break;
    }
    
    serial_print ("add_syringe", sender);

}



//features : Configurations avancées

void syringe_pump_length_mm_callback(Control* sender, int type)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the number controller via the serial port.
***/
{
    syringe_filled.set_syringe_pump_length_mm(sender->type);
    syringe_filled.write_Json();

    serial_print ("syringe_pump_length (sender->value)", sender);

    Serial.println("syringe_pump_length (json value)");
    Serial.println(String("Value: ") + String(syringe_filled.get_syringe_pump_length_mm()));
    Serial.println("");
}

void clockwise_equals_push_callback(Control* sender, int value)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the convention chosen via the serial port.
            Change the clockwise_equals_push_label to display the information.
***/
{
    switch (value)
    {
    case S_ACTIVE:
        syringe_filled.set_clockwise_equals_push(true);
        ESPUI.print(clockwise_equals_push_label, "Horaire = Injection");
        syringe_filled.write_Json();
        
        break;

    case S_INACTIVE:
        syringe_filled.set_clockwise_equals_push(false);
        ESPUI.print(clockwise_equals_push_label, "Horaire = Aspiration");
        syringe_filled.write_Json();
        break;
    }

    serial_print ("clockwise_equals_push (sender->value)", sender);

    Serial.println("clockwise_equals_push (json value)");
    Serial.println(String("Value: ") + String(syringe_filled.get_clockwise_equals_push()));
    Serial.println("");
}

//

void syringe_selection_callback(Control* sender, int value)
/***
-Argument : Pointer to the controller calling the function, integer according to the controller type.
-Return   : /
-Action   : Print the value of the syringe name chosen via the serial port.
***/
{

    select_value = sender->value;
    syringe_filled.set_name_syringe(select_value);
    syringe_filled.write_Json();

    serial_print ("syringe_selection (sender->value)", sender);

}



//ON_OFF METHODS

void syringe_pump_on_off()
/***
-Argument : /
-Return   : /
-Action   : Update the display of the syringe-pump status to match when the motor runs or not (so when we initialize, it stop by itself)
***/
{
    if (syringe_filled.is_running())
    {
      ESPUI.updateControlValue(status_syringe_pump, "1");
    }
    ESPUI.updateControlValue(status_syringe_pump, "0");
}




/*************STYLE_METHODS****************/

void style (uint16_t id, int style)
/***
-Argument : The controller id and the style wanted.
-Return   : /
-Action   : Change style (1 is active, green; 2 is inactive, red; 3 is neutral, brown)
***/
{

    switch (style)
    {
    case 1:
        ESPUI.setPanelStyle(id, couleurs[0]);
        ESPUI.setElementStyle(id, couleurs[1]);
        break;

    case 2:
        ESPUI.setPanelStyle(id, couleurs[2]);
        ESPUI.setElementStyle(id, couleurs[3]);
        break;

    case 3:
        ESPUI.setPanelStyle(id, couleurs[4]);
        ESPUI.setElementStyle(id, couleurs[5]);
        break;

    }

}

void set_initial_style()
/***
-Argument : /
-Return   : /
-Action   : Set up the initial style of every controller.
***/
{
    //***ABOVE***//
    
    style (status_syringe_pump, 2);
    style (stop_syringe_pump, 2);

    style (status_syringe_filled_placement, 2);
    style (syringe_filled_placement, 2);


    style (status_limit_switch, 1);


    style (calibration, 1);

    style_initialisation(3);

    style_exchange_configuration(3);


    style (label_remaining_volume_mL, 3);
    style (remaining_volume_mL, 3);
    style (label_remaining_time_sec, 3);
    style (remaining_time_sec, 3);

    

    //configurations
    style (syringe_volume_mL, 3);
    style (syringe_diameter_mm, 3);
    style (choose_syringe, 3);

    style (name_new_syringe, 3);
    style (internal_diameter_mm_new_syringe, 3);
    style (total_volume_mL_new_syringe, 3);
    style (add_syringe, 3);
    style (name_new_syringe_label, 3);
    style (internal_diameter_mm_new_syringe_label, 3);
    style (total_volume_mL_new_syringe_label, 3);
    style (add_syringe_label, 3);



    


    //features
    style (syringe_pump_length_mm_value, 3);
    style (lead_screw_pitch_mm, 3);
    style (clockwise_equals_push_label, 3);
    style (clockwise_equals_push, 3);



    //
    style (syringe_selection, 3);

}

void set_theme(int theme)
/***
-Argument : Integer defining the theme wanted.
-Return   : /
-Action   : Change the interface theme for dark, light of colorful theme.
***/
{
    if (theme ==1)
    {
    //Creation des différents styles

    //Les verts pour la mise en mrche de la seringue
    sprintf(couleur1, "background-color: #%06X;", (unsigned int) 0xb2dbbf);
    sprintf(couleur2, "background-color: #%06X;", (unsigned int) 0x5a8668);

    //Le rouge pour la seringue a l'arrêt
    sprintf(couleur3, "background-color: #%06X;", (unsigned int) 0xc97064);
    sprintf(couleur4, "background-color: #%06X;", (unsigned int) 0x762419);

    //Les marrons pour la config des seringues
    sprintf(couleur5, "background-color: #%06X;", (unsigned int) 0xce9f6f);
    sprintf(couleur6, "background-color: #%06X;", (unsigned int) 0x926448);

    //Pas utilisé pour le moment
    sprintf(couleur7, "background-color: #%06X;", (unsigned int) 0x0a7477);
    sprintf(couleur8, "background-color: #%06X;", (unsigned int) 0x052a38);
    sprintf(couleur9, "background-color: #%06X;", (unsigned int) 0x044365);
    sprintf(couleur10, "background-color: #%06X;", (unsigned int) 0x58b8c3);


        
    }
}



void style_syringe_pump_on()
/***
-Argument : /
-Return   : /
-Action   : Change the status_syringe_pump label to display the information.
            Change the style of the controller involved.
            Causes the movement of the syringe pump.
***/
{
    ESPUI.print(status_syringe_pump, "En marche");
    style (status_syringe_pump, 1);
    style (stop_syringe_pump, 1);

}

void style_syringe_pump_off()
/***
-Argument : /
-Return   : /
-Action   : Change the status_syringe_pump label to display the information.
            Change the style of the controller involved.
            Causes the stop of the syringe pump.
***/
{
    ESPUI.print(status_syringe_pump, "A l'arrêt");
    style (status_syringe_pump, 2);
    style (stop_syringe_pump, 2);

    syringe_filled.stop();
}

void style_syringe_filled_placement_on()
/***
-Argument : /
-Return   : /
-Action   : Change the status_syringe_filled label to display the information.
            Change the style of the controller involved.
            Disable the calibration.
***/
{
    ESPUI.print(status_syringe_filled_placement, "En place");
    style (status_syringe_filled_placement, 1);
    style (syringe_filled_placement, 1);
    
    ESPUI.setEnabled(calibration, false);
    style (calibration, 2);
}

void style_syringe_filled_placement_off()
/***
-Argument : /
-Return   : /
-Action   : Change the status_syringe_filled label to display the information.
            Change the style of the controller involved.
            Enable the calibration.
***/
{
    ESPUI.print(status_syringe_filled_placement, "Enlevée");
    style (status_syringe_filled_placement, 2);
    style (syringe_filled_placement, 2);

    ESPUI.setEnabled(calibration, true);
    style (calibration, 1);
}


void style_initialisation(int style_choice)
{
    style (fast_forward, style_choice);
    style (fast_backward, style_choice);
    style (slow_forward, style_choice);
    style (slow_backward, style_choice);
    style (confirm_initialisation, style_choice);
}

void style_exchange_configuration(int style_choice)
{
    style (initial_volume_mL, style_choice);
    style (initial_volume_mL_label, style_choice);
    style (volume_exchange_mL_label, style_choice);
    style (volume_exchange_mL, style_choice); 
    style (exchange_throughtput_uL_per_sec_label, style_choice);
    style (exchange_throughtput_uL_per_sec, style_choice);
    style (label_push_pull_choice, style_choice);
    style (switch_push_pull_choice, style_choice);
    style (start_exchange, style_choice);
}


//OTHER METHODS

void select_syringe_maj(uint16_t tab)
/***
-Argument : The page on which the info must display.
-Return   : /
-Action   : Read the syringe_json file so it get/recover all the syringe models registered.
***/
{
    JsonObject root = syringe.get_syringe_database_object();

    for (JsonPair kv : root) 
    {
        uint16_t choice = ESPUI.addControl(ControlType::Option, kv.key().c_str(), kv.key().c_str(), ControlColor::None, syringe_selection);
        style (choice, 3);
    }

    

}

void number_max_min(int min, int max, uint16_t control)
{
    ESPUI.addControl(Min, "", String(min), ControlColor :: None, control);
    ESPUI.addControl(Max, "", String(max), ControlColor :: None, control);
}

void serial_print (String name, Control* sender)
{
    Serial.println(name);
    Serial.println(String("Value: ") + String(sender->type));
    Serial.println(String("ID: ") + sender->id);
    Serial.println("");
}



//WEB_LOOP//
void web_loop ()
{

	if(millis() > last_time + 500) {
		last_time = millis();
        
        //UPDATES


        ESPUI.updateSlider(remaining_volume_mL, syringe_filled.step_to_mm(syringe_filled.where_step()*100/syringe_filled.get_syringe_pump_length_mm()));

        if (syringe_filled.is_running())
        style_syringe_pump_on();
        else
        style_syringe_pump_off();

	}

}