From 4fd23bc14b294aabadca97553c949280d56f19c9 Mon Sep 17 00:00:00 2001 From: nicola Date: Fri, 4 Nov 2022 18:17:38 +0100 Subject: [PATCH] =?UTF-8?q?aggiunte=20funzionalit=C3=A0=20all'interfaccia?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- NikBrowseSearchCombined.html | 1267 +------------------- css/jquery.highlight-within-textarea.css | 48 + js/NikBrowseSearchCombined.js | 207 +++- js/lib/jquery.highlight-within-textarea.js | 380 ++++++ 4 files changed, 638 insertions(+), 1264 deletions(-) create mode 100644 css/jquery.highlight-within-textarea.css create mode 100644 js/lib/jquery.highlight-within-textarea.js diff --git a/NikBrowseSearchCombined.html b/NikBrowseSearchCombined.html index 6c7fb1f..eae6834 100644 --- a/NikBrowseSearchCombined.html +++ b/NikBrowseSearchCombined.html @@ -17,6 +17,8 @@ + + + +// aggiunto per hilight in text + + @@ -39,6 +45,8 @@ + + @@ -78,7 +86,7 @@ -
+
@@ -100,117 +108,10 @@ href="#0" data-added="0">Paradiso
-
-
+
@@ -337,1150 +238,18 @@

