...

View Full Version : I-Chin widget



rdspoons
03-01-2012, 11:17 PM
Styleable I-Ching widget.

Diplays logogram, hexagram and information for oracular statements for two random coins taken from a bag of 8 distinct coins.
R. Wilhelm and modern interpretations are provided along with a state relavent link to wikipedia.

Don't forget to save the file as utf-8 text.

Almost forgot, shows one way to make a one-shot function: execute function body and remove self.
means 1 call to dailyiching is OK, 2 calls(+) is an error.



<!doctype html>
<html>
<head>
<title>
Daily I-Ching
</title>
<style type='text/css'>
/*style class .dailyiching (ie,ff,chrome,opera)*/
.dailyiching {border:solid 1px #072556;width:350px;-moz-border-radius: 0em 0em .5em .5em;border-radius: 0em 0em .5em .5em;background:#276596;color:#fff;padding:3px;}
.dailyiching table {border:solid 1px #072556;width:175px;-moz-border-radius: 0em 0em .5em .5em;border-radius: 0em 0em .5em .5em;}
.dailyiching caption {font:normal bold 14px/14px Trebuchet MS, Geneva, sans-serif;border:solid 1px #072556;border-bottom:none;padding:5px;line-height:1.3em;
-moz-border-radius: .5em .5em 0em 0em;border-radius: .5em .5em 0em 0em;background:#276596;}
.dailyiching td {font:normal normal 12px/12px Trebuchet MS, Geneva, sans-serif;}
.dailyiching a {color:#ff0;font-weight:bold;}
/*style class .dailyichingmac (safari)*/
.dailyichingmac {border:solid 1px #072556;width:350px;-moz-border-radius: 0em 0em .5em .5em;border-radius: 0em 0em .5em .5em;background:#276596;color:#fff;padding:3px;}
.dailyichingmac caption {width:350px;font:normal bold 14px/14px Trebuchet MS, Geneva, sans-serif;border:solid 1px #072556;border-bottom:none;padding:5px;
line-height:1.3em;-moz-border-radius: .5em .5em 0em 0em;border-radius: .5em .5em 0em 0em;background:#276596;}
.dailyichingmac table {border:solid 1px #072556;width:160px;-moz-border-radius: 0em 0em .5em .5em;border-radius: 0em 0em .5em .5em;}
.dailyichingmac table caption {width:160px;font:normal bold 14px/14px Trebuchet MS, Geneva, sans-serif;border:solid 1px #072556;border-bottom:none;padding:5px;
line-height:1.3em;-moz-border-radius: .5em .5em 0em 0em;border-radius: .5em .5em 0em 0em;background:#276596;}
.dailyichingmac td {font:normal normal 12px/12px Trebuchet MS;}
.dailyichingmac a {color:#ff0;font-weight:bold;}
</style>
<script>
(function(){
//data from http://en.wikipedia.org/wiki/I_Ching.
var eid = arguments[0];
function ostated(){ //Oracular Statement.
if(arguments.length==13){
this.name = arguments[0];
this.logogram = arguments[1];
this.symbol = arguments[2];
this.bianry = arguments[3];
this.decimal = arguments[4];
this.translation = arguments[5];
this.nature = arguments[6];
this.direction = arguments[7];
this.relation = arguments[8];
this.bodypart = arguments[9];
this.attribute = arguments[10];
this.state = arguments[11];
this.animal = arguments[12];
}else if(arguments.length==7){
this.symbol = arguments[0];
this.eng = arguments[1];
this.name = arguments[2];
this.logogram = arguments[3];
this.decimal = arguments[4];
this.RWilhelm = arguments[5];
this.modern = arguments[6];
}else{
return false;
}
}
var coin=[
{symbol:"", value:0},
{symbol:"|", value:1}
];
var iching=[
new ostated("kn","坤","","000",0,["the Receptive","Field"],["earth"],"southwest","mother","belly",["devoted","yeilding"],["receptive"],["cow"]),
new ostated("zhn","震","|","100",1,["the Arousing","Shake"],["thunder"],"east","first son","foot",["inciting movement"],["initiative"],["horse"]),
new ostated("kǎn","坎","|","010",2,["the Abysmal","Gorge"],["water"],"north","second son","ear",["dangerous"],["in-motion"],["pig"]),
new ostated("du","兌","||","110",3,["the Joyous","Open"],["swamp","marsh"],"west","third daughter","mouth",["pleasure"],["tranquil"],["sheep"]),
new ostated("gn","艮","|","001",4,["Keeping Still","Bound"],["mountain"],"northeast","third son","hand",["resting","stand-still"],["completion"],["wolf","dog"]),
new ostated("l","離","||","101",5,["the Clinging","Radiance"],["fire"],"south","second daughter","eye",["light-giving","dependence"],["clinging","clarity","adaptable"],["pheasant"]),
new ostated("xn","巽","||","011",6,["the Gentle","Ground"],["wind"],"southeast","first daughter","thigh",["penetrating"],["gentle entrance"],["fowl"]),
new ostated("qin","乾","|||","111",7,["the Creative","Force"],["heaven","sky"],"northwest","father","head",["strong"],["creative"],["dragon"])
];
var hexagram=[
new ostated("","Field","kn","困",2,"The Receptive","Needing Knowledge & Skill; Do not force matters and go with the flow"),
new ostated("|","Returning","f","復",24,"Return","Returning"),
new ostated("|","Leading","shi","師",6,"The Army","Bringing Together, Teamwork"),
new ostated("||","Nearing","ln","臨",19,"Approach","Approaching Goal, Arriving"),
new ostated("|","Humbling","qiān","謙",15,"Modesty","Being Reserved, Refraining"),
new ostated("||","Brightness Hiding","mng y","明夷",36,"Darkening of the Light","Brilliance Injured"),
new ostated("||","Ascending","shēng","升",46,"Pushing Upward","Growing Upward"),
new ostated("|||","Pervading","ti","泰",11,"Peace","Pervading"),
new ostated("|","Providing-For","y","豫",16,"Enthusiasm","Inducement, New Stimulus"),
new ostated("||","Shake","zhn","震",51,"Arousing","Mobilizing"),
new ostated("||","Taking-Apart","xi","解",40,"Deliverance","Liberation, Solution"),
new ostated("|||","Converting The Maiden","guī mi","歸妹",54,"The Marrying Maiden","Marrying"),
new ostated("||","Small Exceeding","xiǎo gu","小過",62,"Small Preponderance","Small Surpassing"),
new ostated("|||","Abounding","fēng","豐",55,"Abundance","Goal Reached, Ambition Achieved"),
new ostated("|||","Persevering","hng","恆",57,"Duration","Perseverance"),
new ostated("||||","Great Invigorating","d zhung","大壯",34,"Great Power","Great Boldness"),
new ostated("|","Grouping","bi","比",8,"Holding Together","Union"),
new ostated("||","Sprouting","zhun","屯",3,"Difficulty at the Beginning","Sprouting"),
new ostated("||","Gorge","kǎn","坎",29,"The Abysmal Water","Darkness, Gorge"),
new ostated("|||","Articulating","ji","節",60,"Limitation","Discipline"),
new ostated("||","Limping","jin","漸",39,"Obstruction","Halting, Hardship"),
new ostated("|||","Already Fording","j j","既濟",63,"After Completion","Completion"),
new ostated("|||","Welling","jǐng","井",48,"The Well","Replenishing, Renewal"),
new ostated("||||","Attending","xu","需",5,"Waiting","Uninvolvement (Wait for now), Nourishment"),
new ostated("||","Clustering","cu","萃",45,"Gathering Together","Association, Companionship"),
new ostated("|||","Following","su","隨",17,"Following","Following"),
new ostated("|||","Confining","kn","坤",47,"Oppression","Exhaustion"),
new ostated("||||","Open","du","兌",58,"The Joyous","Overt Influence"),
new ostated("|||","Conjoining","xin","咸",31,"Influence","Attraction"),
new ostated("||||","Skinning","g","革",49,"Revolution","Abolishing the Old"),
new ostated("||||","Great Exceeding","d gu","大過",28,"Great Preponderance","Great Surpassing"),
new ostated("|||||","Parting","gui","夬",43,"Breakthrough","Separation"),
new ostated("|","Stripping","bō","剝",23,"Splitting Apart","Stripping, Flaying"),
new ostated("||","Swallowing","y","益",27,"Mouth Corners","Seeking Nourishment"),
new ostated("||","Enveloping","mng","蒙",4,"Youthful Folly","Detained, Enveloped and Inexperienced"),
new ostated("|||","Diminishing","sǔn","損",41,"Decrease","Decrease"),
new ostated("||","Bound","gn","艮",52,"The Keeping Still","Immobility"),
new ostated("|||","Adorning","b","賁",22,"Grace","Embellishing"),
new ostated("|||","Corrupting","gŭ","蠱",18,"Work on the Decayed","Repairing"),
new ostated("||||","Great Accumulating","d ch","大畜",26,"Great Taming","Accumulating Wisdom"),
new ostated("||","Prospering","jn","晉",35,"Progress","Expansion, Promotion"),
new ostated("|||","Gnawing Bite","sh k","噬嗑",21,"Biting Through","Deciding"),
new ostated("|||","Not-Yet Fording","wi j","未濟",64,"Before Completion","Incompletion"),
new ostated("||||","Polarising","ku","睽",60,"Opposition","Division, Divergence"),
new ostated("|||","Sojourning","lǚ","旅",56,"The Wanderer","Travel"),
new ostated("||||","Radiance","l","離",30,"The Clinging","Clinging, Attachment"),
new ostated("||||","Holding","dǐng","鼎",50,"The Cauldron","Establishing the New"),
new ostated("|||||","Great Possessing","d you","大有",14,"Great Possession","Independence, Freedom"),
new ostated("||","Viewing","guān","觀",20,"Contemplation","The Withholding"),
new ostated("|||","Augmenting","y","頤",42,"Increase","Increase"),
new ostated("|||","Dispersing","hun","渙",59,"Dispersion","Dispersal"),
new ostated("||||","Centre Confirming","zhōng f","中孚",61,"Inner Truth","Staying Focused, Avoid Misrepresentation"),
new ostated("|||","Infiltrating","jiǎn","蹇",53,"Development","Auspicious Outlook, Infiltration"),
new ostated("||||","Dwelling People","jiā rn","家人",37,"The Family","Family"),
new ostated("||||","Ground","xn","巽",57,"The Gentle","Subtle Influence"),
new ostated("|||||","Small Accumulating","xiao ch","小畜",9,"Small Taming","Accumulating Resources"),
new ostated("|||","Obstruction","pi","否",12,"Standstill","Stagnation"),
new ostated("||||","Without Embroiling","w wng","無妄",25,"Innocence","Without Rashness"),
new ostated("||||","Arguing","sng","訟",6,"song","Conflict Engagement in Conflict"),
new ostated("|||||","Treading","lu","履",10,"Treading (Conduct)","Continuing with Alertness"),
new ostated("||||","Retiring","dn","遯",33,"Retreat","Withdrawing"),
new ostated("|||||","Concording People","tng rn","同人",13,"Fellowship","Fellowship, Partnership"),
new ostated("|||||","Coupling","gu","姤",44,"Coming to","Meet Encountering"),
new ostated("||||||","Force","qin","乾",1,"The Creative","Possessing Creative Power & Skill")
];
function rnd(n){
return n[Math.floor(Math.random()*n.length)];
}
function tossCoin(){
return rnd(coin)
}
function throwCoins(){
var value = 0;
for(var i=0;i<3;i++){
var d = tossCoin();
value+=Math.pow(2, i*d.value)
}
return iching[value];
}
function throwHexagram(){
var c1 = throwCoins();
var c2 = throwCoins();
return {
lowerTrigram:c1,
upperTrigram:c2
}
}
function writeit(){
var cssclassname='dailyiching';
if(window.CSSVariablesRule) cssclassname+="mac";
var hg = throwHexagram();
var lt = hg.lowerTrigram;
var ut = hg.upperTrigram;
var v1 = lt.decimal;
var v2 = ut.decimal;
var v3 = 8*v2;
var v4 = v1 + v3 - 0;
var v5 = 64 - v4;
var s ="<table class='"+cssclassname+"'><caption>"
+ "* "+lt.logogram+" ("+lt.name+") "+ut.logogram+" ("+ut.name+") *<br>"
+ "Hexagram: " + lt.symbol + " " + ut.symbol
+ "</caption><tr><td>"
+ "<table><caption>Inner Aspect: "+lt.symbol+"<br>("+lt.name+") "+rnd(lt.translation)+"</caption>"
+ "<tr><td>Nature:</td><td>"+rnd(lt.nature)+"</td></tr>"
+ "<tr><td>Direction:</td><td>"+lt.direction+"</td></tr>"
+ "<tr><td>Relation:</td><td>"+lt.relation+"</td></tr>"
+ "<tr><td>Body Part:</td><td>"+lt.bodypart+"</td></tr>"
+ "<tr><td>Attribute:</td><td>"+rnd(lt.attribute)+"</td></tr>"
+ "<tr><td>State:</td><td>"+rnd(lt.state)+"</td></tr>"
+ "<tr><td>Animal:</td><td>"+rnd(lt.animal)+"</td></tr>"
+ "</table>"
+ "</td><td>"
+ "<table><caption>Outer Aspect: "+ut.symbol+"<br>("+ut.name+") "+rnd(ut.translation)+"</caption>"
+ "<tr><td>Nature:</td><td>"+rnd(ut.nature)+"</td></tr>"
+ "<tr><td>Direction:</td><td>"+ut.direction+"</td></tr>"
+ "<tr><td>Relation:</td><td>"+ut.relation+"</td></tr>"
+ "<tr><td>Body Part:</td><td>"+ut.bodypart+"</td></tr>"
+ "<tr><td>Attribute:</td><td>"+rnd(ut.attribute)+"</td></tr>"
+ "<tr><td>State:</td><td>"+rnd(ut.state)+"</td></tr>"
+ "<tr><td>Animal:</td><td>"+rnd(ut.animal)+"</td></tr>"
+ "</table>"
+ "</td></tr><tr><td colspan='2'>"
+ "Modern Translation: " + "("+hexagram[v4].eng+") "+ hexagram[v4].modern
+ "<br><br>(Wikipedia: <a href='http://en.wikipedia.org/wiki/I_Ching_hexagram_"+hexagram[v4].decimal+"#Hexagram_"+hexagram[v4].decimal+"' target='_blank'>"+hexagram[v4].decimal+"</a>) "+hexagram[v4].symbol
+ "<div style='float:right;'>"+hexagram[v4].logogram+" ("+hexagram[v4].name+")</div>"
+ "</td></tr></table>";
return(s);
}
//one shot.
window["dailyiching"]=function(){document.write(writeit());delete window["dailyiching"];}
})();
</script>
</head>
<body>
<div id="optionalContainer">
<script>dailyiching();</script>
</div>
</body>
</html>


tested in ie,ff,safari,opera. tested in chrome prior to 3/1/12

felgall
03-02-2012, 01:10 AM
You might consider substituting the unicode values for those characters not part of the usual JavaScript characterset i \u9999 format - that way it is not as relaint on character encoding.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum