From 39810b4035beb2a4a3e3b993224eb20ead26e40c Mon Sep 17 00:00:00 2001 From: aycabta Date: Tue, 27 Aug 2019 21:55:51 +0900 Subject: Good bye jQuery --- lib/rdoc/generator/template/darkfish/_head.rhtml | 7 +- lib/rdoc/generator/template/darkfish/css/rdoc.css | 23 +++- .../generator/template/darkfish/js/darkfish.js | 122 ++++----------------- lib/rdoc/generator/template/darkfish/js/search.js | 63 +++++------ .../generator/template/json_index/js/navigation.js | 44 +------- .../generator/template/json_index/js/searcher.js | 12 +- 6 files changed, 92 insertions(+), 179 deletions(-) (limited to 'lib/rdoc') diff --git a/lib/rdoc/generator/template/darkfish/_head.rhtml b/lib/rdoc/generator/template/darkfish/_head.rhtml index f308526823..8304310d4b 100644 --- a/lib/rdoc/generator/template/darkfish/_head.rhtml +++ b/lib/rdoc/generator/template/darkfish/_head.rhtml @@ -7,8 +7,11 @@ var index_rel_prefix = "<%= rel_prefix %>/"; - - + + + + + diff --git a/lib/rdoc/generator/template/darkfish/css/rdoc.css b/lib/rdoc/generator/template/darkfish/css/rdoc.css index 47ecae768c..a52e44ff8f 100644 --- a/lib/rdoc/generator/template/darkfish/css/rdoc.css +++ b/lib/rdoc/generator/template/darkfish/css/rdoc.css @@ -9,6 +9,8 @@ /* vim: ft=css et sw=2 ts=2 sts=2 */ /* Base Green is: #6C8C22 */ +.hide { display: none !important; } + * { padding: 0; margin: 0; } body { @@ -48,6 +50,16 @@ h6:hover span { display: inline; } +h1:target, +h2:target, +h3:target, +h4:target, +h5:target, +h6:target { + margin-left: -10px; + border-left: 10px solid #f1edba; +} + :link, :visited { color: #6C8C22; @@ -449,7 +461,16 @@ main header h3 { /* @group Method Details */ main .method-source-code { - display: none; + max-height: 0; + overflow: hidden; + transition-duration: 200ms; + transition-delay: 0ms; + transition-property: all; + transition-timing-function: ease-in-out; +} + +main .method-source-code.active-menu { + max-height: 100vh; } main .method-description .method-calls-super { diff --git a/lib/rdoc/generator/template/darkfish/js/darkfish.js b/lib/rdoc/generator/template/darkfish/js/darkfish.js index 38f877ed40..089813fcde 100644 --- a/lib/rdoc/generator/template/darkfish/js/darkfish.js +++ b/lib/rdoc/generator/template/darkfish/js/darkfish.js @@ -8,6 +8,7 @@ */ /* Provide console simulation for firebug-less environments */ +/* if (!("console" in window) || !("firebug" in console)) { var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml", "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"]; @@ -16,41 +17,35 @@ if (!("console" in window) || !("firebug" in console)) { for (var i = 0; i < names.length; ++i) window.console[names[i]] = function() {}; }; - - -/** - * Unwrap the first element that matches the given @expr@ from the targets and return them. - */ -$.fn.unwrap = function( expr ) { - return this.each( function() { - $(this).parents( expr ).eq( 0 ).after( this ).remove(); - }); -}; +*/ function showSource( e ) { var target = e.target; - var codeSections = $(target). - parents('.method-detail'). - find('.method-source-code'); - - $(target). - parents('.method-detail'). - find('.method-source-code'). - slideToggle(); + while (!target.classList.contains('method-detail')) { + target = target.parentNode; + } + if (typeof target !== "undefined" && target !== null) { + target = target.querySelector('.method-source-code'); + } + if (typeof target !== "undefined" && target !== null) { + target.classList.toggle('active-menu') + } }; function hookSourceViews() { - $('.method-heading').click( showSource ); + document.querySelectorAll('.method-heading').forEach(function (codeObject) { + codeObject.addEventListener('click', showSource); + }); }; function hookSearch() { - var input = $('#search-field').eq(0); - var result = $('#search-results').eq(0); - $(result).show(); + var input = document.querySelector('#search-field'); + var result = document.querySelector('#search-results'); + result.classList.remove("initially-hidden"); - var search_section = $('#search-section').get(0); - $(search_section).show(); + var search_section = document.querySelector('#search-section'); + search_section.classList.remove("initially-hidden"); var search = new Search(search_data, input, result); @@ -77,85 +72,14 @@ function hookSearch() { } search.select = function(result) { - var result_element = result.get(0); - window.location.href = result_element.firstChild.firstChild.href; + console.log(result); + window.location.href = result.firstChild.firstChild.href; } search.scrollIntoView = search.scrollInWindow; }; -function highlightTarget( anchor ) { - console.debug( "Highlighting target '%s'.", anchor ); - - $("a[name]").each( function() { - if ( $(this).attr("name") == anchor ) { - if ( !$(this).parent().parent().hasClass('target-section') ) { - console.debug( "Wrapping the target-section" ); - $('div.method-detail').unwrap( 'div.target-section' ); - $(this).parent().wrap( '
' ); - } else { - console.debug( "Already wrapped." ); - } - } - }); -}; - -function highlightLocationTarget() { - console.debug( "Location hash: %s", window.location.hash ); - if ( ! window.location.hash || window.location.hash.length == 0 ) return; - - var anchor = window.location.hash.substring(1); - console.debug( "Found anchor: %s; matching %s", anchor, "a[name=" + anchor + "]" ); - - highlightTarget( anchor ); -}; - -function highlightClickTarget( event ) { - console.debug( "Highlighting click target for event %o", event.target ); - try { - var anchor = $(event.target).attr( 'href' ).substring(1); - console.debug( "Found target anchor: %s", anchor ); - highlightTarget( anchor ); - } catch ( err ) { - console.error( "Exception while highlighting: %o", err ); - }; -}; - -function loadAsync(path, success, prefix) { - $.ajax({ - url: prefix + path, - dataType: 'script', - success: success, - cache: true - }); -}; - -$(document).ready( function() { +document.addEventListener('DOMContentLoaded', function() { hookSourceViews(); - highlightLocationTarget(); - $('ul.link-list a').bind( "click", highlightClickTarget ); - - var search_scripts_loaded = { - navigation_loaded: false, - search_loaded: false, - search_index_loaded: false, - searcher_loaded: false, - } - - var search_success_function = function(variable) { - return (function (data, status, xhr) { - search_scripts_loaded[variable] = true; - - if (search_scripts_loaded['navigation_loaded'] == true && - search_scripts_loaded['search_loaded'] == true && - search_scripts_loaded['search_index_loaded'] == true && - search_scripts_loaded['searcher_loaded'] == true) - hookSearch(); - }); - } - - loadAsync('js/navigation.js', search_success_function('navigation_loaded'), rdoc_rel_prefix); - loadAsync('js/search.js', search_success_function('search_loaded'), rdoc_rel_prefix); - loadAsync('js/search_index.js', search_success_function('search_index_loaded'), index_rel_prefix); - loadAsync('js/searcher.js', search_success_function('searcher_loaded'), rdoc_rel_prefix); + hookSearch(); }); diff --git a/lib/rdoc/generator/template/darkfish/js/search.js b/lib/rdoc/generator/template/darkfish/js/search.js index 60ac295e6c..b558ca5b4f 100644 --- a/lib/rdoc/generator/template/darkfish/js/search.js +++ b/lib/rdoc/generator/template/darkfish/js/search.js @@ -1,29 +1,29 @@ Search = function(data, input, result) { this.data = data; - this.$input = $(input); - this.$result = $(result); + this.input = input; + this.result = result; - this.$current = null; - this.$view = this.$result.parent(); + this.current = null; + this.view = this.result.parentNode; this.searcher = new Searcher(data.index); this.init(); } -Search.prototype = $.extend({}, Navigation, new function() { +Search.prototype = Object.assign({}, Navigation, new function() { var suid = 1; this.init = function() { var _this = this; var observer = function(e) { - switch(e.originalEvent.keyCode) { + switch(e.keyCode) { case 38: // Event.KEY_UP case 40: // Event.KEY_DOWN return; } - _this.search(_this.$input[0].value); + _this.search(_this.input.value); }; - this.$input.keyup(observer); - this.$input.click(observer); // mac's clear field + this.input.addEventListener('keyup', observer); + this.input.addEventListener('click', observer); // mac's clear field this.searcher.ready(function(results, isLast) { _this.addResults(results, isLast); @@ -34,7 +34,7 @@ Search.prototype = $.extend({}, Navigation, new function() { } this.search = function(value, selectFirstMatch) { - value = jQuery.trim(value).toLowerCase(); + value = value.trim().toLowerCase(); if (value) { this.setNavigationActive(true); } else { @@ -43,23 +43,23 @@ Search.prototype = $.extend({}, Navigation, new function() { if (value == '') { this.lastQuery = value; - this.$result.empty(); - this.$result.attr('aria-expanded', 'false'); + this.result.innerHTML = ''; + this.result.setAttribute('aria-expanded', 'false'); this.setNavigationActive(false); } else if (value != this.lastQuery) { this.lastQuery = value; - this.$result.attr('aria-busy', 'true'); - this.$result.attr('aria-expanded', 'true'); + this.result.setAttribute('aria-busy', 'true'); + this.result.setAttribute('aria-expanded', 'true'); this.firstRun = true; this.searcher.find(value); } } this.addResults = function(results, isLast) { - var target = this.$result.get(0); + var target = this.result; if (this.firstRun && (results.length > 0 || isLast)) { - this.$current = null; - this.$result.empty(); + this.current = null; + this.result.innerHTML = ''; } for (var i=0, l = results.length; i < l; i++) { @@ -70,25 +70,26 @@ Search.prototype = $.extend({}, Navigation, new function() { if (this.firstRun && results.length > 0) { this.firstRun = false; - this.$current = $(target.firstChild); - this.$current.addClass('search-selected'); + this.current = target.firstChild; + this.current.classList.add('search-selected'); } - if (jQuery.browser.msie) this.$element[0].className += ''; + //TODO: ECMAScript + //if (jQuery.browser.msie) this.$element[0].className += ''; - if (isLast) this.$result.attr('aria-busy', 'false'); + if (isLast) this.result.setAttribute('aria-busy', 'false'); } this.move = function(isDown) { - if (!this.$current) return; - var $next = this.$current[isDown ? 'next' : 'prev'](); - if ($next.length) { - this.$current.removeClass('search-selected'); - $next.addClass('search-selected'); - this.$input.attr('aria-activedescendant', $next.attr('id')); - this.scrollIntoView($next[0], this.$view[0]); - this.$current = $next; - this.$input.val($next[0].firstChild.firstChild.text); - this.$input.select(); + if (!this.current) return; + var next = isDown ? this.current.nextElementSibling : this.current.previousElementSibling; + if (next) { + this.current.classList.remove('search-selected'); + next.classList.add('search-selected'); + this.input.setAttribute('aria-activedescendant', next.getAttribute('id')); + this.scrollIntoView(next, this.view); + this.current = next; + this.input.value = next.firstChild.firstChild.text; + this.input.select(); } return true; } diff --git a/lib/rdoc/generator/template/json_index/js/navigation.js b/lib/rdoc/generator/template/json_index/js/navigation.js index 43c5118abd..dfad74b1ae 100644 --- a/lib/rdoc/generator/template/json_index/js/navigation.js +++ b/lib/rdoc/generator/template/json_index/js/navigation.js @@ -10,10 +10,8 @@ Navigation = new function() { this.initNavigation = function() { var _this = this; - $(document).keydown(function(e) { + document.addEventListener('keydown', function(e) { _this.onkeydown(e); - }).keyup(function(e) { - _this.onkeyup(e); }); this.navigationActive = true; @@ -21,20 +19,6 @@ Navigation = new function() { this.setNavigationActive = function(state) { this.navigationActive = state; - this.clearMoveTimeout(); - } - - this.onkeyup = function(e) { - if (!this.navigationActive) return; - - switch(e.keyCode) { - case 37: //Event.KEY_LEFT: - case 38: //Event.KEY_UP: - case 39: //Event.KEY_RIGHT: - case 40: //Event.KEY_DOWN: - this.clearMoveTimeout(); - break; - } } this.onkeydown = function(e) { @@ -46,7 +30,6 @@ Navigation = new function() { case 38: //Event.KEY_UP: if (e.keyCode == 38 || e.ctrlKey) { if (this.moveUp()) e.preventDefault(); - this.startMoveTimeout(false); } break; case 39: //Event.KEY_RIGHT: @@ -55,33 +38,14 @@ Navigation = new function() { case 40: //Event.KEY_DOWN: if (e.keyCode == 40 || e.ctrlKey) { if (this.moveDown()) e.preventDefault(); - this.startMoveTimeout(true); } break; case 13: //Event.KEY_RETURN: - if (this.$current) e.preventDefault(); - this.select(this.$current); + if (this.current) e.preventDefault(); + this.select(this.current); break; } - if (e.ctrlKey && e.shiftKey) this.select(this.$current); - } - - this.clearMoveTimeout = function() { - clearTimeout(this.moveTimeout); - this.moveTimeout = null; - } - - this.startMoveTimeout = function(isDown) { - if (!$.browser.mozilla && !$.browser.opera) return; - if (this.moveTimeout) this.clearMoveTimeout(); - var _this = this; - - var go = function() { - if (!_this.moveTimeout) return; - _this[isDown ? 'moveDown' : 'moveUp'](); - _this.moveTimeout = setTimeout(go, 100); - } - this.moveTimeout = setTimeout(go, 200); + if (e.ctrlKey && e.shiftKey) this.select(this.current); } this.moveRight = function() { diff --git a/lib/rdoc/generator/template/json_index/js/searcher.js b/lib/rdoc/generator/template/json_index/js/searcher.js index b3b1c58a0f..e200a168b0 100644 --- a/lib/rdoc/generator/template/json_index/js/searcher.js +++ b/lib/rdoc/generator/template/json_index/js/searcher.js @@ -51,20 +51,20 @@ Searcher.prototype = new function() { /* ----- Utilities ------ */ function splitQuery(query) { - return jQuery.grep(query.split(/(\s+|::?|\(\)?)/), function(string) { + return query.split(/(\s+|::?|\(\)?)/).filter(function(string) { return string.match(/\S/); }); } function buildRegexps(queries) { - return jQuery.map(queries, function(query) { + return queries.map(function(query) { return new RegExp(query.replace(/(.)/g, '([$1])([^$1]*?)'), 'i'); }); } function buildHilighters(queries) { - return jQuery.map(queries, function(query) { - return jQuery.map(query.split(''), function(l, i) { + return queries.map(function(query) { + return query.split('').map(function(l, i) { return '\u0001$' + (i*2+1) + '\u0002$' + (i*2+2); }).join(''); }); @@ -221,9 +221,9 @@ Searcher.prototype = new function() { } function triggerResults(results, isLast) { - jQuery.each(this.handlers, function(i, fn) { + this.handlers.forEach(function(fn) { fn.call(this, results, isLast) - }) + }); } } -- cgit v1.2.3