Custom JS not loading in apostrophe but CSS is - zurb-foundation

I'm having trouble getting my custom js to load when adding it to my themes module in apostrophe. Custom CSS is following the same setup and not encountering an error. I've followed documentation and previous SO solutions on theme setup.
Current setup:
my-theme
- public/
- css/
- foundation/
- foundation.css
- app.css (custom overide for foundation)
- js/
- foundation/
- vendor/
- foundation.js
- jquery.js
- what-input.js
- app.js
- index.js
In index.js I reference the stylesheet (app.css) and js (app.js which loads foundation.js)
What should I be doing so that foundation.js runs properly and doesn't get blocked? I do believe it's getting pushed with self.pushAsset
Functionality I'm trying to recreate:
https://foundation.zurb.com/building-blocks/blocks/topbar-center-logo.html
UPDATE:
I've discovered that the issue is with $(document).foundation() which lives in app.js and is needed to load foundation properly. Any suggestions on how I should be calling foundation?

Related

Django restarts when changing file that does not belong to the project

The problem is django server is restarting when I change the settings.py, that does not belong to my django project.
Here is the folder structure.
- project
- django-conf
- settings.py
- urls.py
- ...
- apps
- apps1
- ...
- scrapy-setting
- settings.py <------- file to be updated
When I update the scrapy-setting/settings.py django server will reload.
I don't know why.
In my django config, there is no relation to that folder.
You have three options:
Use noreload flag. BUT this will prevent reload for the whole app.
A monkey patch over the autoreload module, obviously not recommended.
Move the external code out of the Django project

Suitable build folder structure for small web apps

Is the folder structure below suitable for small web application builds? I've just learnt Sass, and how to build system automating tasks with gulp.
From what I understand the following will happen;
I'll work on the Sass files in the src/sass folder.. which compliles via gulp to dist/css/main.css file.
The same will happen with src/js/ files, which concatenate into dist/js/main.js
I work on the PHP files directly in the dist/ folder
- /dist
- index.php
- /css
- main.css
- /js
- main.js
- /src
- /js
- file1.js
- file2.js
- /sass
- main.sass
- _additonal.sass
- /vendor
- /bootstrap
- _boostrap.sass
- /docs
package.json
gulpfile.js
I'm after some clarification of my process, and any advice on how to improve it :) I've had a look on Stackoverflow/google but can't find anything that isn't for larger scale projects.

Flask: render js embedded webpage from a non-standard location

My flask app has the following structure:
app.py
- templates/
- static/
- external/
Under external, I have a js embedded html file. It has the following structure:
external -
external.html
js/
img/
When I get a URL that looks like http://<server:port>/external?key1=val2&key2=val2, I want to send external.html to the client. My code looks like:
#app.route("/external")
return flask.send_from_directory(external, 'external.html')
However, I am getting server exceptions and nothing is being returned back to the client.
This looks like a path issue. You may want to set the path to the folder manually
app = Flask(__name__, external_folder='external')
#app.route('/external',methods=['GET'])
def send_file(filename):
return send_from_directory(app.external_folder, filename)
Also, if this is in production, you should use a standard web server like Apache to serve your files

How to organize Marionette projects between production and dev?

My question is simple. Imagine that you have a project built with marionette/backbone and you have two target medias: mobile and desktop. There is a backing server, written in DJango (or Ruby, or etc.).
How can I organize the project, so I can compile it to mobile and make it run for desktop? I mean, imagine collections, that have a url parameter. Set it to relative? To absolute, from scratch?
The project already has a feasible layout where I can compile it using r.js. It's pretty much like this:
repo-root/
- src/
- assets/
- css/
- images/
- project-code/
- vendor/
- build.js
- config.xml (phonegap conf)
- index.html
- main.js
- tests/
- bower.json
- .gitignore
here's an example of a collection:
define(function(require){
"use strict";
var Backbone = require("backbone");
var FeatureClass = require("atlas-backbone/models/FeatureClass");
return Backbone.Collection.extend({
url: "api/featureclasses",
model: FeatureClass
});
});
My question is how to organize this, so it can be compiled to a mobile device and run in a desktop version.
In my current job on my current project we make extensive use of Gulp and gulp tasks. We have Gulp tasks for production and for development, and setup different pipelines for each.
Optionally, if you would like to manage such things independently you can utilize more antiquated methods such as a mock server, relative URLs, or host file changes.

Django 1.4 project layout: Using mysite as the glue app

The old accepted answer for Django project layout specifies that it's good practice to make a glue application that ties in data from various other applications (e.g. for the home page).
Now that Django 1.4 automatically creates the ../project_name/project_name/ folder, should I use the project_name application as the glue application? Or should I still make a core app and leave the automatically created project_name application alone?
Over the last couple of projects, I've found the following layout to work quite well:
The common folder above contains all the stuff that doesn't really fit elsewhere, including the base urls.py, sitemaps.py, general template tags, general context processors and so on. I find this pretty clean and easy to maintain. Most importantly, the entire directory can be easily checked into git.
I wouldn't worry about the default layout for 1.4. Do whatever suits you.
- apps/
- /foo_app
- /bar_app
- common # The equivalent of the glue app you talk about
- confs # Uwsgi/supervisor/nginx/gunicorn etc. configurations
- /production
- /staging
- /dev
- docs
- fixtures
- media
- static
- requirements # for `pip freeze > ...`
- /production
- /staging
- /development
- scripts
- settings
- private.py # Secret Key etc., not put on VCS
- database.py # DB Settings, also no in VCS
- development.py
- production.py
- staging.py
- default.py # All Django's settings
- custom.py # Custom application settings
- templates