diff --git a/css/menu.css b/css/menu.css index 89162e4..c351d29 100644 --- a/css/menu.css +++ b/css/menu.css @@ -60,6 +60,19 @@ } } +.g-body .pos-abs { + position: absolute; +} + +.g-body .file-hidden { + opacity: 0; + width: 90px; +} + +.g-body .file-label { + width: 90px; +} + .g-body .text-menu { -webkit-transition: opacity 180ms, margin 180ms; -ms-transition: opacity 180ms, margin 180ms; diff --git a/js/grande.js b/js/grande.js index 5a6d843..5d8703c 100644 --- a/js/grande.js +++ b/js/grande.js @@ -57,7 +57,8 @@ ", imageTooltipTemplate = document.createElement("div"); - imageTooltipTemplate.innerHTML = "
Insert image
"; + imageTooltipTemplate.innerHTML = "
Insert image
\ + "; imageTooltipTemplate.className = "image-tooltip hide"; div.className = "text-menu hide"; @@ -110,6 +111,8 @@ urlInput.onblur = triggerUrlBlur; urlInput.onkeydown = triggerUrlSet; + imageTooltip.onmousedown = triggerFileUpload; + for (i = 0, len = editableNodes.length; i < len; i++) { node = editableNodes[i]; node.contentEditable = true; @@ -121,6 +124,10 @@ toggleImageTooltip(event, event.target); } + function triggerFileUpload(event) { + var fileInput = imageTooltip.querySelectorAll('input')[0]; + } + function toggleImageTooltip(event, element) { var editNode = editableNodes[0], childrenNodes = editNode.children,