getHypeDocument()


(Loves Hype) #1

getHypeDocument

I often read about people that need the hypeDocument context while adding code into an DIV. In Hype this context actually doesn’t know about the hypeDocument so this little helper solves that problem (in Beta).

Installation

This snippet allows you to get the context anytime. Just add it to your Head-HTML. If you can’t put this in your Head-HTML or need it contained in Hype put it in an init function (without the script tags) that runs on scene load. And third option would be an enabler … meaning stick into a persistent symbol. I might offer this in this thread once it’s out of beta.

	<script>
	/**
	* getHypeDocument 1.0
	* @param {HTMLDivElement} optional start node
	* @return {hypeDocument} or null
	*/
	function getHypeDocument(e){
		var wElm = (e) ? e : document.scripts[document.scripts.length - 1];
		do {
			wElm = wElm.parentNode;
			var wElmId = wElm.getAttribute('id');
			if (wElmId!=null) {
				if (wElmId.indexOf('_hype_container')>-1) {
					for (var key in HYPE.documents){
						if (HYPE.documents[key].documentId() == wElmId){
							return HYPE.documents[key];
						}
					}
				}
			}	
		} while(wElm != document.body)
		return null;
	}
	</script>

Usage

And then you can execute any of the following in your DIV that live inside of your Hype-file (just examples)…

Example in a script block

<script>

// get the hypeDocument
var hypeDocument = getHypeDocument();

// let's check it and now we can use it
console.log(hypeDocument)

</script>

Example on a link (in this case it currently needs this as an parameter)

<a onclick="console.log(getHypeDocument(this))">test</a>

Versionhistory

1.0 Initial release under MIT-license


Internal link/javascript question