Detecting layout name


(dmckenna) #1

Is there any means of detecting the name of the layout currently being displayed via javascript? I suppose i could inspect the width and infer it that way but it’d be easier if there was a built in method in hype for that.


(René) #2

It would be nice if there’s an API for the current layout.
I’m now using the height (landscape, should use width for portrait):

var screenHeight = window.screen.height;
if(screenHeight==480){
	//iphone4';
}else if (screenHeight==568){
	//iphone5;
}else if (screenHeight==667){
	//iphone6;
}else if (screenHeight==1024){
	//ipad;
}else if (screenHeight==736){
	//iphone6plus';
};

(Warren Adams-Ockrassa) #3

Can you add a function to the ‘On Layout Load’ options to run a JavaScript, loading the name you want into a variable? Something like:

function layoutLoaded{usual hype stuff( {
  var myLayout = "Whatever name you want for this layout";
}

It’s a bit kludgy…


(Mark Hunte) #4

@warrenao, your are onto something there but I do not think running a Javascript alone would work well.
I think that would mean you would have to have a javascript for each layout.

iChat you could do is use behaviours to run a single JavaScript function. The behaviours have an event property we can use to get the layouts name. customBehaviorName


Create each layout.

Then on each layout’s ‘On Layout Load’ add a custom behaviour.
Name the custom behaviour’s name the same name as the Layout.
Set ALL the custom behaviour’s action to trigger the same (single) javascript.

The javascript will then be able to check the event and access the :

event.customBehaviorName

example:

LayoutName.hypetemplate.zip (21.2 KB)


Proportionally scaling a Tumult Hype document based on the browser width
(Warren Adams-Ockrassa) #5

Aye, a per-layout JS was sort of kind of what I was thinking, though I didn’t make it clear, and I definitely didn’t get as far as scripting it out! :smiley:


(Mark Hunte) #6

Note that you can use the Layout API now. i.e

hypeDocument.currentLayoutName()
hypeDocument.showLayoutNamed(‘layoutName’)
hypeDocument.layoutsForSceneNamed(‘sceneName’)