Opened 10 years ago

Closed 10 years ago

Last modified 10 years ago

#799 closed (fixed)

Spectrum viewer should allow a zoom mass range to be set using the mouse

Reported by: olle Owned by: olle
Milestone: Proteios SE 2.18.0 Keywords:
Cc:

Description (last modified by olle)

Spectrum viewer should allow a zoom mass range to be set using the mouse. The first version should have the following properties:

  • A mass range can be selected by dragging the mouse over the desired region in a mass spectrum.
  • If the current browser reserves dragging in images for other purposes, it should also be possible to select a mass range by clicking on the low and high cutoff masses in a mass spectrum. Each odd click in a mass spectrum should set the low cutoff mass value, and each even click should set the high mass value.
  • The input field that has its value updated should get focus afterward.
  • If the low end of the selected region is below the low end of a zoomed spectrum, the lowest displayed mass should be set as low cutoff value, while if the high end of the selected region is above the high end of a zoomed spectrum, the highest displayed mass should be set as high cutoff value.
  • It should still be possible to select cutoff masses by entering values in the input fields by hand.

Updates of the spectrum viewer, that are not directly coupled to selecting cutoff values using the mouse, but will simplify its use:

  • When both a zoomed spectrum and the original spectrum are displayed, the zoomed spectrum should be shown at the top, since it normally is the one the user is most interested in (currently the original spectrum is shown at the top).
  • When both a zoomed spectrum and the original spectrum are displayed, the original spectrum should indicate the zoom mass range.
  • If the low mass cutoff value is > the high mass cutoff value, the spectrum viewer should internally reverse the values before creating the zoomed spectrum. This allows a mass range to be selected by dragging the mouse in either direction, or clicking on the cutoff masses in any order.

The above functionality will allow a spectrum range to be zoomed by dragging the mouse over the desired mass range , or clicking on the cutoff masses, and pressing the Enter/Return key.

Change History (13)

comment:1 Changed 10 years ago by olle

Status: newassigned

Ticket accepted.

comment:2 Changed 10 years ago by olle

Traceability note:

  • Class ViewActivePeakList was introduced in changeset [801] 2006-10-25 12:33:56.
  • Class PlotSpectrum was introduced in changeset [922] 2006-11-15 14:37:40..
  • The extension project for SpectrumFileInspectorExtension currently includes four tickets:

    1. Ticket #1 (Extension to inspect spectra in a selected spectrum file).
    2. Ticket #2 (Extension documentation).
    3. Ticket #3 (Spectrum File Inspector Extension should display Spectrum Properties).
    4. Ticket #4 (Spectrum File Inspector Extension should display Spectrum File Info).
    5. Ticket #5 (Spectrum File Inspector Extension should forward action to InspectActiveSpectrumFile).

    Since extension SpectrumFileInspectorExtension now relies on class InspectActiveSpectrumFile for its functionality, it is only needed to update the latter class.
  • Mass value annotation in displayed mass spectra was introduced in Ticket #425 (Show mass values for some peaks in mass spectra).
  • Class InspectActiveSpectrumFile was introduced in ticket #540 (Peaklist file cell in Hits table should have view action for inspecting the spectrum file).
  • Zooming of spectra was introduced in Ticket #592 (zoom in spectra).
  • Spectrum display was updated in Ticket #609 (Spectrum peaks displayed as wide).
  • Spectrum file viewer was updated in Ticket #611 (Problems with spectrum viewer when many spectra).
  • Spectrum file viewer was updated in Ticket #616 (Spectrum File Inspector should have buttons for previous and next spectrum).
  • Spectrum viewer was updated to show mass values as tool-tips in Ticket #618 (Spectrum viewers should show mass values as tool-tips).

comment:3 Changed 10 years ago by olle

Description: modified (diff)
Summary: Spectrum viewer should allow cutoff masses to be set by clicking in mass spectraSpectrum viewer should allow a zoom mass range to be set using the mouse

Ticket description updated by adding possibility to select a mass range by dragging the mouse, reversal of cutoff values if the low mass value > the high mass value, and simplification of the rule of selecting cutoff values for mouse events outside the spectrum (an input field will now never be cleared, since there is then no way to determine if it represents a low or high end mass value).

comment:4 Changed 10 years ago by olle

