User:Max34/VDCEditor: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
mNo edit summary
 
(9 intermediate revisions by the same user not shown)
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.
[[File:Icon-VDCEditor.png|link=|17px]] '''VDCEditor''' is a browser extension that transforms the standard edit field in MediaWiki-based projects into a feature-rich code editor, complete with syntax highlighting, line numbering, and additional enhancements.


{{Note|This extension was originally created for the Valve Developer Community, but it can be used on other MediaWiki-based projects}}
Originally developed for the Valve Developer Community, it can be used across any MediaWiki-based platform.
__NOTOC__
== Usage ==
Navigate to any editable page.


== Download v0.1 ==
Click the Edit tab to launch the enhanced editor.
{{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.}}


Download link (Google Drive): https://drive.google.com/file/d/1nLlIZScqa4tEzEuQ6iepLcbCAM-eBFBs/view?usp=sharing
== Installation Instructions ==
<div style="display:flex; gap: 10px;">
{| align="center" style="background:#323232; border:2px solid #4f4f4f; border-radius: 6px; padding: 15px 10px;"
! style="font-size:1.6em; color:white; padding-bottom:5px; solid #4f4f4f;"| Chromium-Based Browsers
|-
| style="padding-top: 10px;"|
# Download the .zip archive from the link below.
# Extract the archive. You should have a VDCEditor folder containing all extension files.
# Place the folder anywhere on your computer.
# Open your browser and navigate to {{Code|chrome://extensions/}}.
# Enable Developer Mode.
# Click Load unpacked extension and select the VDCEditor folder.
# The extension should now appear as an unpacked extension in your browser.
|}


