Changeset 220294 in webkit


Ignore:
Timestamp:
Aug 4, 2017 2:39:58 PM (7 years ago)
Author:
Devin Rousso
Message:

Web Inspector: add source view for WebGL shader programs
https://bugs.webkit.org/show_bug.cgi?id=138593
<rdar://problem/18936194>

Reviewed by Matt Baker.

Source/JavaScriptCore:

  • inspector/protocol/Canvas.json:
    • Add ShaderType enum that contains "vertex" and "fragment".
    • Add requestShaderSource command that will return the original source code for a given shader program and shader type.

Source/WebCore:

Test: inspector/canvas/requestShaderSource.html

  • inspector/InspectorCanvasAgent.h:
  • inspector/InspectorCanvasAgent.cpp:

(WebCore::InspectorCanvasAgent::requestShaderSource):

  • inspector/InspectorShaderProgram.h:
  • inspector/InspectorShaderProgram.cpp:

(WebCore::InspectorShaderProgram::shaderForType):

Source/WebInspectorUI:

Shader programs are now listed in the Resources sidebar as items within the owner Canvas
context. When selected, the shown content view has two editors, one for the Vertex shader
and one for the Fragment shader. These editors use CodeMirror's "clike" mode for GLSL syntax.

  • Localizations/en.lproj/localizedStrings.js:
  • WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
  • WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
  • UserInterface/Main.html:
  • UserInterface/Controllers/CanvasManager.js:

(WI.CanvasManager):
(WI.CanvasManager.prototype.canvasRemoved):
(WI.CanvasManager.prototype.programCreated):
(WI.CanvasManager.prototype.programDeleted):
(WI.CanvasManager.prototype._mainResourceDidChange):

  • UserInterface/Models/Collection.js:
  • UserInterface/Models/Canvas.js:

(WI.Canvas.prototype.get shaderProgramCollection)

  • UserInterface/Models/ShaderProgram.js:

(WI.ShaderProgram.prototype.requestVertexShaderSource):
(WI.ShaderProgram.prototype.requestFragmentShaderSource):
(WI.ShaderProgram.prototype._requestShaderSource):

  • UserInterface/Views/CanvasTreeElement.js:

(WI.CanvasTreeElement):
(WI.CanvasTreeElement.prototype.onattach):
(WI.CanvasTreeElement.prototype.ondetach):
(WI.CanvasTreeElement.prototype.onpopulate):
(WI.CanvasTreeElement.prototype._shaderProgramAdded):
(WI.CanvasTreeElement.prototype._shaderProgramRemoved):

  • UserInterface/Views/ShaderProgramTreeElement.js: Added.

(WI.ShaderProgramTreeElement):

  • UserInterface/Views/ShaderProgramContentView.js: Added.

(WI.ShaderProgramContentView):
(WI.ShaderProgramContentView.prototype.shown):
(WI.ShaderProgramContentView.prototype.hidden):
(WI.ShaderProgramContentView.prototype.closed):
(WI.ShaderProgramContentView.prototype.get supportsSave):
(WI.ShaderProgramContentView.prototype.get saveData):
(WI.ShaderProgramContentView.prototype.get supportsSearch):
(WI.ShaderProgramContentView.prototype.get numberOfSearchResults):
(WI.ShaderProgramContentView.prototype.get hasPerformedSearch):
(WI.ShaderProgramContentView.prototype.set automaticallyRevealFirstSearchResult):
(WI.ShaderProgramContentView.prototype.performSearch):
(WI.ShaderProgramContentView.prototype.searchCleared):
(WI.ShaderProgramContentView.prototype.searchQueryWithSelection):
(WI.ShaderProgramContentView.prototype.revealPreviousSearchResult):
(WI.ShaderProgramContentView.prototype.revealNextSearchResult):
(WI.ShaderProgramContentView.prototype.revealPosition):
(WI.ShaderProgramContentView.prototype._editorFocused):
(WI.ShaderProgramContentView.prototype._numberOfSearchResultsDidChange):

  • UserInterface/Views/ShaderProgramContentView.css: Added.

(.content-view.shader-program > .text-editor.shader):
(body[dir=ltr] .content-view.shader-program > .text-editor.shader.vertex,):
(body[dir=ltr] .content-view.shader-program > .text-editor.shader.fragment,):
(body[dir=ltr] .content-view.shader-program > .text-editor.shader + .text-editor.shader):
(body[dir=rtl] .content-view.shader-program > .text-editor.shader + .text-editor.shader):
(.content-view.shader-program > .text-editor.shader > .type-title):
(.content-view.shader-program > .text-editor.shader > .CodeMirror):

  • UserInterface/Images/DocumentGL.png: Added.
  • UserInterface/Images/DocumentGL@2x.png: Added.
  • UserInterface/Views/ResourceIcons.css:

