### Initialize and Spin Spinner

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/en-tv-chart.64d1f18e.html

Initializes a new spinner instance with a 'large' size and applies custom styles. The spinner is then added to the provided container element and starts spinning.

```javascript
function(){
var t,e,n,r,i,o,s=document.createElement("div");s.className="tv-spinner",s.innerHTML='\n\t\t<div class="tv-spinner" role="progressbar">\n\t\t\t<div class="tv-spinner\_	rumpet__spinner-layer">\n\t\t\t\t<div class="tv-spinner\_	rumpet__background tv-spinner\_	rumpet__width_element"></div>\n\t\t\t\t<div class="tv-spinner\_	rumpet__circle-clipper tv-spinner\_	rumpet__width_element tv-spinner\_	rumpet__circle-clipper--left"></div>\x3c!--\n\t\t\t\t--\x3e<div class="tv-spinner\_	rumpet__circle-clipper tv-spinner\_	rumpet__width_element tv-spinner\_	rumpet__circle-clipper--right"></div>\n\t\t\t</div>\n\t\t</div>\n\t';var a=new WeakMap;var l=function(e,n){var r=a.get(e);tElement,(n=a?a.get(e):n)||((n=e.ownerDocument.createRange()).selectNodeContents(e),a&&a.set(e,n)),n.createContextualFragment('\n\t\t<div class="tv-spinner" role="progressbar">\n\t\t\t<div class="tv-spinner\_	rumpet__spinner-layer">\n\t\t\t\t<div class="tv-spinner\_	rumpet__background tv-spinner\_	rumpet__width_element"></div>\n\t\t\t\t<div class="tv-spinner\_	rumpet__circle-clipper tv-spinner\_	rumpet__width_element tv-spinner\_	rumpet__circle-clipper--left"></div>\x3c!--\n\t\t\t\t--\x3e<div class="tv-spinner\_	rumpet__circle-clipper tv-spinner\_	rumpet__width_element tv-spinner\_	rumpet__circle-clipper--right"></div>\n\t\t\t</div>\n\t\t</div>\n\t'));if("firstElementChild"in t)r=t.firstElementChild;else for(var r=null,i=0;i<t.childNodes.length;i++){var o=t.childNodes[i];if(o.nodeType===s.Element){r=o;break}}return null!==r&&t.removeChild(r),r}(),i=(o.prototype.spin=function(n){return this._el.classList.add("tv-spinner--shown"),void 0===this._container&&(void 0!==(this._container=n)&&n.appendChild(this._el)),this._shown=!0,this},o.prototype.stop=function(n){return n&&void 0!==this._container&&this._container.removeChild(this._el),this._el.classList.remove("tv-spinner--shown"),this._shown=!1,this},o.prototype.setStyle=function(t){var r=this;return Object.keys(t).forEach(function(n){var e=t[n];void 0!==e&&r._el.style.setProperty(n,e)}),this},o.prototype.setSize=function(n){return this._el.className="tv-spinner "+(void 0!==n?"tv-spinner--size_"+n:"")+" "+(this._shown?"tv-spinner--shown":" "),this},o.prototype.getEl=function(){return this._el},o.prototype.destroy=function(){this.stop(),delete this._el,delete this._container},o);function o(n){this._shown=!1,this._el=r.cloneNode(!0),this.setSize(n||"large")}window.Spinner=i}();n=n.foregroundColor||"auto",n=new Spinner("large").setStyle({color:n,zIndex:String(2e9)});n.getEl().classList.add("spinner"),n.spin(e)}()
```

--------------------------------

### JavaScript Spinner Implementation

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/zh_TW-tv-chart.64d1f18e.html

This JavaScript code defines a Spinner class for creating loading indicators. It includes methods for starting, stopping, styling, and destroying the spinner. Use this for implementing visual feedback during data loading or processing.

