Remove some non-functional elements from the Scripts panel
[WebKit-https.git] / WebCore / page / inspector / ScriptsPanel.js
1 /*
2  * Copyright (C) 2008 Apple Inc. All Rights Reserved.
3  *
4  * Redistribution and use in source and binary forms, with or without
5  * modification, are permitted provided that the following conditions
6  * are met:
7  * 1. Redistributions of source code must retain the above copyright
8  *    notice, this list of conditions and the following disclaimer.
9  * 2. Redistributions in binary form must reproduce the above copyright
10  *    notice, this list of conditions and the following disclaimer in the
11  *    documentation and/or other materials provided with the distribution.
12  *
13  * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
14  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
15  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
16  * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
17  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
18  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
19  * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
20  * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
21  * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
22  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
23  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
24  */
25
26 WebInspector.ScriptsPanel = function()
27 {
28     WebInspector.Panel.call(this);
29
30     this.element.addStyleClass("scripts");
31
32     this.topStatusBar = document.createElement("div");
33     this.topStatusBar.className = "status-bar";
34     this.topStatusBar.id = "scripts-status-bar";
35     this.element.appendChild(this.topStatusBar);
36
37     this.backButton = document.createElement("button");
38     this.backButton.className = "status-bar-item";
39     this.backButton.id = "scripts-back";
40     this.backButton.title = WebInspector.UIString("Show the previous script resource.");
41     this.backButton.disabled = true;
42     this.backButton.appendChild(document.createElement("img"));
43
44     // FIXME: append the back button element to the top status bar when it is implemented.
45     // this.topStatusBar.appendChild(this.backButton);
46
47     this.forwardButton = document.createElement("button");
48     this.forwardButton.className = "status-bar-item";
49     this.forwardButton.id = "scripts-forward";
50     this.forwardButton.title = WebInspector.UIString("Show the next script resource.");
51     this.forwardButton.disabled = true;
52     this.forwardButton.appendChild(document.createElement("img"));
53
54     // FIXME: append the forward button element to the top status bar when it is implemented.
55     // this.topStatusBar.appendChild(this.forwardButton);
56
57     this.filesSelectElement = document.createElement("select");
58     this.filesSelectElement.className = "status-bar-item";
59     this.filesSelectElement.id = "scripts-files";
60     this.filesSelectElement.addEventListener("change", this._changeVisibleFile.bind(this), false);
61     this.topStatusBar.appendChild(this.filesSelectElement);
62
63     this.functionsSelectElement = document.createElement("select");
64     this.functionsSelectElement.className = "status-bar-item";
65     this.functionsSelectElement.id = "scripts-functions";
66
67     // FIXME: append the functions select element to the top status bar when it is implemented.
68     // this.topStatusBar.appendChild(this.functionsSelectElement);
69
70     this.sidebarButtonsElement = document.createElement("div");
71     this.sidebarButtonsElement.id = "scripts-sidebar-buttons";
72     this.topStatusBar.appendChild(this.sidebarButtonsElement);
73
74     this.pauseButton = document.createElement("button");
75     this.pauseButton.className = "status-bar-item";
76     this.pauseButton.id = "scripts-pause";
77     this.pauseButton.title = WebInspector.UIString("Pause script execution.");
78     this.pauseButton.disabled = true;
79     this.pauseButton.appendChild(document.createElement("img"));
80     this.pauseButton.addEventListener("click", this._togglePause.bind(this), false);
81     this.sidebarButtonsElement.appendChild(this.pauseButton);
82
83     this.stepOverButton = document.createElement("button");
84     this.stepOverButton.className = "status-bar-item";
85     this.stepOverButton.id = "scripts-step-over";
86     this.stepOverButton.title = WebInspector.UIString("Step over next function call.");
87     this.stepOverButton.disabled = true;
88     this.stepOverButton.addEventListener("click", this._stepOverClicked.bind(this), false);
89     this.stepOverButton.appendChild(document.createElement("img"));
90     this.sidebarButtonsElement.appendChild(this.stepOverButton);
91
92     this.stepIntoButton = document.createElement("button");
93     this.stepIntoButton.className = "status-bar-item";
94     this.stepIntoButton.id = "scripts-step-into";
95     this.stepIntoButton.title = WebInspector.UIString("Step into next function call.");
96     this.stepIntoButton.disabled = true;
97     this.stepIntoButton.addEventListener("click", this._stepIntoClicked.bind(this), false);
98     this.stepIntoButton.appendChild(document.createElement("img"));
99     this.sidebarButtonsElement.appendChild(this.stepIntoButton);
100
101     this.stepOutButton = document.createElement("button");
102     this.stepOutButton.className = "status-bar-item";
103     this.stepOutButton.id = "scripts-step-out";
104     this.stepOutButton.title = WebInspector.UIString("Step out of current function.");
105     this.stepOutButton.disabled = true;
106     this.stepOutButton.addEventListener("click", this._stepOutClicked.bind(this), false);
107     this.stepOutButton.appendChild(document.createElement("img"));
108     this.sidebarButtonsElement.appendChild(this.stepOutButton);
109
110     this.debuggerStatusElement = document.createElement("div");
111     this.debuggerStatusElement.id = "scripts-debugger-status";
112     this.sidebarButtonsElement.appendChild(this.debuggerStatusElement);
113
114     this.scriptResourceViews = document.createElement("div");
115     this.scriptResourceViews.id = "script-resource-views";
116
117     this.sidebarElement = document.createElement("div");
118     this.sidebarElement.id = "scripts-sidebar";
119
120     this.sidebarResizeElement = document.createElement("div");
121     this.sidebarResizeElement.className = "sidebar-resizer-vertical";
122     this.sidebarResizeElement.addEventListener("mousedown", this._startSidebarResizeDrag.bind(this), false);
123
124     this.sidebarResizeWidgetElement = document.createElement("div");
125     this.sidebarResizeWidgetElement.id = "scripts-sidebar-resizer-widget";
126     this.sidebarResizeWidgetElement.addEventListener("mousedown", this._startSidebarResizeDrag.bind(this), false);
127     this.topStatusBar.appendChild(this.sidebarResizeWidgetElement);
128
129     this.sidebarPanes = {};
130     this.sidebarPanes.callstack = new WebInspector.CallStackSidebarPane();
131     this.sidebarPanes.scopechain = new WebInspector.ScopeChainSidebarPane();
132     this.sidebarPanes.breakpoints = new WebInspector.BreakpointsSidebarPane();
133
134     for (var pane in this.sidebarPanes)
135         this.sidebarElement.appendChild(this.sidebarPanes[pane].element);
136
137     // FIXME: remove the following line of code when the Breakpoints pane has content.
138     this.sidebarElement.removeChild(this.sidebarPanes.breakpoints.element);
139
140     this.sidebarPanes.callstack.expanded = true;
141     this.sidebarPanes.callstack.addEventListener("call frame selected", this._callFrameSelected, this);
142
143     this.sidebarPanes.scopechain.expanded = true;
144
145     this.attachOverlayElement = document.createElement("div");
146     this.attachOverlayElement.id = "scripts-attach-overlay";
147
148     var headerElement = document.createElement("h1");
149     headerElement.textContent = WebInspector.UIString("Debugging scripts requires you to attach the debugger.");
150     this.attachOverlayElement.appendChild(headerElement);
151
152     var infoElement = document.createElement("span");
153     infoElement.textContent = WebInspector.UIString("Attaching will reload the inspected page.");
154     this.attachOverlayElement.appendChild(infoElement);
155
156     this.attachOverlayElement.appendChild(document.createElement("br"));
157     this.attachOverlayElement.appendChild(document.createElement("br"));
158
159     var attachButton = document.createElement("button");
160     attachButton.textContent = WebInspector.UIString("Attach Debugger");
161     attachButton.addEventListener("click", this._toggleDebugging.bind(this), false);
162     this.attachOverlayElement.appendChild(attachButton);
163
164     this.element.appendChild(this.attachOverlayElement);
165     this.element.appendChild(this.scriptResourceViews);
166     this.element.appendChild(this.sidebarElement);
167     this.element.appendChild(this.sidebarResizeElement);
168
169     this.debuggingButton = document.createElement("button");
170     this.debuggingButton.id = "scripts-debugging-status-bar-item";
171     this.debuggingButton.className = "status-bar-item";
172     this.debuggingButton.addEventListener("click", this._toggleDebugging.bind(this), false);
173
174     this.pauseOnExceptionButtons = document.createElement("button");
175     this.pauseOnExceptionButtons.id = "scripts-pause-on-exceptions-status-bar-item";
176     this.pauseOnExceptionButtons.className = "status-bar-item";
177     this.pauseOnExceptionButtons.addEventListener("click", this._togglePauseOnExceptions.bind(this), false);
178
179     this._breakpointsURLMap = {};
180
181     this.reset();
182 }
183
184 WebInspector.ScriptsPanel.prototype = {
185     toolbarItemClass: "scripts",
186
187     get toolbarItemLabel()
188     {
189         return WebInspector.UIString("Scripts");
190     },
191
192     get statusBarItems()
193     {
194         return [this.debuggingButton, this.pauseOnExceptionButtons];
195     },
196
197     get paused()
198     {
199         return this._paused;
200     },
201
202     show: function()
203     {
204         WebInspector.Panel.prototype.show.call(this);
205         this.sidebarResizeElement.style.right = (this.sidebarElement.offsetWidth - 3) + "px";
206
207         if (this.visibleView) {
208             if (this.visibleView instanceof WebInspector.ResourceView)
209                 this.visibleView.headersVisible = false;
210             this.visibleView.show(this.scriptResourceViews);
211         }
212     },
213
214     addScript: function(sourceID, sourceURL, source, startingLine, errorLine, errorMessage)
215     {
216         var script = new WebInspector.Script(sourceID, sourceURL, source, startingLine, errorLine, errorMessage);
217
218         if (sourceURL in WebInspector.resourceURLMap) {
219             var resource = WebInspector.resourceURLMap[sourceURL];
220             resource.addScript(script);
221         }
222
223         if (sourceURL in this._breakpointsURLMap && sourceID) {
224             var breakpoints = this._breakpointsURLMap[sourceURL];
225             var breakpointsLength = breakpoints.length;
226             for (var i = 0; i < breakpointsLength; ++i) {
227                 var breakpoint = breakpoints[i];
228                 if (startingLine <= breakpoint.line)
229                     breakpoint.sourceID = sourceID;
230             }
231
232             InspectorController.addBreakpoint(breakpoint.sourceID, breakpoint.line);
233         }
234
235         if (sourceID)
236             this._sourceIDMap[sourceID] = (resource || script);
237
238         this._addScriptToFilesMenu(script);
239     },
240
241     addBreakpoint: function(breakpoint)
242     {
243         this.sidebarPanes.breakpoints.addBreakpoint(breakpoint);
244
245         var sourceFrame;
246         if (breakpoint.url) {
247             if (!(breakpoint.url in this._breakpointsURLMap))
248                 this._breakpointsURLMap[breakpoint.url] = [];
249             this._breakpointsURLMap[breakpoint.url].unshift(breakpoint);
250
251             if (breakpoint.url in WebInspector.resourceURLMap) {
252                 var resource = WebInspector.resourceURLMap[breakpoint.url];
253                 sourceFrame = this._sourceFrameForScriptOrResource(resource);
254             }
255         }
256
257         if (breakpoint.sourceID && !sourceFrame) {
258             var object = this._sourceIDMap[breakpoint.sourceID]
259             sourceFrame = this._sourceFrameForScriptOrResource(object);
260         }
261
262         if (sourceFrame)
263             sourceFrame.addBreakpoint(breakpoint);
264     },
265
266     removeBreakpoint: function(breakpoint)
267     {
268         this.sidebarPanes.breakpoints.removeBreakpoint(breakpoint);
269
270         var sourceFrame;
271         if (breakpoint.url && breakpoint.url in this._breakpointsURLMap) {
272             var breakpoints = this._breakpointsURLMap[breakpoint.url];
273             breakpoints.remove(breakpoint);
274             if (!breakpoints.length)
275                 delete this._breakpointsURLMap[breakpoint.url];
276
277             if (breakpoint.url in WebInspector.resourceURLMap) {
278                 var resource = WebInspector.resourceURLMap[breakpoint.url];
279                 sourceFrame = this._sourceFrameForScriptOrResource(resource);
280             }
281         }
282
283         if (breakpoint.sourceID && !sourceFrame) {
284             var object = this._sourceIDMap[breakpoint.sourceID]
285             sourceFrame = this._sourceFrameForScriptOrResource(object);
286         }
287
288         if (sourceFrame)
289             sourceFrame.removeBreakpoint(breakpoint);
290     },
291
292     evaluateInSelectedCallFrame: function(code)
293     {
294         var selectedCallFrame = this.sidebarPanes.callstack.selectedCallFrame;
295         if (!this._paused || !selectedCallFrame)
296             return;
297         var result = selectedCallFrame.evaluate(code);
298         this.sidebarPanes.scopechain.update(selectedCallFrame);
299         return result;
300     },
301
302     debuggerPaused: function()
303     {
304         this._paused = true;
305         this._waitingToPause = false;
306         this._stepping = false;
307
308         this._updateDebuggerButtons();
309
310         var callStackPane = this.sidebarPanes.callstack;
311         var currentFrame = InspectorController.currentCallFrame();
312         callStackPane.update(currentFrame);
313         callStackPane.selectedCallFrame = currentFrame;
314     },
315
316     debuggerAttached: function()
317     {
318         this.reset();
319     },
320
321     debuggerDetached: function()
322     {
323         this.reset();
324     },
325
326     reset: function()
327     {
328         this.visibleView = null;
329
330         if (!InspectorController.debuggerAttached()) {
331             this._paused = false;
332             this._waitingToPause = false;
333             this._stepping = false;
334         }
335
336         this._clearInterface();
337
338         this._scriptsForURLsInFilesSelect = {};
339         this.filesSelectElement.removeChildren();
340         this.functionsSelectElement.removeChildren();
341         this.scriptResourceViews.removeChildren();
342
343         if (this._sourceIDMap) {
344             for (var sourceID in this._sourceIDMap) {
345                 var object = this._sourceIDMap[sourceID];
346                 if (object instanceof WebInspector.Resource)
347                     object.removeAllScripts();
348             }
349         }
350
351         this._sourceIDMap = {};
352     },
353
354     get visibleView()
355     {
356         return this._visibleView;
357     },
358
359     set visibleView(x)
360     {
361         if (this._visibleView === x)
362             return;
363
364         if (this._visibleView)
365             this._visibleView.hide();
366
367         this._visibleView = x;
368
369         if (x)
370             x.show(this.scriptResourceViews);
371     },
372
373     showScript: function(script, line)
374     {
375         this._showScriptOrResource(script, line);
376     },
377
378     showResource: function(resource, line)
379     {
380         this._showScriptOrResource(resource, line);
381     },
382
383     scriptViewForScript: function(script)
384     {
385         if (!script)
386             return null;
387         if (!script._scriptView)
388             script._scriptView = new WebInspector.ScriptView(script);
389         return script._scriptView;
390     },
391
392     sourceFrameForScript: function(script)
393     {
394         var view = this.scriptViewForScript(script);
395         if (!view)
396             return null;
397
398         // Setting up the source frame requires that we be attached.
399         if (!this.element.parentNode)
400             this.attach();
401
402         view.setupSourceFrameIfNeeded();
403         return view.sourceFrame;
404     },
405
406     _sourceFrameForScriptOrResource: function(scriptOrResource)
407     {
408         if (scriptOrResource instanceof WebInspector.Resource)
409             return WebInspector.panels.resources.sourceFrameForResource(scriptOrResource);
410         if (scriptOrResource instanceof WebInspector.Script)
411             return this.sourceFrameForScript(scriptOrResource);
412     },
413
414     _showScriptOrResource: function(scriptOrResource, line)
415     {
416         if (!scriptOrResource)
417             return;
418
419         var view;
420         if (scriptOrResource instanceof WebInspector.Resource) {
421             view = WebInspector.panels.resources.resourceViewForResource(scriptOrResource);
422             view.headersVisible = false;
423
424             if (scriptOrResource.url in this._breakpointsURLMap) {
425                 var sourceFrame = this._sourceFrameForScriptOrResource(scriptOrResource);
426                 if (sourceFrame && !sourceFrame.breakpoints.length) {
427                     var breakpoints = this._breakpointsURLMap[scriptOrResource.url];
428                     var breakpointsLength = breakpoints.length;
429                     for (var i = 0; i < breakpointsLength; ++i)
430                         sourceFrame.addBreakpoint(breakpoints[i]);
431                 }
432             }
433         } else if (scriptOrResource instanceof WebInspector.Script)
434             view = this.scriptViewForScript(scriptOrResource);
435
436         if (!view)
437             return;
438
439         this.visibleView = view;
440
441         if (line && view.revealLine)
442             view.revealLine(line);
443
444         var option;
445         if (scriptOrResource instanceof WebInspector.Script) {
446             option = script.filesSelectOption;
447             console.assert(option);
448         } else {
449             var url = scriptOrResource.url;
450             var script = this._scriptsForURLsInFilesSelect[url];
451             if (script)
452                option = script.filesSelectOption;
453         }
454
455         if (option)
456             this.filesSelectElement.selectedIndex = option.index;
457     },
458
459     _addScriptToFilesMenu: function(script)
460     {
461         if (script.resource && this._scriptsForURLsInFilesSelect[script.sourceURL])
462             return;
463
464         this._scriptsForURLsInFilesSelect[script.sourceURL] = script;
465
466         var select = this.filesSelectElement;
467
468         // FIXME: Append in some meaningful order.
469         var option = document.createElement("option");
470         option.representedObject = (script.resource || script);
471         option.text = (script.sourceURL ? script.sourceURL.trimURL(WebInspector.mainResource ? WebInspector.mainResource.domain : "") : "(eval script)");
472         select.appendChild(option);
473
474         script.filesSelectOption = option;
475
476         // Call _showScriptOrResource if the option we just appended ended up being selected.
477         // This will happen for the first item added to the menu.
478         if (select.options[select.selectedIndex] === option)
479             this._showScriptOrResource(option.representedObject);
480     },
481
482     _clearCurrentExecutionLine: function()
483     {
484         if (this._executionSourceFrame)
485             this._executionSourceFrame.executionLine = 0;
486         delete this._executionSourceFrame;
487     },
488
489     _callFrameSelected: function()
490     {
491         this._clearCurrentExecutionLine();
492
493         var callStackPane = this.sidebarPanes.callstack;
494         var currentFrame = callStackPane.selectedCallFrame;
495         if (!currentFrame)
496             return;
497
498         this.sidebarPanes.scopechain.update(currentFrame);
499
500         var scriptOrResource = this._sourceIDMap[currentFrame.sourceIdentifier];
501         this._showScriptOrResource(scriptOrResource, currentFrame.line);
502
503         this._executionSourceFrame = this._sourceFrameForScriptOrResource(scriptOrResource);
504         if (this._executionSourceFrame)
505             this._executionSourceFrame.executionLine = currentFrame.line;
506     },
507
508     _changeVisibleFile: function(event)
509     {
510         var select = this.filesSelectElement;
511         this._showScriptOrResource(select.options[select.selectedIndex].representedObject);
512     },
513
514     _startSidebarResizeDrag: function(event)
515     {
516         WebInspector.elementDragStart(this.sidebarElement, this._sidebarResizeDrag.bind(this), this._endSidebarResizeDrag.bind(this), event, "col-resize");
517
518         if (event.target === this.sidebarResizeWidgetElement)
519             this._dragOffset = (event.target.offsetWidth - (event.pageX - event.target.totalOffsetLeft));
520         else
521             this._dragOffset = 0;
522     },
523
524     _endSidebarResizeDrag: function(event)
525     {
526         WebInspector.elementDragEnd(event);
527
528         delete this._dragOffset;
529     },
530
531     _sidebarResizeDrag: function(event)
532     {
533         var x = event.pageX + this._dragOffset;
534         var newWidth = Number.constrain(window.innerWidth - x, Preferences.minScriptsSidebarWidth, window.innerWidth * 0.66);
535
536         this.sidebarElement.style.width = newWidth + "px";
537         this.sidebarButtonsElement.style.width = newWidth + "px";
538         this.scriptResourceViews.style.right = newWidth + "px";
539         this.sidebarResizeWidgetElement.style.right = newWidth + "px";
540         this.sidebarResizeElement.style.right = (newWidth - 3) + "px";
541
542         event.preventDefault();
543     },
544
545     _updatePauseOnExceptionsButton: function()
546     {
547         if (InspectorController.pauseOnExceptions()) {
548             this.pauseOnExceptionButtons.title = WebInspector.UIString("Pause on exceptions.");
549             this.pauseOnExceptionButtons.addStyleClass("toggled-on");
550         } else {
551             this.pauseOnExceptionButtons.title = WebInspector.UIString("Don't pause on exceptions.");
552             this.pauseOnExceptionButtons.removeStyleClass("toggled-on");
553         }
554     },
555
556     _updateDebuggerButtons: function()
557     {
558         if (InspectorController.debuggerAttached()) {
559             this.debuggingButton.title = WebInspector.UIString("Stop debugging.");
560             this.debuggingButton.addStyleClass("toggled-on");
561             this.pauseButton.disabled = false;
562
563             if (this.attachOverlayElement.parentNode)
564                 this.attachOverlayElement.parentNode.removeChild(this.attachOverlayElement);
565         } else {
566             this.debuggingButton.title = WebInspector.UIString("Start debugging and reload inspected page.");
567             this.debuggingButton.removeStyleClass("toggled-on");
568             this.pauseButton.disabled = true;
569
570             this.element.appendChild(this.attachOverlayElement);
571         }
572
573         this._updatePauseOnExceptionsButton();
574
575         if (this._paused) {
576             this.pauseButton.addStyleClass("paused");
577
578             this.pauseButton.disabled = false;
579             this.stepOverButton.disabled = false;
580             this.stepIntoButton.disabled = false;
581             this.stepOutButton.disabled = false;
582
583             this.debuggerStatusElement.textContent = WebInspector.UIString("Paused");
584         } else {
585             this.pauseButton.removeStyleClass("paused");
586
587             this.pauseButton.disabled = this._waitingToPause;
588             this.stepOverButton.disabled = true;
589             this.stepIntoButton.disabled = true;
590             this.stepOutButton.disabled = true;
591
592             if (this._waitingToPause)
593                 this.debuggerStatusElement.textContent = WebInspector.UIString("Pausing");
594             else if (this._stepping)
595                 this.debuggerStatusElement.textContent = WebInspector.UIString("Stepping");
596             else
597                 this.debuggerStatusElement.textContent = "";
598         }
599     },
600
601     _clearInterface: function()
602     {
603         this.sidebarPanes.callstack.update(null);
604         this.sidebarPanes.scopechain.update(null);
605
606         this._clearCurrentExecutionLine();
607         this._updateDebuggerButtons();
608     },
609
610     _toggleDebugging: function()
611     {
612         this._paused = false;
613         this._waitingToPause = false;
614         this._stepping = false;
615
616         if (InspectorController.debuggerAttached())
617             InspectorController.stopDebugging();
618         else
619             InspectorController.startDebuggingAndReloadInspectedPage();
620
621         this._clearInterface();
622     },
623
624     _togglePauseOnExceptions: function()
625     {
626         InspectorController.setPauseOnExceptions(!InspectorController.pauseOnExceptions());
627         this._updatePauseOnExceptionsButton();
628     },
629
630     _togglePause: function()
631     {
632         if (this._paused) {
633             this._paused = false;
634             this._waitingToPause = false;
635             InspectorController.resumeDebugger();
636         } else {
637             this._stepping = false;
638             this._waitingToPause = true;
639             InspectorController.pauseInDebugger();
640         }
641
642         this._clearInterface();
643     },
644
645     _stepOverClicked: function()
646     {
647         this._paused = false;
648         this._stepping = true;
649
650         this._clearInterface();
651
652         InspectorController.stepOverStatementInDebugger();
653     },
654
655     _stepIntoClicked: function()
656     {
657         this._paused = false;
658         this._stepping = true;
659
660         this._clearInterface();
661
662         InspectorController.stepIntoStatementInDebugger();
663     },
664
665     _stepOutClicked: function()
666     {
667         this._paused = false;
668         this._stepping = true;
669
670         this._clearInterface();
671
672         InspectorController.stepOutOfFunctionInDebugger();
673     }
674 }
675
676 WebInspector.ScriptsPanel.prototype.__proto__ = WebInspector.Panel.prototype;