Design description:

  • Class/files action/peakList/PeakAnnotationUtil.java, action/peakList/PlotFileSpectrum.java, and action/peakList/PlotSpectrum.java, all in client/servlet/, should be updated to make the spectrum low and high end masses and pixel offsets available to other classes, and reverse the cutoff mass values internally if the low cutoff mass > the high cutoff mass.
  • Proteios SE should be updated to allow id, ondragstart, onMousedown, and onMouseup attributes to be set for an HTML image element.
  • The spectrum images should have id, ondragstart, onMousedown, and onMouseup attribute values set. Attribute ondragstart should be set to "return false;", in order to disable default drag functionality for the browser (this has been tested to work on Firefox 15.0.1 on openSUSE 12.2). Attributes onMousedown and onMouseup should be set to call new JavaScript functions setMouseDownMassCutoffValue(...) and setMouseUpMassCutoffValue(...), respectively. The spectrum low and high end masses and pixel offsets should be obtained from the spectrum plot object, and transferred to the script functions as arguments. Also, the zoomed spectrum should now be shown above the original spectrum.
  • JavaScript www/static/js/script.js in client/servlet/ should be updated with two new functions setMouseDownMassCutoffValue(...) and setMouseUpMassCutoffValue(...) to set the value of the low and high cutoff mass input fields.

The mechanism by which mouse selection should work both by dragging the mouse and by clicking on the end masses in sequence, is as follows (fully contained in JavaScript www/static/js/script.js in client/servlet/):

  • The script has two global variables, one storing the last mouse down cutoff value string set (initialized to ''), and a boolean flag indicating if the next click is reserved for the mouse up event (initialized to false).
  • At a mouse down event, function setMouseDownMassCutoffValue(...) checks if the next click is reserved for the mouse up event. If it is, the function does nothing, otherwise the cutoff mass is calculated and set in the low mass cutoff input field, and the value string is stored internally.
  • At a mouse up event, function setMouseUpMassCutoffValue(...) calculates the cutoff mass, and checks if this equals the stored last mouse down cutoff value string set. If it does, the mouse has not been moved since the mouse down event, and the function does nothing, except setting the flag indicating that the next click is reserved for the up event to true. If the mass value is different from the stored one, the mouse has been moved since this value was stored (either by dragging or a previous mouse click), and the new mass value is set in the high mass cutoff input field, and the flag indicating that the next click is reserved for the mouse up event is set to false.
Last edited 10 years ago by olle (previous) (diff)

comment:5 Changed 10 years ago by olle

(In [4434]) Refs #799. Proteios SE updated to allow id, ondragstart, onMousedown, and onMouseup attributes to be set for an HTML image element.

comment:6 Changed 10 years ago by olle

(In [4435]) Refs #799. Class/files action/peakList/PeakAnnotationUtil.java, action/peakList/PlotFileSpectrum.java, and action/peakList/PlotSpectrum.java, all in client/servlet/, updated to make the spectrum low and high end masses and pixel offsets available to other classes, and reverse the cutoff mass values internally if the low cutoff mass > the high cutoff mass.

comment:7 Changed 10 years ago by olle

(In [4436]) Refs #799. Proteios SE mass spectrum viewer updated to allow a zoom mass range to be set using the mouse:

  1. JavaScript www/static/js/script.js in client/servlet/ updated with two new functions setMouseDownMassCutoffValue(e, inputElName, imgId, spectrumWidth, spectrumOffsetLeft, spectrumOffsetRight, massMin, massMax) and setMouseUpMassCutoffValue(e, inputElName, imgId, spectrumWidth, spectrumOffsetLeft, spectrumOffsetRight, massMin, massMax) to set the value of the low and high cutoff mass input fields. A number of global variables and help functions are also added, in order to convert a click position to a mass value, and get the functionality of selecting a mass range by either dragging the mouse or clicking on the low and high end masses in the spectrum. Some updates of existing functions were also made, in order to increase the stability of the script.

  1. Classes/files action/file/InspectActiveSpectrumFile.java, action/hit/ViewActiveHitSpectrum.java, action/peakList/ViewActivePeakList.java, and action/spectrumSearch/ViewActivePeptideSearchResult.java, all in client/servlet/, were updated to set the id, ondragstart, onMousedown, and onMouseup attribute values for the spectrum images. Attribute ondragstart is set to "return false;", in order to disable default drag functionality for the browser. Attributes onMousedown and onMouseup are set to call new JavaScript functions setMouseDownMassCutoffValue(...) and setMouseUpMassCutoffValue(...), respectively. The spectrum low and high end masses and pixel offsets are obtained from the spectrum plot object, and transferred to the script functions as arguments. Also, the zoomed spectrum is now shown above the original spectrum.

comment:8 Changed 10 years ago by olle

(In [4437]) Refs #799. JavaScript www/static/js/script.js in client/servlet/ updated in JavaDoc comment for function setMouseDownMassCutoffValue(e, inputElName, imgId, spectrumWidth, spectrumOffsetLeft, spectrumOffsetRight, massMin, massMax) to current name and type of flag variable.

comment:9 Changed 10 years ago by olle

