MANY useful functions for DEVELOPERS

[FlashKnight]

I completed my work and found I did a lot of useful tricks may helped anyone who use hippani , so I post here :

WARNNING : these functions may not work or hippani have already provide an api due to the different versions , and just provide a quick trick as if you really need to solve problem quickly. And I still recommend you to use the official api if available.




[1] How to detect an event target's html element id and ScriptID ?

//version 5.0 and newer:
function getMovieElementRealName(scriptElem){return scriptElem.ObjectId;}//the scriptElem is get through getMovieElement(scriptId) , a htmltag
function getMovieElementObject(scriptId){return this[scriptId]} //Object
function getMovieElement(scriptId){document.getElementById(getMovieElementRealName(scriptId)} //htmlTags
function callMovieElementFunction(scriptId ,evalString){return this[scriptId].contentWindow.eval(evalString);}// if you want to call sub iframe's function
function CompareEventTarget(event , scriptElem){ return event.target.id == scriptElem.ObjectId } //event.target == htmlElement , not Object ScriptElem

//version 4.0
function getMovieElementRealName(scriptId){return window["ScriptId_"+scriptId];}
function getMovieElement(scriptId){document.getElementById(getMovieElementRealName(scriptId));} //5.0
function callMovieElementFunction(scriptId ,evalString){return getMovieElement(scriptId).contentWindow.eval(evalString);}

some times you may not get the event.target.id , maybe you need to try event.target.parentNode.id or event.target.parentNode.parentNode.id
, for these cases , please use the examining-tools (Chrome - press F12) , and see how to locate the event.target.



[2] how to call between main movie and sub iframe ?

sub Movie call main Movie：
main Movie：parent.api = api;
sub Movie：parent.parent.api();
main Movie call sub Movie：
main Movie：parent.api();
sub Movie：parent.parent.api = api;

please note , since I detected the the parent is window , I realized that i can placed everything there and access by sub movie , for example , a variable and a function call. And you may need to place the published movies to your webserver , because browsers denied any script access of local computer that between to iframe.




[3] How to handle the Mouse scroll event:

/**************************************************************************
* how to use these code :
* please copy all code and paste into your project
* and modify the onMouseWheel function , here you go...
**************************************************************************/
function onMouseWheel(direct)
{
// here is the handler
alert(direct);
a.Y -= direct * 30;
}

/**************************************************************************
* function : this function is used for detect mouse wheel scroll
* author : FlashKnight
* adapt to : IE/Opera/Chrome/Firfox/Safari/W3C
* return : >0: scroll up
<0: scroll down
***************************************************************************/
function scrollFunc(e)
{
e=e || window.event;

onMouseWheel(e.wheelDelta ? e.wheelDelta/120 /*IE/Opera/Chrome*/ : -e.detail/3 /*Firefox*/ );
}

/*register event if available*/
if(document.addEventListener){
document.addEventListener('DOMMouseScroll',scrollFunc,false); //W3C
}
document.onmousewheel=scrollFunc;//IE/Opera/Chrome/Safari
//window.onmousewheel=scrollFunc;

/**************************************************************************
* function end
***************************************************************************/




[4] How to get what I want ?

under version 5.0 , please test this (test is an emelent that has ScriptID):

console.log(test.bbb); //scriptObject
console.log(test.bbb.ID); //scriptId
console.log(test.bbb.ObjectId); //domID
console.log(window[test.bbb.ObjectId]); //domObject
console.log(test.bbb.ParentId); //parent domID
console.log(window["test"].bbb); //scriptObject
console.log(window["test"].bbb == test.bbb); //scriptObject
console.log(event.currentTarget); //domObject
console.log(event.currentTarget.id); //domID
console.log(event.currentTarget.id==window["test"].bbb.ObjectId); //domID
console.log(window[event.currentTarget.id]);//domObject


[5] Is there any simple demo function ?

see here:

//extend the duplicate
function ExItemDuplicate(oldID , newID){
var item = ItemDuplicate(oldID,newID);
ExBindItem(item);
return item;
}

//extend the scriptID
function ExBindItem(item){
window[item.ObjectId].ID = item.ID;
window[item.ObjectId].ObjectId = item.ObjectID;
window[item.ObjectId].ParentId = item.ParentId;
}

//extend the scriptID to save properties
function ExSetProperty(item , key , value){
window[item.ObjectId][key] = value;
}




As always I said , feel free to use and with care.

[FlashKnight]

Update : How to create a scalable round corner button that never changes the corner if you scale the movie ?

if you need to scale the designed button , for example , Movie Scale Setting "Stretch" and "Vertical Document" , you may find that button corner is changed , and the text is blur , this because the whole button is a picture , when the picture scales , it changes the original design.

if you use html style of button, it won't matter however your movie scales , or your button scales , your round corner is ALWAYS round.

How to do this :

first , create a css file in hippani , and paste these css code:
.round {
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius:15px;
}

PLEASE NOTE , you may need to change the css file link option from Embeded to External !

then , create a button , change its fill type to "HTML"

and finally , place your button in scene , set the CSS Class to "round" , and adjust the font size . and EXPORT (very important , won't work in player) your movie and see what's going on in your webrowser.