Mirrors/Teknik
1
0
Fork 0
mirror of https://git.teknik.io/Teknikode/Teknik.git synced 2023-08-02 14:16:22 +02:00
Code Releases Activity

Added syntax highlighting to vaults

Browse Source
This commit is contained in:
Uncled1023 2018-06-20 20:39:58 -07:00
parent 767b833cc5
commit f356e35b03
3 changed files with 49 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
Teknik/Areas/Vault/Views/Vault/PasteItem.cshtml
View File

@ -1,23 +1,34 @@
@model Teknik.Areas.Vault.ViewModels.PasteItemViewModel @model Teknik.Areas.Vault.ViewModels.PasteItemViewModel
@*@using Teknik.Pygments*@ @{
string format = Model.Paste.Syntax;
string formatName = "Text";
bool useFormat = true;
bool autoDetect = false;
@{ if (string.IsNullOrEmpty(format))
// Transform content into HTML {
//if (!Highlighter.Lexers.ToList().Exists(l => l.Aliases.Contains(Model.Paste.Syntax))) useFormat = false;
//{ }
// Model.Paste.Syntax = "text"; else if (format == "auto-detect")
//} {
//Highlighter highlighter = new Highlighter(); formatName = "Auto Detect";
// Add a space in front of the content due to bug with pygment (No idea why yet) autoDetect = true;
Model.Paste.Content = Model.Paste.Content;// highlighter.HighlightToHtml(" " + Model.Paste.Content, Model.Paste.Syntax, Model.Config.PasteConfig.SyntaxVisualStyle, generateInlineStyles: true, fragment: true); }
else if (!HighlightHelper.Languages.ContainsKey(format))
{
useFormat = false;
}
else
{
formatName = HighlightHelper.Languages[format];
}
} }
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<div class="row"> <div class="row">
<div class="col-sm-10 text-left"> <div class="col-sm-10 text-left">
<h4><b>@((string.IsNullOrEmpty(Model.Title)) ? "Paste" : Model.Title)</b> <small>Pasted on <time datetime="@Model.Paste.DatePosted.ToString("s")">@Model.Paste.DatePosted.ToString("dddd, MMMM d, yyyy") at @Model.Paste.DatePosted.ToString("h:mm:ss tt")</time> - Format: <b id="syntaxLanguage">@Model.Paste.Syntax</b></small></h4> <h4><b>@((string.IsNullOrEmpty(Model.Title)) ? "Paste" : Model.Title)</b> <small>Pasted on <time datetime="@Model.Paste.DatePosted.ToString("s")">@Model.Paste.DatePosted.ToString("dddd, MMMM d, yyyy") at @Model.Paste.DatePosted.ToString("h:mm:ss tt")</time> - Format: <b id="syntaxLanguage_@(Model.Paste.PasteId)">@formatName</b></small></h4>
</div> </div>
<div class="col-sm-2 text-right"> <div class="col-sm-2 text-right">
<h4><small><a href="@Url.SubRouteUrl("p", "Paste.View", new { url = Model.Paste.Url })" target="_blank">Direct Link</a></small></h4> <h4><small><a href="@Url.SubRouteUrl("p", "Paste.View", new { url = Model.Paste.Url })" target="_blank">Direct Link</a></small></h4>
@ -43,7 +54,7 @@
} }
else else
{ {
@Html.Raw(Model.Paste.Content) <pre><code id="code_@(Model.Paste.PasteId)">@Html.Raw(Model.Paste.Content)</code></pre>
} }
</div> </div>
<div class="show-more" id="show-more-bottom-@Model.VaultItemId"> <div class="show-more" id="show-more-bottom-@Model.VaultItemId">
@ -57,4 +68,26 @@
<p>@Model.Description</p> <p>@Model.Description</p>
</div> </div>
} }
</div> </div>
@if (useFormat)
{
<script>
var code = document.querySelector('#code_@(Model.Paste.PasteId)');
var worker = new Worker(GenerateBlobURL('@Url.FullURL("~/js/highlight.worker.min.js")'));
var scriptBlob = GenerateBlobURL('@Url.FullURL("~/js/highlight.min.js")');
worker.onmessage = function (event) {
code.innerHTML = event.data.value;
@if (autoDetect)
{
@:$('#syntaxLanguage_@(Model.Paste.PasteId)').html('Auto Detect (' + event.data.language + ')');
}
}
worker.postMessage({
content: code.textContent,
script: scriptBlob,
format: '@(format)',
autoDetect: @(autoDetect.ToString().ToLower())
});
</script>
}

2
Teknik/Scripts/Paste/ViewPaste.js
View File

@ -12,7 +12,7 @@
worker.onmessage = function (event) { worker.onmessage = function (event) {
code.innerHTML = event.data.value; code.innerHTML = event.data.value;
if (autoDetect) { if (autoDetect) {
$('#syntaxLanguage').html('Auto-Detect (' + event.data.language + ')'); $('#syntaxLanguage').html('Auto Detect (' + event.data.language + ')');
} }
} }
worker.postMessage({ worker.postMessage({

1
Teknik/bundleconfig.json
View File

@ -251,6 +251,7 @@
{ {
"outputFileName": "./wwwroot/css/vault.min.css", "outputFileName": "./wwwroot/css/vault.min.css",
"inputFiles": [ "inputFiles": [
"./wwwroot/lib/highlight/css/github-gist.css",
"./wwwroot/css/app/Vault/Vault.css" "./wwwroot/css/app/Vault/Vault.css"
] ]
}, },