User:Max34/VDCEditor: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
mNo edit summary
Line 1: Line 1:
VDCEditor is an extension that will change the edit field from a regular flat textarea into a full-fledged code editor with syntax highlighting, line numbering and much more.
VDCEditor is an extension that will change the edit field from a regular flat textarea into a full-fledged code editor with syntax highlighting, line numbering and much more.


{{Note|Despite the fact that this extension is made for the Valve Developer Community, it can probably work on any other wikis running on the MediaWiki engine.}}
{{Note|This extension was originally created for the Valve Developer Community, but it can be used on other MediaWiki-based projects}}


== Download v0.1 ==
== Download v0.1 ==
{{Warning|This extension may be unstable because it’s still under development. By installing it, you agree that I (as the creator of this extension) am not responsible for any shortcomings. You also agree that you will install the unpacked extension yourself. This is necessary due to the fact that browsers can block packaged extensions installed not from their store.}}
{{Warning|This extension may be unstable because it’s still under development. By installing it, you agree that I (as the creator of this extension) am not responsible for any shortcomings. You also agree that you will install the unpacked extension yourself. This is necessary due to the fact that browsers can block packaged extensions installed not from their store.}}
{{Note|Since my skills in writing extensions are not very great, editing may lag if there is a lot of code.}}
 
Download link (Google Drive): https://drive.google.com/file/d/1nLlIZScqa4tEzEuQ6iepLcbCAM-eBFBs/view?usp=sharing
Download link (Google Drive): https://drive.google.com/file/d/1nLlIZScqa4tEzEuQ6iepLcbCAM-eBFBs/view?usp=sharing


Line 31: Line 31:


=== Using the extension ===
=== Using the extension ===
# You must be logged in to this site
# Go to any page that you can edit
# Go to any page that you can edit
# Click the Edit tab
# Click the Edit tab


== Development progress ==
== Version Changelog ==
<span style=color:green>☑</span> Make the first edit using the new editor
=== 0.2 ===
 
(In development)
<span style=color:green>☑</span> Change the style of the entire editor to the dark version
 
<span style=color:green>☑</span> Implement the correct automatic loading of the script
 
<span style=color:green>☑</span> Add line numbering
 
<span style=color:green>☑</span> Add Word Wrap setting
 
☐ Add code font size setting
 
<span style=color:green>☑</span> Make editor height saveable
 
<span style=color:green>☑</span> Make a status bar
 
<span style=color:green>☑</span> Add an indicator of the number of characters in the code
 
<span style=color:green>☑</span> Add a carriage location indicator
 
<span style=color:green>☑</span> Add highlighting of MediaWiki magic words
 
☐ Add highlighting to {{Code|&amp;#999;}} elements
 
<span style=color:orange>☑</span> Add highlighting for mnemonics (not all mnemonics have been added. Need a complete list of mnemonics working on this site)
 
<span style=color:green>☑</span> Add highlighting to HTML elements
 
<span style=color:orange>☑</span> Add highlighting to MediaWiki elements (hardest one)
 
☐ Implement the loading of translations directly from the VDC so that users can translate the extension directly from the site
 
☐ Implement the loading of brief documentation of templates when hovering over them with the mouse with Ctrl pressed
 
☐ Implement a color square next to each color (as in F12)
 
<span style=color:green>☑</span> Add attributes to disable unwanted actions with the editor (translate="no", spellcheck="false", autocorrect="off", autocapitalize="off")
 
<span style=color:green>☑</span> Add scrolling below content until only the last line is shown
 
<span style=color:green>☑</span> Add highlighting to parts of code similar to the part that was selected
 
<span style=color:green>☑</span> Add setting to disable highlighting of similar text as selected text
 
☐ Add a setting to display control characters
 
<span style=color:green>☑</span> Add an icon and extension name to the top left corner of the editor to make it look like a separate application
 
☐ Adapt the editor to display correctly in right-to-left mode
 
<span style=color:green>☑</span> Add preserving indentation (tabs and spaces) at the beginning of a line when creating a new line
 
<span style=color:green>☑</span> Add a setting to disable scrolling below the last line
 
<span style=color:green>☑</span> Add a setting to disable template styling. This styling is still quite unstable
 
☐ Add auto-completion of templates and their shortcuts.
 
<span style=color:green>☑</span> Add the ability to duplicate selected text (or a line if nothing is selected) when pressing Ctrl + D
 
<span style=color:orange>☑</span> Reduce the “editpage-copywarn” font a little (maybe it’s worth coming up with another way to reduce the space this text takes up)
 
<span style=color:green>☑</span> Style the diff table to match the site theme (styled both when editing and when viewing the history of page changes)
 
☐ Replace the {{Code|Ctrl+B}} and {{Code|Ctrl+I}} keyboard shortcuts with automatic insertion of single quotes (the contenteditable div turns out to add these keyboard shortcuts, and given how exactly this extension is made, the original functionality of these shortcuts can break the entire editor)
 


(For copying: ☐ <span style=color:orange>☑</span> <span style=color:green>☑</span>)
=== 0.1 ===
(This version was just a test run)
* Initial release

Revision as of 21:27, 22 January 2025

VDCEditor is an extension that will change the edit field from a regular flat textarea into a full-fledged code editor with syntax highlighting, line numbering and much more.

Note.pngNote:This extension was originally created for the Valve Developer Community, but it can be used on other MediaWiki-based projects

Download v0.1

Warning.pngWarning:This extension may be unstable because it’s still under development. By installing it, you agree that I (as the creator of this extension) am not responsible for any shortcomings. You also agree that you will install the unpacked extension yourself. This is necessary due to the fact that browsers can block packaged extensions installed not from their store.

Download link (Google Drive): https://drive.google.com/file/d/1nLlIZScqa4tEzEuQ6iepLcbCAM-eBFBs/view?usp=sharing

How to use the extension

Installing (chromium based browsers)

  1. Follow the link to install .zip archive
  2. After installation, you need to unpack the archive and you should have the following structure: the “VDCEditor” folder and inside it all the extension files
  3. Place the extension folder in any location you need on your computer
  4. Open your browser and open the chrome://extensions/
  5. You will have to find the "Developer Mode" switch and activate it
  6. After this, you should see a button “load unpacked extension”
  7. Click on this button and select the folder of this extension

When you are done, the VDCEditor extension marked as “unpacked extension” should appear in the list of extensions.

Installing (Firefox)

  1. Follow the link to install .zip archive
  2. After installation place the archive in any location you need on your computer
  3. Open Firefox and type about:config in the search bar
  4. You will see a warning message, and after clicking the button, an input field
  5. Enter axpinstall.signatures.required in this field. You need to switch it to the false state
  6. Now go to your extensions list (about:addons), click on the gear icon and select “Install add-on from file”
  7. Select a previously installed archive

When you're done, the VDCEditor extension with a warning that this extension is not verified should appear in the list of extensions.

Note.pngNote:If the extension does not launch on its own, click on the extensions button in the upper right corner of the browser while you are on VDC site and right-click on the VDCEditor icon. Select "Always allow on developer.valvesoftware.com".

Using the extension

  1. Go to any page that you can edit
  2. Click the Edit tab

Version Changelog

0.2

(In development)

0.1

(This version was just a test run)

  • Initial release
Retrieved from "https://developer.valvesoftware.com/w/index.php?title=User:Max34/VDCEditor&oldid=461627"