I have been trying to extend the UI of airflow by adding airflow plugins. My goal is to be able to show internal project documentation from airflow. I am using MKDocs for this.
I have followed the airflow documentation process(https://airflow.apache.org/plugins.html#example) and created a plugin successfully. The link is appearing and when I click on it, it takes me to index.html. My problem is it is not rendering any CSS, images and other .md or .html files. They are all in the same folder.
I found a similar thread on StackOverflow (Airlfow serving static html directory). I have tried to follow the solution posted there, but it is not helping.
I have also posted the query on the airflow help forum but I have not received any solution yet. I would appreciate any leads. Thank you.
#Creating a flask appbuilder BaseView
class TestAppBuilderBaseView(AppBuilderBaseView):
template_folder = '/home/airflow/airflow/plugins/test-project/site'
#expose("/")
def list(self):
return self.render_template("index.html", content="")
v_appbuilder_view = TestAppBuilderBaseView()
v_appbuilder_package = {"name": "Test View",
"category": "Test Plugin",
"view": v_appbuilder_view}
Plugin Class:
# Defining the plugin class
class AirflowTestPlugin(AirflowPlugin):
name = "test_plugin"
appbuilder_views = [v_appbuilder_package]
Faced a similar issue: I had to show images in doc_md of a DAG.
Long story short we need to configure a Blueprint properly to host static files and templates.
Following works for me for airflow=1.10.14.
test_plugin.py
from airflow.plugins_manager import AirflowPlugin
from flask import Blueprint
from flask_admin import base, BaseView, expose
# Creating a flask admin BaseView
class TestView(BaseView):
#expose('/')
def list(self):
return self.render("index.html", content="")
v = TestView(category="Test Plugin", name="Test View")
# Creating a flask blueprint to integrate the templates and static folder
bp = Blueprint(
"test_blueprint", __name__,
template_folder='templates/testview',
static_folder='static/testview',
static_url_path='/admin/testview/static')
class AirflowTestPlugin(AirflowPlugin):
name = "test_plugin"
admin_views = [v]
flask_blueprints = [bp]
index.html
<!DOCTYPE html>
<HTML>
<body>
<p>This is a paragraph.</p>
<img alt="initial-state" src="static/img/initial-state.png">
</body>
</html>
Directory Structure
airflow
- plugins
- test_plugin.py
- templates
- testview
- index.html
- static
- testview
- img
- initial-state.png
Related
I'm using Gatsby for the first time on a simple website project. I'm accustomed with traditional React apps where there is a root file component, typically "App.js" that one attaches Providers and other global level functionality.
Gatsby doesn't offer a root App.js, but it does offer wrapRootElement and wrapPageElement, which, after a bit of wrangling, worked just fine on my localhost.
export const wrapRootElement = ({ element }) => {
return (
<ThemeProvider theme={theme}>
{element}
</ThemeProvider>
)
}
and
export const wrapPageElement = ({ element, props }) => {
return <Layout {...props}>{element}</Layout>
}
inside of gatsby-browser.js (and with appropriate local imports and such)
(using Root for my Theme Provider and Page for my Layout wrapper, which includes header and footer elements)
I used 'gatsby clean' then 'gatsby build' to generate the deployable public folder, but upon upload to my shared host, only the inner portion showed up, not the header or footer, nor did my theme colors show up.
On a whim, I downloaded Gatsby and pulled out their "using-redux" example, built, and deployed it to the same shared host with similar results — that is, it doesn't behave as expected.
What am I missing? Since it fails on the Gatsby example, I'm presuming it as something to do with my server side setup (recall, it works fine on localhost). I have Node installed, but I'm not using it as part of this app; it's intended to be completely static and I'm just trying to use the wrappers to clean up my code.
After toying around with it some more, I replicated the code in gatsby-browser.js into gatsby-ssr.js. Voila, it worked.
This article is what inspired me, sort of: https://www.gatsbyjs.org/docs/api-files-gatsby-browser/. It states:
If you use one of them, consider if you should implement it in both
gatsby-ssr.js and gatsby-browser.js.
I had read the article earlier, but didn't take the gatsby-ssr.js file as being a requirement. Apparently, I should have interpreted the word "should" a bit more forcefully.
I'm trying to add a logo component inside a new component that I've created. The project was created using the eclipse aem plugin.
My component, that inherits from a native component.
My content component
<!DOCTYPE html>
<html>
<head>
<sly data-sly-use.clientLib="/libs/granite/sightly/templates/clientlib.html" data-sly-call="${clientLib.css # categories='paiva.all'}" data-sly-unwrap/>
<sly data-sly-include="/libs/cq/cloudserviceconfigs/components/servicelibs/servicelibs.jsp" data-sly-unwrap/>
<sly data-sly-include="/libs/wcm/core/components/init/init.jsp" data-sly-unwrap/>
<title>${currentPage.title || currentPage.name}</title>
</head>
<body>
<div class="page__logo" data-sly-resource="logo"></div>
</body>
</html>
My template
My template details
A page using the template
The error
Looking at the content folder I noticed that the component that I added in my component pagina.html does not exists at content folder. But when I add a component to the parsys, it does work.
If I add the component manually, it works.
Is that normal? If not, what should I do?
When you add a component using the UI, I suppose yo mean adding it to a paragraph system (parsys). When that happens a new resource of the appropriate resource type is added below the parsys resource.
In your case, you are statically including a resource which is missing. Sling then cannot render it.
The best solution is to add a 'logo' resource below the jcr:content resource in your template. That way the resource will be there when the page is initially created.
You could also force the resourceType of the resource when including it, then it would inject a synthetic resource. (but I would do the first option)
I made a meteor app, added a /public directory full of .html, .jpeg, etc...
It all works nicely just like that except that going to my domain's root doesn't show anything; I have to type in /index.html.
How can I make my domain root go to public/index.html?
Meteor wasn't really made with serving static content (in the form of HTML) in mind. The public folder is really used to serve things like the favicon and maybe an image here or there (http://docs.meteor.com/#structuringyourapp).
While you could technically do something like:
if (Meteor.isClient) {
window.location = 'index.html';
}
It's not really how it's supposed to work. And this brings other problems, such as making sure this only works on the / route.
A far better solution is to have nginx stand in front of a running instance of Meteor and serve static content directly.
It all really depends on why you're attempting to serve index.html like that. If it's for SEO purposes, just use normal Meteor templates (and routing) and use the spiderable (http://docs.meteor.com/#spiderable) package.
What Dino suggests is definitely true, but from your description ("my domain root doesn't show anything") it sounds like you might just want to put your index.html into your client folder and edit it to accommodate the way meteor likes it, namely removing all doctype declarations and the html tags. Afterwards you should be seeing something when you go to your domain root.
If you want to serve several different .html files, you could check out the iron-router, which allows you to do server side routing.
It's not standard practice to use mywebsite.com/public/index.html.
One reason is your site won't render the index page without navigating to mywebsite.com/public.
But if you really want to do this, simply add a public folder within your public folder.
public/public/index.html
It sounds like for what you're trying to do you'll want to put the index.html file into the form of a meteor template and then define that template as the one to be used for the '/' route in your routes file.
For example your template would look like:
<tementer code hereplate name="home">
<h1>My Home Page</h1>
</template>
And in your router file:
Router.route('/', function() {
this.render('home');
this.layout('homeLayout');
});
This is assuming that you're using Iron Router and have a separate template file that you're using for the layout. If you need a further example let me know and I'll be happy to help.
I want to create settings in the settings.py file that i can access in the templates that i use without passing the setting in ,in the views.py using django
settings.py
CSS_FOLDER_ROOT = "/home/brian/Projects/RaffleThis/RaffleGym/stylesheets"
CSS_FOLDER_URL = SITE_DOMAIN + "/CSS/"
I want the server to serve the files from CSS_FOLDER_ROOT when HttpRequest is sent
working on the django template .html file and the views.py file
I guess one way to do this is by creating a context processor.
Create a context_processors.py somewhere in your project
import settings
def css_url(request):
return {'CSS_URL': settings.CSS_URL}
Add the context processor in your settings
CSS_FOLDER_ROOT = "/home/brian/Projects/RaffleThis/RaffleGym/stylesheets/"
CSS_URL = '/css/'
TEMPLATE_CONTEXT_PROCESSORS += (
"django_app.context_processors.css_url",
)
Then you can use something like this in your templates.
<link rel="stylesheet" href="{{ CSS_URL }}<filename.css>" />
I am developing a CMS so I need each respective site's global css file to be stored in a database and loaded. I have a controller called util and the method is called sitecss. So my main wrapper view looks like this:
<link rel="stylesheet" type="text/css" href="/util/sitecss">
The css loads, but has no effect. If I view source on the page, and then click on the link, I can see the css just fine. So I know it is being loaded. Is it something about it not coming from a file? Or perhaps the browser assuming it is cached when it is not?
If I make a static file and change to above to
<link rel="stylesheet" type="text/css" href="/css/site.css">
everything works just fine. If I do this in .NET with a handler ashx file, it works fine. It is in php with Codeigniter that I am having the problem. I know someone will ask "why don't you just make static files?" and the answer is, it is not practical for this application. This is for thousands of sites with very rapid deployment.
Thanks in advance!
EDIT:
My controller method looks like this:
function sitecss() {
$cssdata = $this->cmsutils->loadCss($this->session->userdata('sitecss'));
echo $cssdata;
}
So can I just echo a mime-type first? It doesn't seem like this will work as I am making this call within the
write a caching library to pull from the database and create a css file in a cache folder.
You will need:
Library Class
Interact with the css and create a form to perform CRUD
handle cache file monitoring CRUD (every hour or, even on every C,U,D of the form)
Inject the stylesheet cache file into the DOM view
Model
Interact with the database and perform CRUD operations
return data to the Controller for creating the cache file
View
parse out the values into a css stylesheet file format
The other option is to define a mime type with a controller and just load a view with the stylesheet properly formatted. No writing to the filesystem or anything.. Add a .css extension to the end of the URI and call it good...
I do this exact same thing for an app that I just released. I have a form in a view on the admin section of the app that has specified textfields. The user inputs hexadecimal color codes and then it saves/updates the data in the database. The library then creates a cached css file that is referenced in the header view. We did this to eliminate the need for us to add a .gitignore file in a special directory when we deploy the app to several clients.
Could you just load the css by passing it to the view from the controller and then echo it in the header somewhere or somewhere else in the view like this:
controller:
$data['css_rules'] = $this->yourcssmodel->get_css_rules_function();
$this->load->view('yadayadayada, $data);
view: (likely in header)
?>
<style>
<?echo $css_rules;?>
</style>