code-player/java.js at main · shubhangini22/code-player · GitHub

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
function updateOutput() {
    //this function is fpr updating the output
    $("iframe").contents().find("html").html("<html><head><style type='text/css'>" + $("#cssPanel").val() + "</style></head><body>" + $("#htmlPanel").val() + "</body></html>");
    //updating output -- inline html
    document.getElementById("outputPanel").contentWindow.eval($("#javascriptPanel").val());
    //for running javascript code in iframe of output section


}

$(".toggleButton").hover(function() {

    $(this).addClass("highlightedButton");

}, function() {

    $(this).removeClass("highlightedButton");
  //.removeclass function here helps in removing one or more class names from selected elements
    //hover function (hover documentation)
});

$(".toggleButton").click(function() {

    $(this).toggleClass("active");

    $(this).removeClass("highlightedButton");

    var panelId = $(this).attr("id") + "Panel";

    $("#" + panelId).toggleClass("hidden");

    var numberOfActivePanels = 4 - $('.hidden').length;
    //for dividing the panels into equal length in our code
    $(".panel").width(($(window).width() / numberOfActivePanels) - 10);
   //toggle class documentation
})

$(".panel").height($(window).height() - $("#header").height() - 15);

$(".panel").width(($(window).width() / 2) - 10);

updateOutput();

$("textarea").on('change keyup paste', function() {
    //this function will trigger the output section as soon as we write the code
    updateOutput();


});