Base documentation, séparation code DOM dans fichier distinct
This commit is contained in:
parent
908b12ef20
commit
30092c25f3
15
Gruntfile.js
15
Gruntfile.js
|
|
@ -7,15 +7,16 @@ module.exports = function(grunt) {
|
|||
var NW_VERSION = '0.12.2';
|
||||
var BUILD_DIR = 'build';
|
||||
var BUILD_TARGETS = {
|
||||
linux_ia32: true,
|
||||
linux_ia32: false,
|
||||
linux_x64: true,
|
||||
win: true,
|
||||
win: false,
|
||||
osx: false
|
||||
};
|
||||
var PKG = grunt.file.readJSON('package.json');
|
||||
var PKG_OVERWRITE = {
|
||||
window: {
|
||||
toolbar: false
|
||||
toolbar: false,
|
||||
kiosk: true
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -51,6 +52,8 @@ module.exports = function(grunt) {
|
|||
src: [
|
||||
'index.html',
|
||||
'package.json',
|
||||
'default-profile.json',
|
||||
'LICENCE',
|
||||
'css/**',
|
||||
'js/**',
|
||||
'img/**'
|
||||
|
|
@ -101,12 +104,12 @@ module.exports = function(grunt) {
|
|||
|
||||
});
|
||||
|
||||
grunt.registerTask('kaki:run', ['download', 'run']);
|
||||
grunt.registerTask('papaye:run', ['download', 'run']);
|
||||
grunt.registerTask(
|
||||
'kaki:build',
|
||||
'papaye:build',
|
||||
['download', 'build', 'copy:build']
|
||||
);
|
||||
grunt.registerTask('default', ['kaki:run']);
|
||||
grunt.registerTask('default', ['papaye:run']);
|
||||
|
||||
grunt.loadNpmTasks('grunt-contrib-clean');
|
||||
grunt.loadNpmTasks('grunt-contrib-copy');
|
||||
|
|
|
|||
36
README.md
36
README.md
|
|
@ -1,18 +1,31 @@
|
|||
# Kaki
|
||||
# Papaye
|
||||
|
||||
Application loader
|
||||
Lanceur d'application pour Linux
|
||||
|
||||
## Getting started
|
||||
## Démarrer avec les sources
|
||||
|
||||
### Dépendences de développement
|
||||
|
||||
- [NodeJS](https://nodejs.org/) - Dernière version stable, testé sur la 0.12.*
|
||||
- [NPM](https://www.npmjs.com/) - Normalement automatiquement installé avec NodeJS.
|
||||
|
||||
### Initialisation du projet
|
||||
|
||||
```
|
||||
git clone <repo>
|
||||
cd kaki
|
||||
cd papaye
|
||||
git checkout develop
|
||||
npm install
|
||||
npm start
|
||||
```
|
||||
|
||||
### Passing options in development
|
||||
## Options
|
||||
|
||||
```
|
||||
--profile=<chemin_profile> Chemin vers le fichier de profil à charger dans l'application.
|
||||
```
|
||||
|
||||
### Passer des options en développement
|
||||
|
||||
```
|
||||
npm start -- [options...]
|
||||
|
|
@ -23,6 +36,15 @@ Exemple:
|
|||
npm start -- --profile=my-profile.json
|
||||
```
|
||||
|
||||
## How to contribute
|
||||
## Comment construire l'application depuis les sources
|
||||
|
||||
This project uses [Git Flow](http://nvie.com/posts/a-successful-git-branching-model/).
|
||||
```
|
||||
npm run build
|
||||
```
|
||||
|
||||
Un dossier `papaye-<version>-<target>-<arch>` sera créé dans le répertoire `./build`. Celui ci contient tous les fichiers nécessaires à l'application.
|
||||
|
||||
|
||||
## Comment contribuer
|
||||
|
||||
Ce projet utilise la méthodologie [Git Flow](http://nvie.com/posts/a-successful-git-branching-model/).
|
||||
|
|
|
|||
14
index.html
14
index.html
|
|
@ -1,11 +1,14 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>Kaki Launcher</title>
|
||||
<title>Lanceur - Papaye</title>
|
||||
<link rel="stylesheet" href="css/style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="kaki"></div>
|
||||
|
||||
<!-- Application root element -->
|
||||
<div id="papaye"></div>
|
||||
|
||||
<!-- Templates -->
|
||||
<script id="items-list-tpl" type="text/x-template">
|
||||
<ul class="apps-list">
|
||||
{{#each items}}
|
||||
|
|
@ -17,10 +20,13 @@
|
|||
</ul>
|
||||
</script>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script type="text/javascript" src="js/dom.js"></script>
|
||||
<script type="text/javascript" src="js/app.js"></script>
|
||||
|
||||
<!-- Application bootstrapping -->
|
||||
<script type="text/javascript">
|
||||
// Start the app
|
||||
Kaki.start('#kaki')
|
||||
Papaye.start('#papaye')
|
||||
.then(function() {
|
||||
console.info('Application started.');
|
||||
})
|
||||
|
|
|
|||
104
js/app.js
104
js/app.js
|
|
@ -1,7 +1,8 @@
|
|||
(function(Kaki, window) {
|
||||
(function(Papaye, window) {
|
||||
|
||||
"use strict";
|
||||
|
||||
// Load dependencies
|
||||
var path = require('path');
|
||||
var fs = require('fs');
|
||||
var Handlebars = require('handlebars');
|
||||
|
|
@ -9,26 +10,29 @@
|
|||
var gui = require('nw.gui');
|
||||
var minimist = require('minimist');
|
||||
|
||||
// Templates
|
||||
var itemsListTpl = Handlebars.compile(select('#items-list-tpl').innerHTML);
|
||||
// Load templates
|
||||
var itemsListTpl = Handlebars.compile(Papaye.DOM.select('#items-list-tpl').innerHTML);
|
||||
|
||||
// Internal constants
|
||||
var DEFAULT_PROFILE = './default-profile.json';
|
||||
|
||||
/**
|
||||
* Start the app
|
||||
*
|
||||
* @param rootEl The application root element selector
|
||||
* @return Kaki
|
||||
* @return Papaye
|
||||
*/
|
||||
Kaki.start = function(rootEl) {
|
||||
Papaye.start = function(rootEl) {
|
||||
|
||||
Kaki._opts = minimist(gui.App.argv);
|
||||
Kaki._rootEl = select(rootEl);
|
||||
Kaki._initListeners();
|
||||
Papaye._opts = minimist(gui.App.argv);
|
||||
Papaye._rootEl = Papaye.DOM.select(rootEl);
|
||||
Papaye._initListeners();
|
||||
|
||||
var profilePath = Kaki._opts.profile || './default-profile.json';
|
||||
var profilePath = Papaye._opts.profile || DEFAULT_PROFILE;
|
||||
|
||||
return Kaki.loadProfile(profilePath)
|
||||
return Papaye.loadProfile(profilePath)
|
||||
.then(function() {
|
||||
return Kaki;
|
||||
return Papaye;
|
||||
})
|
||||
;
|
||||
|
||||
|
|
@ -40,11 +44,11 @@
|
|||
* @param profilePath The path of the profile file
|
||||
* @return Promise
|
||||
*/
|
||||
Kaki.loadProfile = function(profilePath) {
|
||||
return Kaki._loadJSONFile(profilePath)
|
||||
Papaye.loadProfile = function(profilePath) {
|
||||
return Papaye._loadJSONFile(profilePath)
|
||||
.then(function(profile) {
|
||||
Kaki._profile = profile;
|
||||
Kaki.render();
|
||||
Papaye._profile = profile;
|
||||
Papaye.render();
|
||||
return profile;
|
||||
})
|
||||
;
|
||||
|
|
@ -53,11 +57,11 @@
|
|||
/**
|
||||
* Update the application view
|
||||
*
|
||||
* @return Kaki
|
||||
* @return Papaye
|
||||
*/
|
||||
Kaki.render = function() {
|
||||
var rootEl = Kaki._rootEl;
|
||||
var profile = Kaki._profile;
|
||||
Papaye.render = function() {
|
||||
var rootEl = Papaye._rootEl;
|
||||
var profile = Papaye._profile;
|
||||
rootEl.innerHTML = itemsListTpl(profile);
|
||||
};
|
||||
|
||||
|
|
@ -66,19 +70,19 @@
|
|||
* Initialize DOM event listeners
|
||||
* @private
|
||||
*/
|
||||
Kaki._initListeners = function() {
|
||||
var rootEl = Kaki._rootEl;
|
||||
rootEl.addEventListener('click', Kaki._onItemClick);
|
||||
Papaye._initListeners = function() {
|
||||
var rootEl = Papaye._rootEl;
|
||||
rootEl.addEventListener('click', Papaye._onItemClick);
|
||||
};
|
||||
|
||||
/**
|
||||
* App item click handler
|
||||
* @private
|
||||
*/
|
||||
Kaki._onItemClick = function(evt) {
|
||||
Papaye._onItemClick = function(evt) {
|
||||
|
||||
var appItemEl = evt.srcElement.matches( '.app-item') ? evt.srcElement :
|
||||
getClosestAncestor(evt.srcElement, '.app-item')
|
||||
Papaye.DOM.getClosestAncestor(evt.srcElement, '.app-item')
|
||||
;
|
||||
|
||||
if( !appItemEl ) return;
|
||||
|
|
@ -105,7 +109,7 @@
|
|||
* @param filePath The path of the json file
|
||||
* @return Promise
|
||||
*/
|
||||
Kaki._loadJSONFile = function(filePath) {
|
||||
Papaye._loadJSONFile = function(filePath) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
fs.readFile(filePath, 'utf8', function(err, fileContent) {
|
||||
if(err) return reject(err);
|
||||
|
|
@ -119,52 +123,4 @@
|
|||
});
|
||||
};
|
||||
|
||||
// DOM manipulation helpers
|
||||
|
||||
/**
|
||||
* Select an element in the DOM by its CSS selector
|
||||
*
|
||||
* @private
|
||||
* @param selector The CSS selector
|
||||
* @return The selected element or null
|
||||
*/
|
||||
function select(selector) {
|
||||
return window.document.querySelector(selector);
|
||||
}
|
||||
|
||||
/**
|
||||
* Select all elements in the DOM with a CSS selector
|
||||
*
|
||||
* @private
|
||||
* @param selector The CSS selector
|
||||
* @return An array of the selected elements (if any)
|
||||
*/
|
||||
function selectAll(selector) {
|
||||
return window.document.querySelectorAll(selector);
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the closest ancestor matching the CSS selector
|
||||
*
|
||||
* @private
|
||||
* @param selector The CSS selector
|
||||
* @return An array of the selected elements (if any)
|
||||
*/
|
||||
function getClosestAncestor(el, selector) {
|
||||
|
||||
var parent = el.parentElement;
|
||||
|
||||
if(parent) {
|
||||
if(parent.matches(selector)) {
|
||||
return parent;
|
||||
} else {
|
||||
return getClosestAncestor(parent, selector);
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}(window.Kaki = window.Kaki || {}, window));
|
||||
}(window.Papaye = window.Papaye || {}, window));
|
||||
|
|
|
|||
|
|
@ -0,0 +1,53 @@
|
|||
(function(Papaye, window) {
|
||||
|
||||
"use strict";
|
||||
|
||||
var DOM = Papaye.DOM = {};
|
||||
|
||||
/**
|
||||
* Select an element in the DOM by its CSS selector
|
||||
*
|
||||
* @private
|
||||
* @param selector The CSS selector
|
||||
* @return The selected element or null
|
||||
*/
|
||||
DOM.select = function(selector) {
|
||||
return window.document.querySelector(selector);
|
||||
};
|
||||
|
||||
/**
|
||||
* Select all elements in the DOM with a CSS selector
|
||||
*
|
||||
* @private
|
||||
* @param selector The CSS selector
|
||||
* @return An array of the selected elements (if any)
|
||||
*/
|
||||
DOM.selectAll = function(selector) {
|
||||
return window.document.querySelectorAll(selector);
|
||||
};
|
||||
|
||||
/**
|
||||
* Find the closest ancestor matching the CSS selector
|
||||
*
|
||||
* @private
|
||||
* @param selector The CSS selector
|
||||
* @return An array of the selected elements (if any)
|
||||
*/
|
||||
DOM.getClosestAncestor = function(el, selector) {
|
||||
|
||||
var parent = el.parentElement;
|
||||
|
||||
if(parent) {
|
||||
if(parent.matches(selector)) {
|
||||
return parent;
|
||||
} else {
|
||||
return DOM.getClosestAncestor(parent, selector);
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
|
||||
};
|
||||
|
||||
|
||||
}(window.Papaye = window.Papaye || {}, window));
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "kaki",
|
||||
"name": "papaye",
|
||||
"version": "0.0.0",
|
||||
"private": "true",
|
||||
"main": "index.html",
|
||||
|
|
@ -12,8 +12,8 @@
|
|||
"lodash": "^3.0.1"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "./node_modules/.bin/grunt kaki:run",
|
||||
"build": "./node_modules/.bin/grunt kaki:build"
|
||||
"start": "./node_modules/.bin/grunt papaye:run",
|
||||
"build": "./node_modules/.bin/grunt papaye:build"
|
||||
},
|
||||
"chromium-args": "--ignore-certificate-errors",
|
||||
"window": {
|
||||
|
|
|
|||
Loading…
Reference in New Issue