(.shader-program .icon):

  • UserInterface/Base/Main.js:
  • UserInterface/Views/ContentView.js:

(WI.ContentView.createFromRepresentedObject):
(WI.ContentView.isViewable):

  • UserInterface/Views/ResourceSidebarPanel.js:

(WI.ResourceSidebarPanel.prototype.matchTreeElementAgainstCustomFilters.match):
(WI.ResourceSidebarPanel.prototype.matchTreeElementAgainstCustomFilters):
(WI.ResourceSidebarPanel.prototype._treeSelectionDidChange):

  • UserInterface/Views/ResourcesTabContentView.js:

(WI.ResourcesTabContentView.prototype.canShowRepresentedObject):
Plumbing for displaying ShaderProgram content.

  • UserInterface/Views/TextEditor.js:

(WebInspector.TextEditor):
(WebInspector.TextEditor.prototype._editorFocused):

  • Scripts/update-codemirror-resources.rb:
  • UserInterface/External/CodeMirror/clike.js: Added.

Add C-like mode for highlighting GLSL.

LayoutTests:

  • inspector/canvas/requestShaderSource-expected.txt: Added.
  • inspector/canvas/requestShaderSource.html: Added.
  • inspector/canvas/resources/shaderProgram-utilities.js:

(linkProgram):
(linkProgram.typeForScript):
(linkProgram.createShaderFromScript):

  • platform/win/TestExpectations:
