Skip to content

Commit a087398

Browse files
dencodenco
committed
add simple css, fix simple link
1 parent 3818e14 commit a087398

File tree

3 files changed

+97
-17
lines changed

3 files changed

+97
-17
lines changed

‎resources/css/confluence.css‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
body {
2+
font-family: "Segoe WPC", "Segoe UI", "SFUIText-Light", "HelveticaNeue-Light", sans-serif, "Droid Sans Fallback";
3+
font-size: 14px;
4+
padding: 0 26px;
5+
line-height: 1em;
6+
word-wrap: break-word;
7+
}
8+
9+
img {
10+
max-width: 100%;
11+
max-height: 100%;
12+
}
13+
14+
a {
15+
color: #4080D0;
16+
text-decoration: none;
17+
}
18+
19+
a:focus,
20+
input:focus,
21+
select:focus,
22+
textarea:focus {
23+
outline: 1px solid -webkit-focus-ring-color;
24+
outline-offset: -1px;
25+
}
26+
27+
hr {
28+
border: 0;
29+
height: 2px;
30+
border-bottom: 2px solid;
31+
}
32+
33+
h1 {
34+
padding-bottom: 0.3em;
35+
line-height: 1.2;
36+
border-bottom-width: 1px;
37+
border-bottom-style: solid;
38+
}
39+
40+
h1, h2, h3 {
41+
font-weight: normal;
42+
}
43+
44+
blockquote {
45+
margin: 0 7px 0 5px;
46+
padding: 0 16px 0 10px;
47+
border-left: 5px solid;
48+
}
49+
50+
pre > code {
51+
display: inline-block;
52+
width: 90%;
53+
color: white;
54+
margin: 0px 5px;
55+
font-size: 14px;
56+
font-family: Menlo, Monaco, Consolas, "Droid Sans Mono", "Courier New", monospace, "Droid Sans Fallback";
57+
background-color:black;
58+
cursor: pointer;
59+
padding: 5px 1em;
60+
box-shadow: 1px 1px 1px rgba(0,0,0,.25);
61+
line-height: 1.5em;
62+
}

‎src/ConfluenceContentProvider.ts‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
// Import the module and reference it with the alias vscode in your code below
44
import * as vscode from 'vscode';
55

6-
import { parseMarkup } from './markupParser';
6+
import { parseMarkup, cssUri } from './markupParser';
77

