// ==UserScript==
// @name Pawoo min drawer
// @description:ja Pawoo(というかMastdon)のトゥートドロワーを折り畳めるようにします。
// @match https://pawoo.net/web/*
// @grant none
// @require https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
// @version 0.0.1.20190225162932
// @namespace https://greasyfork.org/users/249870
// @description Pawoo(というかMastdon)のトゥートドロワーを折り畳めるようにします。
// @downloadURL none
// ==/UserScript==

$(window).on('load', function () {
  var $columnsArea = $('.columns-area');

  if (!$columnsArea.children('.drawer-min').length) {
    var styleText = ".columns-area > input#drawer-toggle:not(:checked) ~ .drawer{  display: none;}";
    var style = document.createElement('style');
    style.innerText = styleText;
    document.head.appendChild(style);
    var chkBox = '<input id="drawer-toggle" type="checkbox" style="display:none;"/>';
    var minDrawer = '<div class="drawer-min" style="width:50px;"></div>';
    $columnsArea.prepend(minDrawer);
    $columnsArea.prepend(chkBox);
    $('.navigation-bar').on('DOMSubtreeModified propertychange', function () {
      console.log("DOMSubtreeModified propertychange");
    });
    var permalink = $('.navigation-bar > .permalink')[0].cloneNode(true);
    permalink.style = "display:block;margin:10px 5px;";
    $('.drawer-min').prepend(permalink);
    console.log(permalink);
    $(this).off('DOMSubtreeModified propertychange');
    var tootButton = document.createElement('button');
    tootButton.style = "color: #444b5d;background: #707b97;border: 0;border-radius: 5px;cursor: pointer;font-size: 16px;padding: 0 10px;height: 35px;margin-left: 7px;";
    tootButton.innerHTML = '<i class="fa fa-pencil"></i>';

    tootButton.onclick = function () {
      var x = $('#drawer-toggle');
      x.prop('checked', !x.prop('checked'));
    };

    $('.drawer-min').append(tootButton);
  }
});