== How to use the extension ==
=== Installing (chromium based browsers) ===
# Follow the link to install .zip archive
# 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
# Place the extension folder in any location you need on your computer
# Open your browser and open the {{Code|chrome://extensions/}}
# You will have to find the "Developer Mode" switch and activate it
# After this, you should see a button “load unpacked extension”
# 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) ===
{| align="center" style="background:#323232; border:2px solid #4f4f4f; border-radius: 6px; padding: 15px 10px;"
# Follow the link to install .zip archive
! style="font-size:1.6em; color:white; padding-bottom:5px; solid #4f4f4f;"| Firefox  
# After installation place the archive in any location you need on your computer
|-
# Open Firefox and type {{Code|about:config}} in the search bar
| style="padding-top: 10px;"|
# You will see a warning message, and after clicking the button, an input field
# Download the .zip archive from the link below.
# Enter {{Code|axpinstall.signatures.required}} in this field. You need to switch it to the false state
# Save the archive to any location.
# Now go to your extensions list ({{Code|about:addons}}), click on the gear icon and select “Install add-on from file”
# Open Firefox and go to {{Code|about:config}}.
# Select a previously installed archive
# Accept the warning and search for xpinstall.signatures.required.
When you're done, the VDCEditor extension with a warning that this extension is not verified should appear in the list of extensions.
# Set this preference to false.
{{Note|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".}}
# Open your add-ons manager ({{Code|about:addons}}), click the gear icon, and select Install Add-on from File.
# Choose the previously downloaded archive.
# The extension should now appear, although Firefox will indicate it is unverified.
|}
</div>
{{Note|If the extension doesn't start automatically, click the extensions button in your browser, find VDCEditor, right-click it, and select Always allow on developer.valvesoftware.com.}}


=== Using the extension ===
== Download ==
# Go to any page that you can edit
{| align="center" style="background:rgb(255,32,32, .04); border:2px solid rgb(255,32,32); border-radius: 6px; padding: 10px"
# Click the Edit tab
| style="color:#d33;"| This extension is still under development and may be unstable. By installing it, you agree that the creator is not responsible for any shortcomings. Installation of the unpacked extension is required because some browsers block extensions not installed from their store.
|-
|}


== Version Changelog ==
=== 0.2 ===
(In development)


=== 0.1 ===
{| align="center" style="background:#323232; border:2px solid #4f4f4f; border-radius: 6px; width: 1000px; padding: 15px 10px;"
(This version was just a test run)
| style="font-size:2em; color:white; padding-bottom:5px; solid #4f4f4f;"| v0.2
* Initial release
|-
| style="padding-top:5px; border-bottom:1px solid #4f4f4f;" | In development.
|-
| style="padding-top: 10px;"|<span style="font-size:132%; color:white;">Download:</span> TBD
|}
 
 
{| id="Ed-Latest" align="center" style="background:#323232; border:2px solid #4f4f4f; border-radius: 6px; width: 1000px; padding: 15px 10px;"
| style="font-size:2em; color:white; padding-bottom:5px; solid #4f4f4f;"| v0.1.2 <span style="border:1px solid #238636; border-radius:25px; color:#3fb950; font-size:12px; padding:5px; position: relative; top: -5px;">Latest</span>
|-
| style="padding-top:5px; border-bottom:1px solid #4f4f4f;" | A [[User:N0one/VDCEditorEx|temporary editor]] developed by [[User:N0one|N0one]], until v0.2 is released.
* Fixed color of the editor after the site upgrade
* Fixed some UI elements
* Added support for RTL
* Added a button for each type of wiki tag ({{Code|1=<span style="color:#87CEEB"><nowiki>[[Link]]</nowiki></span>}}, {{Code|1=<span style="color:#01B700"><nowiki>{{ACategory}}</nowiki></span>}}, {{Code|1=<span style="color:#369FFF"><nowiki>'''</nowiki></span>Apostrophes<span style="color:#369FFF"><nowiki>'''</nowiki></span>}})
* Added a special button that changes links into their template one, e.g. {{Code|1=<span style="color:#01B700"><nowiki>[[Category:...]]</nowiki></span>}} -> {{Code|1=<span style="color:#01B700"><nowiki>{{ACategory|...}}</nowiki></span>}} (idea from [[Project:Alternative Languages|Alternative Languages]], the regex area)
* Added a custom dropdown area for stylizing each wiki tag color and a reset button to reset every color
* Added a custom dropdown area for stylizing the Editor
* Added highlighting to {{Code|&amp;#999;}} elements
* [[User:N0one/VDCEditorEx/Localization|Added Translations for the VDCEditor]].
* Added an auto scroll on a new line
* Added a button that enables/disables matching brackets for highlighting same as selection
* Added a custom file for users to customize template coloring [https://github.com/N0ine/VDCEditorEx/blob/v0.1.2/VDCEditorEx-v0.1.2/templates.js Usage]
* Fully supported stylized templates (Not fully supported by template pages)
{{Note|It highlights templates, which can be very helpful for spotting unclosed ones, if a template isn't properly closed, nothing after it will be highlighted.}}
* Lots of optimizations
|-
| style="padding-top: 10px;"|<span style="font-size:132%; color:white;">Download:</span>
* {{GitHub|N0ine/VDCEditorEx/releases/tag/0.1.2|GitHub}}
|}
 
 
{| align="center" style="background:#323232; border:2px solid #4f4f4f; border-radius: 6px; width: 1000px; padding: 15px 10px;"
| style="font-size:2em; color:white; padding-bottom:5px; solid #4f4f4f;"| v0.1
|-
| style="padding-top:5px; border-bottom:1px solid #4f4f4f;" |
* Initial test release.
|-
| style="padding-top: 10px;"|<span style="font-size:132%; color:white;">Download:</span>
* [https://drive.google.com/file/d/1nLlIZScqa4tEzEuQ6iepLcbCAM-eBFBs/view?usp=sharing Google Drive]
|}

Latest revision as of 12:59, 25 May 2025

Icon-VDCEditor.png VDCEditor is a browser extension that transforms the standard edit field in MediaWiki-based projects into a feature-rich code editor, complete with syntax highlighting, line numbering, and additional enhancements.

Originally developed for the Valve Developer Community, it can be used across any MediaWiki-based platform.

Usage

Navigate to any editable page.

Click the Edit tab to launch the enhanced editor.

Installation Instructions

Chromium-Based Browsers
  1. Download the .zip archive from the link below.
  2. Extract the archive. You should have a VDCEditor folder containing all extension files.
  3. Place the folder anywhere on your computer.
  4. Open your browser and navigate to chrome://extensions/.
  5. Enable Developer Mode.
  6. Click Load unpacked extension and select the VDCEditor folder.
  7. The extension should now appear as an unpacked extension in your browser.


Firefox
  1. Download the .zip archive from the link below.
  2. Save the archive to any location.
  3. Open Firefox and go to about:config.
  4. Accept the warning and search for xpinstall.signatures.required.
  5. Set this preference to false.
  6. Open your add-ons manager (about:addons), click the gear icon, and select Install Add-on from File.
  7. Choose the previously downloaded archive.
  8. The extension should now appear, although Firefox will indicate it is unverified.
Note.pngNote:If the extension doesn't start automatically, click the extensions button in your browser, find VDCEditor, right-click it, and select Always allow on developer.valvesoftware.com.

Download

This extension is still under development and may be unstable. By installing it, you agree that the creator is not responsible for any shortcomings. Installation of the unpacked extension is required because some browsers block extensions not installed from their store.


v0.2
In development.
Download: TBD


v0.1.2 Latest
A temporary editor developed by N0one, until v0.2 is released.
  • Fixed color of the editor after the site upgrade
  • Fixed some UI elements
  • Added support for RTL
  • Added a button for each type of wiki tag ([[Link]], {{ACategory}}, '''Apostrophes''')
  • Added a special button that changes links into their template one, e.g. [[Category:...]] -> {{ACategory|...}} (idea from Alternative Languages, the regex area)
  • Added a custom dropdown area for stylizing each wiki tag color and a reset button to reset every color
  • Added a custom dropdown area for stylizing the Editor
  • Added highlighting to &#999; elements
  • Added Translations for the VDCEditor.
  • Added an auto scroll on a new line
  • Added a button that enables/disables matching brackets for highlighting same as selection
  • Added a custom file for users to customize template coloring Usage
  • Fully supported stylized templates (Not fully supported by template pages)
Note.pngNote:It highlights templates, which can be very helpful for spotting unclosed ones, if a template isn't properly closed, nothing after it will be highlighted.
  • Lots of optimizations
Download:


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