(In [4438]) Refs #799. JavaScript www/static/js/script.js in client/servlet/ updated in function setMouseDownMassCutoffValue(...) to not set focus to low mass cutoff input field at the end, since this might scroll the page vertically to make the input field visible, if both a zoomed and original spectrum is shown, and will interfere with marking a mass cutoff range by dragging or clicking the mouse. The high mass cutoff input field will still be set to be in focus at the end of function setMouseUpMassCutoffValue(...), since both mass cutoff values are then set.

comment:10 Changed 10 years ago by olle

Design update:

  • If both a zoomed and original spectrum are shown, the zoom area should be indicated in the original spectrum by a rectangle with sides at the low and high cutoff masses (the height should be equal to that of the spectrum area, minus a pixel at the top and bottom. to make the horizontal sides visible). The zoom indication should be considered as a guideline only, and not a precise display of the zoom area.

This feature can be implemented by the following changes:

  1. Class/file action/peakList/PeakAnnotationUtil.java in client/servlet/ is updated with a new public method void markZoomMassRange(BufferedImage image, Double massCutoffMin, Double massCutoffMax), that marks a mass region by drawing a rectangle in an existing mass spectrum image. It obtains values of the lowest and highest masses in the spectrum, as well as the spectrum area left and right offsets in pixels from values of instance variables, so these must have been set before the method is called. Existing public method void annotateMassValues(BufferedImage image, SpectrumInterface spectrum) is updated to set these values, since it is normally called before the new method.
  2. Classes/files action/peakList/PlotFileSpectrum.java and action/peakList/PlotSpectrum.java, both in client/servlet/, are updated in protected method void runMe() to obtain value of new valid parameter VBoolean VMASSCUTOFFMARKUPONLY and if its value is true, ignore the cutoff values when obtaining the spectra (i.e. this spectra is not zoomed), and call method void markZoomMassRange(BufferedImage image, Double massCutoffMin, Double massCutoffMax) in the PeakAnnotationUtil object used to annotate the spectrum.
  3. Classes/files action/file/InspectActiveSpectrumFile.java, action/hit/ViewActiveHitSpectrum.java, action/peakList/ViewActivePeakList.java, and action/spectrumSearch/ViewActivePeptideSearchResult.java, all in client/servlet/, are updated to add mass cutoff values to valid parameters VMASSCUTOFFLOWSTR and VMASSCUTOFFHIGHSTR, and set value of valid parameter VMASSCUTOFFMARKUPONLY to true for the view action used for the original spectrum plot.

comment:11 Changed 10 years ago by olle

(In [4439]) Refs #799. Proteios SE spectrum viewer updated to indicate the zoom region with a gray rectangle in the original spectrum, in case both a zoomed and original spectrum are shown:

  1. Class/file action/peakList/PeakAnnotationUtil.java in client/servlet/ is updated with a new public method void markZoomMassRange(BufferedImage image, Double massCutoffMin, Double massCutoffMax), that marks a mass region by drawing a rectangle in an existing mass spectrum image. It obtains values of the lowest and highest masses in the spectrum, as well as the spectrum area left and right offsets in pixels from values of instance variables, so these must have been set before the method is called. Existing public method void annotateMassValues(BufferedImage image, SpectrumInterface spectrum) is updated to set these values, since it is normally called before the new method.
  2. Classes/files action/peakList/PlotFileSpectrum.java and action/peakList/PlotSpectrum.java, both in client/servlet/, are updated in protected method void runMe() to obtain value of new valid parameter VBoolean VMASSCUTOFFMARKUPONLY and if its value is true, ignore the cutoff values when obtaining the spectra (i.e. this spectra is not zoomed), and call method void markZoomMassRange(BufferedImage image, Double massCutoffMin, Double massCutoffMax) in the PeakAnnotationUtil object used to annotate the spectrum.
  3. Classes/files action/file/InspectActiveSpectrumFile.java, action/hit/ViewActiveHitSpectrum.java, action/peakList/ViewActivePeakList.java, and action/spectrumSearch/ViewActivePeptideSearchResult.java, all in client/servlet/, are updated to add mass cutoff values to valid parameters VMASSCUTOFFLOWSTR and VMASSCUTOFFHIGHSTR, and set value of valid parameter VMASSCUTOFFMARKUPONLY to true for the view action used for the original spectrum plot.

comment:12 Changed 10 years ago by olle

Resolution: fixed
Status: assignedclosed

Ticket closed as the desired functionality has been added.

comment:13 Changed 10 years ago by olle

Description: modified (diff)

Ticket description updated by adding that when both a zoomed spectrum and the original spectrum are displayed, the original spectrum should indicate the zoom mass range.

Note: See TracTickets for help on using tickets.