- -
- - -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - - - - - -
- -
- -
- -
-
- -
-
-
-
- - - +
- @@ -1490,7 +259,9 @@
@@ -1507,10 +278,18 @@ +
- +
diff --git a/css/jquery.highlight-within-textarea.css b/css/jquery.highlight-within-textarea.css new file mode 100644 index 0000000..ad5d0a6 --- /dev/null +++ b/css/jquery.highlight-within-textarea.css @@ -0,0 +1,48 @@ +.hwt-container { + display: inline-block; + position: relative; + overflow: hidden !important; + -webkit-text-size-adjust: none !important; +} + +.hwt-backdrop { + position: absolute !important; + top: 0 !important; + right: -99px !important; + bottom: 0 !important; + left: 0 !important; + padding-right: 99px !important; + overflow-x: hidden !important; + overflow-y: auto !important; +} + +.hwt-highlights { + width: auto !important; + height: auto !important; + border-color: transparent !important; + white-space: pre-wrap !important; + word-wrap: break-word !important; + color: transparent !important; + overflow: hidden !important; +} + +.hwt-input { + display: block !important; + position: relative !important; + margin: 0; + padding: 0; + border-radius: 0; + font: inherit; + overflow-x: hidden !important; + overflow-y: auto !important; +} + +.hwt-content { + border: 1px solid; + background: none transparent !important; +} + +.hwt-content mark { + padding: 0 !important; + color: inherit; +} diff --git a/js/NikBrowseSearchCombined.js b/js/NikBrowseSearchCombined.js index 598fe16..a47787c 100644 --- a/js/NikBrowseSearchCombined.js +++ b/js/NikBrowseSearchCombined.js @@ -1090,8 +1090,6 @@ $(document).ready(function() { if (role == 'lemmaRadio'){ $('#lemmaCheck').prop('disabled', false); $('#formaCheck').prop('disabled', false); -// $('#lemmaCheck').prop('checked', true); -// $('#formaCheck').prop('checked', true); }else{ if (role == 'stringaRadio'){ $('#lemmaCheck').prop('disabled', true); @@ -1099,33 +1097,58 @@ $(document).ready(function() { } } }); + + jQuery(document).delegate('#close_cerca', 'click', function(e) { + e.preventDefault(); + + $('#apricerca').attr('style', "display:none;") + $('.labelVai span').html("Vai a:"); + $('#grammarbutton').attr('style', "display:block; width: 51px; height: 51px;"); + + $('#browseArea').css('opacity', '1'); + $('#PagineCanti').prop("disabled", false); + $('#PagineCanti').css('overflow', 'auto'); + + }); jQuery(document).delegate('#grammarbutton', 'click', function(e) { - - - $('.labelVai span').html("Cerca in:"); - /*$('.searchCosa').attr('style', "display:block;") - $('#lemmaCheck').prop('disabled', true); - $('#formaCheck').prop('disabled', true); - $('#lemmaCheck').prop('checked', false); - $('#formaCheck').prop('checked', false); + e.preventDefault(); + + $('#browseArea').css('opacity', '0.4'); + $('#PagineCanti').prop("disabled", true); + $('#PagineCanti').css('overflow', 'hidden'); + $('.labelVai span').html("Cerca in:"); + $('#grammarbutton').attr('style', "display:none;"); - $('#grammarbutton').attr('style', "display:none;"); - $('#quitGoButton').attr('style', "display:block;"); - - $('#searchValue').val(""); - $('#stringaRadio').attr('checked', true).click(); - //$(this).prop('disabled', true); - $('#FiltriGrafici').attr('style', "display:none;") - - filtraPerOpen = false;*/ $('#apricerca').attr('style', "display:block;") - + $('#advanSW').prop('checked',false) return true } ) + jQuery(document).delegate('#BottoneCerca', 'click', function(e) { + e.preventDefault(); + $("#loader").show(); + setTimeout(function() { + $("#loader").hide(); + fakeResult(); + }, 3000); + } + ) + jQuery(document).delegate('a.selectInferno1', 'click', function(e) { + e.preventDefault(); + //var areaText = $('#PagineCanti'); + $('#PagineCanti').highlightWithinTextarea({ + highlight: 'paura' + }); + }); + + + + + + // Da Luca JS $('#cla-TabContent').on('click', '#advanSW', function() { if ($(this).prop('checked')) { $("#cla-Advanced").attr('style', "display: block;"); @@ -1137,6 +1160,150 @@ $(document).ready(function() { } }); + $('.btn-group a').on('click', function() { + var addClaN = $(this).attr('id'); + switch (addClaN) { + case "Grammaticale": + addGramCla(1); + $('#cla' + tabID + '-tab').tab('show'); + break; + case "Sintattico": + addSyntCla(1); + $('#cla' + tabID + '-tab').tab('show'); + break; + case "Metafore": + addMetaCla(0); + $('#cla' + tabID + '-tab').tab('show'); + break; + case "Dialoghi": + addDialCla(0); + $('#cla' + tabID + '-tab').tab('show'); + break; + case "Struttura": + addStruCla(0); + $('#cla' + tabID + '-tab').tab('show'); + break; + case "andCond": + addLogicCond("AND","#sortable0") + break; + case "orCond": + addLogicCond("OR","#sortable0") + break; + default: + }; + }); + + function fakeResult(){ + tabellaCanti =""; + + for (j=1;j<20;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + tabellaCanti = tabellaCanti + + ''+'20(3)'+' '; + for (j=21;j<30;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + + tabellaCanti = tabellaCanti + + ''+'30(2)'+' '; + + for (j=31;j<34;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + + $('#CantiParadiso').append(tabellaCanti); + $('#CantiParadiso').attr('style', "display:block;") + + CantiParadiso = true; + + tabellaCanti =""; + + for (j=1;j<10;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + tabellaCanti = tabellaCanti + + ''+'10(4)'+' '; + for (j=11;j<25;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + + tabellaCanti = tabellaCanti + + ''+'25(2)'+' '; + + for (j=26;j<34;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + + $('#CantiPurgatorio').append(tabellaCanti); + $('#CantiPurgatorio').attr('style', "display:block;") + + CantiPurgatorio = true; + + tabellaCanti =""; + + tabellaCanti = tabellaCanti + + ''+'1(3)'+' '; + for (j=2;j<15;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + tabellaCanti = tabellaCanti + + ''+'15(1)'+' '; + for (j=16;j<22;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + + tabellaCanti = tabellaCanti + + ''+'22(2)'+' '; + tabellaCanti = tabellaCanti + + ''+'23(4)'+' '; + + + for (j=24;j<35;j++){ + tabellaCanti = tabellaCanti + + ''+j+' '; + } + + $('#CantiInferno').append(tabellaCanti); + $('#CantiInferno').attr('style', "display:block;") + + CantiInferno = true; + + $('#apricerca').attr('style', "display:none;") + $('.labelVai span').html("Vai a:"); + $('#grammarbutton').attr('style', "display:block; width: 51px; height: 51px;"); + + $('#browseArea').css('opacity', '1'); + $('#PagineCanti').prop("disabled", false); + $('#PagineCanti').css('overflow', 'auto'); + return true; + } + //Cesare $(function() { $("#filtri").sortable({ diff --git a/js/lib/jquery.highlight-within-textarea.js b/js/lib/jquery.highlight-within-textarea.js new file mode 100644 index 0000000..f77b212 --- /dev/null +++ b/js/lib/jquery.highlight-within-textarea.js @@ -0,0 +1,380 @@ +/* + * highlight-within-textarea + * + * @author Will Boyd + * @github https://github.com/lonekorean/highlight-within-textarea + */ + +(function($) { + let ID = 'hwt'; + + let HighlightWithinTextarea = function($el, config) { + this.init($el, config); + }; + + HighlightWithinTextarea.prototype = { + init: function($el, config) { + this.$el = $el; + + // backwards compatibility with v1 (deprecated) + if (this.getType(config) === 'function') { + config = { highlight: config }; + } + + if (this.getType(config) === 'custom') { + this.highlight = config; + this.generate(); + } else { + console.error('valid config object not provided'); + } + }, + + // returns identifier strings that aren't necessarily "real" JavaScript types + getType: function(instance) { + let type = typeof instance; + if (!instance) { + return 'falsey'; + } else if (Array.isArray(instance)) { + if (instance.length === 2 && typeof instance[0] === 'number' && typeof instance[1] === 'number') { + return 'range'; + } else { + return 'array'; + } + } else if (type === 'object') { + if (instance instanceof RegExp) { + return 'regexp'; + } else if (instance.hasOwnProperty('highlight')) { + return 'custom'; + } + } else if (type === 'function' || type === 'string') { + return type; + } + + return 'other'; + }, + + generate: function() { + this.$el + .addClass(ID + '-input ' + ID + '-content') + .on('input.' + ID, this.handleInput.bind(this)) + .on('scroll.' + ID, this.handleScroll.bind(this)); + + this.$highlights = $('
', { class: ID + '-highlights ' + ID + '-content' }); + + this.$backdrop = $('
', { class: ID + '-backdrop' }) + .append(this.$highlights); + + this.$container = $('
', { class: ID + '-container' }) + .insertAfter(this.$el) + .append(this.$backdrop, this.$el) // moves $el into $container + .on('scroll', this.blockContainerScroll.bind(this)); + + this.browser = this.detectBrowser(); + switch (this.browser) { + case 'firefox': + this.fixFirefox(); + break; + case 'ios': + this.fixIOS(); + break; + } + + // plugin function checks this for success + this.isGenerated = true; + + // trigger input event to highlight any existing input + this.handleInput(); + }, + + // browser sniffing sucks, but there are browser-specific quirks to handle + // that are not a matter of feature detection + detectBrowser: function() { + let ua = window.navigator.userAgent.toLowerCase(); + if (ua.indexOf('firefox') !== -1) { + return 'firefox'; + } else if (!!ua.match(/msie|trident\/7|edge/)) { + return 'ie'; + } else if (!!ua.match(/ipad|iphone|ipod/) && ua.indexOf('windows phone') === -1) { + // Windows Phone flags itself as "like iPhone", thus the extra check + return 'ios'; + } else { + return 'other'; + } + }, + + // Firefox doesn't show text that scrolls into the padding of a textarea, so + // rearrange a couple box models to make highlights behave the same way + fixFirefox: function() { + // take padding and border pixels from highlights div + let padding = this.$highlights.css([ + 'padding-top', 'padding-right', 'padding-bottom', 'padding-left' + ]); + let border = this.$highlights.css([ + 'border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width' + ]); + this.$highlights.css({ + 'padding': '0', + 'border-width': '0' + }); + + this.$backdrop + .css({ + // give padding pixels to backdrop div + 'margin-top': '+=' + padding['padding-top'], + 'margin-right': '+=' + padding['padding-right'], + 'margin-bottom': '+=' + padding['padding-bottom'], + 'margin-left': '+=' + padding['padding-left'], + }) + .css({ + // give border pixels to backdrop div + 'margin-top': '+=' + border['border-top-width'], + 'margin-right': '+=' + border['border-right-width'], + 'margin-bottom': '+=' + border['border-bottom-width'], + 'margin-left': '+=' + border['border-left-width'], + }); + }, + + // iOS adds 3px of (unremovable) padding to the left and right of a textarea, + // so adjust highlights div to match + fixIOS: function() { + this.$highlights.css({ + 'padding-left': '+=3px', + 'padding-right': '+=3px' + }); + }, + + handleInput: function() { + let input = this.$el.val(); + let ranges = this.getRanges(input, this.highlight); + let unstaggeredRanges = this.removeStaggeredRanges(ranges); + let boundaries = this.getBoundaries(unstaggeredRanges); + this.renderMarks(boundaries); + }, + + getRanges: function(input, highlight) { + let type = this.getType(highlight); + switch (type) { + case 'array': + return this.getArrayRanges(input, highlight); + case 'function': + return this.getFunctionRanges(input, highlight); + case 'regexp': + return this.getRegExpRanges(input, highlight); + case 'string': + return this.getStringRanges(input, highlight); + case 'range': + return this.getRangeRanges(input, highlight); + case 'custom': + return this.getCustomRanges(input, highlight); + default: + if (!highlight) { + // do nothing for falsey values + return []; + } else { + console.error('unrecognized highlight type'); + } + } + }, + + getArrayRanges: function(input, arr) { + let ranges = arr.map(this.getRanges.bind(this, input)); + return Array.prototype.concat.apply([], ranges); + }, + + getFunctionRanges: function(input, func) { + return this.getRanges(input, func(input)); + }, + + getRegExpRanges: function(input, regex) { + let ranges = []; + let match; + while (match = regex.exec(input), match !== null) { + ranges.push([match.index, match.index + match[0].length]); + if (!regex.global) { + // non-global regexes do not increase lastIndex, causing an infinite loop, + // but we can just break manually after the first match + break; + } + } + return ranges; + }, + + getStringRanges: function(input, str) { + let ranges = []; + let inputLower = input.toLowerCase(); + let strLower = str.toLowerCase(); + let index = 0; + while (index = inputLower.indexOf(strLower, index), index !== -1) { + ranges.push([index, index + strLower.length]); + index += strLower.length; + } + return ranges; + }, + + getRangeRanges: function(input, range) { + return [range]; + }, + + getCustomRanges: function(input, custom) { + let ranges = this.getRanges(input, custom.highlight); + if (custom.className) { + ranges.forEach(function(range) { + // persist class name as a property of the array + if (range.className) { + range.className = custom.className + ' ' + range.className; + } else { + range.className = custom.className; + } + }); + } + return ranges; + }, + + // prevent staggered overlaps (clean nesting is fine) + removeStaggeredRanges: function(ranges) { + let unstaggeredRanges = []; + ranges.forEach(function(range) { + let isStaggered = unstaggeredRanges.some(function(unstaggeredRange) { + let isStartInside = range[0] > unstaggeredRange[0] && range[0] < unstaggeredRange[1]; + let isStopInside = range[1] > unstaggeredRange[0] && range[1] < unstaggeredRange[1]; + return isStartInside !== isStopInside; // xor + }); + if (!isStaggered) { + unstaggeredRanges.push(range); + } + }); + return unstaggeredRanges; + }, + + getBoundaries: function(ranges) { + let boundaries = []; + ranges.forEach(function(range) { + boundaries.push({ + type: 'start', + index: range[0], + className: range.className + }); + boundaries.push({ + type: 'stop', + index: range[1] + }); + }); + + this.sortBoundaries(boundaries); + return boundaries; + }, + + sortBoundaries: function(boundaries) { + // backwards sort (since marks are inserted right to left) + boundaries.sort(function(a, b) { + if (a.index !== b.index) { + return b.index - a.index; + } else if (a.type === 'stop' && b.type === 'start') { + return 1; + } else if (a.type === 'start' && b.type === 'stop') { + return -1; + } else { + return 0; + } + }); + }, + + renderMarks: function(boundaries) { + let input = this.$el.val(); + boundaries.forEach(function(boundary, index) { + let markup; + if (boundary.type === 'start') { + markup = '{{hwt-mark-start|' + index + '}}'; + } else { + markup = '{{hwt-mark-stop}}'; + } + input = input.slice(0, boundary.index) + markup + input.slice(boundary.index); + }); + + // this keeps scrolling aligned when input ends with a newline + input = input.replace(/\n(\{\{hwt-mark-stop\}\})?$/, '\n\n$1'); + + // encode HTML entities + input = input.replace(//g, '>'); + + if (this.browser === 'ie') { + // IE/Edge wraps whitespace differently in a div vs textarea, this fixes it + input = input.replace(/ /g, ' '); + } + + // replace start tokens with opening tags with class name + input = input.replace(/\{\{hwt-mark-start\|(\d+)\}\}/g, function(match, submatch) { + var className = boundaries[+submatch].className; + if (className) { + return ''; + } else { + return ''; + } + }); + + // replace stop tokens with closing tags + input = input.replace(/\{\{hwt-mark-stop\}\}/g, ''); + + this.$highlights.html(input); + }, + + handleScroll: function() { + let scrollTop = this.$el.scrollTop(); + this.$backdrop.scrollTop(scrollTop); + + // Chrome and Safari won't break long strings of spaces, which can cause + // horizontal scrolling, this compensates by shifting highlights by the + // horizontally scrolled amount to keep things aligned + let scrollLeft = this.$el.scrollLeft(); + this.$backdrop.css('transform', (scrollLeft > 0) ? 'translateX(' + -scrollLeft + 'px)' : ''); + }, + + // in Chrome, page up/down in the textarea will shift stuff within the + // container (despite the CSS), this immediately reverts the shift + blockContainerScroll: function() { + this.$container.scrollLeft(0); + }, + + destroy: function() { + this.$backdrop.remove(); + this.$el + .unwrap() + .removeClass(ID + '-text ' + ID + '-input') + .off(ID) + .removeData(ID); + }, + }; + + // register the jQuery plugin + $.fn.highlightWithinTextarea = function(options) { + return this.each(function() { + let $this = $(this); + let plugin = $this.data(ID); + + if (typeof options === 'string') { + if (plugin) { + switch (options) { + case 'update': + plugin.handleInput(); + break; + case 'destroy': + plugin.destroy(); + break; + default: + console.error('unrecognized method string'); + } + } else { + console.error('plugin must be instantiated first'); + } + } else { + if (plugin) { + plugin.destroy(); + } + plugin = new HighlightWithinTextarea($this, options); + if (plugin.isGenerated) { + $this.data(ID, plugin); + } + } + }); + }; +})(jQuery);