I'm trying to add fast-rendering into my current app, which uses flow-router.
I've imported the router.js in both client as well as server, and added the subscriptions() function to my route definition, like so:
FlowRouter.route('/', {
name: 'Main',
subscriptions() {
this.register('allTeams', Meteor.subscribe('allTeams'));
},
action() {
mount(Basic, { content: <App /> });
},
});
But this doesn't seem to work as the initial HTML loaded doesn't seem to include the initial load data
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" class="__meteor-css__" href="/merged-stylesheets.css?hash=66297db7ce0861d8515cbc9745f889f7a44afb3e">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
<title>Clicky!</title>
</head>
<body>
<script type="text/javascript">__meteor_runtime_config__ = JSON.parse(decodeURIComponent("%7B%22meteorRelease%22%3A%22METEOR%401.5.1%22%2C%22meteorEnv%22%3A%7B%22NODE_ENV%22%3A%22development%22%2C%22TEST_METADATA%22%3A%22%7B%7D%22%7D%2C%22PUBLIC_SETTINGS%22%3A%7B%7D%2C%22ROOT_URL%22%3A%22http%3A%2F%2Flocalhost%3A3000%2F%22%2C%22ROOT_URL_PATH_PREFIX%22%3A%22%22%2C%22appId%22%3A%2211tfp6ttdhgdpo3wzz4%22%2C%22autoupdateVersion%22%3A%22d3ada84377c112891c944017fc4fb1996ab2f202%22%2C%22autoupdateVersionRefreshable%22%3A%2214dfede7f12a46ade065ec58219591137c679eab%22%2C%22autoupdateVersionCordova%22%3A%22none%22%7D"));</script>
<script type="text/javascript" src="/packages/underscore.js?hash=cde485f60699ff9aced3305f70189e39c665183c"></script>
<script type="text/javascript" src="/packages/meteor.js?hash=814eae5b938a9a89ce7cf9174c98be4982f953d8"></script>
<script type="text/javascript" src="/packages/meteor-base.js?hash=a4d07a6b394e56bbe6ccc773c95e7cdb3434960d"></script>
<script type="text/javascript" src="/packages/mobile-experience.js?hash=8ded3e69a3e367f321ab9a2b52e3ecdd2661a365"></script>
<script type="text/javascript" src="/packages/babel-compiler.js?hash=a9546d4e245cfe40b406e08d40bf106241f01683"></script>
<script type="text/javascript" src="/packages/ecmascript.js?hash=370a8752194bcf73be7fffa3635715d0fbf7853d"></script>
<script type="text/javascript" src="/packages/base64.js?hash=0053489bb30bb5c0e3545df151f83e41150344b0"></script>
<script type="text/javascript" src="/packages/ejson.js?hash=0f17ced99d522d48cd8f8b2139167fd06babd969"></script>
<script type="text/javascript" src="/packages/id-map.js?hash=c7aea8dfa2bf46ff2ae0aa6c6cf09e36abc61d07"></script>
<script type="text/javascript" src="/packages/ordered-dict.js?hash=bacdd1852075630a01f7de783e5e8e8aa8541cdc"></script>
<script type="text/javascript" src="/packages/tracker.js?hash=997515fa2d5b0530ba07741da556c4b36963ef3b"></script>
<script type="text/javascript" src="/packages/modules-runtime.js?hash=8587d188e038b75ecd27ed2469a52b269e38fb62"></script>
<script type="text/javascript" src="/packages/modules.js?hash=f54f0a303135090c544bc624c0d33aa81f2519e3"></script>
<script type="text/javascript" src="/packages/ecmascript-runtime.js?hash=ed0d1c9624ff822ac7a673101e02acc5a1471a22"></script>
<script type="text/javascript" src="/packages/es5-shim.js?hash=4187fffd3f43294b6953a57a6a17c24fbf2af5d2"></script>
<script type="text/javascript" src="/packages/promise.js?hash=68cae2c639c7a67d8dbe7d0ec4dbc81aefc182aa"></script>
<script type="text/javascript" src="/packages/babel-runtime.js?hash=19ef5d5ba37e9a2d052fbaadafbe5079845d8f26"></script>
<script type="text/javascript" src="/packages/ecmascript-runtime-client.js?hash=ebe5054265cd34dd320c7a8cc00c62601ba9f58b"></script>
<script type="text/javascript" src="/packages/random.js?hash=49bdca10b45b36115e6aa1acbc9dd294091ea928"></script>
<script type="text/javascript" src="/packages/mongo-id.js?hash=345d169d517353f8146292b4abd24061721f8b26"></script>
<script type="text/javascript" src="/packages/diff-sequence.js?hash=15014d7b1e11c05111a386992e684ab1d3cc4158"></script>
<script type="text/javascript" src="/packages/geojson-utils.js?hash=401d570cf4ab9b4470b0a68dfab45f3321d9fceb"></script>
<script type="text/javascript" src="/packages/minimongo.js?hash=4f5c421ee64a333e2a96f515d4287fc153ec9252"></script>
<script type="text/javascript" src="/packages/check.js?hash=a2540f962c925251e9ed815a46332e7712760474"></script>
<script type="text/javascript" src="/packages/retry.js?hash=1e409617b538ff3e2b0238b15e45b3380c51a224"></script>
<script type="text/javascript" src="/packages/ddp-common.js?hash=83c6dba3051ec76b5c1cd85d39357f0f501add98"></script>
<script type="text/javascript" src="/packages/reload.js?hash=02487cd11db41d01f7837ad146e4680a9e8d2e12"></script>
<script type="text/javascript" src="/packages/ddp-client.js?hash=14d966b7972bd95a1f7015fec9ac340f10508a44"></script>
<script type="text/javascript" src="/packages/ddp.js?hash=25dc3f428447c81620c91c4245dbc6e4f7d32fb7"></script>
<script type="text/javascript" src="/packages/ddp-server.js?hash=1beefbc7bd033ea687e7ab8fbd5694df072662af"></script>
<script type="text/javascript" src="/packages/allow-deny.js?hash=92ac887172b3b2c2522bf4c9a634d90247b338d4"></script>
<script type="text/javascript" src="/packages/mongo.js?hash=e92cf37034f2703254bf91c2d4a148271b91342c"></script>
<script type="text/javascript" src="/packages/blaze-html-templates.js?hash=6e8335ce66460e45f00da73c7497654c5e26e236"></script>
<script type="text/javascript" src="/packages/reactive-var.js?hash=ec712fa3ae588c4a1e7017f0bb4507c725391225"></script>
<script type="text/javascript" src="/packages/standard-minifier-css.js?hash=cfe82682f4394d3ffc6335555c1f9f3f73294507"></script>
<script type="text/javascript" src="/packages/standard-minifier-js.js?hash=041bab58c8a89172eaab795deb5d96e38b64ec37"></script>
<script type="text/javascript" src="/packages/shell-server.js?hash=6ff1313e4bf7618e577eb2604a580b2ea9b7631f"></script>
<script type="text/javascript" src="/packages/reactive-dict.js?hash=6fb8f893720a4d179c0db118d90d5e7eef5153d6"></script>
<script type="text/javascript" src="/packages/jquery.js?hash=0c5fac3e4b18ec685e561deac3634fb49bc807e5"></script>
<script type="text/javascript" src="/packages/meteorhacks_inject-data.js?hash=4761d8bfeaaee92da0178e51bd787e28865b70a7"></script>
<script type="text/javascript" src="/packages/chuangbo_cookie.js?hash=678eb757a3052e339582a74e75c3cd3cffe8a40f"></script>
<script type="text/javascript" src="/packages/deps.js?hash=7313f5a2685c6c2c673c78c15c8ce86ff59ab0c9"></script>
<script type="text/javascript" src="/packages/ddp-rate-limiter.js?hash=457af847f89d207a6ca630c56f06d2a3af3a414c"></script>
<script type="text/javascript" src="/packages/localstorage.js?hash=b8f7913d89016e62d42164380fabfc1366797d36"></script>
<script type="text/javascript" src="/packages/callback-hook.js?hash=e15ed8aa52e7c647efd9f4854e8a0fe4e40808fc"></script>
<script type="text/javascript" src="/packages/observe-sequence.js?hash=8fe58036c6ba00c458f54c360a21fd0e41fb7ee0"></script>
<script type="text/javascript" src="/packages/htmljs.js?hash=1ac878018eee6c53ed1375dc7ee75fc6865666ae"></script>
<script type="text/javascript" src="/packages/blaze.js?hash=f33d3dfed63a491d24e3aa07ad66c24b5fe8c761"></script>
<script type="text/javascript" src="/packages/accounts-base.js?hash=6a4c856fbcc54a9e0a584a6e104ef7d16b8ec5f6"></script>
<script type="text/javascript" src="/packages/meteorhacks_fast-render.js?hash=543e29057cacad25a0d6f18583d56805b77133e5"></script>
<script type="text/javascript" src="/packages/kadira_flow-router.js?hash=310d7cd0f453b68e1f11fa81928610fb20813e66"></script>
<script type="text/javascript" src="/packages/tmeasday_check-npm-versions.js?hash=dc479d10bd43094d77b8fa694b90aea8d3404e27"></script>
<script type="text/javascript" src="/packages/react-meteor-data.js?hash=ce32adc2cecffb9535e28d205cc53eef5ae36327"></script>
<script type="text/javascript" src="/packages/aldeed_simple-schema.js?hash=13e803ef04b6685a7577083e5871767a498b6351"></script>
<script type="text/javascript" src="/packages/raix_eventemitter.js?hash=b009bf66474c7942360d5e2bba2398ec847d81dc"></script>
<script type="text/javascript" src="/packages/aldeed_collection2-core.js?hash=cd76f0a8f289f873c33e0896e9a86201e64a47d1"></script>
<script type="text/javascript" src="/packages/aldeed_schema-index.js?hash=2ca1861c8f7de7459aa47835657b11b4e560c8e7"></script>
<script type="text/javascript" src="/packages/aldeed_schema-deny.js?hash=c46f0998a459ed45c0c557fcb85c31b85c40e7d4"></script>
<script type="text/javascript" src="/packages/aldeed_collection2.js?hash=2a40052f92753d39451338b55e6d318a4bf46a3b"></script>
<script type="text/javascript" src="/packages/fourseven_scss.js?hash=080f9a0a149e205f9ebc6171dc54f856dba838ab"></script>
<script type="text/javascript" src="/packages/materialize_materialize.js?hash=cad3a0b9203285245063c348bd2e2aed7f7c9573"></script>
<script type="text/javascript" src="/packages/webapp.js?hash=21a471b5e10ef4f65b9925eaf8d227797c060a10"></script>
<script type="text/javascript" src="/packages/livedata.js?hash=7cf1831a60b48e304b054aee1ae0f7e38ff35d09"></script>
<script type="text/javascript" src="/packages/dynamic-import.js?hash=d3e0fe1c9fb2d37129ef347d1ee905ade2691f6c"></script>
<script type="text/javascript" src="/packages/hot-code-push.js?hash=2e864a0bdd0d5f686115099f8c48eb6c866b5b14"></script>
<script type="text/javascript" src="/packages/spacebars.js?hash=ebf9381e7fc625d41acb0df14995b7614360858a"></script>
<script type="text/javascript" src="/packages/templating-compiler.js?hash=a71883cdec50e95ca135291415990753ed6d57fc"></script>
<script type="text/javascript" src="/packages/templating-runtime.js?hash=c18de19afda6e9f0db7faf3d4382a4c953cabe18"></script>
<script type="text/javascript" src="/packages/templating.js?hash=c2cf38de06efb47f67affb2dff9320e5eef33893"></script>
<script type="text/javascript" src="/packages/launch-screen.js?hash=2f56943306c7e900ed9f4d894b87f534ebffeaeb"></script>
<script type="text/javascript" src="/packages/ui.js?hash=039c55a98376abd03d9d8cd4100895861b897643"></script>
<script type="text/javascript" src="/packages/autoupdate.js?hash=1fd9cf3472adaa6887170d88ab5ea1ddabf695fa"></script>
<script type="text/javascript" src="/packages/global-imports.js?hash=aefba5f001df7c63d154d4128a2752b411556608"></script>
<script type="text/javascript" src="/app/app.js?hash=965d954fd523022df05f94b1167321ba34799b8e"></script>
<script type="text/javascript" src="/packages/mdg_validation-error.js?hash=9df8c3f9376af1b92879fee50b9a91c60e2cfaf2"></script>
<script type="text/javascript" src="/packages/service-configuration.js?hash=42ac9ae8eb44f3e73762f9cb0003410397021984"></script>
</body>
</html>
Am I missing something?
Fixed! Found a forked repo with a fix
meteor add staringatlights:fast-render
instead of
meteor add meteorhacks:fast-render
Related
I'am a beginner in meteor.js, so know I'm trying to optimize meteor app.
I noticed that there are a lot of includes in page.
Anybody knows how to get rid of them?
here it is:
<script type="text/javascript">__meteor_runtime_config__ = JSON.parse(decodeURIComponent("%7B%22meteorRelease%22%3A%22METEOR%401.4.2.3%22%2C%22meteorEnv%22%3A%7B%22NODE_ENV%22%3A%22development%22%2C%22TEST_METADATA%22%3A%22%7B%7D%22%7D%2C%22PUBLIC_SETTINGS%22%3A%7B%7D%2C%22ROOT_URL%22%3A%22http%3A%2F%2Flocalhost%3A3000%2F%22%2C%22ROOT_URL_PATH_PREFIX%22%3A%22%22%2C%22appId%22%3A%223lv5c21c0ikr9qpyaa9%22%2C%22autoupdateVersion%22%3A%22e07242d68a165ae640e730c0dd787691b4268550%22%2C%22autoupdateVersionRefreshable%22%3A%22f4f9f237151a8c4325bd029b5e7eceb5b2797974%22%2C%22autoupdateVersionCordova%22%3A%22none%22%7D"));</script>
<script type="text/javascript" src="/packages/underscore.js?hash=cde485f60699ff9aced3305f70189e39c665183c"></script>
<script type="text/javascript" src="/packages/meteor.js?hash=e3f53db3be730057fed1a5f709ecd5fc7cae1229"></script>
<script type="text/javascript" src="/packages/meteor-base.js?hash=a4d07a6b394e56bbe6ccc773c95e7cdb3434960d"></script>
<script type="text/javascript" src="/packages/mobile-experience.js?hash=8ded3e69a3e367f321ab9a2b52e3ecdd2661a365"></script>
<script type="text/javascript" src="/packages/modules-runtime.js?hash=637cb12b6fd3acf3ffbfcf0f2ee1cf3988a7f1fe"></script>
<script type="text/javascript" src="/packages/modules.js?hash=fff25e49208022bdf509af1c4e5fade57e29f302"></script>
<script type="text/javascript" src="/packages/es5-shim.js?hash=adc3c6270d5697523fe2a72e73428390b7eba83a"></script>
<script type="text/javascript" src="/packages/promise.js?hash=33f3b940f94952cb3a44d500099467511da0b575"></script>
<script type="text/javascript" src="/packages/ecmascript-runtime.js?hash=d0c1e87c070810a617a5853c970ab05284650255"></script>
<script type="text/javascript" src="/packages/babel-compiler.js?hash=a9546d4e245cfe40b406e08d40bf106241f01683"></script>
<script type="text/javascript" src="/packages/ecmascript.js?hash=370a8752194bcf73be7fffa3635715d0fbf7853d"></script>
<script type="text/javascript" src="/packages/base64.js?hash=0053489bb30bb5c0e3545df151f83e41150344b0"></script>
<script type="text/javascript" src="/packages/ejson.js?hash=0f17ced99d522d48cd8f8b2139167fd06babd969"></script>
<script type="text/javascript" src="/packages/id-map.js?hash=c7aea8dfa2bf46ff2ae0aa6c6cf09e36abc61d07"></script>
<script type="text/javascript" src="/packages/ordered-dict.js?hash=bacdd1852075630a01f7de783e5e8e8aa8541cdc"></script>
<script type="text/javascript" src="/packages/tracker.js?hash=9f8a0cec09c662aad5a5e224447b2d4e88d011ef"></script>
<script type="text/javascript" src="/packages/babel-runtime.js?hash=cd7adc00903a7005bb7fbad73ca0c3986be427d1"></script>
<script type="text/javascript" src="/packages/random.js?hash=31dadb9d3427506dd30dc50f5c898837e69e739b"></script>
<script type="text/javascript" src="/packages/mongo-id.js?hash=345d169d517353f8146292b4abd24061721f8b26"></script>
<script type="text/javascript" src="/packages/diff-sequence.js?hash=15014d7b1e11c05111a386992e684ab1d3cc4158"></script>
<script type="text/javascript" src="/packages/geojson-utils.js?hash=b204c7d4caf119e6883522fb87c6cce060724bf0"></script>
<script type="text/javascript" src="/packages/minimongo.js?hash=66cc6ab213289f154f49d61566dba8ff9dfc33b2"></script>
<script type="text/javascript" src="/packages/check.js?hash=63d7478b74cadc04d378bc2266ea8bd1bf6849d8"></script>
<script type="text/javascript" src="/packages/retry.js?hash=1e409617b538ff3e2b0238b15e45b3380c51a224"></script>
<script type="text/javascript" src="/packages/ddp-common.js?hash=d42359bcace6c66ac90e2782193494253ee68155"></script>
<script type="text/javascript" src="/packages/reload.js?hash=628b069673bffbc7390ba84ece8809c8c88c2eed"></script>
<script type="text/javascript" src="/packages/ddp-client.js?hash=bc32a166cd269e06a394f9418e0024d805bab379"></script>
<script type="text/javascript" src="/packages/ddp.js?hash=25dc3f428447c81620c91c4245dbc6e4f7d32fb7"></script>
<script type="text/javascript" src="/packages/ddp-server.js?hash=1beefbc7bd033ea687e7ab8fbd5694df072662af"></script>
<script type="text/javascript" src="/packages/allow-deny.js?hash=c9344ef36901e05cbb58a8485e17433dac946bdc"></script>
<script type="text/javascript" src="/packages/mongo.js?hash=c4281c0ff989ebee020f59f5a7b0735053cea5f7"></script>
<script type="text/javascript" src="/packages/blaze-html-templates.js?hash=6e8335ce66460e45f00da73c7497654c5e26e236"></script>
<script type="text/javascript" src="/packages/reactive-var.js?hash=ec712fa3ae588c4a1e7017f0bb4507c725391225"></script>
<script type="text/javascript" src="/packages/jquery.js?hash=c57b3cfa0ca9c66400d4456b6f6f1e486ee10aad"></script>
<script type="text/javascript" src="/packages/standard-minifier-css.js?hash=cfe82682f4394d3ffc6335555c1f9f3f73294507"></script>
<script type="text/javascript" src="/packages/standard-minifier-js.js?hash=041bab58c8a89172eaab795deb5d96e38b64ec37"></script>
<script type="text/javascript" src="/packages/shell-server.js?hash=6ff1313e4bf7618e577eb2604a580b2ea9b7631f"></script>
<script type="text/javascript" src="/packages/deps.js?hash=7313f5a2685c6c2c673c78c15c8ce86ff59ab0c9"></script>
<script type="text/javascript" src="/packages/observe-sequence.js?hash=7657a09b18583bf0e90cc7b86aa029572767a87f"></script>
<script type="text/javascript" src="/packages/htmljs.js?hash=1ac878018eee6c53ed1375dc7ee75fc6865666ae"></script>
<script type="text/javascript" src="/packages/blaze.js?hash=9d08dd7dde99958947679827a947134cdf2e4f12"></script>
<script type="text/javascript" src="/packages/ui.js?hash=039c55a98376abd03d9d8cd4100895861b897643"></script>
<script type="text/javascript" src="/packages/spacebars.js?hash=ebf9381e7fc625d41acb0df14995b7614360858a"></script>
<script type="text/javascript" src="/packages/templating-compiler.js?hash=a71883cdec50e95ca135291415990753ed6d57fc"></script>
<script type="text/javascript" src="/packages/templating-runtime.js?hash=c18de19afda6e9f0db7faf3d4382a4c953cabe18"></script>
<script type="text/javascript" src="/packages/templating.js?hash=c2cf38de06efb47f67affb2dff9320e5eef33893"></script>
<script type="text/javascript" src="/packages/iron_core.js?hash=eb27a7eaa0318536b619a36fbd2c9d45cd833bc9"></script>
<script type="text/javascript" src="/packages/iron_dynamic-template.js?hash=7644dc7260de827ef1e361a75159fcc8af9fc074"></script>
<script type="text/javascript" src="/packages/iron_layout.js?hash=b2030df3beb941a1eb0eeaf4d68c7f4c145ec14a"></script>
<script type="text/javascript" src="/packages/iron_url.js?hash=ef0d02430901394d674ecc46d12f8d3c557e31c0"></script>
<script type="text/javascript" src="/packages/iron_middleware-stack.js?hash=e5ffae14128fa7f2aa1e3c04bb343146e1dfec09"></script>
<script type="text/javascript" src="/packages/iron_location.js?hash=1a6ee647a94fae1d34d1b5074ec4dfebfe6f1bd3"></script>
<script type="text/javascript" src="/packages/reactive-dict.js?hash=6e313616fd3cbca06ed28d63ffd0164d2a78d804"></script>
<script type="text/javascript" src="/packages/iron_controller.js?hash=eb63ea93809dcd3a8f40ad258e0997969a4d3ebc"></script>
<script type="text/javascript" src="/packages/iron_router.js?hash=017cbcf91efe3e433391e5dcfa2f6ae06a124b46"></script>
<script type="text/javascript" src="/packages/sacha_spin.js?hash=ddf0981d5d15b5595b1d93642b2710ed3b1c7763"></script>
<script type="text/javascript" src="/packages/stylus.js?hash=dcbbc27dc6329f453854e5b19bd0f8aefa82fb05"></script>
<script type="text/javascript" src="/packages/session.js?hash=821b0746e602b3be69538d299d6866e222121b54"></script>
<script type="text/javascript" src="/packages/twbs_bootstrap.js?hash=2ee228e6c80c1d9a4b1e67e10006f8a5a425ddda"></script>
<script type="text/javascript" src="/packages/ddp-rate-limiter.js?hash=457af847f89d207a6ca630c56f06d2a3af3a414c"></script>
<script type="text/javascript" src="/packages/localstorage.js?hash=0e2106503b232ac80073b6e8ef206e988c5aca5b"></script>
<script type="text/javascript" src="/packages/callback-hook.js?hash=e15ed8aa52e7c647efd9f4854e8a0fe4e40808fc"></script>
<script type="text/javascript" src="/packages/accounts-base.js?hash=dfba72beacc01e72b0f8fb3d7770c95ac774f2b8"></script>
<script type="text/javascript" src="/packages/anti_i18n.js?hash=8960dc7613ff1467b213e4ed2dec27fb491d232b"></script>
<script type="text/javascript" src="/packages/sha.js?hash=04013281f0c21857cac3458d88a0dd86b20109ba"></script>
<script type="text/javascript" src="/packages/srp.js?hash=85fa5b3bc1440273f8fa5125df5443c09f337567"></script>
<script type="text/javascript" src="/packages/accounts-password.js?hash=6d4e41828e1dfcc45ff74267779a4e5ecdcd9eda"></script>
<script type="text/javascript" src="/packages/ian_accounts-ui-bootstrap-3.js?hash=e27c97032efae26b11dd04146509e767d9194a4d"></script>
<script type="text/javascript" src="/packages/webapp.js?hash=3026d4501b6e3076a0aea1f7628466ebbe004a29"></script>
<script type="text/javascript" src="/packages/livedata.js?hash=7cf1831a60b48e304b054aee1ae0f7e38ff35d09"></script>
<script type="text/javascript" src="/packages/hot-code-push.js?hash=2e864a0bdd0d5f686115099f8c48eb6c866b5b14"></script>
<script type="text/javascript" src="/packages/launch-screen.js?hash=2f56943306c7e900ed9f4d894b87f534ebffeaeb"></script>
<script type="text/javascript" src="/packages/autoupdate.js?hash=1fd9cf3472adaa6887170d88ab5ea1ddabf695fa"></script>
<script type="text/javascript" src="/packages/global-imports.js?hash=5b2fa358214a42aa3d898f1904a07f63ced7fb52"></script>
<script type="text/javascript" src="/app/app.js?hash=d41b18152b7ec04d24415a8fbfbc9932f2cbd1bf"></script>
<script type="text/javascript" src="/packages/service-configuration.js?hash=42ac9ae8eb44f3e73762f9cb0003410397021984"></script>
</body>
( page loades 6secs for first time , too long )
Thnak you!
When you will build your production version, Meteor will automatically bundle all scripts into a single file.
You can simulate the effect by using the --production flag, e.g. meteor run --production.
During development, Meteor does not bundle the individual scripts to avoid performing too many operations at each file change.
I'm using the following javascript code to help me draw an output screen in a .erb file which doesn't render properly. The canvas tag is unhelpful.
There is no output screen. The linking is proper and I am able to get output "hello" when I add a testing line.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Programming++! Build Your Own Blocks</title>
<link rel="shortcut icon" href="favicon.ico">
<script type="text/javascript" src="morphic.js"></script>
<script type="text/javascript" src="widgets.js"></script>
<script type="text/javascript" src="blocks.js"></script>
<script type="text/javascript" src="threads.js"></script>
<script type="text/javascript" src="objects.js"></script>
<script type="text/javascript" src="gui.js"></script>
<script type="text/javascript" src="paint.js"></script>
<script type="text/javascript" src="lists.js"></script>
<script type="text/javascript" src="byob.js"></script>
<script type="text/javascript" src="xml.js"></script>
<script type="text/javascript" src="store.js"></script>
<script type="text/javascript" src="locale.js"></script>
<script type="text/javascript" src="cloud.js"></script>
<script type="text/javascript" src="sha512.js"></script>
<script type="text/javascript" src="FileSaver.min.js"></script>
<script type="text/javascript">
var world;
window.onload = function () {
world = new WorldMorph(document.getElementById('world'));
world.worldCanvas.focus();
new IDE_Morph().openIn(world);
loop();
};
function loop() {
requestAnimationFrame(loop);
world.doOneCycle();
}
</script>
</head>
<body style="margin: 0;">
<canvas id="world" tabindex="1" style="position: absolute;" />
</body>
</html>
Any help please ?
I am trying to make the navigation smooth scroll to their approiate section of the page. Right now my navigation goes to the section of the page I want it too, but it doesn't smooth scroll.
I have included the smoothscroll.js in the js folder and called it in my html through this script:
<script type="text/javascript" src="js/smoothscroll.js">
I have added these scripts to the end of the body tag after the end of my wrapper
<script type="text/javascript" src="js/_jq.js">
</script>
<script type="text/javascript" src="js/_jquery.placeholder.js">
</script>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
</script>
Not sure why it is not smooth scroll and why it is not keeping the navigation bar as I scroll up n down. I also added anchor points above the container containing the about us and contact section.
seen here:
<a href="#aboutus" class="smoothScroll">
<span class="label-nav">
About Us
</span>
</a>
Any advice? Thanks!
extra scripts:
<script src="js/activeaxon_menu.js" type="text/javascript"></script>
<script src="js/animationEnigne.js" type="text/javascript"></script>
<script src="js/bootstrap.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/easypiecharts.js" type="text/javascript"></script>
<script src="js/ie-fixes.js" type="text/javascript"></script>
<script src="js/jquery.base64.js" type="text/javascript"></script>
<script src="js/jquery.carouFredSel-6.2.1-packed.js" type="text/javascript"> </script>
<script src="js/jquery.cycle.js" type="text/javascript"></script>
<script src="js/jquery.cycle2.carousel.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="js/jquery.easytabs.js" type="text/javascript"></script>
<script src="js/jquery.eislideshow.js" type="text/javascript"></script>
<script src="js/jquery.flexslider.js" type="text/javascript"></script>
<script src="js/jquery.infinitescroll.js" type="text/javascript"></script>
<script src="js/jquery.isotope.js" type="text/javascript"></script>
<script src="js/jquery.parallax-1.1.3.js" type="text/javascript"></script>
<script src="js/jquery.prettyPhoto.js" type="text/javascript"></script>
<script src="js/jQuery.scrollPoint.js" type="text/javascript"></script>
<script src="js/jquery.themepunch.plugins.min.js" type="text/javascript"></script>
<script src="js/jquery.themepunch.revolution.js" type="text/javascript"></script>
<script src="js/jquery.tipsy.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script src="js/jQuery.XDomainRequest.js" type="text/javascript"></script>
<script src="js/retina.js" type="text/javascript"></script>
<script src="js/timeago.js" type="text/javascript"></script>
<script src="js/tweetable.jquery.js" type="text/javascript"></script>
<script src="js/zeina.js" type="text/javascript"></script>
<script type="text/javascript" src="js/smoothscroll.js"></script>
</body>
</html>
After years of using spaghetti code to write my PHP projects, I have opted to switch over to using Code Igniter just to get some experience with a MVC Framework (Yeah, I know its dying but Laravel/Composer blew brain).
I have a site theme I purchased years back and decided to use it while experimenting with creating Views. The particular theme has a massive amount of JS links though due to not being optimized but rather just showing all features.
Is there any issues with just placing all of the Header content into a PHP file and then including it into the the actual View file?
<link href="css/main.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/plugins/spinner/jquery.mousewheel.js"></script>
<script type="text/javascript" src="js/plugins/charts/excanvas.min.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.orderBars.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.pie.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.resize.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.sparkline.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/uniform.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.cleditor.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.validationEngine-en.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.validationEngine.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.autosize.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.maskedinput.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.dualListBox.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.inputlimiter.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/chosen.jquery.min.js"></script>
<script type="text/javascript" src="js/plugins/wizard/jquery.form.js"></script>
<script type="text/javascript" src="js/plugins/wizard/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/plugins/wizard/jquery.form.wizard.js"></script>
<script type="text/javascript" src="js/plugins/uploader/plupload.js"></script>
<script type="text/javascript" src="js/plugins/uploader/plupload.html5.js"></script>
<script type="text/javascript" src="js/plugins/uploader/plupload.html4.js"></script>
<script type="text/javascript" src="js/plugins/uploader/jquery.plupload.queue.js"></script>
<script type="text/javascript" src="js/plugins/tables/datatable.js"></script>
<script type="text/javascript" src="js/plugins/tables/tablesort.min.js"></script>
<script type="text/javascript" src="js/plugins/tables/resizable.min.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.tipsy.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.collapsible.min.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.progress.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.timeentry.min.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.colorpicker.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.jgrowl.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.breadcrumbs.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.sourcerer.js"></script>
<script type="text/javascript" src="js/plugins/jquery.fullcalendar.js"></script>
<script type="text/javascript" src="js/plugins/jquery.elfinder.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript" src="js/charts/chart.js"></script>
This is possible for your local files. Of course you need two php files - one for your css and one for your JS.
Here is an example
<?PHP
header("content-type: application/javascript");
$all_your_js_ressources = array(
'libs/foo.js',
'libs/bar.js',
'modules/foo.module.js',
'modules/bar.module.js',
'plugins/foo.plugin.js',
'plugins/bar.plugin.js',
'main.js'
);
foreach ($all_your_js_ressources as $filename) {
readfile( $filename );echo "\r\n";
}
?>
I'm trying to setup an elFinder window on my website. So I downloaded the latest release of from GitHub and followed it's instructions.
I included every file they asked for:
<!-- elFinder -->
<script type="text/javascript" src="../includes/elfinder/js/elfinder.min.js"></script>
<script type="text/javascript" src="../includes/elfinder/js/i18n/elfinder.nl.js"></script>
<!-- JQuery UI -->
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.timepicker.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.droppable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.selectable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.resizable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.slider.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.dialog.js"></script>
And I include this into my head-section as well:
<script type="text/javascript">
$().ready(function() {
var elf = $('#elfinder').elfinder({
lang: 'nl', // language (OPTIONAL)
url : '../includes/elfinder/php/connector.php' // connector URL (REQUIRED)
}).elfinder('instance');
});
</script>
But for some reason, all I get is this image:
But those files are, obviously, included... So I'm wondering what I'm doing wrong since I can't get my finger on the issue...
Why don't you combine the jQuery UI files into one?
Yes the order of includes does matter.
Here a working demo.
Here is the code
HTML
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://elfinder.org/demo/css/elfinder.min.css" />
</head>
<div id="elfinder"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" ></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<script src="http://elfinder.org/demo/js/elfinder.min.js" ></script>
Javascript
$().ready(function() {
var f = $('#elfinder').elfinder({
url : '/connector'
}).elfinder('instance');
});
have you tried changing the order of inclusion?
<!-- elFinder -->
<script type="text/javascript" src="../includes/elfinder/js/elfinder.min.js"></script>
<script type="text/javascript" src="../includes/elfinder/js/i18n/elfinder.nl.js"></script>
<!-- JQuery UI -->
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.timepicker.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.droppable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.selectable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.resizable.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.slider.js"></script>
<script type="text/javascript" src="../includes/js/jquery-ui/development-bundle/ui/jquery.ui.dialog.js"></script>
Let me know ;)