forked from Botanical/BotanJS
Restructure
This commit is contained in:
parent
a2c96cec64
commit
4cb79f9e85
@ -684,7 +684,7 @@
|
|||||||
|
|
||||||
var stage = c_body.parentNode
|
var stage = c_body.parentNode
|
||||||
BotanJS.addEventListener( "Responsive"
|
BotanJS.addEventListener( "Responsive"
|
||||||
/** e @type {Astro.Blog.Events.Responsive} */
|
/** e @type {Astro.Starfall.Events.Responsive} */
|
||||||
, function( e ) {
|
, function( e ) {
|
||||||
e.data.ratio < 1
|
e.data.ratio < 1
|
||||||
? stage.style.width = "100%"
|
? stage.style.width = "100%"
|
||||||
|
@ -1,2 +0,0 @@
|
|||||||
// __namespace( "Astro.Blog.Element.Footer" );
|
|
||||||
// __import( "Astro.Common.Element.Footer" );
|
|
@ -1 +0,0 @@
|
|||||||
// __namespace( "Astro.Blog.Element.Header" );
|
|
@ -1 +0,0 @@
|
|||||||
// __namespace( "Astro.Blog.Element.Layer" );
|
|
@ -1,63 +1,3 @@
|
|||||||
html, body { height: 100%; }
|
|
||||||
|
|
||||||
html { background-color: #222; }
|
|
||||||
|
|
||||||
body {
|
|
||||||
background-color: #F0F0F0;
|
|
||||||
font-family: custom-sans,Helvetica,Arial,STHeiti,"Microsoft JhengHei","微軟正黑體";
|
|
||||||
}
|
|
||||||
|
|
||||||
pre { font-family: monospace; }
|
|
||||||
|
|
||||||
::selection {
|
|
||||||
color: white;
|
|
||||||
background: purple;
|
|
||||||
}
|
|
||||||
::-moz-selection {
|
|
||||||
color: white;
|
|
||||||
background: purple;
|
|
||||||
}
|
|
||||||
|
|
||||||
p { padding: 0.5em; }
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: #333;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
sup { vertical-align: super; }
|
|
||||||
|
|
||||||
a:hover { text-decoration: underline; }
|
|
||||||
|
|
||||||
.clearfix {
|
|
||||||
clear: both;
|
|
||||||
padding: 0 !important;
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.begin-wrapper {
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
min-height: 100%;
|
|
||||||
background-color: #EBEAEF;
|
|
||||||
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mbody {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-column {
|
|
||||||
width: 85%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.right { text-align: right; }
|
|
||||||
.panel { padding: 0.5em 1.2em 1.2em 1.2em; }
|
|
||||||
|
|
||||||
/* transition properties */
|
|
||||||
div#header, div#mbody, div#contact, div#horizon {
|
div#header, div#mbody, div#contact, div#horizon {
|
||||||
|
|
||||||
-webkit-transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
-webkit-transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
||||||
@ -97,5 +37,3 @@ div#header, div#mbody, div#contact, div#horizon {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cw { animation-name: spin; }
|
.cw { animation-name: spin; }
|
||||||
|
|
||||||
/* end transition properties */
|
|
||||||
|
@ -5,14 +5,10 @@
|
|||||||
var Cycle = __import( "System.Cycle" );
|
var Cycle = __import( "System.Cycle" );
|
||||||
/** @type {System.Cycle.Trigger} */
|
/** @type {System.Cycle.Trigger} */
|
||||||
var Trigger = __import( "System.Cycle.Trigger" );
|
var Trigger = __import( "System.Cycle.Trigger" );
|
||||||
/** @type {System.utils.IKey} */
|
|
||||||
var IKey = __import( "System.utils.IKey" );
|
|
||||||
/** @type {System.utils.DataKey} */
|
/** @type {System.utils.DataKey} */
|
||||||
var DataKey = __import( "System.utils.DataKey" );
|
var DataKey = __import( "System.utils.DataKey" );
|
||||||
/** @type {Dandelion} */
|
/** @type {Dandelion} */
|
||||||
var Dand = __import( "Dandelion" );
|
var Dand = __import( "Dandelion" );
|
||||||
/** @type {Dandelion.IDOMObject} */
|
|
||||||
var IDOMObject = __import( "Dandelion.IDOMObject" );
|
|
||||||
/** @type {Dandelion.IDOMElement} */
|
/** @type {Dandelion.IDOMElement} */
|
||||||
var IDOMElement = __import( "Dandelion.IDOMElement" );
|
var IDOMElement = __import( "Dandelion.IDOMElement" );
|
||||||
/** @type {Dandelion.Window} */
|
/** @type {Dandelion.Window} */
|
||||||
@ -29,49 +25,24 @@
|
|||||||
// __import( "Dandelion.CSSReset" ); CSS_RESERVATION
|
// __import( "Dandelion.CSSReset" ); CSS_RESERVATION
|
||||||
// __import( "Dandelion.CSSAnimations" ); CSS_RESERVATION
|
// __import( "Dandelion.CSSAnimations" ); CSS_RESERVATION
|
||||||
// __import( "Astro.Blog.SharedStyle" ); CSS_RESERVATION
|
// __import( "Astro.Blog.SharedStyle" ); CSS_RESERVATION
|
||||||
// __import( "Astro.Blog.Element.Layer" ); CSS_RESERVATION
|
// __import( "Astro.Starfall.Element.Layer" ); CSS_RESERVATION
|
||||||
|
|
||||||
/** @function {System.Net.getData} */
|
/** @function {System.Net.getData} */
|
||||||
var getData = __import( "System.Net.getData" );
|
var getData = __import( "System.Net.getData" );
|
||||||
|
|
||||||
var main;
|
|
||||||
var header;
|
var header;
|
||||||
var main_h;
|
|
||||||
|
|
||||||
// menu and horizon
|
// menu and horizon
|
||||||
var horizon;
|
var horizon;
|
||||||
var contact;
|
var contact;
|
||||||
var contaht_page;
|
var contact_page;
|
||||||
var collapse_panel;
|
var collapse_panel;
|
||||||
var c_expand = false;
|
var c_expand = false;
|
||||||
var savedPath;
|
|
||||||
|
|
||||||
var init = function ()
|
var init = function ()
|
||||||
{
|
{
|
||||||
// Footer at bottom
|
|
||||||
var padder = Dand.wrap();
|
|
||||||
var begin_wrapper = Dand.id( "begin-wrapper" );
|
|
||||||
var content_wrapper = Dand.id( "mbody" );
|
|
||||||
var footer = Dand.tag( "footer" );
|
|
||||||
var fhorizon = Dand.id( "fhorizon" );
|
|
||||||
|
|
||||||
if( footer.length )
|
|
||||||
{
|
|
||||||
footer = footer[0];
|
|
||||||
var fheight = footer.scrollHeight || footer.offsetHeight;
|
|
||||||
var hheight = fhorizon.scrollHeight || fhorizon.offsetHeight;
|
|
||||||
|
|
||||||
padder.style.height = ( fheight + hheight ) + "px";
|
|
||||||
begin_wrapper.style.marginBottom = "-" + fheight + "px";
|
|
||||||
}
|
|
||||||
|
|
||||||
content_wrapper.appendChild( padder );
|
|
||||||
|
|
||||||
IDOMObject( window ).addEventListener( "Resize", responsify );
|
|
||||||
|
|
||||||
initTopButton();
|
initTopButton();
|
||||||
navControl();
|
navControl();
|
||||||
responsify( null, true );
|
|
||||||
initBackgroundParallax();
|
initBackgroundParallax();
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -81,7 +52,6 @@
|
|||||||
// init params
|
// init params
|
||||||
header = Dand.id( "header" );
|
header = Dand.id( "header" );
|
||||||
horizon = Dand.id( "horizon" );
|
horizon = Dand.id( "horizon" );
|
||||||
main = Dand.id( "mbody" );
|
|
||||||
|
|
||||||
contact_page = Dand.id( "contact" );
|
contact_page = Dand.id( "contact" );
|
||||||
collapse_panel = Dand.id( "collapse_panel" );
|
collapse_panel = Dand.id( "collapse_panel" );
|
||||||
@ -149,24 +119,6 @@
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/** @type {Dandelion.IDOMElement} */
|
|
||||||
var rspd_ratio = 0;
|
|
||||||
var responsify = function( e, override )
|
|
||||||
{
|
|
||||||
// Ratio changes would trigger content
|
|
||||||
var ratio = wsupp.clientWidth / wsupp.clientHeight;
|
|
||||||
|
|
||||||
// Swap only on ration changes from 1 < x OR x < 1
|
|
||||||
if( ( ratio < 1.2 && 1.2 < rspd_ratio ) || ( 1.2 < ratio && rspd_ratio < 1.2 ) || override )
|
|
||||||
{
|
|
||||||
rspd_ratio = ratio;
|
|
||||||
debug.Info( "Responsive Event: R = " + ratio );
|
|
||||||
|
|
||||||
BotanJS.dispatchEvent( new BotanEvent( "Responsive", { "ratio": ratio } ) );
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
/////// Menu
|
/////// Menu
|
||||||
// Contact
|
// Contact
|
||||||
var expandContact = function ()
|
var expandContact = function ()
|
||||||
|
2
botanjs/src/Astro/Starfall/Element/Footer.js
Normal file
2
botanjs/src/Astro/Starfall/Element/Footer.js
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
// __namespace( "Astro.Starfall.Element.Footer" );
|
||||||
|
// __import( "Astro.Common.Element.Footer" );
|
1
botanjs/src/Astro/Starfall/Element/Header.js
Normal file
1
botanjs/src/Astro/Starfall/Element/Header.js
Normal file
@ -0,0 +1 @@
|
|||||||
|
// __namespace( "Astro.Starfall.Element.Header" );
|
1
botanjs/src/Astro/Starfall/Element/Layer.js
Normal file
1
botanjs/src/Astro/Starfall/Element/Layer.js
Normal file
@ -0,0 +1 @@
|
|||||||
|
// __namespace( "Astro.Starfall.Element.Layer" );
|
58
botanjs/src/Astro/Starfall/Layout/MainFrame.css
Normal file
58
botanjs/src/Astro/Starfall/Layout/MainFrame.css
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
html, body { height: 100%; }
|
||||||
|
|
||||||
|
html { background-color: #222; }
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: #F0F0F0;
|
||||||
|
font-family: custom-sans,Helvetica,Arial,STHeiti,"Microsoft JhengHei","微軟正黑體";
|
||||||
|
}
|
||||||
|
|
||||||
|
pre { font-family: monospace; }
|
||||||
|
|
||||||
|
::selection {
|
||||||
|
color: white;
|
||||||
|
background: purple;
|
||||||
|
}
|
||||||
|
::-moz-selection {
|
||||||
|
color: white;
|
||||||
|
background: purple;
|
||||||
|
}
|
||||||
|
|
||||||
|
p { padding: 0.5em; }
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #333;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup { vertical-align: super; }
|
||||||
|
|
||||||
|
a:hover { text-decoration: underline; }
|
||||||
|
|
||||||
|
.clearfix {
|
||||||
|
clear: both;
|
||||||
|
padding: 0 !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.begin-wrapper {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
min-height: 100%;
|
||||||
|
background-color: #EBEAEF;
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mbody {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-column {
|
||||||
|
width: 85%;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right { text-align: right; }
|
||||||
|
.panel { padding: 0.5em 1.2em 1.2em 1.2em; }
|
61
botanjs/src/Astro/Starfall/Layout/MainFrame.js
Normal file
61
botanjs/src/Astro/Starfall/Layout/MainFrame.js
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
(function(){
|
||||||
|
var ns = __namespace( "Astro.Starfall.Layout.MainFrame" );
|
||||||
|
|
||||||
|
/** @type {Dandelion} */
|
||||||
|
var Dand = __import( "Dandelion" );
|
||||||
|
/** @type {Dandelion.IDOMObject} */
|
||||||
|
var IDOMObject = __import( "Dandelion.IDOMObject" );
|
||||||
|
/** @type {Dandelion.Window} */
|
||||||
|
var wsupp = __import( "Dandelion.Window" );
|
||||||
|
/** @type {System.Debug} */
|
||||||
|
var debug = __import( "System.Debug" );
|
||||||
|
/** @type {Astro.Bootstrap} */
|
||||||
|
var Bootstrap = __import( "Astro.Bootstrap" );
|
||||||
|
|
||||||
|
// __import( "Astro.Starfall.Element.Layer" ); CSS_RESERVATION
|
||||||
|
|
||||||
|
var init = function ()
|
||||||
|
{
|
||||||
|
console.log( "HERE" );
|
||||||
|
// Footer at bottom
|
||||||
|
var padder = Dand.wrap();
|
||||||
|
var begin_wrapper = Dand.id( "begin-wrapper" );
|
||||||
|
var content_wrapper = Dand.id( "mbody" );
|
||||||
|
var footer = Dand.tag( "footer" );
|
||||||
|
var fhorizon = Dand.id( "fhorizon" );
|
||||||
|
|
||||||
|
if( footer.length )
|
||||||
|
{
|
||||||
|
footer = footer[0];
|
||||||
|
var fheight = footer.scrollHeight || footer.offsetHeight;
|
||||||
|
var hheight = fhorizon.scrollHeight || fhorizon.offsetHeight;
|
||||||
|
|
||||||
|
padder.style.height = ( fheight + hheight ) + "px";
|
||||||
|
begin_wrapper.style.marginBottom = "-" + fheight + "px";
|
||||||
|
}
|
||||||
|
|
||||||
|
content_wrapper.appendChild( padder );
|
||||||
|
|
||||||
|
IDOMObject( window ).addEventListener( "Resize", responsify );
|
||||||
|
|
||||||
|
responsify( null, true );
|
||||||
|
};
|
||||||
|
|
||||||
|
var rspd_ratio = 0;
|
||||||
|
var responsify = function( e, override )
|
||||||
|
{
|
||||||
|
// Ratio changes would trigger content
|
||||||
|
var ratio = wsupp.clientWidth / wsupp.clientHeight;
|
||||||
|
|
||||||
|
// Swap only on ration changes from 1 < x OR x < 1
|
||||||
|
if( ( ratio < 1.2 && 1.2 < rspd_ratio ) || ( 1.2 < ratio && rspd_ratio < 1.2 ) || override )
|
||||||
|
{
|
||||||
|
rspd_ratio = ratio;
|
||||||
|
debug.Info( "Responsive Event: R = " + ratio );
|
||||||
|
|
||||||
|
BotanJS.dispatchEvent( new BotanEvent( "Responsive", { "ratio": ratio } ) );
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Bootstrap.regInit( init );
|
||||||
|
})();
|
@ -1,5 +1,5 @@
|
|||||||
(function(){
|
(function(){
|
||||||
var ns = __namespace( "Astro.Blog.Layout.PureColumn" );
|
var ns = __namespace( "Astro.Starfall.Layout.PureColumn" );
|
||||||
|
|
||||||
/** @type {Astro.Bootstrap} */
|
/** @type {Astro.Bootstrap} */
|
||||||
var Bootstrap = __import( "Astro.Bootstrap" );
|
var Bootstrap = __import( "Astro.Bootstrap" );
|
@ -1,5 +1,5 @@
|
|||||||
(function(){
|
(function(){
|
||||||
var ns = __namespace( "Astro.Blog.Layout.TwoColumn" );
|
var ns = __namespace( "Astro.Starfall.Layout.TwoColumn" );
|
||||||
|
|
||||||
/** @type {Dandelion} */
|
/** @type {Dandelion} */
|
||||||
var Dand = __import( "Dandelion" );
|
var Dand = __import( "Dandelion" );
|
||||||
@ -12,7 +12,7 @@
|
|||||||
if( rspd )
|
if( rspd )
|
||||||
{
|
{
|
||||||
BotanJS.addEventListener( "Responsive"
|
BotanJS.addEventListener( "Responsive"
|
||||||
/** e @type {Astro.Blog.Events.Responsive} */
|
/** e @type {Astro.Starfall.Events.Responsive} */
|
||||||
, function( e ) {
|
, function( e ) {
|
||||||
rspd.foreach(
|
rspd.foreach(
|
||||||
document.ELEMENT_NODE
|
document.ELEMENT_NODE
|
3
botanjs/src/Astro/Starfall/_this.js
Normal file
3
botanjs/src/Astro/Starfall/_this.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
(function(){
|
||||||
|
var ns = __namespace( "Astro.Starfall.Layout" );
|
||||||
|
})();
|
Loading…
Reference in New Issue
Block a user