TheSwamp

Code Red => .NET => Topic started by: kdub_nz on May 12, 2023, 08:38:44 PM

Title: Code Display in Browser
Post by: kdub_nz on May 12, 2023, 08:38:44 PM

I've been playing.

. . . with the idea of displaying c# code on a site.
Trying to leverage the bits I've learnt.


Is this too garish ??

Title: Re: Code Display in Browser
Post by: It's Alive! on May 12, 2023, 08:54:05 PM
yikes .. there used to be a plugin for VS C# to HTML

Title: Re: Code Display in Browser
Post by: kdub_nz on May 12, 2023, 09:16:42 PM
Yep !

One version gives me this.

Just need to ref some [additional]  font styles.
Title: Re: Code Display in Browser
Post by: kdub_nz on May 12, 2023, 09:27:21 PM
Output honours fonts in VS editor
I'll need to parse the file to change those , OR force the browser to download the fonts . . which is pretty economical

Title: Re: Code Display in Browser
Post by: kdub_nz on May 12, 2023, 09:36:33 PM
This is my actual VS Editor
. .
The selected line is about 87 characters long
Title: Re: Code Display in Browser
Post by: It's Alive! on May 13, 2023, 02:01:42 AM
I've been using consolas. I wonder what GIThub uses for format code
Title: Re: Code Display in Browser
Post by: pkohut on May 13, 2023, 04:59:11 AM
As someone with diminishing vision, I struggle with Windows font rendering and fight with it after every reinstall of 10/11.
For example I have 2 monitors of QHD which are 27 and 32 inch.  After much trial and error, a custom scaling of 127 is best for me for most windows applications and the desktop.  Having a stigmatism makes Dark themes a no go.  Some dark themes look great but cause headaches.

Out of the box, VS Code has fantastic font rendering all around, whereas VS absolutely sucks for me for side menus, dialog boxes, etc.,  editor looks OK.  A resent Google search of VS 2022 community fonts are blurry, brought me to a plugin of "Text Sharp".  After install, I'd say font are 80 percent in VSC.

One theme in VSC I think is fantastic is "Tomorrow Dark Blue", but it still causes headaches.  The theme I use for coding is "Blue (extra contrast)"

I am a less is more when it comes to themes and think the GitHub theme is a good balance.

BTW, the screenshot from D, look fuzzy, what programs are these from?

TIA
Title: Re: Code Display in Browser
Post by: It's Alive! on May 13, 2023, 05:57:22 AM
windows snip win+shift+s or something.

I noticed everything done in WPF, .net is blurry... but I'm old, so that could be it  :laugh:
Title: Re: Code Display in Browser
Post by: kdub_nz on May 13, 2023, 06:00:17 AM
Took me half hour to get rid of the inclined Text in the VS editor.
Visual Assist was the culprit.

Font is now Consolas again ( in place of Cascadia Mono ) . . . so no text style  downloads required for most people


Title: Re: Code Display in Browser
Post by: pkohut on May 13, 2023, 01:02:13 PM
windows snip win+shift+s or something.

I noticed everything done in WPF, .net is blurry... but I'm old, so that could be it  :laugh:

Sorry, meant what editor is the screen shot of? 
Title: Re: Code Display in Browser
Post by: It's Alive! on May 13, 2023, 06:29:29 PM
visual studio, my screen shot tool shrinks the image, why its blurry
Title: Re: Code Display in Browser
Post by: kdub_nz on May 13, 2023, 11:41:11 PM
Just need to add header and Line numbers.

Not quite as gaudy as the first couple.

Title: Re: Code Display in Browser
Post by: It's Alive! on May 14, 2023, 04:23:30 AM
looks good!
Title: Re: Code Display in Browser
Post by: kdub_nz on June 09, 2023, 09:08:06 PM
Next Iteration :

The Code pane text is 20px.  Will probably revert to 16px  ( 1em or 12 pt )
The width suits about 82 characters. ( will have scroll bars when needed )

On a 'normal monitor' there will be enough room to have notes on the right section.

The side menu will eventually be a collapsable tree structure
I 'may' add tooltips to the menu options ( undecided )

Undecided about adding line numbers  :|

Title: Re: Code Display in Browser
Post by: It's Alive! on June 09, 2023, 09:47:04 PM
looks great!

have you seen this? https://gist.github.com/
Title: Re: Code Display in Browser
Post by: kdub_nz on June 09, 2023, 09:53:49 PM
looks great!

have you seen this? https://gist.github.com/

Yes, that's my code.

. . . or did you mean the editor display ??
Title: Re: Code Display in Browser
Post by: It's Alive! on June 09, 2023, 10:44:39 PM
Quote
all care, no responsibility
Livingstone v Roskilly [1992]

What's this project? you're writing all the HTML stuff too?
Title: Re: Code Display in Browser
Post by: kdub_nz on June 10, 2023, 12:06:42 AM
Quote
all care, no responsibility
Livingstone v Roskilly [1992]

What's this project? you're writing all the HTML stuff too?


Hi Dan,

Yes, I've coded all the HTML, CSS, JS jQuery for the project.
It's really just a confirmation for myself that the coding I've learnt has stuck in the wet gray stuff.

The project will be a (sort-of) library/cookbook of some of the stuff I've used over time.

It's a hobby project I s'pose but I see it as useful.

I think I'll spend a couple days evaluating prism.js and highlight.js for generating the syntax highlighting.
This will remove the current reliance on 'CopyToHtml' from Visual Studio. The goal is to be able to use plain text input code and display in an acceptable manner.
I think I'll be able to use them to generate the drop-in <pre> <code> ... </code> </pre> which will save a lot of bandwidth when viewing the page. Basically the pages will be static.
I think I can modify the config files to get the result I'll want.
This will allow me to post a variety of languages without too much dev overhead.

I've had a site for 8+ years and hardly used it , except for playing/learning when the mood took me.

I can't imagine this will be income generating but I may get a few coffee donations from it down the road.

I probably should have done this a few years ago :)
Title: Re: Code Display in Browser
Post by: It's Alive! on June 10, 2023, 04:49:33 AM
Can’t wait to see it.

Through the interface is kind of hard to read, the width is way too narrow, I think around 100 chars’ width might be a good balance
https://drive-cad-with-code.blogspot.com/ Norman’s is very readable, bigger bolder font
https://gilecad.azurewebsites.net/UserInterfaces.aspx  Gile’s is easy on the eyes, and scrollable
http://www.lee-mac.com/programs.html Lee’s is amazing, a page with the description overview, HTML view in dark, light and vlide, the formatting is juicy and delicious 

Title: Re: Code Display in Browser
Post by: kdub_nz on June 14, 2023, 10:50:49 PM
Traslation from C# to HTML using prism.js.

Just need to learn how to write a plug-in for extendables to handle the AutoCAD classes and methods ( or not ! )

font-size is 20px, perhaps adequate
Title: Re: Code Display in Browser
Post by: Atook on June 15, 2023, 09:59:51 AM
Looks good!
Title: Re: Code Display in Browser
Post by: kdub_nz on June 24, 2023, 02:54:01 AM
Been playing with menu options.

I think this may be the winner . . . . or some variation of it :)

Fashioning this stuff from scratch is cathartic, and fun.

Title: Re: Code Display in Browser
Post by: kdub_nz on June 24, 2023, 03:14:16 AM
Though, this may be better :

a more vibrant color and increased size for the selected topic . . . may be different tomorrow.

Title: Re: Code Display in Browser
Post by: kdub_nz on June 24, 2023, 11:54:33 PM
That's it for today !

Title: Re: Code Display in Browser
Post by: It's Alive! on June 25, 2023, 01:02:30 AM
Nice!
Are you going to write something for every class?... because there’s a lot of them
Title: Re: Code Display in Browser
Post by: kdub_nz on June 25, 2023, 01:59:59 AM
Nice!
Are you going to write something for every class?... because there’s a lot of them

Yes, there is a lot.

Quite a bit of it uses similar methodology to access and modify so we wouldn't need unique code for each. I thought some could be done on a recipe basis . . . 'this applies to xxx and . . etc. So several of the links from the Model diagram could point to the same info page.

I had imagined a bit of a cookbook, rather than a full blown duplication/re-arrangement of the docs.
 . . and also having links to the official docs

But really, it's not as if I don't have some spare time. :)

and besides, I could (or hope to ) learn something new along the way if I pay attention.
Title: Re: Code Display in Browser
Post by: Atook on June 25, 2023, 09:24:09 AM
Looks like a good project for learning! You going to post it live somewhere?
Title: Re: Code Display in Browser
Post by: kdub_nz on June 25, 2023, 03:51:11 PM
Hi Tim,
Yes, it's sure been a good learning project.
I've been down a few rabbit holes. I'm trying to do a bit each day, as time allows.

I will upload it to a live site, in stages I think.
This is my first full project of this type, so I'm hoping it turns out like I envision.
 
Title: Re: Code Display in Browser
Post by: kdub_nz on June 27, 2023, 03:18:49 AM

Git saved my arse again today . . . . . dragged be out of a big rabbit hole :)

Title: Re: Code Display in Browser
Post by: JohnK on June 27, 2023, 09:50:36 AM
Oh I know that feeling (feels good and odd at the same time)! "Yippie-dippy! it runs again! ...but I just lost a lot of work; I wonder if I just changed X it would have worked?"