<?php
// $Id: tabeleditor.inc.php,v 0.1 2019/10/06
// Copyright
//   2019 Kwansei Gakuin University comp-staff
// License: GPL v2
// Tabeleditor plugin
// naming candidate  "TableEditor", "TabetElroid" -> "Tabetemas", "Tabeleditor"

function plugin_tabeleditor_action()
{
    global $vars, $now, $_title_updated, $_no_name;
    global $_msg_tabeleditor_collided, $_title_tabeleditor_collided;
    global $_tabeleditor_plugin_fail_msg;

    if (PKWK_READONLY) die_message('PKWK_READONLY prohibits editing');

    $head = '';
    $match = array();

    $tabeleditor_added = TRUE;
    $cell_counter = 0;
    foreach (get_source($vars['refer']) as $line) {
        if (strpos($line, "|") === 0) {
            preg_match("/([fh])$/", $line, $match);
            $postamble = $match[1];
            $line = preg_replace("/^\\|(.*)\\|[fh]?$[^|]*/", "$1", $line);
            $postdata .= "|";
            foreach(explode("|", $line) as $cell) {
                if (strpos($cell,"~")===FALSE) {
                    $entry_name = "__buttons_" . $cell_counter;
                    //$postdata .= $cell_counter;
                    if ($vars[$entry_name]!==null) { 
                        $postdata .= $vars[$entry_name] . "|";
                    } else {
                        $postdata .= $cell . "|";
                    }
                    $cell_counter++;
                } else {
                    $postdata .= $cell . "|";
                }
            }
            $postdata .= "$postamble\n";
        } else {
            $postdata .= $line;
        }
    }

    $title = $_title_updated;
    $body = $postdata;
    if ($tabeleditor_added) {
        // new table created
        if (md5(get_source($vars['refer'], TRUE, TRUE)) !== $vars['digest']) {
            $title = $_title_tabeleditor_collided;
            $body  = $_msg_tabeleditor_collided . make_pagelink($vars['refer']);
        }
        page_write($vars['refer'], $postdata);
    } else {
        // failed to add new table
        $title = $_title_tabeleditor_collided;
        $body  = $_tabeleditor_plugin_fail_msg . make_pagelink($vars['refer']);
    }
    $retvars['msg']  = $vars['name'];
    $retvars['body'] = $vars['body'];
    $vars['page'] = $vars['refer'];
    return $retvars;
}

function plugin_tabeleditor_convert()
{
    global $vars, $digest, $_btn_tabeleditor, $_btn_name, $_msg_tabeleditor;
    static $numbers = array();

    if (PKWK_READONLY) return ''; // Show nothing

    $page = $vars['page'];
    if (! isset($numbers[$page])) $numbers[$page] = 0;
    $tabeleditor_no = $numbers[$page]++;

    $options = func_num_args() ? func_get_args() : array();

    $script = get_script_uri();
    $s_page = htmlsc($page);
    $string = <<<EOD
<style>
 .style_td input {
    font-size: 100%;
    background: linear-gradient(#6af 0%, #fef 10%, #dde 85%, #fff 100%);
}
</style>
<script>
  function blur_handler(e) {
    var value = e.target.value;
    var elm   = e.target.parentNode;
    var cellid = elm.cellid;
    var entry_name = "__buttons_"+cellid;
    var entry = document.getElementById(entry_name);

    elm.style = "";
    if (elm.initial_value != value) {
        elm.style.color= "red";
        document.getElementById("__buttons").style.visibility = "visible";
        if (!entry) {
            entry = document.createElement("input");
            entry.className = "changed";
            entry.type = "hidden";
            entry.name = entry.id = entry_name;
            document.getElementById("tabform").appendChild(entry);
        } 
        entry.value = value;
    } else {
        elm.style.color= "";
        if (entry) {
            entry.remove();
            if (document.querySelectorAll(".changed").length == 0) {
                document.getElementById("__buttons").style.visibility = "hidden";
            }
        }
    }
    value = value.replace("&br;", "<br class=\"spacer\">");
    elm.onclick = click_handler;
    elm.innerHTML = value;
  }
  function key_handler(e) {
    if (e.keyCode == 13) e.target.blur();
    else if (e.keyCode == 27) {
        e.target.value = e.target.parentNode.initial_value;
        e.target.blur();
    }
  }
  function click_handler(e) {
    e.target.onclick = null;
    var elm = document.createElement("input");
    var value = e.target.innerHTML;
    value = value.replace(/<br class=\"spacer\">/g, "&br;");

    console.log(e.target.cellid);

    var container = document.querySelector('.style_td');
    var style = window.getComputedStyle(container);
    var pad = style.getPropertyValue("padding");

    elm.value = value;
    elm.style.width = e.target.clientWidth + "px";
    elm.style.height = e.target.clientHeight + "px";
    elm.style.outline = elm.style.margin = 
    elm.style.padding = elm.style.border = "0px";
    elm.onblur = blur_handler;
    elm.onkeydown = key_handler;

    e.target.innerHTML="";
    e.target.style.padding = "0px";
    e.target.appendChild(elm);

    elm.focus();
  }

  (function() {
     var node_td = document.getElementsByClassName("style_td");
     for (let i = 0; i< node_td.length; i++) {
       node_td[i].cellid = i;
       node_td[i].onclick = click_handler; 
       node_td[i].initial_value = node_td[i].innerHTML; //.replace(/<br class=\"spacer\">/g, "&br;");
     }
   })();
</script>

<form id="tabform" action="$script" method="post">
  <input type="hidden" name="plugin" value="tabeleditor" />
  <input type="hidden" name="refer"  value="$s_page" />
  <input type="hidden" name="digest" value="$digest" />
  <div id="__buttons" class="style_buttons" style="padding:10px;background:#f5f0f0;margin:0px 26% 0px 26%;text-align:right;visibility:hidden;">
      <input type="submit" name="tabeleditor" value="SUBMIT" />
      <input type="button" name="tabeleditor" onclick="location.reload();" value="CANCEL" />
  </div>
 </div>
</form>
EOD;

    return $string;
}