Added concat and uglify tasks to grunt. Piskel on master will only be able to work in debug mode, by passing ?debug in URL. The minified version is built in /build, which has been added to .gitignore

This commit is contained in:
jdescottes 2013-08-04 18:27:32 +02:00
parent 9a68da8bda
commit 91bacd1dd9
9 changed files with 212 additions and 208 deletions

4
.gitignore vendored
View File

@ -3,6 +3,7 @@
# nodejs local installs
node_modules
npm-debug.log
# sublime text stuff (the -project should actually be shared, but then we'd have to share the same disk location)
*.sublime-project
@ -10,3 +11,6 @@ node_modules
# git stackdumps
*.stackdump
# builds
build

View File

@ -10,42 +10,60 @@
* If you run this task locally, it may require some env set up first.
*/
module.exports = function(grunt) {
module.exports = function (grunt) {
grunt.initConfig({
jshint: {
jshint : {
/*options: {
"evil": true,
"asi": true,
"smarttabs": true,
"eqnull": true
},*/
files: [
files : [
'Gruntfile.js',
'package.json',
'js/**/*.js',
'!js/lib/**/*.js' // Exclude lib folder (note the leading !)
]
},
connect: {
www: {
options: {
base: '.',
port: 4545
connect : {
www : {
options : {
base : '.',
port : 4545
}
}
},
ghost: {
dist: {
filesSrc: ['tests/integration/casperjs/*_test.js'],
options: {
args: {
baseUrl: 'http://localhost:' +
'<%= connect.www.options.port %>/'
ghost : {
dist : {
filesSrc : ['tests/integration/casperjs/*_test.js'],
options : {
args : {
baseUrl : 'http://localhost:' + '<%= connect.www.options.port %>/'
},
direct: false,
logLevel: 'error',
printCommand: false,
printFilePaths: true
direct : false,
logLevel : 'error',
printCommand : false,
printFilePaths : true
}
}
},
concat : {
options : {
separator : ';',
},
dist : {
src : require('./script-load-list.js').scripts,
dest : 'build/piskel-packaged.js',
},
},
uglify : {
options : {
mangle : true
},
my_target : {
files : {
'build/piskel-packaged-min.js' : ['build/piskel-packaged.js']
}
}
}
@ -53,8 +71,11 @@ module.exports = function(grunt) {
grunt.loadNpmTasks('grunt-contrib-connect');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-ghost');
grunt.registerTask('default', ['jshint', 'concat', 'uglify']);
grunt.registerTask('lint', ['jshint']);
grunt.registerTask('test', ['jshint', 'connect', 'ghost']);
};

View File

@ -1,39 +0,0 @@
<!doctype html5>
<html>
<head>
<title>All piskels</title>
</head>
<body>
<script type="text/javascript">
(function () {
var loadAllPiskelIds = function (frameId) {
var xhr = new XMLHttpRequest();
// TODO: Change frameId to framesheetId on the backend
xhr.open('GET', 'http://2.piskel-app.appspot.com/all?l=' + frameId, true);
xhr.responseType = 'text';
xhr.onload = function(e) {
var ul = document.createElement("UL");
var innerHTML = "";
eval("var responseObject = " + this.responseText);
var keys = responseObject.keys;
var baseUrl = window.location.origin + "/piskel/?frameId=";
if (keys) {
for (var i = 0 ; i < keys.length ; i++) {
var key = keys[i];
innerHTML += "<li><a target='_blank' href='"+baseUrl+key+"'>"+key+"</a></li>"
}
}
ul.innerHTML = innerHTML;
document.body.appendChild(ul);
};
xhr.send();
};
loadAllPiskelIds();
})();
</script>
</body>
</html>

View File

@ -119,70 +119,42 @@
</div>
</div>
<!-- Core libraries: -->
<script src="js/lib/jquery-1.8.0.js"></script>
<script src="js/lib/jquery-ui-1.10.3.custom.js"></script>
<script src="js/lib/pubsub.js"></script>
<script src="js/lib/bootstrap/bootstrap.js"></script>
<script type="text/javascript">
(function () {
var loadScript = function (src, callback) {
document.write('<scr'+'ipt src ="'+src+'" onload="'+callback+'"></sc'+'ript>');
};
if (window.location.href.indexOf("debug") != -1) {
window.exports = {};
loadScript("script-load-list.js", "loadDebugScripts()");
window.loadDebugScripts = function () {
exports.scripts.forEach(function (script){
loadScript(script, "done()")
})
}
var loaded = 0;
window.done = function () {
loaded ++;
if (loaded == exports.scripts.length) {
pskl.app.init();
// cleanup
delete window.exports;
delete window.loadDebugScripts;
delete window.done;
}
};
<!-- GIF Encoding libraries -->
<script src="js/lib/gif/GIFEncoder.js"></script>
<script src="js/lib/gif/b64.js"></script>
<script src="js/lib/gif/NeuQuant.js"></script>
<script src="js/lib/gif/LZWEncoder.js"></script>
} else {
var script;
if (window.location.href.indexOf("pack") != -1) {
script = "build/piskel-packaged.js";
} else {
script = "build/piskel-packaged-min.js";
}
loadScript(script, "pskl.app.init()");
}
})();
<!-- Application wide configuration -->
<script src="js/Constants.js"></script>
<script src="js/Events.js"></script>
<!-- Libraries -->
<script src="js/utils/core.js"></script>
<script src="js/utils/PixelUtils.js"></script>
<script src="js/utils/CanvasUtils.js"></script>
<script src="js/utils/UserSettings.js"></script>
<script src="js/lib/jsColor_1_4_0/jscolor.js"></script>
<!-- Application libraries-->
<script src="js/rendering/DrawingLoop.js"></script>
<!-- Models -->
<script src="js/model/Frame.js"></script>
<script src="js/model/FrameSheet.js"></script>
<script src="js/selection/SelectionManager.js"></script>
<script src="js/selection/BaseSelection.js"></script>
<script src="js/selection/RectangularSelection.js"></script>
<script src="js/selection/ShapeSelection.js"></script>
<!-- Rendering -->
<script src="js/rendering/CanvasRenderer.js"></script>
<script src="js/rendering/FrameRenderer.js"></script>
<script src="js/rendering/SpritesheetRenderer.js"></script>
<!-- Controllers -->
<script src="js/controller/DrawingController.js"></script>
<script src="js/controller/PreviewFilmController.js"></script>
<script src="js/controller/AnimatedPreviewController.js"></script>
<script src="js/controller/ToolController.js"></script>
<script src="js/controller/PaletteController.js"></script>
<script src="js/controller/NotificationController.js"></script>
<script src="js/controller/SettingsController.js"></script>
<!-- Services -->
<script src="js/service/LocalStorageService.js"></script>
<script src="js/service/HistoryService.js"></script>
<script src="js/service/KeyboardEventService.js"></script>
<!-- Tools-->
<script src="js/drawingtools/BaseTool.js"></script>
<script src="js/drawingtools/SimplePen.js"></script>
<script src="js/drawingtools/VerticalMirrorPen.js"></script>
<script src="js/drawingtools/Eraser.js"></script>
<script src="js/drawingtools/Stroke.js"></script>
<script src="js/drawingtools/PaintBucket.js"></script>
<script src="js/drawingtools/Rectangle.js"></script>
<script src="js/drawingtools/Circle.js"></script>
<script src="js/drawingtools/Move.js"></script>
<script src="js/drawingtools/selectiontools/BaseSelect.js"></script>
<script src="js/drawingtools/selectiontools/RectangleSelect.js"></script>
<script src="js/drawingtools/selectiontools/ShapeSelect.js"></script>
<script src="js/drawingtools/ColorPicker.js"></script>
<!-- Application controller and initialization -->
<script src="js/piskel.js"></script>
</script>
</body>
</html>

View File

@ -35,34 +35,7 @@ var jscolor = {
getDir : function() {
if(!jscolor.dir) {
var detected = jscolor.detectDir();
jscolor.dir = detected!==false ? detected : 'jscolor/';
}
return jscolor.dir;
},
detectDir : function() {
var base = location.href;
var e = document.getElementsByTagName('base');
for(var i=0; i<e.length; i+=1) {
if(e[i].href) { base = e[i].href; }
}
var e = document.getElementsByTagName('script');
for(var i=0; i<e.length; i+=1) {
if(e[i].src && /(^|\/)jscolor\.js([?#].*)?$/i.test(e[i].src)) {
var src = new jscolor.URI(e[i].src);
var srcAbs = src.toAbsolute(base);
srcAbs.path = srcAbs.path.replace(/[^\/]+$/, ''); // remove filename
srcAbs.query = null;
srcAbs.fragment = null;
return srcAbs.toString();
}
}
return false;
return "js/lib/jsColor_1_4_0/";
},

View File

@ -60,7 +60,9 @@
if (this.isStaticVersion) {
var framesheetId = this.readFramesheetIdFromURL_();
if (framesheetId) {
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Loading animation with id : [" + framesheetId + "]"}]);
$.publish(Events.SHOW_NOTIFICATION, [{
"content" : "Loading animation with id : [" + framesheetId + "]"
}]);
this.loadFramesheetFromService(framesheetId);
} else {
this.finishInit();
@ -79,7 +81,7 @@
// Init (event-delegated) bootstrap tooltips:
$('body').tooltip({
selector: '[rel=tooltip]'
selector : '[rel=tooltip]'
});
},
@ -98,7 +100,8 @@
},
readSizeFromURL_ : function () {
var sizeParam = this.readUrlParameter_("size"), size;
var sizeParam = this.readUrlParameter_("size"),
size;
// parameter expected as size=64x48 => size=widthxheight
var parts = sizeParam.split("x");
if (parts && parts.length == 2 && !isNaN(parts[0]) && !isNaN(parts[1])) {
@ -115,7 +118,7 @@
return size;
},
readFramesheetIdFromURL_ : function() {
readFramesheetIdFromURL_ : function () {
return this.readUrlParameter_("frameId");
},
@ -123,7 +126,7 @@
var searchString = window.location.search.substring(1),
i, val, params = searchString.split("&");
for (i=0;i<params.length;i++) {
for (i = 0; i < params.length; i++) {
val = params[i].split("=");
if (val[0] == paramName) {
return unescape(val[1]);
@ -137,7 +140,7 @@
xhr.open('GET', Constants.PISKEL_SERVICE_URL + '/get?l=' + frameId, true);
xhr.responseType = 'text';
xhr.onload = function(e) {
xhr.onload = function (e) {
var res = JSON.parse(this.responseText);
frameSheet.load(res.framesheet);
pskl.app.animationController.setFPS(res.fps);
@ -180,38 +183,42 @@
xhr.open('POST', "save", true);
}
xhr.onload = function(e) {
xhr.onload = function (e) {
if (this.status == 200) {
if (pskl.app.isStaticVersion) {
var baseUrl = window.location.href.replace(window.location.search, "");
window.location.href = baseUrl + "?frameId=" + this.responseText;
} else {
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Successfully saved !"}]);
$.publish(Events.SHOW_NOTIFICATION, [{
"content" : "Successfully saved !"
}]);
}
} else {
this.onerror(e);
}
};
xhr.onerror = function(e) {
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Saving failed ("+this.status+")"}]);
xhr.onerror = function (e) {
$.publish(Events.SHOW_NOTIFICATION, [{
"content" : "Saving failed (" + this.status + ")"
}]);
};
xhr.send(formData);
if(event) {
if (event) {
event.stopPropagation();
event.preventDefault();
}
return false;
},
uploadToScreenletstore : function(imageData) {
uploadToScreenletstore : function (imageData) {
var xhr = new XMLHttpRequest();
var formData = new FormData();
formData.append('data', imageData);
xhr.open('POST', "http://screenletstore.appspot.com/__/upload", true);
var cloudURL;
var that = this;
xhr.onload = function(e) {
xhr.onload = function (e) {
if (this.status == 200) {
cloudURL = "http://screenletstore.appspot.com/img/" + this.responseText;
that.openWindow(cloudURL);
@ -232,7 +239,7 @@
this.uploadToScreenletstore(imageData);
},
openWindow: function(url) {
openWindow : function (url) {
var options = [
"dialog=yes", "scrollbars=no", "status=no",
"width=" + frameSheet.getWidth() * frameSheet.getFrameCount(),
@ -242,7 +249,4 @@
window.open(url, "piskel-export", options);
}
};
pskl.app.init();
})();

View File

@ -10,6 +10,13 @@
this.localStorageThrottler_ = null;
};
/**
* @public
*/
ns.LocalStorageService.prototype.init = function(framesheet_) {
$.subscribe(Events.LOCALSTORAGE_REQUEST, $.proxy(this.persistToLocalStorageRequest_, this));
};
/**
* @private
*/
@ -51,13 +58,6 @@
delete window.localStorage.snapShot;
};
/**
* @public
*/
ns.LocalStorageService.prototype.init = function(framesheet_) {
$.subscribe(Events.LOCALSTORAGE_REQUEST, $.proxy(this.persistToLocalStorageRequest_, this));
};
/**
* @public
*/

View File

@ -15,6 +15,8 @@
"grunt": "~0.4.1",
"grunt-contrib-connect": "0.3.0",
"grunt-contrib-jshint": "0.5.4",
"grunt-ghost": "1.0.12"
"grunt-contrib-uglify": "0.2.2",
"grunt-ghost": "1.0.12",
"grunt-contrib-concat": "0.1.2"
}
}

67
script-load-list.js Normal file
View File

@ -0,0 +1,67 @@
// This list is used both by the grunt build and index.html (in debug mode)
exports.scripts = [
// Core libraries
"js/lib/jquery-1.8.0.js","js/lib/jquery-ui-1.10.3.custom.js","js/lib/pubsub.js","js/lib/bootstrap/bootstrap.js",
// GIF Encoding libraries
"js/lib/gif/GIFEncoder.js","js/lib/gif/b64.js","js/lib/gif/NeuQuant.js","js/lib/gif/LZWEncoder.js",
// Application wide configuration
"js/Constants.js",
"js/Events.js",
// Libraries
"js/utils/core.js",
"js/utils/PixelUtils.js",
"js/utils/CanvasUtils.js",
"js/utils/UserSettings.js",
"js/lib/jsColor_1_4_0/jscolor.js",
// Application libraries-->
"js/rendering/DrawingLoop.js",
// Models
"js/model/Frame.js",
"js/model/FrameSheet.js",
"js/selection/SelectionManager.js",
"js/selection/BaseSelection.js",
"js/selection/RectangularSelection.js",
"js/selection/ShapeSelection.js",
// Rendering
"js/rendering/CanvasRenderer.js",
"js/rendering/FrameRenderer.js",
"js/rendering/SpritesheetRenderer.js",
// Controllers
"js/controller/DrawingController.js",
"js/controller/PreviewFilmController.js",
"js/controller/AnimatedPreviewController.js",
"js/controller/ToolController.js",
"js/controller/PaletteController.js",
"js/controller/NotificationController.js",
"js/controller/SettingsController.js",
// Services
"js/service/LocalStorageService.js",
"js/service/HistoryService.js",
"js/service/KeyboardEventService.js",
// Tools
"js/drawingtools/BaseTool.js",
"js/drawingtools/SimplePen.js",
"js/drawingtools/VerticalMirrorPen.js",
"js/drawingtools/Eraser.js",
"js/drawingtools/Stroke.js",
"js/drawingtools/PaintBucket.js",
"js/drawingtools/Rectangle.js",
"js/drawingtools/Circle.js",
"js/drawingtools/Move.js",
"js/drawingtools/selectiontools/BaseSelect.js",
"js/drawingtools/selectiontools/RectangleSelect.js",
"js/drawingtools/selectiontools/ShapeSelect.js",
"js/drawingtools/ColorPicker.js",
// Application controller and initialization
"js/piskel.js"
];