mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2025-11-04 09:57:36 +03:00
removed meteor folder from gh-pages
This commit is contained in:
FezVrasta
parent
4f03a69c8b
commit
34358a1df5
|
|
@ -1,69 +0,0 @@
|
||||||
[](https://travis-ci.org/MeteorPackaging/hammer.js)
|
|
||||||
|
|
||||||
Packaging [FezVrasta's Bootstrap Material Design](https://github.com/FezVrasta/bootstrap-material-design)
|
|
||||||
for [Meteor.js](http://meteor.com).
|
|
||||||
|
|
||||||
|
|
||||||
# Versions
|
|
||||||
|
|
||||||
All versions include the Material Design theme CSS, JS, and `ripple.js` for the ripple click effect.
|
|
||||||
|
|
||||||
* [fezvrasta:bootstrap-material-design](https://atmospherejs.com/fezvrasta/bootstrap-material-design) - Includes Bootstrap's glyphicons along with some Material Design icons.
|
|
||||||
* [fezvrasta:bootstrap-material-design-noglyph](https://atmospherejs.com/fezvrasta/bootstrap-material-design-noglyph) - No Bootstrap glyphicons, but includes the Material Design icons.
|
|
||||||
* [fezvrasta:bootstrap-material-design-noicons](https://atmospherejs.com/fezvrasta/bootstrap-material-design-noicons) - No icons at all. Useful if you want to use another icon set instead, such as [Font Awesome](https://atmospherejs.com/fortawesome/fontawesome).
|
|
||||||
|
|
||||||
|
|
||||||
# Usage
|
|
||||||
|
|
||||||
Just run
|
|
||||||
|
|
||||||
|
|
||||||
```sh
|
|
||||||
meteor add fezvrasta:bootstrap-material-design
|
|
||||||
```
|
|
||||||
|
|
||||||
and your Bootstrap CSS will look like Google's Material Design (Polymer Paper Elements).
|
|
||||||
|
|
||||||
|
|
||||||
# Dependencies
|
|
||||||
|
|
||||||
* [twbs:bootstrap](https://atmospherejs.com/twbs/bootstrap) (the official community integration package for Bootstrap 3)
|
|
||||||
* jquery
|
|
||||||
|
|
||||||
|
|
||||||
# Meteor
|
|
||||||
|
|
||||||
If you're new to Meteor, here's what the excitement is all about -
|
|
||||||
[watch the first two minutes](https://www.youtube.com/watch?v=fsi0aJ9yr2o); you'll be hooked by 1:28.
|
|
||||||
|
|
||||||
That screencast is from 2012. In the meantime, Meteor has become a mature JavaScript-everywhere web
|
|
||||||
development framework. Read more at [Why Meteor](http://www.meteorpedia.com/read/Why_Meteor).
|
|
||||||
|
|
||||||
|
|
||||||
# Issues
|
|
||||||
|
|
||||||
If you encounter an issue while using this package, please CC @dandv when you file it in this repo.
|
|
||||||
|
|
||||||
|
|
||||||
# DONE
|
|
||||||
|
|
||||||
* Automatically initialize the JS on client startup: `$.material.init()`
|
|
||||||
* Material Design Icons font loading test: EOT, SVG, TTF, WOFF
|
|
||||||
* Bootstrap plugin loading tests
|
|
||||||
* Visual check, including for the ripple effect
|
|
||||||
|
|
||||||
|
|
||||||
# TODO
|
|
||||||
|
|
||||||
* LESS version / fine-grained control? See [nemo64's package](https://github.com/Nemo64/meteor-bootstrap).
|
|
||||||
|
|
||||||
|
|
||||||
# Testing
|
|
||||||
|
|
||||||
To test the theme in a browser, run `cp meteor/package.js ./ && meteor test-packages ./`
|
|
||||||
|
|
||||||
|
|
||||||
# Acknowledgements
|
|
||||||
|
|
||||||
* [Yuri Dybskiy / html5cat](https://github.com/html5cat) for the first wrapper of this package
|
|
||||||
* [Dan Dascalescu / dandv](https://github.com/dandv) for this direct integration
|
|
||||||
1
meteor/example/.meteor/.gitignore
vendored
1
meteor/example/.meteor/.gitignore
vendored
|
|
@ -1 +0,0 @@
|
||||||
local
|
|
||||||
|
|
@ -1,7 +0,0 @@
|
||||||
# Meteor packages used by this project, one per line.
|
|
||||||
#
|
|
||||||
# 'meteor add' and 'meteor remove' will edit this file for you,
|
|
||||||
# but you can also edit it by hand.
|
|
||||||
|
|
||||||
meteor-platform
|
|
||||||
fezvrasta:bootstrap-material-design-noglyph
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
METEOR@1.0.1
|
|
||||||
|
|
@ -1,3 +0,0 @@
|
||||||
body {
|
|
||||||
background: #8BC34A;
|
|
||||||
}
|
|
||||||
|
|
@ -1,14 +0,0 @@
|
||||||
<body>
|
|
||||||
<h1>Watch the ripple effect on newly created buttons!</h1>
|
|
||||||
|
|
||||||
{{> hello}}
|
|
||||||
</body>
|
|
||||||
|
|
||||||
<template name="hello">
|
|
||||||
<button type="button" class="btn btn-info">Click Me</button>
|
|
||||||
<hr/>
|
|
||||||
{{#each buttons}}
|
|
||||||
<button type="button" class="btn btn-primary">{{name}}</button>
|
|
||||||
<br/>
|
|
||||||
{{/each}}
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
'use strict';
|
|
||||||
|
|
||||||
var Buttons = new Mongo.Collection(null);
|
|
||||||
|
|
||||||
Template.hello.helpers({
|
|
||||||
buttons: function () {
|
|
||||||
return Buttons.find();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Template.hello.events({
|
|
||||||
'click button': function (event, template) {
|
|
||||||
Buttons.insert({name: _.sample(['No, click ME!', 'Click me too!', 'Click here!', 'Hey!', 'Psst!'])});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
../../../
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
mklink ..\..\package.js "meteor/package-noglyph.js"
|
|
||||||
mklink package.json "../../package.json"
|
|
||||||
set MONGO_URL=mongodb://
|
|
||||||
meteor run
|
|
||||||
del ..\..\package.js package.json
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
# sanity check: make sure we're in the root directory of the example
|
|
||||||
cd "$( dirname "$0" )"
|
|
||||||
|
|
||||||
# delete temp files even if Ctrl+C is pressed
|
|
||||||
int_trap() {
|
|
||||||
echo "Cleaning up..."
|
|
||||||
}
|
|
||||||
trap int_trap INT
|
|
||||||
|
|
||||||
ln -s "meteor/package-noglyph.js" ../../package.js
|
|
||||||
ln -s "../../package.json" package.json
|
|
||||||
|
|
||||||
MONGO_URL=mongodb:// meteor run
|
|
||||||
|
|
||||||
rm ../../package.js package.json
|
|
||||||
|
|
@ -1,3 +0,0 @@
|
||||||
Meteor.startup(function () {
|
|
||||||
$.material.init();
|
|
||||||
});
|
|
||||||
|
|
@ -1,39 +0,0 @@
|
||||||
// package metadata file for Meteor.js
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
var packageName = 'fezvrasta:bootstrap-material-design-noglyph'; // https://atmospherejs.com/fezvrasta/bootstrap-material-design-noglyph
|
|
||||||
var where = 'client'; // where to install: 'client' or 'server'. For both, pass nothing.
|
|
||||||
|
|
||||||
var packageJson = JSON.parse(Npm.require("fs").readFileSync('package.json'));
|
|
||||||
|
|
||||||
Package.describe({
|
|
||||||
name: packageName,
|
|
||||||
summary: 'FezVrasta\'s Bootstrap Google Material Design theme. Material icons instead of Bootstrap glyphicons.',
|
|
||||||
version: packageJson.version,
|
|
||||||
git: 'https://github.com/fezvrasta/bootstrap-material-design.git'
|
|
||||||
});
|
|
||||||
|
|
||||||
Package.onUse(function (api) {
|
|
||||||
api.versionsFrom(['METEOR@0.9.0', 'METEOR@1.0']);
|
|
||||||
api.use('twbs:bootstrap-noglyph@3.3.1');
|
|
||||||
api.use('jquery');
|
|
||||||
api.addFiles([
|
|
||||||
// we bundle all font files, but the client will request only one of them via the CSS @font-face rule
|
|
||||||
'dist/fonts/Material-Design-Icons.eot', // IE8 or older
|
|
||||||
'dist/fonts/Material-Design-Icons.svg', // SVG fallback for iOS < 5 - http://caniuse.com/#feat=svg-fonts, http://stackoverflow.com/a/11002874/126903
|
|
||||||
'dist/fonts/Material-Design-Icons.ttf', // Android Browers 4.1, 4.3 - http://caniuse.com/#feat=ttf
|
|
||||||
'dist/fonts/Material-Design-Icons.woff', // Supported by all modern browsers
|
|
||||||
'dist/css/material-wfont.css', // includes @font-face rules to load the Roboto font
|
|
||||||
'dist/css/ripples.css',
|
|
||||||
'dist/js/material.js',
|
|
||||||
'dist/js/ripples.js',
|
|
||||||
'meteor/init.js'
|
|
||||||
], where);
|
|
||||||
});
|
|
||||||
|
|
||||||
Package.onTest(function (api) {
|
|
||||||
api.use(packageName, where);
|
|
||||||
api.use(['tinytest', 'http'], where);
|
|
||||||
|
|
||||||
api.addFiles('meteor/test.js', where); // same test because we don't test the glyphicons in particular (that's the job of twbs:bootstrap)
|
|
||||||
});
|
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
// package metadata file for Meteor.js
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
var packageName = 'fezvrasta:bootstrap-material-design-noicons'; // https://atmospherejs.com/fezvrasta/bootstrap-material-design-noicons
|
|
||||||
var where = 'client'; // where to install: 'client' or 'server'. For both, pass nothing.
|
|
||||||
|
|
||||||
var packageJson = JSON.parse(Npm.require("fs").readFileSync('package.json'));
|
|
||||||
|
|
||||||
Package.describe({
|
|
||||||
name: packageName,
|
|
||||||
summary: 'FezVrasta\'s Bootstrap theme implementing Google\'s Material Design (Paper Elements). No icons.',
|
|
||||||
version: packageJson.version,
|
|
||||||
git: 'https://github.com/fezvrasta/bootstrap-material-design.git'
|
|
||||||
});
|
|
||||||
|
|
||||||
Package.onUse(function (api) {
|
|
||||||
api.versionsFrom(['METEOR@0.9.0', 'METEOR@1.0']);
|
|
||||||
api.use('twbs:bootstrap-noglyph@3.3.1');
|
|
||||||
api.use('jquery');
|
|
||||||
api.addFiles([
|
|
||||||
'dist/css/material-wfont.css', // includes @font-face rules to load the Roboto font
|
|
||||||
'dist/css/ripples.css',
|
|
||||||
'dist/js/material.js',
|
|
||||||
'dist/js/ripples.js',
|
|
||||||
'meteor/init.js'
|
|
||||||
], where);
|
|
||||||
});
|
|
||||||
|
|
||||||
Package.onTest(function (api) {
|
|
||||||
api.use(packageName, where);
|
|
||||||
api.use(['tinytest', 'http'], where);
|
|
||||||
|
|
||||||
api.addFiles('meteor/test-noicons.js', where);
|
|
||||||
});
|
|
||||||
|
|
@ -1,39 +0,0 @@
|
||||||
// package metadata file for Meteor.js
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
var packageName = 'fezvrasta:bootstrap-material-design'; // https://atmospherejs.com/fezvrasta/bootstrap-material-design
|
|
||||||
var where = 'client'; // where to install: 'client' or 'server'. For both, pass nothing.
|
|
||||||
|
|
||||||
var packageJson = JSON.parse(Npm.require("fs").readFileSync('package.json'));
|
|
||||||
|
|
||||||
Package.describe({
|
|
||||||
name: packageName,
|
|
||||||
summary: 'FezVrasta\'s Bootstrap theme implementing Google\'s Material (Paper) Design',
|
|
||||||
version: packageJson.version,
|
|
||||||
git: 'https://github.com/fezvrasta/bootstrap-material-design.git'
|
|
||||||
});
|
|
||||||
|
|
||||||
Package.onUse(function (api) {
|
|
||||||
api.versionsFrom(['METEOR@0.9.0', 'METEOR@1.0']);
|
|
||||||
api.use('twbs:bootstrap@3.3.1');
|
|
||||||
api.use('jquery');
|
|
||||||
api.addFiles([
|
|
||||||
// we bundle all font files, but the client will request only one of them via the CSS @font-face rule
|
|
||||||
'dist/fonts/Material-Design-Icons.eot', // IE8 or older
|
|
||||||
'dist/fonts/Material-Design-Icons.svg', // SVG fallback for iOS < 5 - http://caniuse.com/#feat=svg-fonts, http://stackoverflow.com/a/11002874/126903
|
|
||||||
'dist/fonts/Material-Design-Icons.ttf', // Android Browers 4.1, 4.3 - http://caniuse.com/#feat=ttf
|
|
||||||
'dist/fonts/Material-Design-Icons.woff', // Supported by all modern browsers
|
|
||||||
'dist/css/material-wfont.css', // includes @font-face rules to load the Roboto font
|
|
||||||
'dist/css/ripples.css',
|
|
||||||
'dist/js/material.js',
|
|
||||||
'dist/js/ripples.js',
|
|
||||||
'meteor/init.js'
|
|
||||||
], where);
|
|
||||||
});
|
|
||||||
|
|
||||||
Package.onTest(function (api) {
|
|
||||||
api.use(packageName, where);
|
|
||||||
api.use(['tinytest', 'http'], where);
|
|
||||||
|
|
||||||
api.addFiles('meteor/test.js', where);
|
|
||||||
});
|
|
||||||
|
|
@ -1,63 +0,0 @@
|
||||||
'use strict';
|
|
||||||
|
|
||||||
var packageName; // there seems to be no official way of finding out the name of the very package we're testing - http://stackoverflow.com/questions/27180709/in-a-tinytest-test-file-how-do-i-get-the-name-of-the-package
|
|
||||||
|
|
||||||
var plugins = ['affix', 'alert', 'button', 'carousel', 'collapse', 'dropdown', 'modal', 'popover', 'scrollspy', 'tab', 'tooltip'];
|
|
||||||
|
|
||||||
// test plugins
|
|
||||||
plugins.forEach(function (plugin) {
|
|
||||||
Tinytest.add('Plugin - ' + plugin, function (test) {
|
|
||||||
test.instanceOf($(document.body)[plugin], Function, 'instantiated correctly');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// visual check
|
|
||||||
plugins.forEach(function (plugin) {
|
|
||||||
|
|
||||||
Tinytest.addAsync('Visual check - ' + plugin, function (test, done) {
|
|
||||||
var bootstrapDropZone = document.createElement('div');
|
|
||||||
document.body.appendChild(bootstrapDropZone);
|
|
||||||
|
|
||||||
|
|
||||||
HTTP.get('http://rawgit.com/twbs/bootstrap/master/js/tests/visual/' + plugin + '.html', function callback(error, result) {
|
|
||||||
if (error) {
|
|
||||||
test.fail('Error getting the test file. Do we have an Internet connection to rawgit.com?');
|
|
||||||
} else {
|
|
||||||
// [^] matches across newlines. Stay within the container div, or else the fragment will attempt to load resources on its own.
|
|
||||||
bootstrapDropZone.innerHTML = result.content.match(/<div[^]+<\/div>/);
|
|
||||||
test.ok({message: 'Test passed if the display looks OK *and* clicking dropdowns/popovers/tooltips works.'});
|
|
||||||
}
|
|
||||||
|
|
||||||
done();
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
Tinytest.addAsync('Visual check - Material Design', function (test, done) {
|
|
||||||
var bootstrapDropZone = document.createElement('div');
|
|
||||||
document.body.appendChild(bootstrapDropZone);
|
|
||||||
|
|
||||||
HTTP.get('http://rawgit.com/FezVrasta/bootstrap-material-design/master/bootstrap-elements.html', function callback(error, result) {
|
|
||||||
if (error) {
|
|
||||||
test.fail('Error getting the FezVrasta test file. Do we have an Internet connection to rawgit.com?');
|
|
||||||
} else {
|
|
||||||
// [^] matches across newlines. Stay within the container div, or else the fragment will attempt to load resources on its own.
|
|
||||||
bootstrapDropZone.innerHTML = result.content.match(/<meta name="viewport"[^]+<script src=/);
|
|
||||||
test.ok({message: 'Test passed if the display looks OK *and* clicking dropdowns/popovers/tooltips works.'});
|
|
||||||
// only does anything after loading the 'dropdown' plugin test
|
|
||||||
$('[data-toggle="dropdown"]').dropdown();
|
|
||||||
// only does anything after loading the 'popover' plugin test
|
|
||||||
$('[data-toggle="popover"]').popover();
|
|
||||||
// only does anything after loading the 'tooltip' plugin test
|
|
||||||
$('[data-toggle="tooltip"]').tooltip();
|
|
||||||
// don't initialize the modals because that messes up the Tinytest runner HTML
|
|
||||||
$.material.init();
|
|
||||||
}
|
|
||||||
|
|
||||||
done();
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
103
meteor/test.js
103
meteor/test.js
|
|
@ -1,103 +0,0 @@
|
||||||
'use strict';
|
|
||||||
|
|
||||||
var packageName; // there seems to be no official way of finding out the name of the very package we're testing - http://stackoverflow.com/questions/27180709/in-a-tinytest-test-file-how-do-i-get-the-name-of-the-package
|
|
||||||
|
|
||||||
// Check that the font files are downloadable. Meteor places assets at /packages/<packageName>/.
|
|
||||||
// Only 'woff' for now, but 'woff2' may become available - https://github.com/FortAwesome/Font-Awesome/pull/5062#discussion_r20936453
|
|
||||||
['eot', 'svg', 'ttf', 'woff'].forEach(function (font) {
|
|
||||||
Tinytest.addAsync(font + ' fonts are shipped', function (test, done) {
|
|
||||||
|
|
||||||
// curiously enough, the 'local-test:...' package isn't loaded into Package before calling Tinytest, so we can't do this determination outside this loop
|
|
||||||
if (!packageName)
|
|
||||||
Object.keys(Package).forEach(function(p) {
|
|
||||||
if (p.search(/local-test/) > -1)
|
|
||||||
packageName = p.replace('local-test:', ''); // we should stop the loop, but forEach can't do that
|
|
||||||
})
|
|
||||||
|
|
||||||
if (!packageName) {
|
|
||||||
test.exception({message: 'Package not quite loaded... go figure'});
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
var packagePath = packageName.replace(':', '_') // e.g. meteorpackaging_bootstrap-material-design
|
|
||||||
|
|
||||||
HTTP.get(
|
|
||||||
'/packages/' + packagePath + '/dist/fonts/Material-Design-Icons.' + font,
|
|
||||||
{
|
|
||||||
headers: {
|
|
||||||
'Cache-Control': 'no-cache' // because Meteor has cached fonts even after they were removed from package.js (!) - https://github.com/meteor/meteor/issues/3196
|
|
||||||
}
|
|
||||||
},
|
|
||||||
function callback(error, result) {
|
|
||||||
if (error) {
|
|
||||||
test.fail({message: 'Font failed to load'});
|
|
||||||
} else {
|
|
||||||
// if the file is 404, Meteor will redirect to / and return the Meteor.js boilerplate
|
|
||||||
test.isTrue(result.content.length > 100000, font + ' font could not be downloaded');
|
|
||||||
}
|
|
||||||
|
|
||||||
done();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
});
|
|
||||||
})
|
|
||||||
|
|
||||||
var plugins = ['affix', 'alert', 'button', 'carousel', 'collapse', 'dropdown', 'modal', 'popover', 'scrollspy', 'tab', 'tooltip'];
|
|
||||||
|
|
||||||
// test plugins
|
|
||||||
plugins.forEach(function (plugin) {
|
|
||||||
Tinytest.add('Plugin - ' + plugin, function (test) {
|
|
||||||
test.instanceOf($(document.body)[plugin], Function, 'instantiated correctly');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// visual check
|
|
||||||
plugins.forEach(function (plugin) {
|
|
||||||
|
|
||||||
Tinytest.addAsync('Visual check - ' + plugin, function (test, done) {
|
|
||||||
var bootstrapDropZone = document.createElement('div');
|
|
||||||
document.body.appendChild(bootstrapDropZone);
|
|
||||||
|
|
||||||
|
|
||||||
HTTP.get('http://rawgit.com/twbs/bootstrap/master/js/tests/visual/' + plugin + '.html', function callback(error, result) {
|
|
||||||
if (error) {
|
|
||||||
test.fail('Error getting the test file. Do we have an Internet connection to rawgit.com?');
|
|
||||||
} else {
|
|
||||||
// [^] matches across newlines. Stay within the container div, or else the fragment will attempt to load resources on its own.
|
|
||||||
bootstrapDropZone.innerHTML = result.content.match(/<div[^]+<\/div>/);
|
|
||||||
test.ok({message: 'Test passed if the display looks OK *and* clicking dropdowns/popovers/tooltips works.'});
|
|
||||||
}
|
|
||||||
|
|
||||||
done();
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
Tinytest.addAsync('Visual check - Material Design', function (test, done) {
|
|
||||||
var bootstrapDropZone = document.createElement('div');
|
|
||||||
document.body.appendChild(bootstrapDropZone);
|
|
||||||
|
|
||||||
HTTP.get('http://rawgit.com/FezVrasta/bootstrap-material-design/master/bootstrap-elements.html', function callback(error, result) {
|
|
||||||
if (error) {
|
|
||||||
test.fail('Error getting the FezVrasta test file. Do we have an Internet connection to rawgit.com?');
|
|
||||||
} else {
|
|
||||||
// [^] matches across newlines. Stay within the container div, or else the fragment will attempt to load resources on its own.
|
|
||||||
bootstrapDropZone.innerHTML = result.content.match(/<meta name="viewport"[^]+<script src=/);
|
|
||||||
test.ok({message: 'Test passed if the display looks OK *and* clicking dropdowns/popovers/tooltips works.'});
|
|
||||||
// only does anything after loading the 'dropdown' plugin test
|
|
||||||
$('[data-toggle="dropdown"]').dropdown();
|
|
||||||
// only does anything after loading the 'popover' plugin test
|
|
||||||
$('[data-toggle="popover"]').popover();
|
|
||||||
// only does anything after loading the 'tooltip' plugin test
|
|
||||||
$('[data-toggle="tooltip"]').tooltip();
|
|
||||||
// don't initialize the modals because that messes up the Tinytest runner HTML
|
|
||||||
$.material.init();
|
|
||||||
}
|
|
||||||
|
|
||||||
done();
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
Loading…
Reference in New Issue
Block a user