88
export function packConfluenceUri(uri: vscode.Uri) {
99
// Temporarily change the URI scheme
@@ -36,14 +36,16 @@ export class ConfluenceContentProvider implements vscode.TextDocumentContentProv
3636

3737
public async provideTextDocumentContent(uri: vscode.Uri): Promise<string> {
3838
let document = await vscode.workspace.openTextDocument(unpackConfluenceUri(uri));
39-
let body = await parseMarkup(document.getText(), unpackConfluenceUri(uri));
39+
let body = await parseMarkup(unpackConfluenceUri(uri), document.getText());
40+
let cssLink = cssUri("confluence.css");
4041

4142
return `<!DOCTYPE html>
4243
<html>
4344
<head>
4445
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
46+
<link rel="stylesheet" href="${cssLink}">
4547
</head>
46-
<body class="vscode-body">
48+
<body>
4749
${body}
4850
</body>
4951
</html>`;

‎src/markupParser.ts‎

Lines changed: 30 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
// Import the module and reference it with the alias vscode in your code below
44
import * as vscode from 'vscode';
55
import * as path from 'path';
6-
import { open } from 'fs';
76

87
const EXTENTION_ID = 'denco.confluence-markup';
98
const EMOTICON_PATH = '/resources/emoticons/';
9+
const CSS_PATH = '/resources/css/';
1010

1111
function imageUri(searchUri: vscode.Uri, imageLink: string) {
1212
let imageUri
@@ -25,7 +25,13 @@ function emoticonUri(emoticonFile: string) {
2525
return emoticonUri;
2626
}
2727

28-
export async function parseMarkup(sourceText: string, sourceUri: vscode.Uri) {
28+
export function cssUri(cssFile: string) {
29+
let extPath = vscode.extensions.getExtension(EXTENTION_ID).extensionPath;
30+
let cssUri = vscode.Uri.file(path.join(extPath, CSS_PATH, cssFile));
31+
return cssUri;
32+
}
33+
34+
export async function parseMarkup(sourceUri: vscode.Uri, sourceText: string) {
2935
//TODO: use Tokenazer instead of line loop
3036

3137
var result = '';
@@ -65,7 +71,13 @@ export async function parseMarkup(sourceText: string, sourceUri: vscode.Uri) {
6571
tag = tag.replace(/\(x\)/g, '<img alt="(cross)" src="' + emoticonUri('error.png') + '"/>');
6672
tag = tag.replace(/\(!\)/g, '<img alt="(warning)" src="' + emoticonUri('warning.png') + '"/>');
6773

68-
tag = tag.replace(/\[([^|]*)?\|?([^|]*)\]/g, "<a href='$2'>$1</a>");
74+
tag = tag.replace(/\[([^|]*)?\|?([^|]*)\]/g, function (m0, m1, m2) {
75+
if ((m1.length !== 0) && (m2.length !== 0)) {
76+
return "<a href='" + m2 + "'>" + m1 + "</a>";
77+
} else {
78+
return "<a href='" + m1 + "'>" + m1 + "</a>";
79+
}
80+
});
6981

7082
//img
7183
let img = /!(.*)!/;
@@ -82,26 +94,26 @@ export async function parseMarkup(sourceText: string, sourceUri: vscode.Uri) {
8294
let re = /\{code.*\}/;
8395
let match = tag.match(re);
8496
if (match) {
85-
if (codeTagFlag == 0) {
86-
tag = '<pre><code>';
87-
codeTagFlag = 1;
97+
if (codeTagFlag === 0) {
98+
tag = '<pre><code>';
99+
codeTagFlag = 1;
88100
} else {
89101
tag = '</pre></code>';
90102
codeTagFlag = 0;
91103
}
92104
}
93105

94-
if (codeTagFlag == 0) {
106+
if (codeTagFlag === 0) {
95107
// lists
96108
re = /^([-|\*|#]+)\s(.*)/;
97109
match = tag.match(re);
98110
if (match) {
99-
if (listTag.length == 0) {
111+
if (listTag.length === 0) {
100112
if (match[1] == '#') {
101113
listTag = 'ol';
102114
} else {
103115
listTag = 'ul';
104-
if (match[1] == '-'){
116+
if (match[1] == '-') {
105117
listTag += ' style="list-style-type: square;"'
106118
}
107119
}
@@ -112,16 +124,20 @@ export async function parseMarkup(sourceText: string, sourceUri: vscode.Uri) {
112124
tag += "<li>" + match[2] + "</li>";
113125
}
114126

115-
if ((tag.length == 0) && (listTag.length != 0)) {
127+
if ((tag.length === 0) && (listTag.length !== 0)) {
116128
tag += '</' + listTag + '>';
117129
listTag = '';
118130
}
119131

120132
tag = tag.replace(/\*([^\*]*)\*/g, "<strong>$1</strong>");
121-
// tag = tag.replace(/-(.*)-/g, "<span style='text-decoration: line-through;'>striket-hrough</span>");
122-
}
123-
console.log("PARSED:" + tag);
124-
result += tag + '<br />';
133+
tag = tag.replace(/\B-(\w*)-\B/g, "<span style='text-decoration: line-through;'>striket-hrough</span>");
134+
}
135+
if (tag === '<pre><code>') {
136+
result += tag;
137+
} else {
138+
result += tag + '<br />';
139+
}
140+
// console.log("PARSED:" + tag);
125141
}
126142

127143
return result;

0 commit comments

Comments
 (0)