1. 21 Jan, 2014 5 commits
    • timothy@apple.com's avatar
      Start fleshing out the Overview Timeline view. · 4e24b669
      timothy@apple.com authored
      This gets the overview populating in the Timeline sidebar. The graph side is still empty.
      
      https://bugs.webkit.org/show_bug.cgi?id=124005
      
      Reviewed by Joseph Pecoraro.
      
      * Localizations/en.lproj/localizedStrings.js: Updated.
      * UserInterface/Frame.js:
      (WebInspector.Frame.prototype.addResource):
      * UserInterface/Images/TimelineRecordAnimation.svg: Added.
      * UserInterface/Images/TimelineRecordEvent.svg: Added.
      * UserInterface/Images/TimelineRecordLayout.svg: Added.
      * UserInterface/Images/TimelineRecordPaint.svg: Added.
      * UserInterface/Images/TimelineRecordScriptEvaluated.svg: Added.
      * UserInterface/Images/TimelineRecordStyle.svg: Added.
      * UserInterface/Images/TimelineRecordTimer.svg: Added.
      * UserInterface/Main.html:
      * UserInterface/OverviewTimelineView.js: Added.
      (WebInspector.OverviewTimelineView):
      (WebInspector.OverviewTimelineView.prototype.get navigationSidebarTreeOutlineLabel):
      (WebInspector.OverviewTimelineView.prototype._childFrameWasAdded):
      (WebInspector.OverviewTimelineView.prototype._mainResourceDidChange):
      (WebInspector.OverviewTimelineView.prototype._provisionalResourceWasAdded):
      (WebInspector.OverviewTimelineView.prototype._resourceWasAdded):
      (WebInspector.OverviewTimelineView.prototype._compareTreeElementsByDetails):
      (WebInspector.OverviewTimelineView.prototype._compareTreeElementsByStartTime):
      (WebInspector.OverviewTimelineView.prototype._insertTreeElement):
      (WebInspector.OverviewTimelineView.prototype._addResourceToTreeIfNeeded):
      (WebInspector.OverviewTimelineView.prototype._sourceCodeTimelineAdded):
      (WebInspector.OverviewTimelineView.prototype._treeElementSelected):
      * UserInterface/SourceCodeTimelineTreeElement.js: Added.
      (WebInspector.SourceCodeTimelineTreeElement):
      (WebInspector.SourceCodeTimelineTreeElement.prototype.get sourceCodeTimeline):
      * UserInterface/TimelineContentView.js:
      (WebInspector.TimelineContentView.createPathComponent):
      (WebInspector.TimelineContentView):
      (WebInspector.TimelineContentView.prototype.showOverviewTimelineView):
      (WebInspector.TimelineContentView.prototype.showTimelineView):
      (WebInspector.TimelineContentView.prototype.get supportsSplitContentBrowser):
      (WebInspector.TimelineContentView.prototype.get selectionPathComponents):
      (WebInspector.TimelineContentView.prototype._pathComponentSelected):
      (WebInspector.TimelineContentView.prototype._showTimelineView):
      (WebInspector.TimelineContentView.prototype._recordingReset):
      * UserInterface/TimelineIcons.css:
      (.style-record .icon): Added.
      (.layout-record .icon): Added.
      (.paint-record .icon): Added.
      (.evaluated-record .icon): Added.
      (.event-record .icon): Added.
      (.timer-record .icon): Added.
      (.animation-record .icon): Added.
      * UserInterface/TimelineView.css: Added.
      (.timeline-view):
      * UserInterface/TimelineView.js: Added.
      (WebInspector.TimelineView):
      (WebInspector.TimelineView.prototype.get navigationSidebarTreeOutline):
      (WebInspector.TimelineView.prototype.get navigationSidebarTreeOutlineLabel):
      (WebInspector.TimelineView.prototype.reset):
      (WebInspector.TimelineView.prototype.shown):
      (WebInspector.TimelineView.prototype.hidden):
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162404 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      4e24b669
    • timothy@apple.com's avatar
      Start fleshing out the new TimelineSidebarPanel and TimelineContentView. · fe816eba
      timothy@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=124003
      
      Reviewed by Joseph Pecoraro.
      
      * UserInterface/ContentView.js:
      (WebInspector.ContentView):
      (WebInspector.ContentView.isViewable):
      * UserInterface/FrameContentView.js:
      * UserInterface/Images/CloseTimeline.png: Added.
      * UserInterface/Images/CloseTimeline@2x.png: Added.
      * UserInterface/Images/ColorsLarge.png: Added.
      * UserInterface/Images/ColorsLarge@2x.png: Added.
      * UserInterface/Images/NetworkLarge.png: Added.
      * UserInterface/Images/NetworkLarge@2x.png: Added.
      * UserInterface/Images/ScriptLarge.png: Added.
      * UserInterface/Images/ScriptLarge@2x.png: Added.
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.sidebarPanelForRepresentedObject):
      (WebInspector._revealAndSelectRepresentedObjectInNavigationSidebar):
      * UserInterface/NavigationSidebarPanel.js:
      (WebInspector.NavigationSidebarPanel.prototype.showDefaultContentView):
      * UserInterface/ResourceClusterContentView.js:
      * UserInterface/TimelineContentView.css: Added.
      (.content-view.timeline > .view-container):
      * UserInterface/TimelineContentView.js: Added.
      (WebInspector.TimelineContentView):
      * UserInterface/TimelineIcons.css: Renamed from Source/WebInspectorUI/UserInterface/InstrumentIcons.css.
      (.network-icon.large .icon): Added.
      (.colors-icon.large .icon): Added.
      (.script-icon.large .icon): Added.
      * UserInterface/TimelineSidebarPanel.css:
      (.sidebar > .panel.timeline > .navigation-bar):
      (.sidebar > .panel.timeline > .title-bar):
      (.sidebar > .panel.timeline > .title-bar.timelines):
      (.sidebar > .panel.timeline > .title-bar.timeline-events):
      (.sidebar > .panel.timeline > .timelines-content):
      (.sidebar > .panel.timeline > .timelines-content .close-button):
      (.sidebar > .panel.timeline > .timelines-content li.item.selected .close-button):
      (.sidebar > .panel.timeline > .timelines-content .close-button:active):
      (.sidebar > .panel.timeline > .content):
      * UserInterface/TimelineSidebarPanel.js:
      (WebInspector.TimelineSidebarPanel.createTimelineTreeElement):
      (WebInspector.TimelineSidebarPanel):
      (WebInspector.TimelineSidebarPanel.prototype.showDefaultContentView):
      (WebInspector.TimelineSidebarPanel.prototype.treeElementForRepresentedObject):
      (WebInspector.TimelineSidebarPanel.prototype.get contentTreeOutlineLabel):
      (WebInspector.TimelineSidebarPanel.prototype.set contentTreeOutlineLabel):
      (WebInspector.TimelineSidebarPanel.prototype.showTimelineOverview):
      (WebInspector.TimelineSidebarPanel.prototype.showTimelineView):
      (WebInspector.TimelineSidebarPanel.prototype._timelinesTreeElementSelected):
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162403 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      fe816eba
    • timothy@apple.com's avatar
      Implement TimelineRecording and per-call-site timelines. · 650bc7c5
      timothy@apple.com authored
      Keep track of timeline records per global timeline and per source code location.
      This will be used to display them in the UI in later patches.
      
      https://bugs.webkit.org/show_bug.cgi?id=123367
      
      Reviewed by Joseph Pecoraro.
      
      * UserInterface/Main.html:
      * UserInterface/SourceCodeTimeline.js: Added.
      (WebInspector.SourceCodeTimeline):
      (WebInspector.SourceCodeTimeline.prototype.get sourceCode):
      (WebInspector.SourceCodeTimeline.prototype.get sourceCodeLocation):
      (WebInspector.SourceCodeTimeline.prototype.get recordType):
      (WebInspector.SourceCodeTimeline.prototype.get recordEventType):
      * UserInterface/Timeline.js: Added.
      (WebInspector.Timeline):
      (WebInspector.Timeline.prototype.get records):
      (WebInspector.Timeline.prototype.addRecord):
      * UserInterface/TimelineRecording.js:
      (WebInspector.TimelineRecording):
      (WebInspector.TimelineRecording.prototype.get timelines): Added.
      (WebInspector.TimelineRecording.prototype.sourceCodeTimelinesForSourceCode): Added.
      (WebInspector.TimelineRecording.prototype.addEventMarker): Implemented.
      (WebInspector.TimelineRecording.prototype.addRecord): Implemented.
      (WebInspector.TimelineRecording.prototype._keyForRecord): Added.
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162401 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      650bc7c5
    • timothy@apple.com's avatar
      Add support for multiple Timeline recordings. · bde56d6d
      timothy@apple.com authored
      We also don't explicitly add ResourceTimelineRecords anymore. These will be tracked automatically in a later patch.
      
      https://bugs.webkit.org/show_bug.cgi?id=123366
      
      Reviewed by Joseph Pecoraro.
      
      * UserInterface/DashboardManager.js:
      (WebInspector.DashboardManager.prototype._mainResourceDidChange): Check for currentRecording.
      * UserInterface/InspectorFrontendAPI.js:
      (InspectorFrontendAPI.isTimelineProfilingEnabled): Check for currentRecording.
      * UserInterface/Main.html:
      * UserInterface/TimelineManager.js:
      (WebInspector.TimelineManager):
      (WebInspector.TimelineManager.prototype.get currentRecording): Added.
      (WebInspector.TimelineManager.prototype.startRecording): Make a new recording and push it onto the recording array.
      Add the current recording to the event.
      (WebInspector.TimelineManager.prototype.stopRecording): Add the current recording to the event.
      (WebInspector.TimelineManager.prototype.eventRecorded.processRecord): Check for currentRecording. Add the markers
      to the current recording.
      (WebInspector.TimelineManager.prototype._addRecord): Add the record to the current recording.
      (WebInspector.TimelineManager.prototype._startAutoRecording): Clean up. Don't add ResourceTimelineRecord. Clear recordings.
      (WebInspector.TimelineManager.prototype._stopAutoRecordingSoon): Check for _currentRecording.
      (WebInspector.TimelineManager.prototype._resetAutoRecordingDeadTimeTimeout): Ditto.
      (WebInspector.TimelineManager.prototype._mainResourceDidChange): Don't add ResourceTimelineRecord anymore.
      (WebInspector.TimelineManager.prototype._resourceWasAdded): Removed.
      * UserInterface/TimelineRecording.js: Added.
      (WebInspector.TimelineRecording): Added.
      (WebInspector.TimelineRecording.prototype.addEventMarker): Added.
      (WebInspector.TimelineRecording.prototype.addRecord): Added.
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162400 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      bde56d6d
    • timothy@apple.com's avatar
      Remove a lot of the current Timelines code to make room for a new implementation. · 3d837ef6
      timothy@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=123368
      
      Reviewed by Joseph Pecoraro.
      
      * Localizations/en.lproj/localizedStrings.js:
      * UserInterface/ContentView.js:
      (WebInspector.ContentView):
      (WebInspector.ContentView.isViewable):
      * UserInterface/DashboardView.js:
      (WebInspector.DashboardView.prototype._networkItemWasClicked):
      * UserInterface/InspectorFrontendAPI.js:
      (InspectorFrontendAPI.setTimelineProfilingEnabled):
      (InspectorFrontendAPI.stopProfilingJavaScript):
      * UserInterface/InstrumentSidebarPanel.js: Removed.
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.contentLoaded):
      (WebInspector.sidebarPanelForRepresentedObject):
      (WebInspector.openURL):
      * UserInterface/Object.js:
      (WebInspector.Object.addEventListener):
      * UserInterface/TimelineManager.js:
      (WebInspector.TimelineManager):
      (WebInspector.TimelineManager.prototype.startRecording):
      (WebInspector.TimelineManager.prototype.eventRecorded.processRecord):
      (WebInspector.TimelineManager.prototype.eventRecorded):
      (WebInspector.TimelineManager.prototype.objectForCookie):
      (WebInspector.TimelineManager.prototype._addRecord):
      * UserInterface/TimelinesObject.js: Removed.
      * UserInterface/TimelineOverview.css: Removed.
      * UserInterface/TimelineOverview.js: Removed.
      * UserInterface/TimelineSidebarPanel.css: Added.
      * UserInterface/TimelineSidebarPanel.js: Added.
      (WebInspector.TimelineSidebarPanel):
      * UserInterface/TimelinesContentView.css: Removed.
      * UserInterface/TimelinesContentView.js: Removed.
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162397 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      3d837ef6
  2. 15 Jan, 2014 1 commit
    • akling@apple.com's avatar
      Remove the CSS selector profiler. · 6f601c10
      akling@apple.com authored
      <https://webkit.org/b/127039>
      
      Source/WebCore:
      
      The selector profiler was painting a mostly fictional picture of what
      selectors we were spending time on. It never really grokked the fast
      path selectors, nor did it understand recent additions like the extra
      cascading pass or the selector JIT.
      
      Somewhat ironically, this may end up making some selectors run faster
      since it removes a number of brances in hot code.
      
      Reviewed by Sam Weinig.
      
      * css/ElementRuleCollector.cpp:
      (WebCore::ElementRuleCollector::collectMatchingRulesForList):
      * css/ElementRuleCollector.h:
      * inspector/InspectorCSSAgent.cpp:
      (WebCore::InspectorCSSAgent::willDestroyFrontendAndBackend):
      * inspector/InspectorCSSAgent.h:
      * inspector/InspectorInstrumentation.cpp:
      * inspector/InspectorInstrumentation.h:
      * inspector/protocol/CSS.json:
      
      Source/WebInspectorUI:
      
      Purge selector profiler code from the new Web Inspector UI.
      
      Reviewed by Sam Weinig.
      
      * Localizations/en.lproj/localizedStrings.js:
      * UserInterface/CSSSelectorProfileObject.js: Removed.
      * UserInterface/CSSSelectorProfileType.js: Removed.
      * UserInterface/CSSSelectorProfileView.js: Removed.
      * UserInterface/ContentView.js:
      (WebInspector.ContentView):
      (WebInspector.ContentView.isViewable):
      * UserInterface/InspectorWebBackendCommands.js:
      * UserInterface/InstrumentSidebarPanel.js:
      (WebInspector.InstrumentSidebarPanel):
      (WebInspector.InstrumentSidebarPanel.prototype._recordProfileGlyphMousedOver):
      (WebInspector.InstrumentSidebarPanel.prototype._recordProfileGlyphMousedDown):
      (WebInspector.InstrumentSidebarPanel.prototype._recordProfileGlyphClicked):
      (WebInspector.InstrumentSidebarPanel.prototype._profileTypeWasSelected):
      (WebInspector.InstrumentSidebarPanel.prototype._profilesCleared):
      * UserInterface/Main.html:
      * UserInterface/ProfileManager.js:
      (WebInspector.ProfileManager):
      (WebInspector.ProfileManager.prototype.initialize):
      (WebInspector.ProfileManager.prototype._checkForInterruptions):
      (WebInspector.ProfileManager.prototype._attemptToResumeProfiling):
      * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
      * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@162084 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      6f601c10
  3. 13 Dec, 2013 1 commit
    • graouts@apple.com's avatar
      Web Inspector: provide an abstraction for CodeMirror's TextMarker · e69d304a
      graouts@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=125695
      
      Reviewed by Timothy Hatcher.
      
      Introduce a new WebInspector.TextMarker class which is used by code with CodeMirror knowledge
      to return information related to text markers to objects that should have no direct knowledge
      of CodeMirror. Start using this class in TextEditor and SourceCodeTextEditor to remove the
      last remaining pieces of CodeMirror knowledge added to SourceCodeTextEditor to fix
      https://webkit.org/b/124364.
      
      * UserInterface/CodeMirrorAdditions.js:
      Stop using __markedColor to identify a color marker and instead use the type on the matching
      WebInspector.TextMarker. Additionally, create a WebInspector.TextMarker with type
      WebInspector.TextMarker.Type.Color in createColorMarkers().
      
      * UserInterface/CodeMirrorColorEditingController.js:
      (WebInspector.CodeMirrorColorEditingController):
      Use a WebInspector.TextRange to track the edited range and obtain it directly from the
      WebInspector.TextMaker used to instantiate the object. We also use the new "text" public
      property to create the color.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.set color):
      Simply assing the serialized color to the new "text" public property.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.get text):
      (WebInspector.CodeMirrorColorEditingController.prototype.set text):
      New public property to set get and set the text for the edited range, automatically updating
      the range upon setting to a new text.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.presentHoverMenu):
      Obtain the bounds directly from the WebInspector.TextMarker object.
      
      * UserInterface/CodeMirrorTokenTrackingController.js:
      (WebInspector.CodeMirrorTokenTrackingController.prototype._updateHoveredTokenInfo):
      Since we're now tracking the hoveredMarker as a WebInspector.TextMarker, get the CodeMirror
      TextMarker from that object to check if it's contained within the text markers at the
      hovered position.
      
      * UserInterface/Main.html:
      Add the new TextMarker class source.
      
      * UserInterface/SourceCodeTextEditor.js:
      (WebInspector.SourceCodeTextEditor.prototype._hasColorMarkers):
      Use the WebInspector.TextMarker type to identify a given text marker is marking a color.
      
      (WebInspector.SourceCodeTextEditor.prototype.tokenTrackingControllerNewHighlightCandidate):
      Use the renamed markersAtPosition() method from TextEditor.
      
      (WebInspector.SourceCodeTextEditor.prototype._tokenTrackingControllerHighlightedMarkedExpression):
      Use the WebInspector.TextMarker type to identify a given text marker is marking a color.
      
      (WebInspector.SourceCodeTextEditor.prototype.colorEditingControllerDidFinishEditing):
      Since the CodeMirrorColorEditingController is now using a WebInspector.TextRange for its range,
      update to use a WebInspector.TextRange API to get the range's start line.
      
      * UserInterface/TextEditor.js:
      (WebInspector.TextEditor.prototype.get markers):
      Return WebInspector.TextMarker objects instead of CodeMirror TextRange objects.
      
      (WebInspector.TextEditor.prototype.markersAtPosition):
      Rename method to a better name instead of using the CodeMirror-influenced name. Also, return
      WebInspector.TextMarker objects instead of CodeMirror TextRange objects.
      
      * UserInterface/TextMarker.js: Added.
      (WebInspector.TextMarker):
      Create a WebInspector.TextMarker with a CodeMirror TextMarker and an optional type.
      
      (WebInspector.TextMarker.textMarkerForCodeMirrorTextMarker):
      Static method to either obtain the existing WebInspector.TextMarker for a given CodeMirror
      TextMarker, or create a new WebInspector.TextMarker.
      
      (WebInspector.TextMarker.prototype.get codeMirrorTextMarker):
      Public property to access the CodeMirror TextMarker objects for classes that have direct
      knowledge of CodeMirror.
      
      (WebInspector.TextMarker.prototype.get type):
      Public property to access the type used to create this text marker.
      
      (WebInspector.TextMarker.prototype.get range):
      (WebInspector.TextMarker.prototype.get bounds):
      Public properties allowing easy access to generally useful information related to marked text.
      
      (WebInspector.TextMarker.prototype.clear):
      Wrapper for the CodeMirror TextMarker clear() method.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@160552 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      e69d304a
  4. 12 Dec, 2013 1 commit
    • graouts@apple.com's avatar
      Web Inspector: allow editing of colors in CSS resources · ffc95ad7
      graouts@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=124364
      
      Reviewed by Timothy Hatcher.
      
      Identify colors in CSS and HTML resources so that hovering these colors shows a HoverMenu
      allowing a ColorPicker hosted in a Popover to be shown to edit the hovered color.
      
      * UserInterface/CSSStyleDeclarationTextEditor.js:
      (WebInspector.CSSStyleDeclarationTextEditor.prototype._createColorSwatches):
      Remove the code that goes through the lines of the CodeMirror editor to look for
      color strings and replace it with a call to the .createColorMarkers() CodeMirror
      extension in which the code was refactored. The callback passed to
      .createColorMarkers() handles the CSSStyleDeclarationTextEditor-specific creation
      of color swatches to show the popover, keeping the existing behavior of the Styles
      sidebar panel.
      
      * UserInterface/CodeMirrorAdditions.js:
      Refactor existing code into two new CodeMirror extensions: .boundsForRange(), which
      was previously defined on the CodeMirrorTokenTrackingController but was also needed
      in the new CodeMirrorColorEditingController, and .createColorMarkers(), discussed above.
      
      * UserInterface/CodeMirrorColorEditingController.js: Added.
      (WebInspector.CodeMirrorColorEditingController):
      New class used by SourceCodeTextEditor to coordinate the editing of a color in a CodeMirror
      TextMarker by a ColorPicker hosted in a Popover shown by the activation of a HoverMenu. This
      controller automatically gets the color set by the user using the ColorPicker and updates
      the CodeMirror text editor with the new value. When the user presses the Esc. key while the
      popover is shown, it's automatically dismissed and the original color is reset in the editor.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.get marker):
      (WebInspector.CodeMirrorColorEditingController.prototype.get range):
      (WebInspector.CodeMirrorColorEditingController.prototype.get delegate):
      (WebInspector.CodeMirrorColorEditingController.prototype.set delegate):
      Getters and setters for public properties.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.get color):
      (WebInspector.CodeMirrorColorEditingController.prototype.set color):
      Get and set the color for the edited color marker, replacing the text in the marker's range
      upon setting.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.presentHoverMenu):
      Public API allowing for a HoverMenu to be shown around the bounds of the TextMarker passed
      in the constructor. This method is called from SourceCodeTextEditor when the
      CodeMirrorTokenTrackingController identifies that a token that is part of a TextMarker is
      hovered and that token is a color.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.dismissHoverMenu):
      Public API allowing for the HoverMenu to be dismissed. This method is called when the
      CodeMirrorTokenTrackingController identifies that its "hoveredMarker" is no longer being
      hovered as well as when we identify that editing of the color has completed.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.handleEvent):
      Event handler for the "keydown" event that are being listened to when the HoverMenu
      is activated such that the Esc. key can be used to dimiss the popover and reset the
      original color before any edits.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.hoverMenuButtonWasPressed):
      Implementation of the HoverMenu delegation method used to show a Popover containing a
      ColorPicker upon clicking on the color wheel attached to the HoverMenu. We also remember
      the color set on the marker so that it may be restored when Esc. is pressed and used to
      set the original state of the ColorPicker. The delegation method
      colorEditingControllerDidStartEditing() is also called at this point, which the
      SourceCodeTextEditor implements.
      
      (WebInspector.CodeMirrorColorEditingController.prototype.didDismissPopover):
      Implementation of the Popover delegation method used to identify that color editing has
      completed. The delegation method colorEditingControllerDidFinishEditing() is called
      at this point, which the SourceCodeTextEditor implements.
      
      (WebInspector.CodeMirrorColorEditingController.prototype._colorPickerColorChanged):
      Apply the color set in the color picker to the CodeMirror text editor.
      
      * UserInterface/CodeMirrorTokenTrackingController.js:
      Add two new modes to CodeMirrorTokenTrackingController. The first mode is "None" and is
      the default, incurring no specific token handling behavior. The second mode is "MarkedTokens"
      which identifies hover of a token contained in a CodeMirror TextMarker range. The new
      "MarkedTokens" mode is used by SourceCodeTextEditor to identify when a marked color is being
      hovered to display a HoverMenu.
      
      (WebInspector.CodeMirrorTokenTrackingController):
      (WebInspector.CodeMirrorTokenTrackingController.prototype.set mode):
      Make "None" the new default mode for CodeMirrorTokenTrackingController.
      
      (WebInspector.CodeMirrorTokenTrackingController.prototype.get hoveredMarker):
      (WebInspector.CodeMirrorTokenTrackingController.prototype.set hoveredMarker):
      (WebInspector.CodeMirrorTokenTrackingController.prototype._updateHoveredTokenInfo):
      Check, when we have a "hoveredMarker" set on the CodeMirrorTokenTrackingController,
      whether the "hoveredMarker" is still being hovered when there is no token at the current
      mouse position. We can then determine when we're mousing out of the "hoveredMarker" and
      notify the delegate via the new tokenTrackingControllerMouseOutOfHoveredMarker delegate
      method. The SourceCodeTextEditor uses this method to dismiss its CodeMirrorColorEditingController.
      
      (WebInspector.CodeMirrorTokenTrackingController.prototype._processNewHoveredToken):
      Add support for the new "MarkedTokens" mode.
      
      (WebInspector.CodeMirrorTokenTrackingController.prototype._processMarkedToken):
      For the moment, use the same behavior as the existing "MarkedTokens" mode.
      
      * UserInterface/Color.js:
      (WebInspector.Color):
      Add a new "valid" property to identify whether a color has any invalid (NaN) component. This property
      is used by SourceCodeTextEditor to establish whether a hovered color marker is indeed set to a
      valid color still.
      
      (WebInspector.Color.prototype.copy):
      New method to create an exact copy of a Color instance, used by CodeMirrorColorEditingController
      to duplicate the edited color in case we need to revert it.
      
      * UserInterface/HoverMenu.js:
      (WebInspector.HoverMenu.prototype._handleClickEvent):
      Rename hoverMenuWasActivated to hoverMenuButtonWasPressed per review feedback.
      
      * UserInterface/Images/ColorIcon.png: Added.
      * UserInterface/Images/ColorIcon@2x.png: Added.
      New color wheel icon used to customize the HoverMenu shown by a CodeMirrorColorEditingController.
      
      * UserInterface/Main.html:
      Link to the new CodeMirrorColorEditingController.js file.
      
      * UserInterface/SourceCodeTextEditor.css:
      (.hover-menu.color):
      (.hover-menu.color > img):
      Customize the HoverMenu shown by a CodeMirrorColorEditingController to use the new ColorIcon asset.
      
      * UserInterface/SourceCodeTextEditor.js:
      (WebInspector.SourceCodeTextEditor):
      Add a new "_ignoreContentDidChange" ivar that increments and decrements to track when handling
      of CodeMirror content changes should be disabled.
      
      (WebInspector.SourceCodeTextEditor.prototype.close):
      Adopt the new ._updateTokenTrackingControllerState() method to update the state of the
      CodeMirrorTokenTrackingController.
      
      (WebInspector.SourceCodeTextEditor.prototype.contentDidChange):
      Override the new TextEditor public API called when content in the CodeMirror text editor is changed.
      We use this method to process any newly added line to create any newly added color marker.
      
      (WebInspector.SourceCodeTextEditor.prototype._contentDidPopulate):
      (WebInspector.SourceCodeTextEditor.prototype._debuggerDidPause):
      (WebInspector.SourceCodeTextEditor.prototype._debuggerDidResume):
      (WebInspector.SourceCodeTextEditor.prototype._sourceCodeSourceMapAdded):
      Adopt the new ._updateTokenTrackingControllerState() method to update the state of the
      CodeMirrorTokenTrackingController.
      
      (WebInspector.SourceCodeTextEditor.prototype._updateTokenTrackingControllerState):
      New method acting as the only point where we check the state of the text editor and set the right
      mode and settings on the CodeMirrorTokenTrackingController, including setting the new "MarkedTokens"
      mode when we have color markers, as determined by ._hasColorMarkers().
      
      (WebInspector.SourceCodeTextEditor.prototype._hasColorMarkers):
      Check whether any of the TextMarkers set on the CodeMirror text editor were created for a color.
      
      (WebInspector.SourceCodeTextEditor.prototype.tokenTrackingControllerHighlightedRangeWasClicked):
      Check the CodeMirrorTokenTrackingController mode rather than the removed "_jumpToSymbolTrackingModeEnabled"
      ivar to identify we're in the "NonSymbolTokens" mode.
      
      (WebInspector.SourceCodeTextEditor.prototype.tokenTrackingControllerNewHighlightCandidate):
      Refactor method to use the CodeMirrorTokenTrackingController mode to branch into mode-specific code
      and add a new branch for the new "MarkedTokens" mode where we check if the newly hovered token
      is part of a color TextMarker range.
      
      (WebInspector.SourceCodeTextEditor.prototype.tokenTrackingControllerMouseOutOfHoveredMarker):
      Implement this new CodeMirrorTokenTrackingController delegation method to dismiss the
      CodeMirrorColorEditingController as we identify we're no longer hovering over the TextMarker
      for which the CodeMirrorColorEditingController was created.
      
      (WebInspector.SourceCodeTextEditor.prototype._showPopover):
      Adopt the new TextEditor boundsForRange() method.
      
      (WebInspector.SourceCodeTextEditor.prototype._updateColorMarkers):
      Harness the new TextEditor createColorMarkers() method to create new TextMarkers for the provided
      line, or the entire text editor content if none provided. We then immediately call _updateTokenTrackingControllerState()
      so that the new "MarkedTokens" mode is entered in case color TextMarkers were created for the first
      time for this text editor.
      
      (WebInspector.SourceCodeTextEditor.prototype._tokenTrackingControllerHighlightedMarkedExpression):
      Called when we've identified the CodeMirrorTokenTrackingController highlighted a TextMarker. We check
      if any of the hovered TextMarkers are for a color, and in this case create a CodeMirrorColorEditingController
      to coordinate the display of a ColorPicker in a Popover to edit the hovered color token. We also check
      whether the hovered marker still contains a valid color, clearing the marker in case it was edited to
      no longer contain a color.
      
      (WebInspector.SourceCodeTextEditor.prototype._dismissCodeMirrorColorEditingController):
      Used to dismiss the CodeMirrorColorEditingController, if previously presented, and reset some internal state.
      
      (WebInspector.SourceCodeTextEditor.prototype.colorEditingControllerDidStartEditing):
      Implement this CodeMirrorColorEditingController delegation method to temporarily disable the
      CodeMirrorTokenTrackingController while we edit the color with the ColorPicker, remove
      the TextMarker for the edited color and instruct that content changes should be ignored
      such that we act on the complete set of color edits upon completion.
      
      (WebInspector.SourceCodeTextEditor.prototype.colorEditingControllerDidFinishEditing):
      Update color markers for the edited line such that any color edits are correctly updated for
      the future and so that, as a side-effect, the CodeMirrorColorEditingController is reset to the
      appropriate mode depending on whether color TextMarkers are indeed available, resetting states
      that may have been altered by colorEditingControllerDidStartEditing().
      
      * UserInterface/TextEditor.js:
      (WebInspector.TextEditor.prototype.contentDidChange):
      New public method meant to be overriden by subclasses, added for the use of SourceCodeTextEditor, exposing
      the list of TextRanges affected by the content change, both in the context of the old content and new content.
      
      (WebInspector.TextEditor.prototype.boundsForRange):
      (WebInspector.TextEditor.prototype.get markers):
      (WebInspector.TextEditor.prototype.findMarkersAtPosition):
      (WebInspector.TextEditor.prototype.createColorMarkers):
      (WebInspector.TextEditor.prototype.colorEditingControllerForMarker):
      New public methods calling into the CodeMirror private ivar for the benefit of SourceCodeTextEditor.
      
      (WebInspector.TextEditor.prototype._contentChanged):
      Call the new contentDidChange() method.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@160483 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      ffc95ad7
  5. 05 Dec, 2013 1 commit
    • achicu@adobe.com's avatar
      Web Inspector: [CSS Regions] Show a list of containing regions when clicking a... · 0e035b16
      achicu@adobe.com authored
      Web Inspector: [CSS Regions] Show a list of containing regions when clicking a node that is part of a flow
      https://bugs.webkit.org/show_bug.cgi?id=124614
      
      Reviewed by Timothy Hatcher.
      
      Source/WebInspectorUI:
      
      Added a new function in DOMTreeManager called getNodeContentFlowInfo that can be used
      to retrieve an object with the following structure:
      {
           "regionFlow": <Reference to the ContentFlow object referenced by the -webkit-flow-from property of the node>,
           "contentFlow": <Reference to the ContentFlow object referenced by the -webkit-flow-into property of
                           the node or a parent of the node>,
           "regions": [ list of DOMNodes representing the regions containers of the node. The node is split across all these regions. ]
      }
      
      Also, used this method to display a two new sections in the Computed Styles panel.
      1. Section "Flows": can have up to two Simple Rows: "Region Flow" and "Content Flow".
      2. Section "Container Regions" contains a DOMTreeDataGrid with the list of regions.
      
      The sections are only visible when there's content to display.
      
      Next to the "Region Flow" simple row I've added an arrow that will take the user to the "ContentFlowDOMTreeContentView" of the
      ContentFlow. The same happens for the "Content Flow", but in this case the element will also be highlighted.
      
      Part of the patch I've added the DOMTreeDataGridNode. LayerTreeDataGrid has a lot of CSS in common with it, so I
      will make another patch to refactor LayerTreeDataGrid to use DOMTreeDataGridNode as a base class.
      
      * Localizations/en.lproj/localizedStrings.js:
      * UserInterface/ComputedStyleDetailsPanel.css: Added.
      (.details-section > .content > .group > .row.simple.content-flow-link > .label):
      (.details-section > .content > .group > .row.simple.content-flow-link > .value):
      (.details-section > .content > .group > .row.simple.content-flow-link > .value > div):
      (.details-section > .content > .group > .row.simple.content-flow-link > .value > div > .icon):
      (.details-section > .content > .group > .row.simple.content-flow-link > .value > div > span):
      (.details-section > .content > .group > .row.simple.content-flow-link > .value > div > .go-to-arrow):
      (.details-section > .content > .group > .row.simple.content-flow-link:hover > .value > div > .go-to-arrow):
      * UserInterface/ComputedStyleDetailsPanel.js:
      (WebInspector.ComputedStyleDetailsPanel):
      (WebInspector.ComputedStyleDetailsPanel.prototype.get regionFlow):
      (WebInspector.ComputedStyleDetailsPanel.prototype.set regionFlow):
      (WebInspector.ComputedStyleDetailsPanel.prototype.get contentFlow):
      (WebInspector.ComputedStyleDetailsPanel.prototype.set contentFlow):
      (WebInspector.ComputedStyleDetailsPanel.prototype.get containerRegions):
      (WebInspector.ComputedStyleDetailsPanel.prototype.set containerRegions):
      (WebInspector.ComputedStyleDetailsPanel.prototype.refresh):
      (WebInspector.ComputedStyleDetailsPanel.prototype._computedStyleShowAllCheckboxValueChanged):
      (WebInspector.ComputedStyleDetailsPanel.prototype._resetFlowDetails):
      (WebInspector.ComputedStyleDetailsPanel.prototype._refreshFlowDetails.contentFlowInfoReady):
      (WebInspector.ComputedStyleDetailsPanel.prototype._refreshFlowDetails):
      (WebInspector.ComputedStyleDetailsPanel.prototype._goToRegionFlowArrowWasClicked):
      (WebInspector.ComputedStyleDetailsPanel.prototype._goToContentFlowArrowWasClicked):
      * UserInterface/DOMTreeDataGrid.css: Added.
      (.dom-tree-data-grid .data-grid):
      (.dom-tree-data-grid .data-grid table.data):
      (.dom-tree-data-grid .data-container):
      (.dom-tree-data-grid .data-container tr):
      (.dom-tree-data-grid .data-container td > div):
      (.dom-tree-data-grid .data-container .name-column):
      (.dom-tree-data-grid .data-container .name-column .icon):
      (.dom-tree-data-grid .data-container .name-column .label):
      (.dom-tree-data-grid .data-container tr:hover .name-column .label):
      (.dom-tree-data-grid .data-container .go-to-arrow):
      (.dom-tree-data-grid .data-container tr:hover .go-to-arrow):
      (.dom-tree-data-grid .data-container tbody > tr:nth-child(2n)):
      (.dom-tree-data-grid .data-container tbody > tr:nth-child(2n+1)):
      * UserInterface/DOMTreeDataGrid.js: Added.
      (WebInspector.DOMTreeDataGrid):
      (WebInspector.DOMTreeDataGrid.prototype._onmousemove):
      (WebInspector.DOMTreeDataGrid.prototype._onmouseout):
      * UserInterface/DOMTreeDataGridNode.js: Added.
      (WebInspector.DOMTreeDataGridNode):
      (WebInspector.DOMTreeDataGridNode.prototype.get domNode):
      (WebInspector.DOMTreeDataGridNode.prototype.createCellContent):
      (WebInspector.DOMTreeDataGridNode.prototype._updateNodeName):
      (WebInspector.DOMTreeDataGridNode.prototype._makeNameCell):
      (WebInspector.DOMTreeDataGridNode.prototype._updateNameCellData):
      (WebInspector.DOMTreeDataGridNode.prototype._goToArrowWasClicked):
      * UserInterface/DOMTreeManager.js:
      (WebInspector.DOMTreeManager.prototype.unregisteredNamedFlowContentElement):
      (WebInspector.DOMTreeManager.prototype.nodeRequested):
      (WebInspector.DOMTreeManager.prototype._coerceRemoteArrayOfDOMNodes):
      (WebInspector.DOMTreeManager.prototype.domNodeResolved):
      (WebInspector.DOMTreeManager.prototype.regionNodesAvailable):
      (WebInspector.DOMTreeManager.prototype.get if):
      (WebInspector.DOMTreeManager.prototype.get var):
      (WebInspector.DOMTreeManager.prototype.backendFunction.getComputedProperty):
      (WebInspector.DOMTreeManager.prototype.backendFunction.getContentFlowName):
      (WebInspector.DOMTreeManager.prototype.):
      * UserInterface/DataGrid.css:
      (.data-grid.no-header > table.header):
      (.data-grid.no-header .data-container):
      * UserInterface/DetailsSection.js:
      (WebInspector.DetailsSection):
      * UserInterface/InspectorBackend.js:
      (InspectorBackendClass.prototype._wrap):
      * UserInterface/Main.html:
      * UserInterface/ResourceSidebarPanel.js:
      (WebInspector.ResourceSidebarPanel.prototype.showContentFlowDOMTree):
      * UserInterface/RuntimeManager.js:
      (WebInspector.RuntimeManager.prototype.evaluateInInspectedWindow):
      (WebInspector.RuntimeManager.prototype.getPropertiesForRemoteObject):
      
      LayoutTests:
      
      Added a new test to check the new WebInspector function called DOMTreeManager.getNodeContentFlowInfo.
      
      * http/tests/inspector-protocol/resources/InspectorTest.js:
      When testing the inspector code, we want to catch and log any uncaught exceptions or console.errors/asserts.
      (InspectorTest.importInspectorScripts.console.error.window.onerror):
      (InspectorTest.importInspectorScripts.console.assert):
      (InspectorTest.importInspectorScripts):
      * inspector-protocol/model/content-node-region-info-expected.txt: Added.
      * inspector-protocol/model/content-node-region-info.html: Added.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@160198 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      0e035b16
  6. 04 Dec, 2013 1 commit
    • graouts@apple.com's avatar
      Web Inspector: "data detectors" menu on hover for actionable tokens · e3186aeb
      graouts@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=124363
      
      Reviewed by Timothy Hatcher.
      
      Add a new WebInspector.HoverMenu class to display an overlay menu that is presented
      with respect to a target frame that it draws itself around adding a customizable
      action button to its right. The menu uses fade animations as it's presented and
      dismissed and a single delegation method is fired when the button is pressed. Finally,
      just like a popover, it automatically dismisses itself upon scrolling anywhere
      outside of its bounds.
      
      * UserInterface/HoverMenu.css: Added.
      * UserInterface/HoverMenu.js: Added.
      (WebInspector.HoverMenu):
      (WebInspector.HoverMenu.prototype.get element):
      (WebInspector.HoverMenu.prototype.dismiss):
      (WebInspector.HoverMenu.prototype.handleEvent):
      (WebInspector.HoverMenu.prototype._handleClickEvent):
      * UserInterface/Images/HoverMenuButton.png: Added.
      * UserInterface/Images/HoverMenuButton@2x.png: Added.
      * UserInterface/Main.html:
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@160134 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      e3186aeb
  7. 15 Nov, 2013 1 commit
    • graouts@apple.com's avatar
      Web Inspector: New color picker · d26f595c
      graouts@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=124354
      
      Reviewed by Timothy Hatcher.
      
      Beginning of a new color picker. The focus of this new picker is to let you pick from
      a color wheel as the primary mean of color picking, with additional slider controls for
      the brightness and the opacity, better matching the default OS X color picker. This is the
      basis for a color picker that will evolve to support the following:
      
      - editable CSS value label (http://webkit.org/b/124356)
      - picking a color anywhere on screen (http://webkit.org/b/124357)
      - swatches based on other colors in page (http://webkit.org/b/124358)
      
      Note also that the color wheel has not been tested on Retina displays
      (see http://webkit.org/b/124355).
      
      * UserInterface/CSSColorPicker.css: Removed.
      * UserInterface/CSSColorPicker.js: Removed.
      Previous color picker, now removed in favor of the new ColorPicker class.
      
      * UserInterface/CSSStyleDeclarationTextEditor.js:
      Adopt new class name for the color picker, add a little padding to the popover
      target frame and set the base color after the picker has been presented.
      
      * UserInterface/Color.js:
      (WebInspector.Color.prototype._hslToRGB):
      Simplified math.
      
      (WebInspector.Color.rgb2hsv):
      (WebInspector.Color.hsv2rgb):
      New utilities to deal with HSV colors used in the ColorWheel.
      
      * UserInterface/ColorPicker.css: Added.
      
      * UserInterface/ColorPicker.js: Added.
      (WebInspector.ColorPicker):
      (WebInspector.ColorPicker.prototype.get element):
      (WebInspector.ColorPicker.prototype.set brightness):
      (WebInspector.ColorPicker.prototype.set opacity):
      (WebInspector.ColorPicker.prototype.get color):
      
      (WebInspector.ColorPicker.prototype.set color):
      We set the _dontUpdateColor flag here such that we don't attempt to
      notify about a color change at this point in case the selected color
      is too saturated to be represented accurately on the color wheel and
      we would end up changing the color by virtue of presenting the popover.
      
      (WebInspector.ColorPicker.prototype.colorWheelColorDidChange):
      (WebInspector.ColorPicker.prototype.sliderValueDidChange):
      (WebInspector.ColorPicker.prototype._updateColor):
      (WebInspector.ColorPicker.prototype._updateSliders):
      
      * UserInterface/ColorWheel.css: Added.
      
      * UserInterface/ColorWheel.js: Added.
      The ColorWheel makes use of three different <canvas> elements to draw itself.
      The "raw" canvas is used to draw the raw, un-tinted color wheel with poor
      aliasing. The "raw" canvas is only drawn when the dimension is changed.
      The "tinted" canvas is used to draw the "raw" canvas with a black overlay
      based on the brightness set on the wheel. The "final" canvas, the only <canvas>
      element attached to the DOM, is used to draw the "tinted" canvas into a circle
      clip of a slightly narrower radius so that the drawn image is visually more pleasing
      and can be displayed above virtually any background color.
      
      We use color math to generate the color wheel, courtesy of Dean Jackson, and also to
      figure out where to position the crosshair for the provided base color as well as
      the opposite operation where we get the color under the mouse pointer.
      
      The color wheel fires a single delegate method call colorWheelColorDidChange(colorWheel),
      the colors themselves being retrieved via the public properties tintedColor and rawColor.
      
      (WebInspector.ColorWheel):
      (WebInspector.ColorWheel.prototype.set dimension):
      (WebInspector.ColorWheel.prototype.get element):
      (WebInspector.ColorWheel.prototype.get brightness):
      (WebInspector.ColorWheel.prototype.set brightness):
      (WebInspector.ColorWheel.prototype.get tintedColor):
      (WebInspector.ColorWheel.prototype.set tintedColor):
      (WebInspector.ColorWheel.prototype.get rawColor):
      (WebInspector.ColorWheel.prototype.handleEvent):
      (WebInspector.ColorWheel.prototype._handleMousedown):
      (WebInspector.ColorWheel.prototype._handleMousemove):
      (WebInspector.ColorWheel.prototype._handleMouseup):
      (WebInspector.ColorWheel.prototype._pointInCircleForEvent):
      (WebInspector.ColorWheel.prototype._pointInCircleForEvent.angleFromCenterToPoint):
      (WebInspector.ColorWheel.prototype._pointInCircleForEvent.pointOnCircumference):
      (WebInspector.ColorWheel.prototype._updateColorForMouseEvent):
      (WebInspector.ColorWheel.prototype._setCrosshairPosition):
      (WebInspector.ColorWheel.prototype._tintedColorToPointAndBrightness):
      (WebInspector.ColorWheel.prototype._drawRawCanvas):
      (WebInspector.ColorWheel.prototype._colorAtPointWithBrightness):
      (WebInspector.ColorWheel.prototype._drawTintedCanvas):
      (WebInspector.ColorWheel.prototype._draw):
      
      * UserInterface/Images/SliderThumb.png: Added.
      * UserInterface/Images/SliderThumb@2x.png: Added.
      * UserInterface/Images/SliderThumbPressed.png: Added.
      * UserInterface/Images/SliderThumbPressed@2x.png: Added.
      Supporting artwork for the new Slider class.
      
      * UserInterface/Main.html:
      Remove the previous color picker class and add the new one, as well as the new Slider class.
      
      * UserInterface/Slider.css: Added.
      
      * UserInterface/Slider.js: Added.
      New slider to match the look of the sliders used in the native OS X color picker. The most
      interesting feature of these sliders is that they can be transformed using CSS in any way
      and will still operate correctly due to always converting the mouse coordinates in the page
      coordinate system to the coordinate system local to the backing element. For instance, the
      color picker uses two sliders transformed to be displayed vertically.
      
      As it stands these slides only support values between 0 and 1 and fire a single delegate
      method call sliderValueDidChange(slider, newValue).
      
      (WebInspector.Slider):
      (WebInspector.Slider.prototype.get element):
      (WebInspector.Slider.prototype.get value):
      (WebInspector.Slider.prototype.set value):
      (WebInspector.Slider.prototype.handleEvent):
      (WebInspector.Slider.prototype._handleMousedown):
      (WebInspector.Slider.prototype._handleMousemove):
      (WebInspector.Slider.prototype._handleMouseup):
      (WebInspector.Slider.prototype._localPointForEvent):
      (WebInspector.Slider.prototype.get _maxX):
      
      * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
      * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
      Update file names for the new color picker.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@159332 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      d26f595c
  8. 12 Nov, 2013 1 commit
    • achicu@adobe.com's avatar
      Web Inspector: ContentFlowTreeContentView should use only one DOMTreeOutline · 5aef1877
      achicu@adobe.com authored
      https://bugs.webkit.org/show_bug.cgi?id=124230
      
      Reviewed by Timothy Hatcher.
      
      Changed ContentFlowTreeContentView to use one DOMTreeOutline by just
      populating it with root DOMTreeElements directly. That is very
      similar to how DOMTreeOutline works when omitRootDOMNode is used.
      
      Now that ContentFlowTreeContentView has only one DOMTreeOutline,
      it makes sense to change its base class to be DOMTreeContentView instead.
      Also, with that I've changed its name to ContentFlowDOMTreeContentView.
      
      I had to move all the DOMTree document loading code from DOMTreeContentView to a
      new class called FrameDOMTreeContentView. This is used to display the DOM of the
      frame objects. FrameDOMTreeContentView is also inheriting from DOMTreeContentView.
      
      Issues that are fixed as a side effect:
      - Selection path components are now displaying all the sibling elements for contentFlow.contentNodes
      (those are the nodes that have "-webkit-flow-into" set directly).
      - Keyboard navigation works for the contentFlow.contentNodes.
      - Search is implemented in DOMTreeContentView, so that code now works for flows too.
      The DOMAgents's search API will use all the Documents to lookup for nodes, so it might
      find DOM nodes that are not part of the flow. This is in line with the behavior for the
      frames.
      
      * UserInterface/ContentFlowDOMTreeContentView.js: Renamed from ContentFlowTreeContentView
      to better reflect the inheritance from DOMTreeContentView.
      (WebInspector.ContentFlowDOMTreeContentView):
      (WebInspector.ContentFlowDOMTreeContentView.prototype.closed):
      (WebInspector.ContentFlowDOMTreeContentView.prototype._createContentTrees):
      (WebInspector.ContentFlowDOMTreeContentView.prototype._contentNodeWasAdded):
      (WebInspector.ContentFlowDOMTreeContentView.prototype._contentNodeWasRemoved):
      * UserInterface/ContentView.js:
      (WebInspector.ContentView):
      * UserInterface/DOMTreeContentView.js:
      (WebInspector.DOMTreeContentView):
      (WebInspector.DOMTreeContentView.prototype.closed):
      (WebInspector.DOMTreeContentView.prototype.):
      (WebInspector.DOMTreeContentView.prototype._restoreSelectedNodeAfterUpdate):
      (WebInspector.DOMTreeContentView.prototype._selectedNodeDidChange):
      * UserInterface/FrameDOMTreeContentView.js: Added.
      (WebInspector.FrameDOMTreeContentView):
      (WebInspector.FrameDOMTreeContentView.prototype.get domTree):
      (WebInspector.FrameDOMTreeContentView.prototype.closed):
      (WebInspector.FrameDOMTreeContentView.prototype._rootDOMNodeAvailable):
      (WebInspector.FrameDOMTreeContentView.prototype._rootDOMNodeInvalidated):
      (WebInspector.FrameDOMTreeContentView.prototype._requestRootDOMNode):
      * UserInterface/Main.html:
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@159151 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      5aef1877
  9. 06 Nov, 2013 1 commit
    • achicu@adobe.com's avatar
      Web Inspector: CSS Regions: When a flow is clicked the content of flow needs to be displayed · 750ac612
      achicu@adobe.com authored
      https://bugs.webkit.org/show_bug.cgi?id=122927
      
      Reviewed by Joseph Pecoraro.
      
      ContentFlowTreeContentView is now used to display the content nodes of a ContentFlow. It is
      very similar to the DOMTreeContentView class, but can handle multiple root nodes.
      
      * UserInterface/ContentFlowTreeContentView.js: Added.
      (WebInspector.ContentFlowTreeContentView):
      (WebInspector.ContentFlowTreeContentView.prototype.get selectionPathComponents):
      (WebInspector.ContentFlowTreeContentView.prototype.updateLayout):
      (WebInspector.ContentFlowTreeContentView.prototype.shown):
      (WebInspector.ContentFlowTreeContentView.prototype.hidden):
      (WebInspector.ContentFlowTreeContentView.prototype.closed):
      (WebInspector.ContentFlowTreeContentView.prototype._selectedNodeDidChange):
      (WebInspector.ContentFlowTreeContentView.prototype._pathComponentSelected):
      (WebInspector.ContentFlowTreeContentView.prototype._createContentNodeTree):
      (WebInspector.ContentFlowTreeContentView.prototype._createContentTrees):
      (WebInspector.ContentFlowTreeContentView.prototype._contentNodeWasAdded):
      (WebInspector.ContentFlowTreeContentView.prototype._contentNodeWasRemoved):
      * UserInterface/ContentView.js:
      (WebInspector.ContentView):
      (WebInspector.ContentView.isViewable):
      * UserInterface/DOMTreeElement.js:
      (WebInspector.DOMTreeElement.prototype.ondeselect): We need to remove the selected "dom node"
      so that the element is not going to stay selected after the we move to a different DOM tree.
      * UserInterface/DOMTreeOutline.js:
      (WebInspector.DOMTreeOutline.prototype.selectDOMNode):
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.sidebarPanelForRepresentedObject):
      * UserInterface/ResourceSidebarPanel.js:
      (WebInspector.ResourceSidebarPanel.prototype._treeElementSelected):
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@158788 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      750ac612
  10. 24 Oct, 2013 1 commit
    • achicu@adobe.com's avatar
      Web Inspector: Add a way to test the Manager and model classes · 1a45048e
      achicu@adobe.com authored
      https://bugs.webkit.org/show_bug.cgi?id=123223
      
      Reviewed by Timothy Hatcher.
      
      Source/WebInspectorUI:
      
      Moved some global functions out of Main.js, so that they can be used in the
      layout tests without including Main.js.
      
      * UserInterface/Main.html: Referenced the new JS files.
      * UserInterface/Main.js:
      * UserInterface/MessageDispatcher.js: Added.
      (WebInspector.dispatchNextQueuedMessageFromBackend):
      (WebInspector.dispatchMessageFromBackend):
      * UserInterface/URLUtilities.js: Added.
      (removeURLFragment):
      (relativePath):
      (parseURL):
      (absoluteURL):
      (parseLocationQueryParameters):
      (parseQueryString):
      (WebInspector.displayNameForURL):
      (WebInspector.displayNameForHost):
      * UserInterface/Utilities.js:
      
      LayoutTests:
      
      Added the first new WebInspector layout test file. The test is using InspectorTest.importInspectorScripts
      to bootstrap some of the managers/observers/models from the new WebInspector.
      
      * http/tests/inspector-protocol/resources/InspectorTest.js:
      (InspectorTest.importScript):
      (InspectorTest.importInspectorScripts):
      * inspector-protocol/model/main-frame-resource-expected.txt: Added.
      * inspector-protocol/model/main-frame-resource.html: Added.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@157938 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      1a45048e
  11. 18 Oct, 2013 1 commit
    • achicu@adobe.com's avatar
      Web Inspector: CSS Regions: Add the list of flows in the FrameTreeElement · 3fb6c1d9
      achicu@adobe.com authored
      https://bugs.webkit.org/show_bug.cgi?id=122924
      
      Reviewed by Timothy Hatcher.
      
      Added code to collect the flows from the backend into the DOMTree object
      on the frontend. Added ContentFlow to represent the flows on the frontend
      side and created ContentFlowTreeElement to display the flows in the FrameTreeElement.
      
      * Localizations/en.lproj/localizedStrings.js:
      * Scripts/copy-user-interface-resources.sh:
      * UserInterface/CSSObserver.js:
      (WebInspector.CSSObserver.prototype.namedFlowCreated):
      (WebInspector.CSSObserver.prototype.namedFlowRemoved):
      (WebInspector.CSSObserver.prototype.regionLayoutUpdated):
      (WebInspector.CSSObserver.prototype.regionOversetChanged):
      * UserInterface/ContentFlow.js: Added.
      (WebInspector.ContentFlow):
      (WebInspector.ContentFlow.prototype.get id):
      (WebInspector.ContentFlow.prototype.get documentNodeIdentifier):
      (WebInspector.ContentFlow.prototype.get name):
      (WebInspector.ContentFlow.prototype.get overset):
      (WebInspector.ContentFlow.prototype.set overset):
      * UserInterface/ContentFlowIcon.css: Added.
      (.content-flow-icon .icon):
      * UserInterface/ContentFlowTreeElement.js: Added.
      (WebInspector.ContentFlowTreeElement):
      * UserInterface/DOMTree.js:
      (WebInspector.DOMTree):
      (WebInspector.DOMTree.prototype.get flowMap):
      (WebInspector.DOMTree.prototype.get flowsCount):
      (WebInspector.DOMTree.prototype._framePageExecutionContextChanged):
      (WebInspector.DOMTree.prototype.requestContentFlowList):
      (WebInspector.DOMTree.prototype._isContentFlowInCurrentDocument):
      (WebInspector.DOMTree.prototype._contentFlowListWasUpdated):
      (WebInspector.DOMTree.prototype._contentFlowWasAdded):
      (WebInspector.DOMTree.prototype._contentFlowWasRemoved):
      * UserInterface/DOMTreeManager.js:
      (WebInspector.DOMTreeManager):
      (WebInspector.DOMTreeManager._flowPayloadHashKey):
      (WebInspector.DOMTreeManager.prototype._buildHighlightConfig):
      (WebInspector.DOMTreeManager.prototype._createContentFlowFromPayload):
      (WebInspector.DOMTreeManager.prototype._updateContentFlowFromPayload):
      (WebInspector.DOMTreeManager.prototype.getNamedFlowCollection):
      (WebInspector.DOMTreeManager.prototype.namedFlowCreated):
      (WebInspector.DOMTreeManager.prototype.namedFlowRemoved):
      (WebInspector.DOMTreeManager.prototype._sendNamedFlowUpdateEvents):
      (WebInspector.DOMTreeManager.prototype.regionLayoutUpdated):
      (WebInspector.DOMTreeManager.prototype.regionOversetChanged):
      * UserInterface/FrameTreeElement.js:
      (WebInspector.FrameTreeElement):
      (WebInspector.FrameTreeElement.prototype.onpopulate):
      (WebInspector.FrameTreeElement.prototype.onexpand):
      (WebInspector.FrameTreeElement.prototype._childContentFlowWasAdded):
      (WebInspector.FrameTreeElement.prototype._childContentFlowWasRemoved):
      (WebInspector.FrameTreeElement.prototype._rootDOMNodeInvalidated):
      (WebInspector.FrameTreeElement.prototype._addChildForRepresentedObject):
      (WebInspector.FrameTreeElement.prototype._removeChildForRepresentedObject):
      (WebInspector.FrameTreeElement.prototype._addTreeElementForRepresentedObject):
      (WebInspector.FrameTreeElement.prototype._compareResourceTreeElements):
      (WebInspector.FrameTreeElement.prototype._insertResourceTreeElement):
      (WebInspector.FrameTreeElement.prototype._parentTreeElementForRepresentedObject):
      (WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders):
      * UserInterface/Images/ContentFlow.svg: Added.
      * UserInterface/Main.html:
      * UserInterface/ResourceSidebarPanel.js:
      (WebInspector.ResourceSidebarPanel.prototype._treeElementSelected):
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@157649 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      3fb6c1d9
  12. 17 Oct, 2013 1 commit
    • graouts@apple.com's avatar
      Web Inspector: Go to line keyboard command and dialog · c0736bac
      graouts@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=122893
      
      Reviewed by Timothy Hatcher.
      
      Add a text input over source code text editors, centered within the width of the editor
      and towards the top of the editor, upon pressing Command+L or Control+G to match the
      behavior in Chrome.
      
      * Localizations/en.lproj/localizedStrings.js:
      New localized string "Line Number".
      
      * UserInterface/GoToLineDialog.css: Added.
      Styling for the go-to-line dialog.
      
      * UserInterface/GoToLineDialog.js: Added.
      (WebInspector.GoToLineDialog):
      Generate the DOM structure for the dialog.
      
      (WebInspector.GoToLineDialog.prototype.present):
      Present the dialog as a child of a parent element. The dialog's text field automatically
      gets focus and resets to be empty.
      
      (WebInspector.GoToLineDialog.prototype.dismiss):
      Dismiss the dialog if visible, this triggers the goToLineDialogWasDismissed delegate method.
      
      (WebInspector.GoToLineDialog.prototype.handleEvent):
      Route the various events registered in the dialog's DOM tree: input, keydown, blur, mousedown
      and click.
      
      (WebInspector.GoToLineDialog.prototype._handleInputEvent):
      Update the "non-empty" class on the dialog's element depending on the content of the dialog's
      text field. If there is content in the text field, this will make the clear icon visible.
      
      (WebInspector.GoToLineDialog.prototype._handleKeydownEvent):
      If the Esc. key is pressed when there is text in the dialog's input field, clear the input field.
      If no text is in the input field, dismiss the input field. When the Enter key is pressed, we call
      the isGoToLineDialogValueValid() method on the delegate to figure out if the text field value is
      valid. If it's not, we select the text field value so that it may be easily replaced and play
      en error sound. If it's valid, we call the goToLineDialogValueWasValidated() delegate method
      and dismiss the dialog.
      
      (WebInspector.GoToLineDialog.prototype._handleBlurEvent):
      Dismiss the dialog when its text field loses focus. This ensures that clicking anywhere outside
      of the dialog removes it from display.
      
      (WebInspector.GoToLineDialog.prototype._handleMousedownEvent):
      Upon pressing the mouse down on the clear icon, select the entire text field content (matches
      the behavior of Xcode) and prevent the default event action that would blur the text field
      which would dismiss the dialog.
      
      (WebInspector.GoToLineDialog.prototype._handleClickEvent):
      Clear the content of the dialog's text field upon clicking on its clear button.
      
      (WebInspector.GoToLineDialog.prototype._clear):
      Reset the dialog's text field's value to an empty string and remove the "non-empty" CSS class name
      controlling the display of the clear button.
      
      * UserInterface/Images/CloseWhite.svg: Added.
      Variation of the Close.svg icon with a white cross.
      
      * UserInterface/Main.html:
      Link to the newly added resources for GoToLineDialog.
      
      * UserInterface/SourceCodeTextEditor.js:
      (WebInspector.SourceCodeTextEditor):
      Register the Command+L and Control+G keyboard shortcuts to bring up the go-to-line dialog.
      
      (WebInspector.SourceCodeTextEditor.prototype.showGoToLineDialog):
      Method called upon pressing the Command+L and Control+G keyboard shorcuts creating an instance
      of a GoToDialog if necessary, becoming its delegate and presenting it in the context of the
      editor's root element.
      
      (WebInspector.SourceCodeTextEditor.prototype.isGoToLineDialogValueValid):
      Delegate method called to validate the line number presently set in the go-to-dialog's text field,
      checking it's a number between 1 and the number of lines in the source code.
      
      (WebInspector.SourceCodeTextEditor.prototype.goToLineDialogValueWasValidated):
      Delegate method called when the line number set in the go-to-dialog's text field has been validated.
      We reveal and select the line at the number provided.
      
      (WebInspector.SourceCodeTextEditor.prototype.goToLineDialogWasDismissed):
      Ensure the source code editor regains focus upon dismissing the go-to-dialog.
      
      * UserInterface/TextEditor.js:
      (WebInspector.TextEditor.prototype.revealPosition):
      Add a new opt-in option to not highlight the revealed position. The code in goToLineDialogValueWasValidated()
      sets that new flag to true to avoid an unnecessary highlight on top of the selection.
      
      (WebInspector.TextEditor.prototype.get lineCount):
      Expose the lineCount() method on the private CodeMirror instance.
      
      (WebInspector.TextEditor.prototype.focus):
      Expose the focus() method on the private CodeMirror instance.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@157601 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      c0736bac
  13. 02 Oct, 2013 1 commit
    • commit-queue@webkit.org's avatar
      Web Inspector: save and restore source positions in back/forward history · 8db4e7e6
      commit-queue@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=122062
      
      Patch by Brian J. Burg <burg@cs.washington.edu> on 2013-10-02
      Reviewed by Timothy Hatcher.
      
      Previously, the back/forward entries comprised of only the content
      views, but not their positions if navigated via hyperlink (i.e.,
      handling script.js:42).  When multiple instances of the same
      content view appeared in the back/forward list, the most recent
      navigation was displayed rather than the linked position.
      
      We now store context necessary to re-navigate such hyperlinks by
      storing view- specific data inside a cookie object, and invoke a
      supplied callback to take any position initialization actions,
      such as calling TextEditor.revealPosition.  This state is
      encapsulated into BackForwardEntry instances.
      
      Functions that save and restore scroll positions inside content
      views have been changed to store state in BackForwardEntry
      instances, so multiple scroll positions can be saved for a content
      view appearing in the navigation history more than once.
      
      * UserInterface/BackForwardEntry.js: Added.
      (WebInspector.BackForwardEntry):
      (WebInspector.BackForwardEntry.prototype.get contentView):
      (WebInspector.BackForwardEntry.prototype.get cookie):
      (WebInspector.BackForwardEntry.prototype.prepareToShow):
      (WebInspector.BackForwardEntry.prototype.prepareToHide):
      (WebInspector.BackForwardEntry.prototype._restoreFromCookie):
      (WebInspector.BackForwardEntry.prototype._restoreScrollPositions):
      (WebInspector.BackForwardEntry.prototype._saveScrollPositions):
      * UserInterface/ContentBrowser.js:
      (WebInspector.ContentBrowser.prototype.showContentView):
      (WebInspector.ContentBrowser.prototype._updateContentViewNavigationItems):
      (WebInspector.ContentBrowser.prototype._updateFindBanner):
      * UserInterface/ContentViewContainer.js:
      (WebInspector.ContentViewContainer.prototype.get currentContentView):
      (WebInspector.ContentViewContainer.prototype.get currentBackForwardEntry):
      (WebInspector.ContentViewContainer.prototype.showContentView):
      (WebInspector.ContentViewContainer.prototype.showBackForwardEntryForIndex):
      (WebInspector.ContentViewContainer.prototype.replaceContentView):
      (WebInspector.ContentViewContainer.prototype.closeAllContentViewsOfPrototype):
      (WebInspector.ContentViewContainer.prototype.closeAllContentViews):
      (WebInspector.ContentViewContainer.prototype.goBack):
      (WebInspector.ContentViewContainer.prototype.goForward):
      (WebInspector.ContentViewContainer.prototype.shown):
      (WebInspector.ContentViewContainer.prototype.hidden):
      (WebInspector.ContentViewContainer.prototype._showEntry):
      (WebInspector.ContentViewContainer.prototype._hideEntry):
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.openURL):
      * UserInterface/ResourceSidebarPanel.js:
      (WebInspector.ResourceSidebarPanel.prototype.restoreCallback):
      (WebInspector.ResourceSidebarPanel.prototype.showSourceCode):
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@156809 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      8db4e7e6
  14. 05 Sep, 2013 2 commits
    • joepeck@webkit.org's avatar
      Web Inspector: Breakpoint Actions · 572a17e2
      joepeck@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=120576
      
      Reviewed by Timothy Hatcher.
      
      Give the CodeMirror editor for JavaScript Breakpoint Actions JS Runtime
      completions (like window, document, etc.).
      
      The logic was inside of JavaScriptLogViewController but was already
      entirely independent. Factor it out into its own class and plug it into
      CodeMirrorCompletionController as a "CompletionsProvider".
      
      Because the class hooks into a global event to reset some state, make
      it a singleton, so new instances are not leaked.
      
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.loaded):
      * UserInterface/RuntimeManager.js: Added.
      (WebInspector.RuntimeManager):
      (WebInspector.RuntimeManager.prototype.evalCallback):
      (WebInspector.RuntimeManager.prototype.evaluateInInspectedWindow):
      Move eval in window to new RuntimeManager. A slightly cleaner place to this
      since it is used both by the console and JS completions provider.
      
      * UserInterface/CodeMirrorCompletionController.js:
      (WebInspector.CodeMirrorCompletionController):
      (WebInspector.CodeMirrorCompletionController.prototype.setExtendedCompletionProvider):
      (WebInspector.CodeMirrorCompletionController.prototype._completeAtCurrentPosition):
      Allow a completions provider plugin to completions controller. If one
      is available, this supercedes the delegate extend completions path.
      
      * UserInterface/BreakpointActionView.js:
      * UserInterface/ConsolePrompt.js:
      (WebInspector.ConsolePrompt):
      Use the new JS completions provider to get runtime JS completions.
      NOTE: ConsolePrompt still needs the delegate path for SQL completions.
      
      * UserInterface/JavaScriptLogViewController.js:
      (WebInspector.JavaScriptLogViewController):
      (WebInspector.JavaScriptLogViewController.prototype.consolePromptTextCommitted):
      * UserInterface/JavaScriptRuntimeCompletionProvider.js: Added.
      (WebInspector.JavaScriptRuntimeCompletionProvider):
      (get WebInspector.JavaScriptRuntimeCompletionProvider.prototype.):
      (get WebInspector.JavaScriptRuntimeCompletionProvider.prototype.completionControllerCompletionsNeeded):
      Move the JS completions code to a new class. No changes needed.
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@155134 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      572a17e2
    • joepeck@webkit.org's avatar
      Web Inspector: Breakpoint Actions · 8dbc7b8e
      joepeck@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=120576
      
      Reviewed by Timothy Hatcher.
      
      * UserInterface/Breakpoint.js:
      (WebInspector.Breakpoint):
      (WebInspector.Breakpoint.prototype.get actions):
      (WebInspector.Breakpoint.prototype.get options):
      (WebInspector.Breakpoint.prototype.get info):
      (WebInspector.Breakpoint.prototype._serializableActions):
      Saving, restoring, and serialization.
      
      (WebInspector.Breakpoint.prototype.createAction):
      (WebInspector.Breakpoint.prototype.recreateAction):
      (WebInspector.Breakpoint.prototype.removeAction):
      (WebInspector.Breakpoint.prototype.breakpointActionDidChange):
      Modifying _actions ivar.
      
      (WebInspector.Breakpoint.prototype._editBreakpointPopoverContentElement):
      (WebInspector.Breakpoint.prototype._popoverActionsCreateAddActionButton):
      (WebInspector.Breakpoint.prototype._popoverActionsAddActionButtonClicked):
      (WebInspector.Breakpoint.prototype._popoverActionsInsertBreakpointActionView):
      (WebInspector.Breakpoint.prototype.breakpointActionViewAppendActionView):
      (WebInspector.Breakpoint.prototype.breakpointActionViewRemoveActionView):
      (WebInspector.Breakpoint.prototype.breakpointActionViewResized):
      Popover UI containing breakpoint action views and converting to and from
      having no actions.
      
      (WebInspector.Breakpoint.prototype.willDismissPopover):
      Cleanup some ivars when the popover dismisses.
      
      * UserInterface/Breakpoint.css:
      (.popover .edit-breakpoint-popover-content.wide):
      Wider setting when there are actions in the popover.
      
      (.popover .edit-breakpoint-popover-content > table > tr > th):
      Keep the title labels at the top of their section.
      
      * UserInterface/BreakpointAction.js:
      (WebInspector.BreakpointAction):
      (WebInspector.BreakpointAction.prototype.get breakpoint):
      (WebInspector.BreakpointAction.prototype.get type):
      (WebInspector.BreakpointAction.prototype.get data):
      (WebInspector.BreakpointAction.prototype.set data):
      (WebInspector.BreakpointAction.prototype.get info):
      Very basic BreakpointAction class. Notifies Breakpoint on data changes.
      Type changes are not allowed, instead just create a new BreakpointAction.
      
      * UserInterface/BreakpointActionView.css: Added.
      (.breakpoint-action-block-header):
      (.breakpoint-action-remove-button):
      (.breakpoint-action-remove-button:active):
      (.breakpoint-action-append-button):
      (.breakpoint-action-block-body):
      (.breakpoint-action-block-body > input):
      (.breakpoint-action-eval-editor):
      (.breakpoint-action-eval-editor > .CodeMirror):
      (.breakpoint-action-eval-editor > .CodeMirror-scroll):
      * UserInterface/BreakpointActionView.js: Added.
      (WebInspector.BreakpointActionView):
      (WebInspector.BreakpointActionView.displayStringForType):
      (WebInspector.BreakpointActionView.prototype.get action):
      (WebInspector.BreakpointActionView.prototype.get element):
      (WebInspector.BreakpointActionView.prototype._pickerChanged):
      (WebInspector.BreakpointActionView.prototype._appendActionButtonClicked):
      (WebInspector.BreakpointActionView.prototype._removeActionButtonClicked):
      (WebInspector.BreakpointActionView.prototype._updateBody.switch.break):
      (WebInspector.BreakpointActionView.prototype._logInputChanged):
      (WebInspector.BreakpointActionView.prototype._codeMirrorBlurred):
      (WebInspector.BreakpointActionView.prototype._codeMirrorViewportChanged):
      UI and form controls for individual breakpoint actions. The view
      wraps a single BreakpointAction, and for any actions that could affect
      other views the delegate is notified.
      
      * UserInterface/DebuggerManager.js:
      (WebInspector.DebuggerManager):
      (WebInspector.DebuggerManager.prototype._debuggerBreakpointActionType):
      When sending to the backend, make sure to send protocol enums.
      
      * UserInterface/Popover.js:
      (WebInspector.Popover.prototype.update):
      Update the popover when content changes.
      
      * UserInterface/Images/BreakpointActionAdd.svg: Added.
      * UserInterface/Images/BreakpointActionRemove.svg: Added.
      * UserInterface/InspectorBackendCommands.js:
      * UserInterface/Main.html:
      * Localizations/en.lproj/localizedStrings.js:
      Misc. New strings, images, includes.
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@155133 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      8dbc7b8e
  15. 29 Aug, 2013 1 commit
    • joepeck@webkit.org's avatar
      Web Inspector: Download Web Archive of Inspected Page · e061c7f1
      joepeck@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=119774
      
      Reviewed by Timothy Hatcher.
      
      Source/WebCore:
      
      Add PageAgent.archive which will return a Base-64 encoded web archive
      when successful. In order to then allow saving non-string files, extend
      InspectorFrontendHost.save to allow for Base-64 encoded data.
      
      * inspector/Inspector.json:
      * inspector/InspectorPageAgent.cpp:
      (WebCore::InspectorPageAgent::archive):
      * inspector/InspectorPageAgent.h:
      Introduce and implement PageAgent.archive. Create a Web Archive of the
      page's main frame.
      
      * inspector/InspectorFrontendClient.h:
      * inspector/InspectorFrontendClientLocal.h:
      (WebCore::InspectorFrontendClientLocal::save):
      * inspector/InspectorFrontendHost.cpp:
      (WebCore::InspectorFrontendHost::save):
      * inspector/InspectorFrontendHost.h:
      * inspector/InspectorFrontendHost.idl:
      Extend InspectorFrontendHost.save to include a base64Encoded param.
      
      * inspector/front-end/FileManager.js:
      * inspector/front-end/InspectorFrontendHostStub.js:
      (.WebInspector.InspectorFrontendHostStub.prototype.save):
      Misc. updates to the old inspector for function changes.
      
      Source/WebInspectorUI:
      
      * UserInterface/ContentBrowser.js:
      (WebInspector.ContentBrowser.prototype._saveDataToFile):
      Allow a custom save handler which will do all the work.
      
      * UserInterface/DOMTreeContentView.js:
      (WebInspector.DOMTreeContentView):
      (WebInspector.DOMTreeContentView.prototype.get supportsSave):
      (WebInspector.DOMTreeContentView.prototype.get saveData.saveHandler):
      (WebInspector.DOMTreeContentView.prototype.get saveData):
      Allow Save keyboard shortcut to download an archive viewing the DOM Tree.
      
      * UserInterface/ResourceTreeElement.js:
      (WebInspector.ResourceTreeElement.prototype._updateStatus):
      * UserInterface/FrameTreeElement.js:
      (WebInspector.FrameTreeElement):
      (WebInspector.FrameTreeElement.prototype.updateStatusForMainFrame):
      (WebInspector.FrameTreeElement.prototype._mainResourceDidChange):
      (WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders):
      (WebInspector.FrameTreeElement.prototype._reloadPageClicked):
      (WebInspector.FrameTreeElement.prototype._downloadButtonClicked):
      (WebInspector.FrameTreeElement.prototype._updateDownloadButton):
      (WebInspector.FrameTreeElement.prototype._pageArchiveStarted):
      (WebInspector.FrameTreeElement.prototype._pageArchiveEnded):
      Move handling of main frame TreeElement buttons to FrameTreeElement.
      Add a Download button, and enable/disable it appropriately.
      
      * UserInterface/ResourceTreeElement.css:
      * UserInterface/TreeElementStatusButton.css: Copied from Source/WebInspectorUI/UserInterface/ResourceTreeElement.css.
      (.item > .status > .status-button):
      (.item > .status > .status-button > svg *):
      (.item.selected > .status > .status-button > svg *):
      (.item.selected > .status > .status-button:active > svg *):
      (.item > .status > .status-button.disabled > svg *):
      (.item.selected > .status > .status-button.disabled > svg *):
      * UserInterface/TreeElementStatusButton.js: Added.
      (WebInspector.TreeElementStatusButton):
      (WebInspector.TreeElementStatusButton.prototype.get element):
      (WebInspector.TreeElementStatusButton.prototype.get hidden):
      (WebInspector.TreeElementStatusButton.prototype.set hidden):
      (WebInspector.TreeElementStatusButton.prototype.get enabled):
      (WebInspector.TreeElementStatusButton.prototype.set enabled):
      (WebInspector.TreeElementStatusButton.prototype._clicked):
      Make buttons in the TreeElement status a generic class to share styling
      and handling of the buttons. New "disabled" state with even more
      transparent is used when the page is downloading.
      
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.archiveMainFrame):
      (WebInspector.canArchiveMainFrame):
      Generic API for archiving the page and determining if you can archive it.
      
      * UserInterface/InspectorBackendCommands.js:
      * UserInterface/InspectorFrontendHostStub.js:
      (.WebInspector.InspectorFrontendHostStub.prototype.save):
      * UserInterface/Images/DownloadArrow.svg: Added.
      * Localizations/en.lproj/localizedStrings.js:
      Misc. updates and new files.
      
      Source/WebKit/mac:
      
      Update to support InspectorFrontendHost.save's new base64Encoded
      parameter. It means the incoming content is binary data, not a string.
      
      * WebCoreSupport/WebInspectorClient.h:
      * WebCoreSupport/WebInspectorClient.mm:
      (WebInspectorFrontendClient::save):
      
      Source/WebKit2:
      
      Update to support InspectorFrontendHost.save's new base64Encoded
      parameter. It means the incoming content is binary data, not a string.
      
      * UIProcess/WebInspectorProxy.cpp:
      (WebKit::WebInspectorProxy::save):
      * UIProcess/WebInspectorProxy.h:
      * UIProcess/WebInspectorProxy.messages.in:
      * UIProcess/efl/WebInspectorProxyEfl.cpp:
      (WebKit::WebInspectorProxy::platformSave):
      * UIProcess/gtk/WebInspectorProxyGtk.cpp:
      (WebKit::WebInspectorProxy::platformSave):
      * UIProcess/mac/WebInspectorProxyMac.mm:
      (WebKit::WebInspectorProxy::platformSave):
      * UIProcess/qt/WebInspectorProxyQt.cpp:
      (WebKit::WebInspectorProxy::platformSave):
      * WebProcess/WebCoreSupport/WebInspectorFrontendClient.cpp:
      (WebKit::WebInspectorFrontendClient::save):
      * WebProcess/WebCoreSupport/WebInspectorFrontendClient.h:
      * WebProcess/WebPage/WebInspector.cpp:
      (WebKit::WebInspector::save):
      * WebProcess/WebPage/WebInspector.h:
      
      LayoutTests:
      
      * inspector-protocol/page/archive-expected.txt: Added.
      * inspector-protocol/page/archive.html: Added.
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@154828 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      e061c7f1
  16. 14 Aug, 2013 1 commit
  17. 11 Aug, 2013 1 commit
    • dino@apple.com's avatar
      Bootstrap canvas profiler · 31858a66
      dino@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=119652
      <rdar://problem/14703665>
      
      Reviewed by Joseph Pecoraro.
      
      Add enough to get an empty Canvas profile recording
      and displayed.
      
      * Localizations/en.lproj/localizedStrings.js: Add canvas strings.
      * UserInterface/CanvasProfileObject.js: Added. Mostly copied from CSS Selector Profiles.
      * UserInterface/CanvasProfileType.js: Added. Ditto.
      * UserInterface/CanvasDataGridNode.js: Added. Ditto.
      * UserInterface/CanvasProfileView.js: Added. Ditto.
      * UserInterface/ContentView.js:
      (WebInspector.ContentView): Add support for the new View type.
      (WebInspector.ContentView.isViewable):
      * UserInterface/InstrumentSidebarPanel.js:
      (WebInspector.InstrumentSidebarPanel): Add support for canvas profiles.
      (WebInspector.InstrumentSidebarPanel.prototype._recordProfileGlyphMousedOver):
      (WebInspector.InstrumentSidebarPanel.prototype._recordProfileGlyphMousedDown):
      (WebInspector.InstrumentSidebarPanel.prototype._recordProfileGlyphClicked):
      (WebInspector.InstrumentSidebarPanel.prototype._profileTypeWasSelected):
      (WebInspector.InstrumentSidebarPanel.prototype._profilesCleared):
      * UserInterface/Main.html: Load the new files.
      * UserInterface/ProfileManager.js: New methods and support for canvas profiles.
      (WebInspector.ProfileManager):
      (WebInspector.ProfileManager.prototype.initialize):
      (WebInspector.ProfileManager.prototype.isProfilingCanvas):
      (WebInspector.ProfileManager.prototype.startProfilingCanvas):
      (WebInspector.ProfileManager.prototype.stopProfilingCanvas):
      (WebInspector.ProfileManager.prototype._checkForInterruptions):
      (WebInspector.ProfileManager.prototype._attemptToResumeProfiling):
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@153928 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      31858a66
  18. 24 Jul, 2013 1 commit
    • graouts@apple.com's avatar
      Web Inspector: support click-and-drag editing of CSS numeric values · 930aea84
      graouts@apple.com authored
      https://bugs.webkit.org/show_bug.cgi?id=118896
      
      Reviewed by Timothy Hatcher.
      
      Add support for adjustment of numeric values in the various CodeMirror editors
      by holding the option key and dragging the mouse. By default, dragging one pixel
      changes the value by 1, but key modifiers allow to customize that behavior by using
      the control key to change the value to 0.1 and the shift key to change the value to 10.
      
      * UserInterface/CodeMirrorAdditions.js:
      Split adjustNumber() into two methods such that we may use its logic from the
      CodeMirrorDragToAlterNumberController. The new method, CodeMirror.prototype.alterNumberInRange()
      allow to set begin and end CodeMirror positions such that the existing alterNumber()
      can use information based on the current cursor position, and CodeMirrorDragToAlterNumberController
      can use information based on the hovered token.
      
      * UserInterface/CodeMirrorDragToAlterNumberController.css: Added.
      (.CodeMirror.drag-to-adjust .CodeMirror-lines):
      Set the cursor to "col-resize" when a number token is hovered and the option key
      modifier is pressed.
      
      * UserInterface/CodeMirrorDragToAlterNumberController.js: Added.
      (WebInspector.CodeMirrorDragToAlterNumberController):
      We define the new "dragToAdjustNumbers" CodeMirror option.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype.set enabled):
      The "enabled" property controls whether the associated CodeMirror instance
      may act upon hovering numeric values to adjust them via a drag interaction.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype.handleEvent):
      Proxy for various event-specific methods to deal with mouse events. We also bind
      the value of the "active" property to the "mouseenter" and "mouseleave" events
      if we're not currently dragging-to-adjust.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._setActive):
      The "active" property is set when the mouse is over the associated CodeMirror
      editor and when it's on we track all "mousemove" events such that we may
      identify tokens containing numeric values. We also start tracking changes to the
      option modifier key press state such that we may change the cursor accordingly.
      We ensure that the CodeMirror instance is not read-only such that we don't
      allow adjustment of numeric values in places where they couldn't be committed.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._setDragging):
      The "dragging" property reflects whether a dragging-to-adjust interaction
      is underway. We call into WebInspector.elementDragStart() and WebInspector.elementDragEnd()
      to set the cursor to "col-resize" for the whole document while tracking mousemove
      and mouseup events at the window level such that we can drag-to-adjust even outside
      of the inspector window.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._setTracksMouseClickAndDrag):
      The "tracksMouseClickAndDrag" property is set to true whenever the controller
      has detected that a token containing a numeric value is being hovered and the
      option modifier key is pressed. This property controls the cursor value for the
      hovered token to reflect that a drag-to-adjust interaction is allowed and tracks
      "mousedown" events for when a dragging interaction may be initiated.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._modifiersDidChange):
      Sets the "tracksMouseClickAndDrag" property depending on the availability of a hovered
      token containing a numeric value and the pressed state of the option modified key.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._mouseMoved):
      Handles "mousemove" events when we're not in the "dragging" state such that we
      check the currently hovered token, if any, to see if it contains a number that
      we may drag-to-adjust. Subsequently, we may enter the "tracksMouseClickAndDrag"
      state.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._mouseWasPressed):
      Handles "mousedown" events during a drag-to-adjust interaction. We simply track
      the current mouse position in the x-axis and enter the "dragging" state.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._mouseWasDragged):
      Handles "mousemove" events when we are in the "dragging" state. We compare the
      current mouse position in the x-axis with the last recoreded value and determine
      the amount by which we should adjust the value, taking into account the shift and
      control modifier keys. We then call into WebInspector.alterNumberInRange() to
      apply the change amount to the associated CodeMirror editor.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._mouseWasReleased):
      Handles "mouseup" events, simply exiting the "dragging" state and resetting other
      parameters we would have customized as a result of the drag-to-adjust interaction.
      
      (WebInspector.CodeMirrorDragToAlterNumberController.prototype._reset):
      Resetting some parameters we would have customized as a result of the drag-to-adjust
      interaction.
      
      * UserInterface/Main.html:
      Include the new CodeMirrorDragToAlterNumberController.{js|css} files.
      
      * UserInterface/Main.js:
      (WebInspector.elementDragStart):
      (WebInspector.elementDragEnd):
      Add an extra parameter to elementDragStart() such that the caller may specify the event
      target for the "mousemove" and "mouseup" events.
      
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@153087 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      930aea84
  19. 23 Jul, 2013 1 commit
    • commit-queue@webkit.org's avatar
      WebSocket initialization to use remote inspector · 25ed15c5
      commit-queue@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=118678
      
      Patch by Roland Takacs <rtakacs@inf.u-szeged.hu> on 2013-07-23
      Reviewed by Timothy Hatcher.
      
      Add WebSocket initialization and define a 'connect-src' directive in the
      Content-Security-Policy HTTP header to enable the connection.
      
      * UserInterface/InspectorFrontendHostStub.js:
      (.WebInspector.InspectorFrontendHostStub.prototype.sendMessageToBackend):
      * UserInterface/Main.html:
      * UserInterface/Main.js:
      (WebInspector.loaded):
      (WebInspector._initializeWebSocketIfNeeded.createSocket.WebInspector):
      (WebInspector._initializeWebSocketIfNeeded.createSocket):
      (WebInspector._initializeWebSocketIfNeeded):
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@153044 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      25ed15c5
  20. 17 Jul, 2013 1 commit
    • commit-queue@webkit.org's avatar
      Web Inspector: InspectorFrontendHost is undefined · 79bf00d5
      commit-queue@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=118715
      
      Patch by Seokju Kwon <seokju.kwon@gmail.com> on 2013-07-16
      Reviewed by Timothy Hatcher.
      
      Add InspectorFrontendHostStub.js to New Inspector because of the InspectorFrontendHost initialization.
      
      * UserInterface/InspectorFrontendHostStub.js: Added.
      (.WebInspector.InspectorFrontendHostStub):
      (.WebInspector.InspectorFrontendHostStub.prototype.platform):
      (.WebInspector.InspectorFrontendHostStub.prototype.port):
      (.WebInspector.InspectorFrontendHostStub.prototype.bringToFront):
      (.WebInspector.InspectorFrontendHostStub.prototype.closeWindow):
      (.WebInspector.InspectorFrontendHostStub.prototype.requestSetDockSide):
      (.WebInspector.InspectorFrontendHostStub.prototype.setAttachedWindowHeight):
      (.WebInspector.InspectorFrontendHostStub.prototype.setAttachedWindowWidth):
      (.WebInspector.InspectorFrontendHostStub.prototype.setToolbarHeight):
      (.WebInspector.InspectorFrontendHostStub.prototype.moveWindowBy):
      (.WebInspector.InspectorFrontendHostStub.prototype.loaded):
      (.WebInspector.InspectorFrontendHostStub.prototype.localizedStringsURL):
      (.WebInspector.InspectorFrontendHostStub.prototype.inspectedURLChanged):
      (.WebInspector.InspectorFrontendHostStub.prototype.copyText):
      (.WebInspector.InspectorFrontendHostStub.prototype.openInNewTab):
      (.WebInspector.InspectorFrontendHostStub.prototype.canSave):
      (.WebInspector.InspectorFrontendHostStub.prototype.save):
      (.WebInspector.InspectorFrontendHostStub.prototype.append):
      (.WebInspector.InspectorFrontendHostStub.prototype.close.cleanup):
      (.WebInspector.InspectorFrontendHostStub.prototype.close):
      (.WebInspector.InspectorFrontendHostStub.prototype.sendMessageToBackend):
      (.WebInspector.InspectorFrontendHostStub.prototype.loadResourceSynchronously):
      * UserInterface/Main.html:
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@152749 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      79bf00d5
  21. 27 Jun, 2013 1 commit
    • commit-queue@webkit.org's avatar
      Web Inspector: Display color picker in popover on color swatch click · 9848b0bb
      commit-queue@webkit.org authored
      https://bugs.webkit.org/show_bug.cgi?id=117919
      
      Patch by Matthew Holden <jftholden@yahoo.com> on 2013-06-27
      Reviewed by Timothy Hatcher.
      
      Includes fixes from second code review.
      
      * Localizations/en.lproj/localizedStrings.js:
      * UserInterface/CSSColorPicker.css: Added.
      (.colorpicker-container):
      (.colorpicker-fill-parent):
      (.colorpicker-top):
      (.colorpicker-color):
      (.colorpicker-bottom span):
      (.colorpicker-text):
      (.colorpicker-color-text-value):
      (.colorpicker-hue):
      (.colorpicker-fill):
      (.colorpicker-range-container):
      (.colorpicker-range-container *):
      (.colorpicker-range-container label):
      (.colorpicker-range-container input):
      (.colorpicker-saturation):
      (.colorpicker-value):
      (.colorpicker-dragger):
      (.colorpicker-slider):
      (.colorpicker-container .swatch):
      (.colorpicker-container .swatch-inner):
      * UserInterface/CSSColorPicker.js: Added.
      (WebInspector.CSSColorPicker.consume):
      (WebInspector.CSSColorPicker.move):
      (WebInspector.CSSColorPicker.start):
      (WebInspector.CSSColorPicker.stop):
      (WebInspector.CSSColorPicker.makeDraggable):
      (WebInspector.CSSColorPicker.hueDrag):
      (WebInspector.CSSColorPicker.colorDragStart):
      (WebInspector.CSSColorPicker.colorDrag):
      (WebInspector.CSSColorPicker.alphaDrag):
      (WebInspector.CSSColorPicker.colorSwatchClicked):
      (WebInspector.CSSColorPicker):
      (WebInspector.CSSColorPicker.prototype.get element):
      (WebInspector.CSSColorPicker.prototype.set color):
      (WebInspector.CSSColorPicker.prototype.get color):
      (WebInspector.CSSColorPicker.prototype.get outputColorFormat):
      (WebInspector.CSSColorPicker.prototype.get colorHueOnly):
      (WebInspector.CSSColorPicker.prototype.set displayText):
      (WebInspector.CSSColorPicker.prototype.shown):
      (WebInspector.CSSColorPicker.prototype._updateHelperLocations):
      (WebInspector.CSSColorPicker.prototype._updateDisplay):
      (WebInspector.CSSColorPicker.hsvaToRGBA):
      (WebInspector.CSSColorPicker.rgbaToHSVA):
      * UserInterface/CSSStyleDeclarationTextEditor.js:
      (WebInspector.CSSStyleDeclarationTextEditor.prototype.didDismissPopover):
      (WebInspector.CSSStyleDeclarationTextEditor.prototype.):
      (WebInspector.CSSStyleDeclarationTextEditor.prototype._createColorSwatches):
      (WebInspector.CSSStyleDeclarationTextEditor.prototype.event.newColorText.colorTextMarker):
      (WebInspector.CSSStyleDeclarationTextEditor.prototype.event.newColorText):
      * UserInterface/Main.html:
      
      git-svn-id: http://svn.webkit.org/repository/webkit/trunk@152092 268f45cc-cd09-0410-ab3c-d52691b4dbfc
      9848b0bb
  22. 11 Jun, 2013 1 commit