Skip to content

Commit

Permalink
jquery cleanse
Browse files Browse the repository at this point in the history
  • Loading branch information
@turner
turner committed Jan 10, 2025
1 parent be430a7 commit d35fedb
Show file tree
Hide file tree
Showing 28 changed files with 801 additions and 8,996 deletions.
54 changes: 26 additions & 28 deletions js/bam/alignmentTrack.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,9 @@ import orientationTypes from "./orientationTypes.js"
import {ColorTable, PaletteColorTable} from "../util/colorPalletes.js"
import TrackBase from "../trackBase.js"
import {getChrColor} from "../util/getChrColor.js"
import $ from "../vendor/jquery-3.3.1.slim.js"
import {createCheckbox} from "../igv-icons.js"
import BaseModificationKey from "./mods/baseModificationKey.js"
import {modificationName} from "./mods/baseModificationUtils.js"
import {createElementWithString} from "../ui/utils/dom-utils.js"


const alignmentStartGap = 5
Expand Down Expand Up @@ -674,9 +673,9 @@ class AlignmentTrack extends TrackBase {

// Color by items //////////////////////////////////////////////////
menuItems.push('<hr/>')
const $e = $('<div class="igv-track-menu-category">')
$e.text('Color by:')
menuItems.push({name: undefined, object: $e, click: undefined, init: undefined})
let element = createElementWithString('<div class="igv-track-menu-category">')
element.innerText = 'Color by:'
menuItems.push({name: undefined, element, click: undefined, init: undefined})

const colorByMenuItems = []
colorByMenuItems.push({key: 'none', label: 'none'})
Expand Down Expand Up @@ -728,9 +727,10 @@ class AlignmentTrack extends TrackBase {

// Group by items //////////////////////////////////////////////////
menuItems.push('<hr/>')
const $e2 = $('<div class="igv-track-menu-category">')
$e2.text('Group by:')
menuItems.push({name: undefined, object: $e2, click: undefined, init: undefined})
element = document.createElement('div');
element.className = 'igv-track-menu-category';
element.textContent = 'Group by:';
menuItems.push({name: undefined, element, click: undefined, init: undefined});

const groupByMenuItems = []
groupByMenuItems.push({key: 'none', label: 'none'})
Expand Down Expand Up @@ -762,7 +762,7 @@ class AlignmentTrack extends TrackBase {
// Show all bases
menuItems.push('<hr/>')
menuItems.push({
object: $(createCheckbox("Show all bases", this.showAllBases)),
element: createCheckbox("Show all bases", this.showAllBases),
click: function showAllBasesHandler() {
this.alignmentTrack.showAllBases = !this.alignmentTrack.showAllBases
this.trackView.repaintViews()
Expand All @@ -771,7 +771,7 @@ class AlignmentTrack extends TrackBase {

// Show mismatches
menuItems.push({
object: $(createCheckbox("Show mismatches", this.showMismatches)),
element: createCheckbox("Show mismatches", this.showMismatches),
click: function showMismatchesHandler() {
this.alignmentTrack.showMismatches = !this.alignmentTrack.showMismatches
this.trackView.repaintViews()
Expand All @@ -780,7 +780,7 @@ class AlignmentTrack extends TrackBase {

// Insertions
menuItems.push({
object: $(createCheckbox("Show insertions", this.showInsertions)),
element: createCheckbox("Show insertions", this.showInsertions),
click: function showInsertionsHandler() {
this.alignmentTrack.showInsertions = !this.alignmentTrack.showInsertions
this.trackView.repaintViews()
Expand All @@ -789,7 +789,7 @@ class AlignmentTrack extends TrackBase {

// Soft clips
menuItems.push({
object: $(createCheckbox("Show soft clips", this.showSoftClips)),
element: createCheckbox("Show soft clips", this.showSoftClips),
click: function showSoftClipsHandler() {
this.alignmentTrack.showSoftClips = !this.alignmentTrack.showSoftClips
const alignmentContainers = this.getCachedAlignmentContainers()
Expand All @@ -804,7 +804,7 @@ class AlignmentTrack extends TrackBase {
if (this.hasPairs) {
menuItems.push('<hr/>')
menuItems.push({
object: $(createCheckbox("View as pairs", this.viewAsPairs)),
element: createCheckbox("View as pairs", this.viewAsPairs),
click: function viewAsPairsHandler() {
const b = !this.alignmentTrack.viewAsPairs
if (b && this.groupBy && !pairCompatibleGroupOptions.has(this.groupBy)) {
Expand Down Expand Up @@ -851,13 +851,15 @@ class AlignmentTrack extends TrackBase {

// Display mode
menuItems.push('<hr/>')
const $dml = $('<div class="igv-track-menu-category">')
$dml.text('Display mode:')
menuItems.push({name: undefined, object: $dml, click: undefined, init: undefined})

element = document.createElement('div');
element.className = 'igv-track-menu-category';
element.textContent = 'Display mode:';
menuItems.push({name: undefined, element, click: undefined, init: undefined});

for (let mode of ["EXPANDED", "SQUISHED", "FULL"])
menuItems.push({
object: $(createCheckbox(mode.toLowerCase(), this.displayMode === mode)),
element: createCheckbox(mode.toLowerCase(), this.displayMode === mode),
click: function expandHandler() {
this.alignmentTrack.setDisplayMode(mode)
}
Expand Down Expand Up @@ -887,11 +889,11 @@ class AlignmentTrack extends TrackBase {
*
* @param menuItem
* @param showCheck
* @returns {{init: undefined, name: undefined, click: clickHandler, object: (jQuery|HTMLElement|jQuery.fn.init)}}
* @returns {{init: undefined, name: undefined, click: clickHandler, element: (jQuery|HTMLElement|jQuery.fn.init)}}
*/
colorByCB(menuItem, showCheck) {

const $e = $(createCheckbox(menuItem.label, showCheck))
const element = createCheckbox(menuItem.label, showCheck)

if (menuItem.key !== 'tag') {

Expand All @@ -900,7 +902,7 @@ class AlignmentTrack extends TrackBase {
this.trackView.repaintViews()
}

return {name: undefined, object: $e, click: clickHandler, init: undefined}
return {name: undefined, element, click: clickHandler, init: undefined}
} else {

function dialogPresentationHandler(ev) {
Expand All @@ -925,7 +927,7 @@ class AlignmentTrack extends TrackBase {
}, ev)
}

return {name: undefined, object: $e, dialog: dialogPresentationHandler, init: undefined}
return {name: undefined, element, dialog: dialogPresentationHandler, init: undefined}

}
}
Expand All @@ -934,14 +936,12 @@ class AlignmentTrack extends TrackBase {

const showCheck = this.colorBy === menuItem.key

const $e = $(createCheckbox(menuItem.label, showCheck))

function clickHandler() {
this.alignmentTrack.colorBy = menuItem.key
this.trackView.repaintViews()
}

return {name: undefined, object: $e, click: clickHandler, init: undefined}
return {name: undefined, element: createCheckbox(menuItem.label, showCheck), click: clickHandler, init: undefined}
}


Expand All @@ -953,12 +953,10 @@ class AlignmentTrack extends TrackBase {
*
* @param menuItem
* @param showCheck
* @returns {{init: undefined, name: undefined, click: clickHandler, object: (jQuery|HTMLElement|jQuery.fn.init)}}
* @returns {{init: undefined, name: undefined, click: clickHandler, element: (jQuery|HTMLElement|jQuery.fn.init)}}
*/
groupByCB(menuItem, showCheck) {

const $e = $(createCheckbox(menuItem.label, showCheck))

function clickHandler(ev) {

const doGroupBy = () => this.alignmentTrack.repackAlignments()
Expand Down Expand Up @@ -991,7 +989,7 @@ class AlignmentTrack extends TrackBase {
}
}

return {name: undefined, object: $e, dialog: clickHandler, init: undefined}
return {name: undefined, element: createCheckbox(menuItem.label, showCheck), dialog: clickHandler, init: undefined}

}

Expand Down
5 changes: 2 additions & 3 deletions js/bam/bamTrack.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@
* THE SOFTWARE.
*/

import $ from "../vendor/jquery-3.3.1.slim.js"
import BamSource from "./bamSource.js"
import TrackBase from "../trackBase.js"
import IGVGraphics from "../igv-canvas.js"
Expand Down Expand Up @@ -285,7 +284,7 @@ class BAMTrack extends TrackBase {
}

menuItems.push({
object: $(createCheckbox("Show Coverage", this.showCoverage)),
element: createCheckbox("Show Coverage", this.showCoverage),
click: showCoverageHandler
})

Expand All @@ -297,7 +296,7 @@ class BAMTrack extends TrackBase {
}

menuItems.push({
object: $(createCheckbox("Show Alignments", this.showAlignments)),
element: createCheckbox("Show Alignments", this.showAlignments),
click: showAlignmentHandler
})

Expand Down
33 changes: 16 additions & 17 deletions js/browser.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import $ from "./vendor/jquery-3.3.1.slim.js"
import {BGZip, FileUtils, igvxhr, StringUtils, URIUtils} from "../node_modules/igv-utils/src/index.js"
import * as DOMUtils from "./ui/utils/dom-utils.js"
import InputDialog from "./ui/components/inputDialog.js"
Expand Down Expand Up @@ -223,7 +222,7 @@ class Browser {

this.navbar = new ResponsiveNavbar(config, this)

this.navbar.$navigation.insertBefore($(this.columnContainer))
this.columnContainer.parentNode.insertBefore(this.navbar.navigation, this.columnContainer);

if (false === config.showControls) {
this.navbar.hide()
Expand All @@ -233,8 +232,8 @@ class Browser {
this.inputDialog = new InputDialog(this.root)
this.inputDialog.container.id = `igv-input-dialog-${DOMUtils.guid()}`

this.dataRangeDialog = new DataRangeDialog(this, $(this.root))
this.dataRangeDialog.$container.get(0).id = `igv-data-range-dialog-${DOMUtils.guid()}`
this.dataRangeDialog = new DataRangeDialog(this, this.root)
this.dataRangeDialog.container.id = `igv-data-range-dialog-${DOMUtils.guid()}`

this.genericColorPicker = new GenericColorPicker({ parent: this.columnContainer, width: 180 })
this.genericColorPicker.container.id = `igv-track-color-picker-${DOMUtils.guid()}`
Expand Down Expand Up @@ -1179,8 +1178,8 @@ class Browser {

axis.remove()

for (let {$viewport} of viewports) {
$viewport.detach()
for (let {viewportElement} of viewports) {
viewportElement.parentNode.removeChild(viewportElement)
}

sampleInfoViewport.viewport.remove()
Expand Down Expand Up @@ -1208,8 +1207,8 @@ class Browser {
this.columnContainer.querySelector('.igv-axis-column').appendChild(axis)

for (let i = 0; i < viewportColumns.length; i++) {
const {$viewport} = viewports[i]
viewportColumns[i].appendChild($viewport.get(0))
const {viewportElement} = viewports[i]
viewportColumns[i].appendChild(viewportElement)
}

this.columnContainer.querySelector('.igv-sample-info-column').appendChild(sampleInfoViewport.viewport)
Expand Down Expand Up @@ -1521,8 +1520,8 @@ class Browser {
const indexRight = 1 + indexLeft

// TODO -- this is really ugly
const {$viewport} = this.trackViews[0].viewports[indexLeft]
const viewportColumn = viewportColumnManager.insertAfter($viewport.get(0).parentElement)
const {viewportElement} = this.trackViews[0].viewports[indexLeft]
const viewportColumn = viewportColumnManager.insertAfter(viewportElement.parentElement)
this.fireEvent('didchangecolumnlayout')

if (indexRight === this.referenceFrameList.length) {
Expand Down Expand Up @@ -1566,9 +1565,9 @@ class Browser {

// find the $column corresponding to this referenceFrame and remove it
const index = this.referenceFrameList.indexOf(referenceFrame)
const {$viewport} = this.trackViews[0].viewports[index]
const {viewportElement} = this.trackViews[0].viewports[index]

viewportColumnManager.removeColumnAtIndex(index, $viewport.parent().get(0))
viewportColumnManager.removeColumnAtIndex(index, viewportElement.parentElement)
this.fireEvent('didchangecolumnlayout')

for (let {viewports} of this.trackViews) {
Expand Down Expand Up @@ -2330,7 +2329,7 @@ function handleMouseMove(e) {
Math.abs(y - this.vpMouseDown.mouseDownY) > this.constants.scrollThreshold) {
// Scrolling => dragging track vertically
this.isScrolling = true
const viewportHeight = viewport.$viewport.height()
const viewportHeight = viewport.viewportElement.offsetHeight
const contentHeight = viewport.trackView.maxViewportContentHeight()
this.vpMouseDown.r = viewportHeight / contentHeight
}
Expand All @@ -2340,7 +2339,7 @@ function handleMouseMove(e) {
if (this.dragObject) {
const clampDrag = !this.isSoftclipped()
let deltaX = this.vpMouseDown.lastMouseX - x
const viewChanged = referenceFrame.shiftPixels(deltaX, viewport.$viewport.width(), clampDrag)
const viewChanged = referenceFrame.shiftPixels(deltaX, viewport.viewportElement.offsetWidth, clampDrag)
if (viewChanged) {
this.updateViews()
}
Expand Down Expand Up @@ -2450,11 +2449,11 @@ function toggleTrackLabels(trackViews, isVisible) {

for (let {viewports} of trackViews) {
for (let viewport of viewports) {
if (viewport.$trackLabel) {
if (viewport.trackLabelElement) {
if (0 === viewports.indexOf(viewport) && true === isVisible) {
viewport.$trackLabel.show()
viewport.trackLabelElement.style.display = 'block';
} else {
viewport.$trackLabel.hide()
viewport.trackLabelElement.style.display = 'none';
}
}
}
Expand Down
11 changes: 5 additions & 6 deletions js/cnvpytor/cnvpytorTrack.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import MenuUtils from "../ui/menuUtils.js"
import HDF5IndexedReader from "./HDF5IndexedReader.js"
import {CNVpytorVCF} from "./cnvpytorVCF.js"
import FeatureSource from '../feature/featureSource.js'
import $ from "../vendor/jquery-3.3.1.slim.js"
import {createCheckbox} from "../igv-icons.js"
import IGVGraphics from "../igv-canvas.js"
import VariantTrack from "../variant/variantTrack.js"
Expand Down Expand Up @@ -241,7 +240,7 @@ class CNVPytorTrack extends TrackBase {
for (let rd_bin of this.available_bins) {
const checkBox = createCheckbox(rd_bin, rd_bin === this.bin_size)
items.push({
object: $(checkBox),
element: checkBox,
click: async function binSizesHandler() {
this.bin_size = rd_bin
// data loader image
Expand All @@ -261,7 +260,7 @@ class CNVPytorTrack extends TrackBase {
for (let signal_name in signal_dct) {
const checkBox = createCheckbox(signal_dct[signal_name], signal_name === this.signal_name)
items.push({
object: $(checkBox),
element: checkBox,
click: async function signalTypeHandler() {
this.signal_name = signal_name
await this.recreate_tracks(this.bin_size)
Expand All @@ -279,7 +278,7 @@ class CNVPytorTrack extends TrackBase {
for (let cnv_caller of this.available_callers) {
const checkBox = createCheckbox(cnv_caller, cnv_caller === this.cnv_caller)
items.push({
object: $(checkBox),
element: checkBox,
click: async function cnvCallerHandler() {
this.cnv_caller = cnv_caller
// data loader image
Expand Down Expand Up @@ -522,12 +521,12 @@ class CNVPytorTrack extends TrackBase {
// if number >= 100, show whole number
// if >= 1 show 1 significant digits
// if < 1 show 2 significant digits

// change the label for negative number to positive; For BAF likelihood section
if(number < 0){
return Math.abs(number)
}

if (number === 0) {
return "0"
} else if (Math.abs(number) >= 10) {
Expand Down
Loading

0 comments on commit d35fedb

Please sign in to comment.