Add JS files to SDL Tridion CMS without a GUI element

I went through several blogs specially here. But still I found it difficult to do this simple task. I have created a step by step guide here in case if someone needs it.

1. Create a JS file. Sample file here from this link.

//If you only want your code to affect certain screens/views, you should listen to Anguilla events like this:
$evt.addEventHandler($display, "start", onDisplayStarted);

// This callback is called when any view has finished loading
function onDisplayStarted() {

$evt.removeEventHandler($display, "start", onDisplayStarted);

if ($display.getView().getId() == "ComponentView") {
        //Work your magic!
   }
}

2. Create a folder SampleModel at location: %TRIDION_HOME%\web\WebUI\Models and add the JS file to it. We will call the JS file as sample.js.

3. In the same folder create a config file as SampleModel.config as:

<?xml version="1.0"?>
<Configuration xmlns="http://www.sdltridion.com/2009/GUI/Configuration/Merge"
               xmlns:cfg="http://www.sdltridion.com/2009/GUI/Configuration">
  <resources cache="true">
    <cfg:filters/>
    <cfg:extensiongroups>
        <cfg:extensiongroup name="SampleModel.extension">
            <cfg:extension target="Tridion.Web.UI.Editors.CME.Views.Component">
            <cfg:insertafter>SampleModel</cfg:insertafter>
            </cfg:extension> 
        </cfg:extensiongroup>
    </cfg:extensiongroups>
    <cfg:groups>
      <cfg:group name="SampleModel" merger="Tridion.Web.UI.Editors.CME.Views.Component" merge="never" include="always">
        <cfg:fileset>
          <cfg:file type="script" id="sample">/sample.js</cfg:file>
        </cfg:fileset>
        <cfg:dependencies>
          <cfg:dependency></cfg:dependency>
        </cfg:dependencies>
      </cfg:group>
    </cfg:groups>
  </resources>
  <definitionfiles/>
  <extensions>
    <editorextensions xmlns="http://www.sdltridion.com/2009/GUI/extensions"/>
    <dataextenders xmlns="http://www.sdltridion.com/2009/GUI/extensions"/>
  </extensions>
  <commands/>
  <contextmenus/>
  <localization/>
  <settings>
    <defaultpage/>
    <navigatorurl/>
    <editurls/>
    <listdefinitions/>
    <itemicons/>
    <theme>
      <path/>
    </theme>
    <resourceextensions>
        <resourceextension>SampleModel.extension</resourceextension>
    </resourceextensions>
    <customconfiguration/>
  </settings>
</Configuration>

4. Modify the System.config file at location: %TRIDION_HOME%\web\WebUI\WebRoot\Configuration and add the following information under <models>:

<model name="SampleModel">
    <installpath>C:\Tridion\web\WebUI\Models\SampleModel\</installpath>
    <configuration>SampleModel.config</configuration>
    <vdir>SampleModel</vdir>
</model>

5. Open IIS and open the SDL Tridion site. Goto SDL Tridion -> WebUI -> Models and add a Virtual Directory. Give the path as: %TRIDION_HOME%\web\WebUI\Models\SampleModel

6. Restart IIS. If your code has no JS issues. The files should load in SDL Tridion CMS.