Skip to content

Instantly share code, notes, and snippets.

@SiggyF
Last active March 10, 2018 14:27
Show Gist options
  • Save SiggyF/fcd82c61b1cc5e64eb4ca3ccd15d944d to your computer and use it in GitHub Desktop.
Save SiggyF/fcd82c61b1cc5e64eb4ca3ccd15d944d to your computer and use it in GitHub Desktop.
# http://editorconfig.org
root = true
[*]
indent_style = space
indent_size = 4
trim_trailing_whitespace = true
insert_final_newline = true
charset = utf-8
end_of_line = lf
[*.{js,html}]
charset = utf-8
indent_size = 2
[*.bat]
indent_style = tab
end_of_line = crlf
[LICENSE]
insert_final_newline = false
[Makefile]
indent_style = tab
#version 300 es
// fragment shaders don't have a default precision so we need
// to pick one. mediump is a good default. It means "medium precision"
precision mediump float;
// we need to declare an output for the fragment shader
out vec4 outColor;
void main() {
// Just set the output to a constant redish-purple
outColor = vec4(1, 0, 0.5, 1);
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to Vuetify</title>
<link href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons' rel="stylesheet" type="text/css">
<link href="https://unpkg.com/vuetify/dist/vuetify.min.css" rel="stylesheet" type="text/css"></link>
<link href="styles.css" rel="stylesheet" type="text/css">
<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32">
</head>
<body>
<div id="app">
<v-app>
<main>
<v-content>
<v-container fluid>
<canvas></canvas>
</v-container>
</v-content>
</main>
</v-app>
</div>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vuetify/dist/vuetify.js"></script>
<script src="main.js"></script>
</body>
</html>
new Vue({
el: '#app',
data () {
return {}
},
mounted () {
const canvas = this.$el.querySelector('canvas')
const ctx = canvas.getContext('webgl2')
}
})
/** CSS Styles */
#getting-started .intro {
display: flex;
justify-content: center;
margin: 4rem 0;
}
#getting-started .card {
border-radius: 0;
margin-bottom: 5rem;
}
#getting-started a {
color: inherit;
}
#getting-started .list {
margin: 0 2rem !important;
}
#getting-started main {
text-align: center;
}
#getting-started h2 {
text-align: center;
}
#version 300 es
// an attribute is an input (in) to a vertex shader.
// It will receive data from a buffer
in vec4 a_position;
// all shaders have a main function
void main() {
// gl_Position is a special variable a vertex shader
// is responsible for setting
gl_Position = a_position;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment