Author Topic: Code Display in Browser  (Read 5840 times)

0 Members and 1 Guest are viewing this topic.

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Code Display in Browser
« 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 ??

Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #1 on: May 12, 2023, 08:54:05 PM »
yikes .. there used to be a plugin for VS C# to HTML


kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #2 on: May 12, 2023, 09:16:42 PM »
Yep !

One version gives me this.

Just need to ref some [additional]  font styles.
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #3 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

Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #4 on: May 12, 2023, 09:36:33 PM »
This is my actual VS Editor
. .
The selected line is about 87 characters long
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #5 on: May 13, 2023, 02:01:42 AM »
I've been using consolas. I wonder what GIThub uses for format code

pkohut

  • Bull Frog
  • Posts: 483
Re: Code Display in Browser
« Reply #6 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
New tread (not retired) - public repo at https://github.com/pkohut

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #7 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:

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #8 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


Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

pkohut

  • Bull Frog
  • Posts: 483
Re: Code Display in Browser
« Reply #9 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? 
New tread (not retired) - public repo at https://github.com/pkohut

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #10 on: May 13, 2023, 06:29:29 PM »
visual studio, my screen shot tool shrinks the image, why its blurry

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #11 on: May 13, 2023, 11:41:11 PM »
Just need to add header and Line numbers.

Not quite as gaudy as the first couple.

Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #12 on: May 14, 2023, 04:23:30 AM »
looks good!

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #13 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  :|

« Last Edit: June 09, 2023, 09:13:21 PM by kdub_nz »
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #14 on: June 09, 2023, 09:47:04 PM »
looks great!

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

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #15 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 ??
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #16 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?

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #17 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 :)
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #18 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 


kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #19 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
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

Atook

  • Swamp Rat
  • Posts: 1029
  • AKA Tim
Re: Code Display in Browser
« Reply #20 on: June 15, 2023, 09:59:51 AM »
Looks good!

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #21 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.

« Last Edit: June 24, 2023, 02:58:36 AM by kdub_nz »
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #22 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.

Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #23 on: June 24, 2023, 11:54:33 PM »
That's it for today !

Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

It's Alive!

  • Retired
  • Needs a day job
  • Posts: 8690
  • AKA Daniel
Re: Code Display in Browser
« Reply #24 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

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #25 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.
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

Atook

  • Swamp Rat
  • Posts: 1029
  • AKA Tim
Re: Code Display in Browser
« Reply #26 on: June 25, 2023, 09:24:09 AM »
Looks like a good project for learning! You going to post it live somewhere?

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #27 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.
 
Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

kdub_nz

  • Mesozoic keyThumper
  • SuperMod
  • Water Moccasin
  • Posts: 2132
  • class keyThumper<T>:ILazy<T>
Re: Code Display in Browser
« Reply #28 on: June 27, 2023, 03:18:49 AM »

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

Called Kerry in my other life
Retired; but they dragged me back in !

I live at UTC + 13.00

---
some people complain about loading the dishwasher.
Sometimes the question is more important than the answer.

JohnK

  • Administrator
  • Seagull
  • Posts: 10623
Re: Code Display in Browser
« Reply #29 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?"
TheSwamp.org (serving the CAD community since 2003)
Member location map - Add yourself

Donate to TheSwamp.org