Skip to content

Commit d1988c6

Browse files
lanly-devlanly-dev
committed
webview.js
1 parent 4bdd8a7 commit d1988c6

File tree

5 files changed

+100
-41
lines changed

5 files changed

+100
-41
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"views": {
1818
"explorer": [
1919
{
20-
"id": "spec",
20+
"id": "spec-explorer",
2121
"name": "Spec Explorer"
2222
}
2323
]

‎src/extension.js‎

Lines changed: 5 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,26 @@
11
'use strict'
22
const vscode = require('vscode')
33
const tv = require('./treeview')
4-
const pug = require('pug')
4+
const wv = require('./webview')
55
const path = require('path')
6-
const jquery_path = require.resolve('jquery')
7-
const semjs_path = require.resolve('semantic-ui-css')
8-
const semcss_path = require.resolve('semantic-ui-css/semantic.min.css')
96

107
/**
118
* @param {vscode.ExtensionContext} context
129
*/
1310
function activate(context) {
1411
vscode.window.showInformationMessage('Hello World!')
15-
// let files = vscode.workspace.findFiles('**/*', null, 100)
16-
// files.then(data => console.log(data), error => console.error(error))
1712

1813
const specTV = new tv.Treeview(context)
1914

20-
// vscode.workspace.onDidChangeConfiguration()
21-
22-
const compiledFunction = pug.compileFile(`${__dirname}\\index.pug`)
23-
24-
const wv = vscode.window.createWebviewPanel('something', 'Cat Coding', vscode.ViewColumn.One, {
25-
// Enable javascript in the webview
26-
enableScripts: true
27-
// And restric the webview to only loading content from our extension's `media` directory.
28-
// localResourceRoots: [vscode.Uri.file(path.join(extensionPath, 'media'))]
29-
})
30-
31-
specTV.specViewer.onDidChangeSelection(file => {
15+
specTV.specExplorer.onDidChangeSelection(file => {
3216
const fullFilePath = file.selection[0].fullFilePath
17+
console.log(fullFilePath)
3318
if (fullFilePath.indexOf('.mp3') != -1) {
3419
const song_path = vscode.Uri.file(fullFilePath).with({ scheme: 'vscode-resource' })
35-
wv.webview.postMessage(`${song_path}`)
20+
wv.SpecWebviewPanel.createOrShow(context.extensionPath)
21+
wv.SpecWebviewPanel.currentPanel.panel.postMessage(`${song_path}`)
3622
}
3723
})
38-
39-
const song_path = vscode.Uri.file(path.join(context.extensionPath, 'beat.mp3')).with({ scheme: 'vscode-resource' })
40-
const bundle_uri = vscode.Uri.file(path.join(context.extensionPath, 'src', 'bundle.js')).with({ scheme: 'vscode-resource' })
41-
const ctmcss_uri = vscode.Uri.file(path.join(context.extensionPath, 'src', 'custom.css')).with({ scheme: 'vscode-resource' })
42-
const semjs_uri = vscode.Uri.file(semjs_path).with({ scheme: 'vscode-resource' })
43-
const semcss_uri = vscode.Uri.file(semcss_path).with({ scheme: 'vscode-resource' })
44-
const jquery_uri = vscode.Uri.file(jquery_path).with({ scheme: 'vscode-resource' })
45-
46-
wv.webview.html = compiledFunction({
47-
bundle_uri: bundle_uri,
48-
jquery_uri: jquery_uri,
49-
semjs_uri: semjs_uri,
50-
semcss_uri: semcss_uri,
51-
ctmcss_uri: ctmcss_uri,
52-
song_path: song_path,
53-
nonce: '123'
54-
})
5524
}
5625
exports.activate = activate
5726

‎src/index.pug‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@ html
33
title Spec
44
meta(charset='UTF-8')
55
meta(http-equiv='Content-Security-Policy',
6-
content=`default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}'; style-src 'nonce-${nonce}' https:; font-src data: vscode-resource: https:; worker-src blob:; connect-src vscode-resource: ws:`)
6+
content=`default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}';\
7+
style-src 'nonce-${nonce}' https:; font-src data: vscode-resource: https:; worker-src blob:;\
8+
connect-src vscode-resource: ws:`)
79
meta(name='viewport', content='width=device-width, initial-scale=1.0')
810
script(nonce=`${nonce}`).
911
rootPath = '#{song_path}'

‎src/treeview.js‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ const fs = require('fs')
55

66
class Treeview {
77
constructor(context) {
8-
const treeDataProvider = new SpecTreeDataProvider(vscode.workspace.rootPath)
9-
context.subscriptions.push(vscode.workspace.registerTextDocumentContentProvider('spec', treeDataProvider))
10-
this.specViewer = vscode.window.createTreeView('spec', { treeDataProvider })
8+
const specTreeDataProvider = new SpecTreeDataProvider(vscode.workspace.rootPath)
9+
context.subscriptions.push(vscode.workspace.registerTextDocumentContentProvider('spec', specTreeDataProvider))
10+
this.specExplorer = vscode.window.createTreeView('spec-explorer', { treeDataProvider: specTreeDataProvider, showCollapseAll: true })
1111
}
1212
}
1313

@@ -39,6 +39,11 @@ class SpecTreeDataProvider {
3939
}
4040
}
4141

42+
// ??
43+
provideTextDocumentContent(uri, token) {
44+
return uri+token
45+
}
46+
4247
getFiles(thePath) {
4348
const toFileItem = (name, path, type) => {
4449
if (type == 'directory') {

‎src/webview.js‎

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
'use strict'
2+
const path = require('path')
3+
const pug = require('pug')
4+
const vscode = require('vscode')
5+
6+
class SpecWebviewPanel {
7+
constructor(panel, extensionPath) {
8+
this.disposables = []
9+
this.panel = panel
10+
this.extensionPath = extensionPath
11+
12+
this.panel.onDidDispose(() => this.dispose(), null, this.disposables)
13+
this.panel.onDidChangeViewState(event => {}, null, this.disposables)
14+
this.panel.webview.onDidReceiveMessage(message => {}, null, this.disposables)
15+
this.panel.webview.html = this.getHtmlForWebview(extensionPath)
16+
}
17+
18+
static createOrShow(extensionPath) {
19+
const column = vscode.window.activeTextEditor ? vscode.window.activeTextEditor.viewColumn : undefined
20+
21+
// If we already have a panel, show it.
22+
if (SpecWebviewPanel.currentPanel) {
23+
SpecWebviewPanel.currentPanel.panel.reveal(column)
24+
return
25+
}
26+
27+
const panel = vscode.window.createWebviewPanel(SpecWebviewPanel.viewType, 'Spec', column || vscode.ViewColumn.One, {
28+
enableScripts: true,
29+
// localResourceRoots: [vscode.Uri.file(path.join(extensionPath, 'media'))]
30+
})
31+
SpecWebviewPanel.currentPanel = new SpecWebviewPanel(panel, extensionPath)
32+
}
33+
34+
static revive(panel, extensionPath) {
35+
SpecWebviewPanel.currentPanel = new SpecWebviewPanel(panel, extensionPath)
36+
}
37+
38+
dispose() {
39+
SpecWebviewPanel.currentPanel = undefined
40+
41+
this.panel.dispose()
42+
while (this.disposables.length) {
43+
const x = this.disposables.pop()
44+
if (x) x.dispose()
45+
}
46+
}
47+
48+
getHtmlForWebview(extensionPath) {
49+
const jquery_path = require.resolve('jquery')
50+
const semjs_path = require.resolve('semantic-ui-css')
51+
const semcss_path = require.resolve('semantic-ui-css/semantic.min.css')
52+
53+
const bundle_uri = vscode.Uri.file(path.join(extensionPath, 'src', 'bundle.js')).with({ scheme: 'vscode-resource' })
54+
const ctmcss_uri = vscode.Uri.file(path.join(extensionPath, 'src', 'custom.css')).with({ scheme: 'vscode-resource' })
55+
const semjs_uri = vscode.Uri.file(semjs_path).with({ scheme: 'vscode-resource' })
56+
const semcss_uri = vscode.Uri.file(semcss_path).with({ scheme: 'vscode-resource' })
57+
const jquery_uri = vscode.Uri.file(jquery_path).with({ scheme: 'vscode-resource' })
58+
const compiledFunction = pug.compileFile(`${__dirname}\\index.pug`)
59+
60+
return compiledFunction({
61+
bundle_uri: bundle_uri,
62+
jquery_uri: jquery_uri,
63+
semjs_uri: semjs_uri,
64+
semcss_uri: semcss_uri,
65+
ctmcss_uri: ctmcss_uri,
66+
nonce: getNonce()
67+
})
68+
}
69+
}
70+
71+
SpecWebviewPanel.currentPanel = undefined
72+
SpecWebviewPanel.viewType = 'spec'
73+
74+
function getNonce() {
75+
let text = ''
76+
const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
77+
for (let i = 0; i < 32; i++) {
78+
text += possible.charAt(Math.floor(Math.random() * possible.length))
79+
}
80+
return text
81+
}
82+
83+
exports.SpecWebviewPanel = SpecWebviewPanel

0 commit comments

Comments
 (0)