diff options
| author | Cesar G <prototech91@gmail.com> | 2015-05-28 13:36:31 +0200 |
|---|---|---|
| committer | Cesar G <prototech91@gmail.com> | 2015-05-28 13:36:31 +0200 |
| commit | a8ec353a4f3595781523903a615c2148081c7fb4 (patch) | |
| tree | ad284c446f7400a8491fa0951ad42aa8a4bd06cd /phpBB | |
| parent | f6d7ea425f7942fc40dd69a1b161120110e813aa (diff) | |
| parent | f1e11414e8e910b450ec5a0f7d2d488bc27d9f52 (diff) | |
| download | forums-a8ec353a4f3595781523903a615c2148081c7fb4.tar forums-a8ec353a4f3595781523903a615c2148081c7fb4.tar.gz forums-a8ec353a4f3595781523903a615c2148081c7fb4.tar.bz2 forums-a8ec353a4f3595781523903a615c2148081c7fb4.tar.xz forums-a8ec353a4f3595781523903a615c2148081c7fb4.zip | |
Merge branch '3.1.x'
* 3.1.x:
[ticket/12542] Use more specific CSS for drag-n-drop
[ticket/12542] Do not use browser specific css for outline
[ticket/12542] Properly check if textarea is undefined or null
[ticket/12542] Use extended CSS for all browsers
[ticket/12542] Rename javascript method and add doc block
[ticket/12542] Add different outline colors for body & textarea
[ticket/12542] Add initial drag-n-drop animation
Diffstat (limited to 'phpBB')
| -rw-r--r-- | phpBB/assets/javascript/core.js | 25 | ||||
| -rw-r--r-- | phpBB/assets/javascript/editor.js | 3 | ||||
| -rw-r--r-- | phpBB/styles/prosilver/theme/colours.css | 8 | ||||
| -rw-r--r-- | phpBB/styles/prosilver/theme/forms.css | 7 |
4 files changed, 43 insertions, 0 deletions
diff --git a/phpBB/assets/javascript/core.js b/phpBB/assets/javascript/core.js index 806db7d35f..9eb931270a 100644 --- a/phpBB/assets/javascript/core.js +++ b/phpBB/assets/javascript/core.js @@ -1233,6 +1233,31 @@ phpbb.applyCodeEditor = function(textarea) { }; /** + * Show drag and drop animation when textarea is present + * + * This function will enable the drag and drop animation for a specified + * textarea. + * + * @param {object} textarea Textarea DOM object to apply editor to + */ +phpbb.showDragNDrop = function(textarea) { + if (textarea == null) { + return; + } + + $('body').on('dragenter dragover', function () { + $(textarea).addClass('drag-n-drop'); + }).on('dragleave dragout dragend drop', function() { + $(textarea).removeClass('drag-n-drop'); + }); + $(textarea).on('dragenter dragover', function () { + $(textarea).addClass('drag-n-drop-highlight'); + }).on('dragleave dragout dragend drop', function() { + $(textarea).removeClass('drag-n-drop-highlight'); + }); +}; + +/** * List of classes that toggle dropdown menu, * list of classes that contain visible dropdown menu * diff --git a/phpBB/assets/javascript/editor.js b/phpBB/assets/javascript/editor.js index 5fd4f7eae3..c58e4d19dd 100644 --- a/phpBB/assets/javascript/editor.js +++ b/phpBB/assets/javascript/editor.js @@ -355,6 +355,9 @@ function getCaretPosition(txtarea) { textarea = doc.forms[form_name].elements[text_name]; phpbb.applyCodeEditor(textarea); + if ($('#attach-panel').length) { + phpbb.showDragNDrop(textarea); + } }); })(jQuery); diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index 4743b4b39b..29cf641df2 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -977,6 +977,14 @@ fieldset.quick-login input.inputbox { color: #333333; } +#message-box textarea.drag-n-drop { + outline-color: rgba(102, 102, 102, 0.5); +} + +#message-box textarea.drag-n-drop-highlight { + outline-color: rgba(17, 163, 234, 0.5); +} + /* Input field styles ---------------------------------------- */ .inputbox { diff --git a/phpBB/styles/prosilver/theme/forms.css b/phpBB/styles/prosilver/theme/forms.css index f08a8a9691..777f011c35 100644 --- a/phpBB/styles/prosilver/theme/forms.css +++ b/phpBB/styles/prosilver/theme/forms.css @@ -243,6 +243,13 @@ fieldset.submit-buttons input { max-width: 100%; font-size: 1.2em; resize: vertical; + outline: 3px dashed transparent; + outline-offset: -4px; + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -ms-transition: all .5s ease; + -o-transition: all .5s ease; + transition: all .5s ease; } /* Emoticons panel */ |