```javascript
var Spinner;(function(){
var s=Spinner={};s.Element=1;
var r=function(n,a){var t=n.ownerDocument.createRange();
var e=a?a.get(n):null;
t,(n=a?a.get(e):n)||((n=e.ownerDocument.createRange()).selectNodeContents(e),a&&a.set(e,n)),n.createContextualFragment(
'		<div class="tv-spinner" role="progressbar">
			<div class="tv-spinner__spinner-layer">
				<div class="tv-spinner__background tv-spinner__width_element"></div>
				<div class="tv-spinner__circle-clipper tv-spinner__width_element tv-spinner__circle-clipper--left"></div>
				<!--
				-->
				<div class="tv-spinner__circle-clipper tv-spinner__width_element tv-spinner__circle-clipper--right"></div>
			</div>
		</div>
	'));if("firstElementChild"in t)r=t.firstElementChild;else for(var r=null,i=0;i<t.childNodes.length;i++){var o=t.childNodes[i];if(o.nodeType===s.Element){r=o;break}}return null!==r&&t.removeChild(r),r}(),i=(o.prototype.spin=function(n){return this._el.classList.add("tv-spinner--shown"),void 0===this._container&&(void 0!==(this._container=n)&&n.appendChild(this._el)),this._shown=!0,this},o.prototype.stop=function(n){return n&&void 0!==this._container&&this._container.removeChild(this._el),this._el.classList.remove("tv-spinner--shown"),this._shown=!1,this},o.prototype.setStyle=function(t){var r=this;
return Object.keys(t).forEach(function(n){var e=t[n];void 0!==e&&r._el.style.setProperty(n,e)}),this},o.prototype.setSize=function(n){return this._el.className="tv-spinner "+(void 0!==n?"tv-spinner--size_"+n:"")+" "+(this._shown?"tv-spinner--shown":" "),this},o.prototype.getEl=function(){return this._el},o.prototype.destroy=function(){this.stop(),delete this._el,delete this._container},o);function o(n){this._shown=!1,this._el=r.cloneNode(!0),this.setSize(n||"large")}window.Spinner=i}();

```

--------------------------------

### Initialize Charting Library with URL Parameters

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/en-tv-chart.64d1f18e.html

Parses URL parameters to configure the charting library, including datafeed, custom formatters, and broker factory. It also retrieves settings from the parent window for specific keys.

```javascript
window.urlParams=function(){function n(n){return decodeURIComponent(n.replace(t," ")).replace(/<\/?\[^>\n]+(>|$)/g,"")}for(var e,t=/\+/g,r=/(\[^&=\]+)=?\[^&\n]*)/g,i=function(){var n=location.href,e=n.indexOf("#");if(0<=e)return n.substring(e+1);throw"Unexpected use of this page"}(),o={},e=r.exec(i);e;)o[n(e[1])]=n(e[2]);var s,a=window.parent[o.uid],l=["datafeed","customFormatters","brokerFactory","save_load_adapter"];for(s in a)-1===l.indexOf(s)&&(o[s]=JSON.stringify(a[s]));return o}()
```

--------------------------------

### Configure Loading Screen from URL Parameter

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/en-tv-chart.64d1f18e.html

Parses the 'loading_screen' URL parameter, which is expected to be a JSON string, to configure the loading indicator's appearance. Defaults to an empty object if parsing fails.

```javascript
var n={},e=document.getElementById("loading-indicator");if("string"==typeof urlParams.loading_screen)try{n=JSON.parse(urlParams.loading_screen)}catch(n){}n.backgroundColor&&(e.style="background-color: "+n.backgroundColor)
```

--------------------------------

### JavaScript Spinner Initialization

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/zh_TW-tv-chart.64d1f18e.html

This snippet shows how to initialize and attach a spinner to a DOM element. It allows for custom foreground colors and z-index. Ensure the target element exists before calling this.

```javascript
n=n.foregroundColor||"auto",n=new Spinner("large").setStyle({color:n,zIndex:String(2e9)});n.getEl().classList.add("spinner"),n.spin(e)
```

--------------------------------

### Apply Custom CSS from URL Parameter

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/en-tv-chart.64d1f18e.html

Checks for a 'customCSS' parameter in the URL and applies the specified CSS file using `addCustomCSSFile` if present.

```javascript
urlParams.customCSS&&window.addCustomCSSFile(urlParams.customCSS)
```

--------------------------------

### Insert Custom CSS into Document Head

Source: https://github.com/finlab-python/finlab-python.github.io/blob/main/charting_library/en-tv-chart.64d1f18e.html

Creates a style element and inserts the provided CSS text into the document's head. It supports inserting at the beginning of the head if 'top' is specified.

```javascript
t=(n=void 0===n?{}:n).insertAt,"undefined"!=typeof document&&(e=document.head||document.getElementsByTagName("head")[0],(n=document.createElement("style")).type="text/css","top"===t&&e.firstChild?e.insertBefore(n,e.firstChild):e.appendChild(n),n.styleSheet?n.styleSheet.cssText=i:n.appendChild(document.createTextNode(i)))
```