Location:
trunk
Files:
6 added
27 edited
2 copied

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r220289 r220294  
     12017-08-04  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: add source view for WebGL shader programs
     4        https://bugs.webkit.org/show_bug.cgi?id=138593
     5        <rdar://problem/18936194>
     6
     7        Reviewed by Matt Baker.
     8
     9        * inspector/canvas/requestShaderSource-expected.txt: Added.
     10        * inspector/canvas/requestShaderSource.html: Added.
     11
     12        * inspector/canvas/resources/shaderProgram-utilities.js:
     13        (linkProgram):
     14        (linkProgram.typeForScript):
     15        (linkProgram.createShaderFromScript):
     16
     17        * platform/win/TestExpectations:
     18
    1192017-08-04  Said Abou-Hallawa  <sabouhallawa@apple.com>
    220
  • trunk/LayoutTests/inspector/canvas/resources/shaderProgram-utilities.js

    r220233 r220294  
    55    context = document.createElement("canvas").getContext(contextType);
    66    program = context.createProgram();
     7}
     8
     9function linkProgram(vertexShaderIdentifier, fragmentShaderIdentifier) {
     10    function typeForScript(script) {
     11        if (script.type === "x-shader/x-vertex")
     12            return context.VERTEX_SHADER;
     13        if (script.type === "x-shader/x-fragment")
     14            return context.FRAGMENT_SHADER;
     15
     16        console.assert(false, "Unexpected script x-shader type: " + script.type);
     17    }
     18
     19    function createShaderFromScript(scriptIdentifier) {
     20        let script = document.getElementById(scriptIdentifier);
     21        let shader = context.createShader(typeForScript(script));
     22        context.attachShader(program, shader);
     23        context.shaderSource(shader, script.text);
     24        context.compileShader(shader);
     25    }
     26
     27    createShaderFromScript(vertexShaderIdentifier);
     28    createShaderFromScript(fragmentShaderIdentifier);
     29    context.linkProgram(program);
    730}
    831
  • trunk/LayoutTests/platform/win/TestExpectations

    r220233 r220294  
    19121912inspector/canvas/requestContent-webgl.html [ Skip ]
    19131913inspector/canvas/requestContent-webgl2.html [ Skip ]
     1914inspector/canvas/requestShaderSource.html [ Skip ]
    19141915inspector/canvas/resolveCanvasContext-webgl.html [ Skip ]
    19151916inspector/canvas/resolveCanvasContext-webgl2.html [ Skip ]
  • trunk/Source/JavaScriptCore/ChangeLog

    r220291 r220294  
     12017-08-04  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: add source view for WebGL shader programs
     4        https://bugs.webkit.org/show_bug.cgi?id=138593
     5        <rdar://problem/18936194>
     6
     7        Reviewed by Matt Baker.
     8
     9        * inspector/protocol/Canvas.json:
     10         - Add `ShaderType` enum that contains "vertex" and "fragment".
     11         - Add `requestShaderSource` command that will return the original source code for a given
     12           shader program and shader type.
     13
    1142017-08-03  Filip Pizlo  <fpizlo@apple.com>
    215
  • trunk/Source/JavaScriptCore/inspector/protocol/Canvas.json

    r220233 r220294  
    1919            "enum": ["canvas-2d", "webgl", "webgl2", "webgpu"],
    2020            "description": "The type of rendering context backing the canvas element."
     21        },
     22        {
     23            "id": "ShaderType",
     24            "type": "string",
     25            "enum": ["fragment", "vertex"],
     26            "description": "Shader type. WebGL supports vertex and fragment shaders."
    2127        },
    2228        {
     
    114120                { "name": "canvasId", "$ref": "CanvasId" }
    115121            ]
     122        },
     123        {
     124            "name": "requestShaderSource",
     125            "description": "",
     126            "parameters": [
     127                { "name": "programId", "$ref": "ProgramId" },
     128                { "name": "shaderType", "$ref": "ShaderType" }
     129            ],
     130            "returns": [
     131                { "name": "content", "type": "string" }
     132            ]
    116133        }
    117134    ],
  • trunk/Source/WebCore/ChangeLog

    r220293 r220294  
     12017-08-04  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: add source view for WebGL shader programs
     4        https://bugs.webkit.org/show_bug.cgi?id=138593
     5        <rdar://problem/18936194>
     6
     7        Reviewed by Matt Baker.
     8
     9        Test: inspector/canvas/requestShaderSource.html
     10
     11        * inspector/InspectorCanvasAgent.h:
     12        * inspector/InspectorCanvasAgent.cpp:
     13        (WebCore::InspectorCanvasAgent::requestShaderSource):
     14
     15        * inspector/InspectorShaderProgram.h:
     16        * inspector/InspectorShaderProgram.cpp:
     17        (WebCore::InspectorShaderProgram::shaderForType):
     18
    1192017-08-04  Matt Lewis  <jlewis3@apple.com>
    220
  • trunk/Source/WebCore/inspector/InspectorCanvasAgent.cpp

    r220233 r220294  
    4848#include "JSWebGLRenderingContext.h"
    4949#include "WebGLProgram.h"
     50#include "WebGLShader.h"
    5051#endif
    5152
     
    271272}
    272273
     274void InspectorCanvasAgent::requestShaderSource(ErrorString& errorString, const String& programId, const String& shaderType, String* content)
     275{
     276#if ENABLE(WEBGL)
     277    auto* inspectorProgram = assertInspectorProgram(errorString, programId);
     278    if (!inspectorProgram)
     279        return;
     280
     281    auto* shader = inspectorProgram->shaderForType(shaderType);
     282    if (!shader) {
     283        errorString = ASCIILiteral("No shader for given type.");
     284        return;
     285    }
     286
     287    *content = shader->getSource();
     288#else
     289    UNUSED_PARAM(programId);
     290    UNUSED_PARAM(shaderType);
     291    UNUSED_PARAM(content);
     292    errorString = ASCIILiteral("WebGL is not supported.");
     293#endif
     294}
     295
    273296void InspectorCanvasAgent::frameNavigated(Frame& frame)
    274297{
  • trunk/Source/WebCore/inspector/InspectorCanvasAgent.h

    r220233 r220294  
    7676    void requestRecording(ErrorString&, const String& canvasId, const bool* const singleFrame, const int* const memoryLimit) override;
    7777    void cancelRecording(ErrorString&, const String& canvasId) override;
     78    void requestShaderSource(ErrorString&, const String& programId, const String& shaderType, String*) override;
    7879
    7980    // InspectorInstrumentation
  • trunk/Source/WebCore/inspector/InspectorShaderProgram.cpp

    r220233 r220294  
    2727#include "InspectorShaderProgram.h"
    2828
     29#include "GraphicsContext3D.h"
     30#include "GraphicsTypes3D.h"
    2931#include "HTMLCanvasElement.h"
    3032#include "InspectorCanvas.h"
    3133#include "WebGLProgram.h"
    3234#include "WebGLRenderingContextBase.h"
     35#include "WebGLShader.h"
    3336#include <inspector/IdentifiersFactory.h>
    3437
     
    5659}
    5760
     61WebGLShader* InspectorShaderProgram::shaderForType(const String& protocolType)
     62{
     63    GC3Denum shaderType;
     64    if (protocolType == "vertex")
     65        shaderType = GraphicsContext3D::VERTEX_SHADER;
     66    else if (protocolType == "fragment")
     67        shaderType = GraphicsContext3D::FRAGMENT_SHADER;
     68    else
     69        return nullptr;
     70
     71    return m_program.getAttachedShader(shaderType);
     72}
     73
    5874} // namespace WebCore
    5975
  • trunk/Source/WebCore/inspector/InspectorShaderProgram.h

    r220233 r220294  
    3434class WebGLProgram;
    3535class WebGLRenderingContextBase;
     36class WebGLShader;
    3637
    3738typedef String ErrorString;
     
    4546    WebGLRenderingContextBase* context() const;
    4647    WebGLProgram& program() const { return m_program; }
     48    WebGLShader* shaderForType(const String&);
    4749
    4850    ~InspectorShaderProgram() { }
  • trunk/Source/WebInspectorUI/ChangeLog

    r220251 r220294  
     12017-08-04  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: add source view for WebGL shader programs
     4        https://bugs.webkit.org/show_bug.cgi?id=138593
     5        <rdar://problem/18936194>
     6
     7        Reviewed by Matt Baker.
     8
     9        Shader programs are now listed in the Resources sidebar as items within the owner Canvas
     10        context. When selected, the shown content view has two editors, one for the Vertex shader
     11        and one for the Fragment shader. These editors use CodeMirror's "clike" mode for GLSL syntax.
     12
     13        * Localizations/en.lproj/localizedStrings.js:
     14        * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
     15        * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
     16        * UserInterface/Main.html:
     17
     18        * UserInterface/Controllers/CanvasManager.js:
     19        (WI.CanvasManager):
     20        (WI.CanvasManager.prototype.canvasRemoved):
     21        (WI.CanvasManager.prototype.programCreated):
     22        (WI.CanvasManager.prototype.programDeleted):
     23        (WI.CanvasManager.prototype._mainResourceDidChange):
     24
     25        * UserInterface/Models/Collection.js:
     26        * UserInterface/Models/Canvas.js:
     27        (WI.Canvas.prototype.get shaderProgramCollection)
     28
     29        * UserInterface/Models/ShaderProgram.js:
     30        (WI.ShaderProgram.prototype.requestVertexShaderSource):
     31        (WI.ShaderProgram.prototype.requestFragmentShaderSource):
     32        (WI.ShaderProgram.prototype._requestShaderSource):
     33
     34        * UserInterface/Views/CanvasTreeElement.js:
     35        (WI.CanvasTreeElement):
     36        (WI.CanvasTreeElement.prototype.onattach):
     37        (WI.CanvasTreeElement.prototype.ondetach):
     38        (WI.CanvasTreeElement.prototype.onpopulate):
     39        (WI.CanvasTreeElement.prototype._shaderProgramAdded):
     40        (WI.CanvasTreeElement.prototype._shaderProgramRemoved):
     41
     42        * UserInterface/Views/ShaderProgramTreeElement.js: Added.
     43        (WI.ShaderProgramTreeElement):
     44
     45        * UserInterface/Views/ShaderProgramContentView.js: Added.
     46        (WI.ShaderProgramContentView):
     47        (WI.ShaderProgramContentView.prototype.shown):
     48        (WI.ShaderProgramContentView.prototype.hidden):
     49        (WI.ShaderProgramContentView.prototype.closed):
     50        (WI.ShaderProgramContentView.prototype.get supportsSave):
     51        (WI.ShaderProgramContentView.prototype.get saveData):
     52        (WI.ShaderProgramContentView.prototype.get supportsSearch):
     53        (WI.ShaderProgramContentView.prototype.get numberOfSearchResults):
     54        (WI.ShaderProgramContentView.prototype.get hasPerformedSearch):
     55        (WI.ShaderProgramContentView.prototype.set automaticallyRevealFirstSearchResult):
     56        (WI.ShaderProgramContentView.prototype.performSearch):
     57        (WI.ShaderProgramContentView.prototype.searchCleared):
     58        (WI.ShaderProgramContentView.prototype.searchQueryWithSelection):
     59        (WI.ShaderProgramContentView.prototype.revealPreviousSearchResult):
     60        (WI.ShaderProgramContentView.prototype.revealNextSearchResult):
     61        (WI.ShaderProgramContentView.prototype.revealPosition):
     62        (WI.ShaderProgramContentView.prototype._editorFocused):
     63        (WI.ShaderProgramContentView.prototype._numberOfSearchResultsDidChange):
     64        * UserInterface/Views/ShaderProgramContentView.css: Added.
     65        (.content-view.shader-program > .text-editor.shader):
     66        (body[dir=ltr] .content-view.shader-program > .text-editor.shader.vertex,):
     67        (body[dir=ltr] .content-view.shader-program > .text-editor.shader.fragment,):
     68        (body[dir=ltr] .content-view.shader-program > .text-editor.shader + .text-editor.shader):
     69        (body[dir=rtl] .content-view.shader-program > .text-editor.shader + .text-editor.shader):
     70        (.content-view.shader-program > .text-editor.shader > .type-title):
     71        (.content-view.shader-program > .text-editor.shader > .CodeMirror):
     72
     73        * UserInterface/Images/DocumentGL.png: Added.
     74        * UserInterface/Images/DocumentGL@2x.png: Added.
     75        * UserInterface/Views/ResourceIcons.css:
     76        (.shader-program .icon):
     77
     78        * UserInterface/Base/Main.js:
     79        * UserInterface/Views/ContentView.js:
     80        (WI.ContentView.createFromRepresentedObject):
     81        (WI.ContentView.isViewable):
     82        * UserInterface/Views/ResourceSidebarPanel.js:
     83        (WI.ResourceSidebarPanel.prototype.matchTreeElementAgainstCustomFilters.match):
     84        (WI.ResourceSidebarPanel.prototype.matchTreeElementAgainstCustomFilters):
     85        (WI.ResourceSidebarPanel.prototype._treeSelectionDidChange):
     86        * UserInterface/Views/ResourcesTabContentView.js:
     87        (WI.ResourcesTabContentView.prototype.canShowRepresentedObject):
     88        Plumbing for displaying ShaderProgram content.
     89
     90        * UserInterface/Views/TextEditor.js:
     91        (WebInspector.TextEditor):
     92        (WebInspector.TextEditor.prototype._editorFocused):
     93
     94        * Scripts/update-codemirror-resources.rb:
     95        * UserInterface/External/CodeMirror/clike.js: Added.
     96        Add C-like mode for highlighting GLSL.
     97
    1982017-08-03  Joseph Pecoraro  <pecoraro@apple.com>
    299
  • trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

    r220188 r220294  
    422422localizedStrings["Forward (%s)"] = "Forward (%s)";
    423423localizedStrings["Fragment"] = "Fragment";
     424localizedStrings["Fragment Shader"] = "Fragment Shader";
    424425localizedStrings["Frame %d"] = "Frame %d";
    425426localizedStrings["Frame URL"] = "Frame URL";
     
    665666localizedStrings["Probes"] = "Probes";
    666667localizedStrings["Processing Instruction"] = "Processing Instruction";
     668localizedStrings["Program %d"] = "Program %d";
    667669localizedStrings["Properties"] = "Properties";
    668670localizedStrings["Property"] = "Property";
     
    774776localizedStrings["Setter"] = "Setter";
    775777localizedStrings["Settings"] = "Settings";
     778localizedStrings["Shader"] = "Shader";
     779localizedStrings["Shader Programs"] = "Shader Programs";
    776780localizedStrings["Shadow"] = "Shadow";
    777781localizedStrings["Shadow Content"] = "Shadow Content";
     
    931935localizedStrings["Variants"] = "Variants";
    932936localizedStrings["Version"] = "Version";
     937localizedStrings["Vertex"] = "Vertex";
     938localizedStrings["Vertex Shader"] = "Vertex Shader";
    933939localizedStrings["Vertical"] = "Vertical";
    934940localizedStrings["View variable value"] = "View variable value";
  • trunk/Source/WebInspectorUI/Scripts/update-codemirror-resources.rb

    r210032 r220294  
    4242  lib/codemirror.css
    4343  lib/codemirror.js
     44  mode/clike/clike.js
    4445  mode/clojure/clojure.js
    4546  mode/coffeescript/coffeescript.js
  • trunk/Source/WebInspectorUI/UserInterface/Base/Main.js

    r220235 r220294  
    10711071        || representedObject instanceof WI.Script
    10721072        || representedObject instanceof WI.CSSStyleSheet
    1073         || representedObject instanceof WI.Canvas)
     1073        || representedObject instanceof WI.Canvas
     1074        || representedObject instanceof WI.ShaderProgram)
    10741075        return WI.ResourcesTabContentView;
    10751076
  • trunk/Source/WebInspectorUI/UserInterface/Controllers/CanvasManager.js

    r220233 r220294  
    3434        this._canvasIdentifierMap = new Map;
    3535        this._shaderProgramIdentifierMap = new Map;
    36         this._canvasShaderProgramMap = new Map;
    3736
    3837        if (window.CanvasAgent)
     
    7574            return;
    7675
    77         let programs = this._canvasShaderProgramMap.take(canvas);
    78         if (programs) {
    79             for (let program of programs) {
    80                 this._shaderProgramIdentifierMap.delete(program.identifier);
    81                 this._dispatchShaderProgramRemoved(program);
    82             }
     76        for (let program of canvas.shaderProgramCollection.items) {
     77            this._shaderProgramIdentifierMap.delete(program.identifier);
     78            this._dispatchShaderProgramRemoved(program);
    8379        }
    8480
     
    141137        this._shaderProgramIdentifierMap.set(program.identifier, program);
    142138
    143         let programs = this._canvasShaderProgramMap.get(canvas);
    144         if (!programs) {
    145             programs = [];
    146             this._canvasShaderProgramMap.set(canvas, programs);
    147         }
    148 
    149         programs.push(program);
     139        canvas.shaderProgramCollection.add(program);
    150140
    151141        this.dispatchEventToListeners(WI.CanvasManager.Event.ShaderProgramAdded, {program});
     
    161151            return;
    162152
    163         let programs = this._canvasShaderProgramMap.get(program.canvas);
    164 
    165         programs.remove(program);
    166 
    167         if (!programs.length)
    168             this._canvasShaderProgramMap.delete(program.canvas);
     153        program.canvas.shaderProgramCollection.remove(program);
    169154
    170155        this._dispatchShaderProgramRemoved(program);
     
    182167
    183168        this._shaderProgramIdentifierMap.clear();
    184         this._canvasShaderProgramMap.clear();
    185169
    186170        if (this._canvasIdentifierMap.size) {
  • trunk/Source/WebInspectorUI/UserInterface/Main.html

    r220233 r220294  
    164164    <link rel="stylesheet" href="Views/SearchSidebarPanel.css">
    165165    <link rel="stylesheet" href="Views/SettingsTabContentView.css">
     166    <link rel="stylesheet" href="Views/ShaderProgramContentView.css">
    166167    <link rel="stylesheet" href="Views/Sidebar.css">
    167168    <link rel="stylesheet" href="Views/SidebarPanel.css">
     
    227228    <script src="External/CodeMirror/codemirror.js"></script>
    228229
     230    <script src="External/CodeMirror/clike.js"></script>
    229231    <script src="External/CodeMirror/clojure.js"></script>
    230232    <script src="External/CodeMirror/closebrackets.js"></script>
     
    684686    <script src="Views/SearchResultTreeElement.js"></script>
    685687    <script src="Views/SearchSidebarPanel.js"></script>
     688    <script src="Views/ShaderProgramContentView.js"></script>
     689    <script src="Views/ShaderProgramTreeElement.js"></script>
    686690    <script src="Views/Sidebar.js"></script>
    687691    <script src="Views/Slider.js"></script>
  • trunk/Source/WebInspectorUI/UserInterface/Models/Canvas.js

    r220233 r220294  
    4343
    4444        this._cssCanvasClientNodes = null;
     45        this._shaderProgramCollection = new WI.Collection(WI.Collection.TypeVerifier.ShaderProgram);
    4546
    4647        this._nextShaderProgramDisplayNumber = 1;
     
    106107    get cssCanvasName() { return this._cssCanvasName; }
    107108    get contextAttributes() { return this._contextAttributes; }
     109    get shaderProgramCollection() { return this._shaderProgramCollection; }
    108110
    109111    get memoryCost()
  • trunk/Source/WebInspectorUI/UserInterface/Models/Collection.js

    r220119 r220294  
    119119    CSSStyleSheet: (object) => object instanceof WI.CSSStyleSheet,
    120120    Canvas: (object) => object instanceof WI.Canvas,
     121    ShaderProgram: (object) => object instanceof WI.ShaderProgram,
    121122};
  • trunk/Source/WebInspectorUI/UserInterface/Models/ShaderProgram.js

    r220233 r220294  
    4747        return WI.UIString("Program %d").format(this._uniqueDisplayNumber);
    4848    }
     49
     50    requestVertexShaderSource(callback)
     51    {
     52        this._requestShaderSource(CanvasAgent.ShaderType.Vertex, callback);
     53    }
     54
     55    requestFragmentShaderSource(callback)
     56    {
     57        this._requestShaderSource(CanvasAgent.ShaderType.Fragment, callback);
     58    }
     59
     60    // Private
     61
     62    _requestShaderSource(shaderType, callback)
     63    {
     64        CanvasAgent.requestShaderSource(this._identifier, shaderType, (error, content) => {
     65            if (error) {
     66                callback(null);
     67                return;
     68            }
     69
     70            callback(content);
     71        });
     72    }
     73};
     74
     75WI.ShaderProgram.ShaderType = {
     76    Fragment: "shader-type-fragment",
     77    Vertex: "shader-type-vertex",
    4978};
    5079
  • trunk/Source/WebInspectorUI/UserInterface/Views/CanvasTreeElement.js

    r220119 r220294  
    2424 */
    2525
    26 WI.CanvasTreeElement = class CanvasTreeElement extends WI.GeneralTreeElement
     26WI.CanvasTreeElement = class CanvasTreeElement extends WI.FolderizedTreeElement
    2727{
    2828    constructor(representedObject)
     
    3232        const subtitle = null;
    3333        super(["canvas", representedObject.contextType], representedObject.displayName, subtitle, representedObject);
     34
     35        this.registerFolderizeSettings("shader-programs", WI.UIString("Shader Programs"), this.representedObject.shaderProgramCollection, WI.ShaderProgramTreeElement);
    3436    }
    3537
     
    4042        super.onattach();
    4143
     44        this.representedObject.shaderProgramCollection.addEventListener(WI.Collection.Event.ItemAdded, this._shaderProgramAdded, this);
     45        this.representedObject.shaderProgramCollection.addEventListener(WI.Collection.Event.ItemRemoved, this._shaderProgramRemoved, this);
     46
    4247        this.element.addEventListener("mouseover", this._handleMouseOver.bind(this));
    4348        this.element.addEventListener("mouseout", this._handleMouseOut.bind(this));
     49
     50        this.onpopulate();
     51    }
     52
     53    ondetach()
     54    {
     55        this.representedObject.shaderProgramCollection.removeEventListener(WI.Collection.Event.ItemAdded, this._shaderProgramAdded, this);
     56        this.representedObject.shaderProgramCollection.removeEventListener(WI.Collection.Event.ItemRemoved, this._shaderProgramRemoved, this);
     57
     58        super.ondetach();
     59    }
     60
     61    onpopulate()
     62    {
     63        super.onpopulate();
     64
     65        if (this.children.length && !this.shouldRefreshChildren)
     66            return;
     67
     68        this.shouldRefreshChildren = false;
     69
     70        this.removeChildren();
     71
     72        for (let program of this.representedObject.shaderProgramCollection.items)
     73            this.addChildForRepresentedObject(program);
    4474    }
    4575
     
    6494    // Private
    6595
     96    _shaderProgramAdded(event)
     97    {
     98        this.addRepresentedObjectToNewChildQueue(event.data.item);
     99    }
     100
     101    _shaderProgramRemoved(event)
     102    {
     103        this.removeChildForRepresentedObject(event.data.item);
     104    }
     105
    66106    _handleMouseOver(event)
    67107    {
  • trunk/Source/WebInspectorUI/UserInterface/Views/ContentView.js

    r220119 r220294  
    6161            return new WI.CanvasContentView(representedObject, extraArguments);
    6262
     63        if (representedObject instanceof WI.ShaderProgram)
     64            return new WI.ShaderProgramContentView(representedObject, extraArguments);
     65
    6366        if (representedObject instanceof WI.TimelineRecording)
    6467            return new WI.TimelineRecordingContentView(representedObject, extraArguments);
     
    248251        if (representedObject instanceof WI.Canvas)
    249252            return true;
     253        if (representedObject instanceof WI.ShaderProgram)
     254            return true;
    250255        if (representedObject instanceof WI.TimelineRecording)
    251256            return true;
  • trunk/Source/WebInspectorUI/UserInterface/Views/ResourceIcons.css

    r219180 r220294  
    8080}
    8181
     82.shader-program .icon {
     83    content: image-set(url(../Images/DocumentGL.png) 1x, url(../Images/DocumentGL@2x.png) 2x);
     84}
     85
    8286.large .resource-icon .icon {
    8387    content: image-set(url(../Images/DocumentGenericLarge.png) 1x, url(../Images/DocumentGenericLarge@2x.png) 2x);
  • trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.js

    r220251 r220294  
    239239                return selectedScopeBarItem[WI.ResourceSidebarPanel.ResourceTypeSymbol] === WI.Resource.Type.Script;
    240240
    241             if (treeElement instanceof WI.CanvasTreeElement)
     241            if (treeElement instanceof WI.CanvasTreeElement || treeElement instanceof WI.ShaderProgramTreeElement)
    242242                return selectedScopeBarItem[WI.ResourceSidebarPanel.ResourceTypeSymbol] === WI.Canvas.ResourceSidebarType;
    243243
     
    469469            || treeElement instanceof WI.CSSStyleSheetTreeElement
    470470            || treeElement instanceof WI.ContentFlowTreeElement
    471             || treeElement instanceof WI.CanvasTreeElement) {
     471            || treeElement instanceof WI.CanvasTreeElement
     472            || treeElement instanceof WI.ShaderProgramTreeElement) {
    472473            const cookie = null;
    473474            const options = {
  • trunk/Source/WebInspectorUI/UserInterface/Views/ResourcesTabContentView.js

    r220119 r220294  
    7171            || representedObject instanceof WI.ContentFlow
    7272            || representedObject instanceof WI.Canvas
     73            || representedObject instanceof WI.ShaderProgram
    7374            || representedObject instanceof WI.Collection;
    7475    }
  • trunk/Source/WebInspectorUI/UserInterface/Views/ShaderProgramContentView.css

    r220293 r220294  
    2424 */
    2525
    26 WI.ShaderProgram = class ShaderProgram extends WI.Object
    27 {
    28     constructor(identifier, canvas)
    29     {
    30         super();
     26.content-view.shader-program > .text-editor.shader {
     27    position: absolute;
     28    top: 0;
     29    bottom: 0;
    3130
    32         console.assert(identifier);
    33         console.assert(canvas instanceof WI.Canvas);
     31    --border-start-style: 1px solid lightgrey;;
     32}
    3433
    35         this._identifier = identifier;
    36         this._canvas = canvas;
    37         this._uniqueDisplayNumber = canvas.nextShaderProgramDisplayNumber();
    38     }
     34body[dir=ltr] .content-view.shader-program > .text-editor.shader.vertex,
     35body[dir=rtl] .content-view.shader-program > .text-editor.shader.fragment {
     36    width: calc(50% - 1px);
     37    left: 0;
     38}
    3939
    40     // Public
     40body[dir=ltr] .content-view.shader-program > .text-editor.shader.fragment,
     41body[dir=rtl] .content-view.shader-program > .text-editor.shader.vertex {
     42    width: calc(50% + 1px);
     43    right: 0;
     44}
    4145
    42     get identifier() { return this._identifier; }
    43     get canvas() { return this._canvas; }
     46body[dir=ltr] .content-view.shader-program > .text-editor.shader + .text-editor.shader {
     47    border-left: var(--border-start-style);
     48}
    4449
    45     get displayName()
    46     {
    47         return WI.UIString("Program %d").format(this._uniqueDisplayNumber);
    48     }
    49 };
     50body[dir=rtl] .content-view.shader-program > .text-editor.shader + .text-editor.shader {
     51    border-right: var(--border-start-style);
     52}
    5053
    51 WI.ShaderProgram.Event = {
    52     ProgramLinked: "shader-program-program-linked",
    53     ShaderCompiled: "shader-program-shader-compiled",
    54 };
     54.content-view.shader-program > .text-editor.shader > .type-title {
     55    padding: 2px 4px;
     56    background-color: hsl(0, 0%, 95%);
     57    border-bottom: 1px solid lightgrey;
     58}
     59
     60.content-view.shader-program > .text-editor.shader > .CodeMirror {
     61    top: 18px;
     62}
  • trunk/Source/WebInspectorUI/UserInterface/Views/ShaderProgramTreeElement.js

    r220293 r220294  
    2424 */
    2525
    26 WI.ShaderProgram = class ShaderProgram extends WI.Object
     26WI.ShaderProgramTreeElement = class ShaderProgramTreeElement extends WI.GeneralTreeElement
    2727{
    28     constructor(identifier, canvas)
     28    constructor(shaderProgram)
    2929    {
    30         super();
     30        console.assert(shaderProgram instanceof WI.ShaderProgram);
    3131
    32         console.assert(identifier);
    33         console.assert(canvas instanceof WI.Canvas);
    34 
    35         this._identifier = identifier;
    36         this._canvas = canvas;
    37         this._uniqueDisplayNumber = canvas.nextShaderProgramDisplayNumber();
    38     }
    39 
    40     // Public
    41 
    42     get identifier() { return this._identifier; }
    43     get canvas() { return this._canvas; }
    44 
    45     get displayName()
    46     {
    47         return WI.UIString("Program %d").format(this._uniqueDisplayNumber);
     32        const subtitle = null;
     33        super("shader-program", shaderProgram.displayName, subtitle, shaderProgram);
    4834    }
    4935};
    50 
    51 WI.ShaderProgram.Event = {
    52     ProgramLinked: "shader-program-program-linked",
    53     ShaderCompiled: "shader-program-shader-compiled",
    54 };
  • trunk/Source/WebInspectorUI/UserInterface/Views/TextEditor.js

    r220119 r220294  
    6565        });
    6666
     67        this._codeMirror.on("focus", this._editorFocused.bind(this));
    6768        this._codeMirror.on("change", this._contentChanged.bind(this));
    6869        this._codeMirror.on("gutterClick", this._gutterMouseDown.bind(this));
     
    969970    {
    970971        return !this._codeMirror.isClean();
     972    }
     973
     974    _editorFocused(codeMirror)
     975    {
     976        this.dispatchEventToListeners(WI.TextEditor.Event.Focused);
    971977    }
    972978
     
    16571663
    16581664WI.TextEditor.Event = {
     1665    Focused: "text-editor-focused",
    16591666    ExecutionLineNumberDidChange: "text-editor-execution-line-number-did-change",
    16601667    NumberOfSearchResultsDidChange: "text-editor-number-of-search-results-did-change",
  • trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj

    r217924 r220294  
    415415    <None Include="..\UserInterface\ExecutionContext.js" />
    416416    <None Include="..\UserInterface\ExecutionContextList.js" />
     417    <None Include="..\UserInterface\External\CodeMirror\clike.js" />
    417418    <None Include="..\UserInterface\External\CodeMirror\clojure.js" />
    418419    <None Include="..\UserInterface\External\CodeMirror\closebrackets.js" />
  • trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters

    r217924 r220294  
    10661066      <Filter>UserInterface</Filter>
    10671067    </None>
     1068    <None Include="..\UserInterface\External\CodeMirror\clike.js">
     1069      <Filter>UserInterface\External\CodeMirror</Filter>
     1070    </None>
    10681071    <None Include="..\UserInterface\External\CodeMirror\clojure.js">
    10691072      <Filter>UserInterface\External\CodeMirror</Filter>
Note: See TracChangeset for help on using the changeset viewer.