diff --git a/README.md b/README.md
index 44bcce4b57..bc581372cd 100644
--- a/README.md
+++ b/README.md
@@ -7,19 +7,13 @@
#### Building & Running
-- `npm install -g jspm`
-- `jspm init`
- `gulp watch`
-- `python -m SimpleHTTPServer .`
-- `open http://localhost:9000/dist/examples/aside/basic/index.html`
+- `python -m SimpleHTTPServer ./dist`
+- `open http://localhost:9000/e2e/aside/basic/index.html`
- Follow the structure found in src/components/aside/examples/basic
to create more examples.
-
-#### Problems already
-
-- If we have a `.spec.js` file as a sibling of a js file,
- System will make that an export and ignore the `.js` file.
- There's probably a setting in System.js somewhere to fix this.
+ * The biggest thing to remember: your app has to import its dependencies with the `app/` prefix.
+ For example `import {Apple} from 'app/apple';` would import apple.js in your example app.
#### Build
diff --git a/gulpfile.js b/gulpfile.js
index dcbe4023e9..fac59a613a 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -2,81 +2,94 @@
// Mostly stolen from https://github.com/pkozlowski-opensource/ng2-play
/////
-var SystemJsBuilder = require('systemjs-builder');
-var exec = require('child_process').exec;
-var gulp = require('gulp');
-var karma = require('karma').server;
-var path = require('path');
-var buildConfig = require('./scripts/build/config');
-var through2 = require('through2');
+var SystemJsBuilder = require('systemjs-builder')
+var exec = require('child_process').exec
+var gulp = require('gulp')
+var karma = require('karma').server
+var path = require('path')
+var buildConfig = require('./scripts/build/config')
-var concat = require('gulp-concat');
-var debug = require('gulp-debug');
-var del = require('del');
-var gulpif = require('gulp-if');
-var karma = require('karma').server;
-var plumber = require('gulp-plumber');
-var rename = require('gulp-rename');
-var sass = require('gulp-sass');
-var shell = require('gulp-shell');
-var traceur = require('gulp-traceur');
+var argv = require('yargs').argv
+var concat = require('gulp-concat')
+var debug = require('gulp-debug')
+var del = require('del')
+var gulpif = require('gulp-if')
+var karma = require('karma').server
+var plumber = require('gulp-plumber')
+var rename = require('gulp-rename')
+var sass = require('gulp-sass')
+var shell = require('gulp-shell')
+var traceur = require('gulp-traceur')
var wrap = require('gulp-wrap');
-var argv = require('yargs').argv;
-gulp.task('default', ['sass', 'fonts', 'e2e', 'ng2']);
+gulp.task('default', ['build', 'lib', 'e2e'])
+
+gulp.task('build', ['sass', 'js']);
+gulp.task('lib', ['ng2', 'fonts', 'dependencies']);
gulp.task('watch', ['default'], function() {
- gulp.watch(buildConfig.src.scss, ['sass']);
+ gulp.watch(buildConfig.src.scss, ['sass'])
gulp.watch([].concat(
buildConfig.src.js, buildConfig.src.e2e, buildConfig.src.html,
'scripts/e2e/index.template.html'
- ), ['e2e']);
-});
+ ), ['e2e'])
+})
gulp.task('karma', function() {
- return karma.start({ configFile: __dirname + '/scripts/test/karma.conf.js' });
-});
+ return karma.start({ configFile: __dirname + '/scripts/test/karma.conf.js' })
+})
gulp.task('karma-watch', function() {
- return karma.start({ configFile: __dirname + '/scripts/test/karma-watch.conf.js' });
+ return karma.start({ configFile: __dirname + '/scripts/test/karma-watch.conf.js' })
+})
+
+gulp.task('dependencies', function() {
+ return gulp.src(buildConfig.dependencies)
+ .pipe(gulp.dest(buildConfig.distLib));
});
+gulp.task('js', function() {
+ return gulp.src('src/**/*.js')
+ .pipe(gulp.dest(buildConfig.distLib + '/ionic2'))
+})
+
gulp.task('sass', function(done) {
gulp.src('src/components/app/ionic.scss')
.pipe(sass({
onError: function(err) {
- console.log(err);
+ console.log(err)
}
}))
.pipe(gulp.dest('dist/css'))
- .on('end', done);
-});
+ .on('end', done)
+})
gulp.task('fonts', function(done) {
gulp.src('src/components/icon/fonts/**/*')
.pipe(gulp.dest('dist/fonts'))
- .on('end', done);
-});
+ .on('end', done)
+})
gulp.task('clean', function(done) {
- del([buildConfig.dist], done);
-});
+ del([buildConfig.dist], done)
+})
-gulp.task('e2e', ['sass'], function() {
- var e2eSrc = path.join(__dirname, 'src/components/**/test/**/*');
- var templateSrc = path.join(__dirname, 'scripts/e2e/index.template.html');
- var e2eDest = path.join(__dirname, 'dist/e2e/');
+gulp.task('e2e', ['build'], function() {
+ var e2eSrc = path.join(__dirname, 'src/components/**/test/**/*')
+ var templateSrc = path.join(__dirname, 'scripts/e2e/index.template.html')
+ var e2eDest = path.join(__dirname, 'dist/e2e/')
return gulp.src(e2eSrc)
- .pipe(gulpif(/index.html/, wrap({
- src: templateSrc
- })))
+ .pipe(gulpif(/index.html/, wrap(
+ { src: templateSrc },
+ { buildConfig: buildConfig }
+ )))
.pipe(rename(function(file) {
- file.dirname = file.dirname.replace('/test/', '/');
+ file.dirname = file.dirname.replace('/test/', '/')
}))
- .pipe(gulpif({ isFile: true }, gulp.dest(e2eDest)));
-});
+ .pipe(gulpif({ isFile: true }, gulp.dest(e2eDest)))
+})
-require('./scripts/snapshot/snapshot.task')(gulp, argv, buildConfig);
+require('./scripts/snapshot/snapshot.task')(gulp, argv, buildConfig)
// Take es6 files from angular2's output, rename to js, and move to dist/lib/
gulp.task('ng2-rename', function(done) {
@@ -84,27 +97,28 @@ gulp.task('ng2-rename', function(done) {
if (err) {
console.log('You have not installed angular master.\n' +
'Please run ./scripts/build/update-angular.sh.\n' +
- 'Aborting.');
- return process.exit(1);
+ 'Aborting.')
+ return process.exit(1)
}
gulp.src([
'node_modules/angular-master/dist/js/dev/es6/{angular2,rtts_assert}/**/*.es6'
])
.pipe(rename({ extname: '.js' }))
- .pipe(gulp.dest('dist/lib'))
- .on('end', done);
- });
-});
+ .pipe(gulp.dest(buildConfig.distLib))
+ .on('end', done)
+ })
+})
+// We use SystemJsBuilder to build ng2 because it will properly
gulp.task('ng2', ['ng2-rename'], function() {
- var builder = new SystemJsBuilder();
+ var builder = new SystemJsBuilder()
builder.config({
- baseURL: 'dist/lib',
+ baseURL: buildConfig.distLib,
traceurOptions: buildConfig.traceurOptions,
map: {
rx: __dirname + '/node_modules/rx'
}
- });
- return builder.build('angular2/angular2', 'dist/lib/angular2.js');
-});
+ })
+ return builder.build('angular2/angular2', buildConfig.distLib + '/angular2.js')
+})
diff --git a/jspm-config.js b/jspm-config.js
deleted file mode 100644
index 783ad7cc5d..0000000000
--- a/jspm-config.js
+++ /dev/null
@@ -1,23 +0,0 @@
-System.config({
- 'paths': {
- '*': '*.js',
- 'angular2/*': '/dist/lib/angular2/*.js'
- },
- 'traceurOptions': {
- 'sourceMaps': true,
- 'annotations': true,
- 'types': true,
- 'script': false,
- 'memberVariables': true,
- 'modules': 'instantiate'
- }
-});
-
-System.config({
- 'map': {
- 'hammer': '/node_modules/hammerjs/hammer',
- 'rx': '/node_modules/rx',
- 'ionic2': '/src',
- }
-});
-
diff --git a/package.json b/package.json
index b9fceb45b7..992d4d370a 100644
--- a/package.json
+++ b/package.json
@@ -9,50 +9,26 @@
"gulp": "~3.8.10",
"gulp-concat": "~2.5.0",
"gulp-debug": "~2.0.1",
- "gulp-eslint": "^0.7.0",
"gulp-if": "^1.2.5",
- "gulp-jscs": "^1.4.0",
"gulp-plumber": "^1.0.0",
"gulp-rename": "~1.2.0",
"gulp-sass": "^1.3.3",
- "gulp-shell": "^0.4.0",
"gulp-traceur": "0.16.*",
- "gulp-util": "^3.0.4",
"gulp-wrap": "^0.11.0",
"karma": "^0.12.31",
+ "karma-chrome-launcher": "^0.1.7",
+ "karma-jasmine": "^0.3.5",
"lodash": "^2.4.1",
- "lodash.template": "^2.4.1",
"node-uuid": "^1.4.1",
- "q": "^1.2.0",
- "request": "^2.53.0",
- "serve-static": "~1.8.1",
"systemjs": "^0.11.3",
"systemjs-builder": "^0.9.1",
- "through2": "~0.6.3",
"traceur-runtime": "0.0.59",
"yargs": "^3.6.0"
},
"dependencies": {
- "es6-module-loader": "~0.11.0",
- "event-stream": "^3.3.0",
- "gulp-template": "^3.0.0",
"hammerjs": "^2.0.4",
- "jasmine-core": "^2.2.0",
- "karma-chrome-launcher": "^0.1.7",
- "karma-jasmine": "^0.3.5",
"rx": "^2.4.6",
- "systemjs": "~0.11.0",
"traceur": "0.0.87",
"zone.js": "0.4.1"
- },
- "jspm": {
- "directories": {
- "lib": "src",
- "packages": "jspm_packages"
- },
- "configFile": "jspm-config.js",
- "dependencies": {
- "none": "none"
- }
}
}
diff --git a/scripts/build/config.js b/scripts/build/config.js
index 511cfa6b88..d0d9c02d15 100644
--- a/scripts/build/config.js
+++ b/scripts/build/config.js
@@ -1,12 +1,33 @@
module.exports = {
dist: 'dist',
+ distLib: 'dist/lib',
src: {
test: ['src/**/test/*.spec.js'],
- js: ['src/**/*.js', '!src/**/test/**/*'],
+ js: ['src/**/*.js', '!src/**/test/**/*.js'],
e2e: ['src/**/test/*/**/*'],
html: 'src/**/*.html',
scss: 'src/components/**/*.scss',
},
+
+ dependencies: [
+ 'node_modules/traceur/bin/traceur.js',
+ 'node_modules/es6-module-loader/dist/es6-module-loader.js',
+ 'node_modules/systemjs/dist/system.js',
+ 'node_modules/zone.js/zone.js',
+ 'node_modules/zone.js/long-stack-trace-zone.js',
+ 'node_modules/hammerjs/hammer.js',
+ 'node_modules/rx/dist/rx.all.js',
+ ],
+ scripts: [
+ 'traceur.js',
+ 'es6-module-loader.js',
+ 'system.js',
+ 'zone.js',
+ 'long-stack-trace-zone.js',
+ 'hammer.js',
+ 'angular2.js'
+ ],
+
traceurOptions: {
'sourceMaps': true,
'annotations': true,
@@ -16,4 +37,4 @@ module.exports = {
'modules': 'instantiate'
},
protractorPort: 8876
-};
+}
diff --git a/scripts/e2e/index.template.html b/scripts/e2e/index.template.html
index b400947e3b..f203cb5ad1 100644
--- a/scripts/e2e/index.template.html
+++ b/scripts/e2e/index.template.html
@@ -1,21 +1,30 @@
+<% var PREFIX = '../../..'; %>
-
-
-
-
-
-
+
+ <% buildConfig.scripts.forEach(function(src) { %>
+
+ <% }); %>
+
<%= contents %>
diff --git a/src/components/aside/extensions/gestures/gestures.js b/src/components/aside/extensions/gestures/gestures.js
index ac50604691..4fca5c2302 100644
--- a/src/components/aside/extensions/gestures/gestures.js
+++ b/src/components/aside/extensions/gestures/gestures.js
@@ -4,14 +4,15 @@ import {SlideEdgeGesture} from '../../../../core/gestures/slide-edge-gesture';
class AsideGesture extends SlideEdgeGesture {
constructor(aside: Aside) {
- this.aside = aside;
// TODO figure out the sliding element, dont just use the parent
- this.slideElement = aside.domElement.parentNode;
- super(this.slideElement, {
+ let slideElement = aside.domElement.parentNode;
+ super(slideElement, {
direction: (aside.side === 'left' || aside.side === 'right') ? 'x' : 'y',
edge: aside.side,
threshold: 75
});
+ this.aside = aside;
+ this.slideElement = slideElement;
this.listen();
}
diff --git a/src/components/modal/modal.js b/src/components/modal/modal.js
index 75c3952dce..4f48ddb04e 100644
--- a/src/components/modal/modal.js
+++ b/src/components/modal/modal.js
@@ -11,7 +11,7 @@ import {Ion} from '../ion';
`
})
-class ModalWrapper extends Ion {
+class ModalWrapper {
constructor(@NgElement() el : NgElement) {
this.element = el
console.log('element', el)
@@ -35,7 +35,7 @@ class ModalWrapper extends Ion {
`
})
-export class Modal extends Ion {
+export class Modal {
//compiler: Compiler;
constructor(compiler: Compiler, @NgElement() el : NgElement) {
diff --git a/src/components/nav-view/nav-view.js b/src/components/nav-view/nav-view.js
index c1a61a331e..d3225f4b25 100644
--- a/src/components/nav-view/nav-view.js
+++ b/src/components/nav-view/nav-view.js
@@ -1,6 +1,6 @@
import {Ion} from '../ion'
-export class NavView extends Ion {
+export class NavView {
// viewControllers: Stack;
// visibleViewController: ViewController;
diff --git a/src/components/switch/switch.js b/src/components/switch/switch.js
index f6bf37b6df..b762579e8b 100644
--- a/src/components/switch/switch.js
+++ b/src/components/switch/switch.js
@@ -1,5 +1,4 @@
import {NgElement, Component, Template} from 'angular2/angular2';
-import {Ion} from '../ion';
@Component({
selector: 'ion-switch',
@@ -20,7 +19,7 @@ import {Ion} from '../ion';
`
})
-export class Switch extends IonElement {
+export class Switch {
constructor(
@NgElement() el : NgElement,
@EventEmitter('change') emitChange: Function
diff --git a/src/components/tabs/tabs.js b/src/components/tabs/tabs.js
index d8d265968b..05440864b0 100644
--- a/src/components/tabs/tabs.js
+++ b/src/components/tabs/tabs.js
@@ -1,6 +1,5 @@
import {NgElement, Component, Template, Parent} from 'angular2/angular2';
import {History} from '../../history';
-import {Ion} from '../ion';
import {View} from 'ionic/components/view/view';
@@ -26,7 +25,7 @@ import {View} from 'ionic/components/view/view';
`
})
-export class Tabs extends Ion {
+export class Tabs {
constructor(@NgElement() ele:NgElement) {
ele.domElement.classList.add('pane');
diff --git a/src/core/gestures/slide-edge-gesture.js b/src/core/gestures/slide-edge-gesture.js
index 60bc77b706..78ae9c06dc 100644
--- a/src/core/gestures/slide-edge-gesture.js
+++ b/src/core/gestures/slide-edge-gesture.js
@@ -7,10 +7,10 @@ export class SlideEdgeGesture extends SlideGesture {
edge: 'left',
threshold: 50
});
+ super(element, opts);
// Can check corners through use of eg 'left top'
this.edges = opts.edge.split(' ');
this.threshold = opts.threshold;
- super(element, opts);
}
canStart(ev) {
diff --git a/src/core/gestures/slide-gesture.js b/src/core/gestures/slide-gesture.js
index 15a38ef088..4966bfbba1 100644
--- a/src/core/gestures/slide-gesture.js
+++ b/src/core/gestures/slide-gesture.js
@@ -3,8 +3,8 @@ import * as util from '../../util';
export class SlideGesture extends DragGesture {
constructor(element, opts = {}) {
- this.element = element;
super(element, opts);
+ this.element = element;
}
/*