зеркало из https://github.com/mozilla/smarthome.git
Родитель
dfdf479b92
Коммит
fa1949c8e0
|
@ -20,23 +20,4 @@ The manifest generation could be triggered by:
|
|||
The "nice manifest" option will add line breaks after every imported package.
|
||||
Now you can have a look at the manifest that would be generated by the bndtool using:
|
||||
|
||||
cat target/classes/META-INF/MANIFEST.MF
|
||||
|
||||
PaperUI development (JS/HTML)
|
||||
---
|
||||
|
||||
The initial setup of PaperUI can be done in two ways:
|
||||
|
||||
1. By running the maven build.
|
||||
2. Running an 'npm install' followed by 'gulp' build.
|
||||
|
||||
The JS/HTML files of PaperUI are packaged using the 'Gulp' plugin. There are two important gulp tasks needed for development. For normal development you need to run the following command on console:
|
||||
|
||||
gulp serve --development
|
||||
|
||||
This will automatically inject all the needed files to index.html and will launch a browsersync instance running on http://localhost:3000/ (default). The calls to rest end-point are also proxied by this gulp task. After running this, any changes made into the files of folder 'web-src' will be available in the browser after refreshing the page.
|
||||
The distribution version of PaperUI can be seen using the command:
|
||||
|
||||
gulp
|
||||
|
||||
This will minify the files and copy all the sources to 'web' folder. The changes can be seen at 'http://localhost:8080/' (default port for smarthome web server).
|
||||
cat target/classes/META-INF/MANIFEST.MF
|
|
@ -2,4 +2,3 @@ node/
|
|||
node_modules/
|
||||
web-src/bower_components/
|
||||
web/
|
||||
web-src/index.html
|
||||
|
|
|
@ -8,11 +8,7 @@ var angularFilesort = require('gulp-angular-filesort'),
|
|||
ngAnnotate = require('gulp-ng-annotate'),
|
||||
proxyMiddleware = require('http-proxy-middleware'),
|
||||
rename = require("gulp-rename"),
|
||||
uglify = require('gulp-uglify'),
|
||||
inject = require('gulp-inject'),
|
||||
util = require('gulp-util');
|
||||
var isDevelopment = !!util.env.development;
|
||||
|
||||
uglify = require('gulp-uglify');
|
||||
|
||||
var paths = {
|
||||
scripts: [
|
||||
|
@ -56,7 +52,7 @@ var paths = {
|
|||
'./node_modules/masonry-layout/dist/masonry.pkgd.min.js',
|
||||
'./node_modules/sprintf-js/dist/sprintf.min.js',
|
||||
'./node_modules/bootstrap/dist/js/bootstrap.min.js',
|
||||
'./node_modules/tinycolor2/tinycolor.js'
|
||||
'./node_modules/tinycolor2/tinycolor.js',
|
||||
],
|
||||
JQUI: [{
|
||||
'src' : [
|
||||
|
@ -77,9 +73,8 @@ var paths = {
|
|||
]
|
||||
};
|
||||
|
||||
|
||||
gulp.task('default', ['build','inject']);
|
||||
gulp.task('build', ['uglify', 'concat', 'copyCSSLibs', 'copyFontLibs', 'copyJSLibs', 'copyStatic', 'copyPartials']);
|
||||
gulp.task('default', ['build']);
|
||||
gulp.task('build', ['uglify', 'concat', 'copyCSSLibs', 'copyFontLibs', 'copyJSLibs', 'copyJQUI' , 'copyStatic', 'copyPartials']);
|
||||
|
||||
gulp.task('uglify', function () {
|
||||
return gulp.src(paths.scripts)
|
||||
|
@ -149,8 +144,7 @@ gulp.task('clean', function () {
|
|||
// Gulp Serve
|
||||
function browserSyncInit(baseDir) {
|
||||
var server = {
|
||||
baseDir: baseDir,
|
||||
index: "index.html"
|
||||
baseDir: baseDir
|
||||
};
|
||||
|
||||
server.middleware = proxyMiddleware(['/rest'], {target: 'http://localhost:8080'});
|
||||
|
@ -162,43 +156,6 @@ function browserSyncInit(baseDir) {
|
|||
});
|
||||
}
|
||||
|
||||
gulp.task('serve', ['inject'], function () {
|
||||
gulp.task('serve', ['build'], function () {
|
||||
browserSyncInit(['./web-src', './web']);
|
||||
});
|
||||
|
||||
|
||||
gulp.task('inject', ['build'], function () {
|
||||
var target = gulp.src('./web/index.html');
|
||||
// It's not necessary to read the files (will speed up things), we're only after their paths:
|
||||
var files;
|
||||
console.log("MODE:"+isDevelopment);
|
||||
if(!isDevelopment){
|
||||
files = [
|
||||
'web/js/app.js',
|
||||
'web/js/constants.js',
|
||||
'web/js/services.min.js',
|
||||
'web/js/controllers.min.js',
|
||||
'web/js/extensions.js',
|
||||
'web/js/main.js',
|
||||
'web/js/shared.properties.js'
|
||||
];
|
||||
}
|
||||
else
|
||||
{
|
||||
files = ['./web-src/js/*.js']
|
||||
}
|
||||
var sources = gulp.src(files, {read: false});
|
||||
|
||||
return target.pipe(inject(sources,{
|
||||
addRootSlash : false,
|
||||
ignorePath : './web-src/js/*.js',
|
||||
transform : function ( filePath, file, i, length ) {
|
||||
|
||||
var newPath = isDevelopment ? filePath.replace('web-src/','') : filePath.replace( 'web/', '' );
|
||||
console.log('inject script = '+ newPath);
|
||||
return '<script src="' + newPath + '"></script>';
|
||||
}
|
||||
}))
|
||||
.pipe(isDevelopment ? gulp.dest('./web-src'):gulp.dest('./web'));
|
||||
});
|
||||
|
||||
|
|
|
@ -38,7 +38,65 @@
|
|||
<body ng-controller="BodyController">
|
||||
<div id="authentication" data-access-token="{{ACCESS_TOKEN}}"></div>
|
||||
<div ng-include="'partials/include.extension.html'"></div>
|
||||
<div ng-include="'partials/navigation.menu.html'"></div>
|
||||
<nav class="menu slide-menu-left" ng-controller="NavController">
|
||||
<div class="top clickable" ng-click="navigateToRoot()">
|
||||
<img id="logo" alt="Eclipse SmartHome Logo" src="img/logo.png" />
|
||||
<h1 class="title">SmartHome</h1>
|
||||
</div>
|
||||
<ul>
|
||||
<li ng-class="{active: isActive('control'), hidden: isHidden('control')}">
|
||||
<a href="#control">
|
||||
<span class="icon material-icons">dashboard</span>
|
||||
<span class="side-menu">Control</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-class="{active: isActive('inbox')}">
|
||||
<a href="#inbox" class="clickable">
|
||||
<span class="icon material-icons">add_circle_outline</span>
|
||||
<span class="side-menu">Inbox</span>
|
||||
<span ng-show="getNumberOfNewDiscoveryResults() > 0" class="badge">{{getNumberOfNewDiscoveryResults()}}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-class="{active: isActive('configuration'), hidden: isHidden('configuration')}">
|
||||
<a ng-click="open('configuration')" class="clickable">
|
||||
<span class="icon material-icons">settings</span>
|
||||
<span class="side-menu">Configuration</span>
|
||||
</a>
|
||||
<ul ng-show="isActive('configuration')">
|
||||
<li ng-class="{active: isSubActive('bindings')}">
|
||||
<a href="#configuration/bindings">Bindings</a>
|
||||
</li>
|
||||
<li ng-class="{active: isSubActive('services')}">
|
||||
<a href="#configuration/services">Services</a>
|
||||
</li>
|
||||
<li ng-class="{active: isSubActive('things')}">
|
||||
<a href="#configuration/things">Things</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li ng-show="extensionEnabled" ng-class="{active: isActive('extensions'), hidden: isHidden('extensions')}">
|
||||
<a href="#extensions">
|
||||
<span class="icon material-icons">extension</span>
|
||||
<span class="side-menu">Extensions</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-show="ruleEnabled" ng-class="{active: isActive('rules'), hidden: isHidden('rules')}">
|
||||
<a href="#rules">
|
||||
<span class="icon material-icons">movie_creation</span>
|
||||
<span class="side-menu">Rules</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-class="{active: isActive('preferences'), hidden: isHidden('preferences')}">
|
||||
<a href="#preferences">
|
||||
<span class="icon material-icons">brightness_medium</span>
|
||||
<span class="side-menu">Preferences</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="bottom">
|
||||
<span>Paper UI</span>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
|
@ -65,17 +123,24 @@
|
|||
<script src="js/jquery-ui.min.js"></script>
|
||||
<script src="js/angular-bundle.min.js"></script>
|
||||
|
||||
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
|
||||
<!-- TODO: Create custom variant to save space -->
|
||||
<script src="js/tinycolor.js"></script>
|
||||
<script src="js/masonry.pkgd.min.js"></script>
|
||||
|
||||
<!-- TODO: Use angularized version? -->
|
||||
<script src="js/sprintf.min.js"></script>
|
||||
|
||||
<!-- inject:js -->
|
||||
<!-- endinject -->
|
||||
|
||||
<!-- custom js files -->
|
||||
<script src="js/app.js"></script>
|
||||
<script src="js/constants.js"></script>
|
||||
<script src="js/services.min.js"></script>
|
||||
<script src="js/controllers.min.js"></script>
|
||||
<script src="js/extensions.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
<script src="js/shared.properties.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
@ -1,59 +0,0 @@
|
|||
<nav class="menu slide-menu-left" ng-controller="NavController">
|
||||
<div class="top clickable" ng-click="navigateToRoot()">
|
||||
<img id="logo" alt="Eclipse SmartHome Logo" src="img/logo.png" />
|
||||
<h1 class="title">SmartHome</h1>
|
||||
</div>
|
||||
<ul>
|
||||
<li ng-class="{active: isActive('control'), hidden: isHidden('control')}">
|
||||
<a href="#control">
|
||||
<span class="icon material-icons">dashboard</span>
|
||||
<span class="side-menu">Control</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-class="{active: isActive('inbox')}">
|
||||
<a href="#inbox" class="clickable">
|
||||
<span class="icon material-icons">add_circle_outline</span>
|
||||
<span class="side-menu">Inbox</span>
|
||||
<span ng-show="getNumberOfNewDiscoveryResults() > 0" class="badge">{{getNumberOfNewDiscoveryResults()}}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-class="{active: isActive('configuration'), hidden: isHidden('configuration')}">
|
||||
<a ng-click="open('configuration')" class="clickable">
|
||||
<span class="icon material-icons">settings</span>
|
||||
<span class="side-menu">Configuration</span>
|
||||
</a>
|
||||
<ul ng-show="isActive('configuration')">
|
||||
<li ng-class="{active: isSubActive('bindings')}">
|
||||
<a href="#configuration/bindings">Bindings</a>
|
||||
</li>
|
||||
<li ng-class="{active: isSubActive('services')}">
|
||||
<a href="#configuration/services">Services</a>
|
||||
</li>
|
||||
<li ng-class="{active: isSubActive('things')}">
|
||||
<a href="#configuration/things">Things</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li ng-show="extensionEnabled" ng-class="{active: isActive('extensions'), hidden: isHidden('extensions')}">
|
||||
<a href="#extensions">
|
||||
<span class="icon material-icons">extension</span>
|
||||
<span class="side-menu">Extensions</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-show="ruleEnabled" ng-class="{active: isActive('rules'), hidden: isHidden('rules')}">
|
||||
<a href="#rules">
|
||||
<span class="icon material-icons">movie_creation</span>
|
||||
<span class="side-menu">Rules</span>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-class="{active: isActive('preferences'), hidden: isHidden('preferences')}">
|
||||
<a href="#preferences">
|
||||
<span class="icon material-icons">brightness_medium</span>
|
||||
<span class="side-menu">Preferences</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="bottom">
|
||||
<span>Paper UI</span>
|
||||
</div>
|
||||
</nav>
|
Загрузка…
Ссылка в новой задаче