mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity
91bacd1dd9
piskel/index.html

161 lines
6.7 KiB
HTML
Raw Normal View History

Initial commit from dropbox Basic features : Can create frames Can edit frames (black and white only) Can select the frame to edit Animated preview And that's it. Really tired and code is extremely ugly, just needed to do something that _works_
2012-08-23 02:57:35 +04:00
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Piskel</title>
<meta name="description" content="">
<meta name="author" content="Julian Descottes">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Fixing DnD, removing LESS, cleaning code - Updating DnD to use Sortable instead of draggable/dropppable (updating deps as well). - much simpler logic for DnD - Remove LESS for now since it's a bit yet overkill - fix moveFrame function
2013-06-13 02:04:39 +04:00
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/tools.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap-tooltip-custom.css">
<link rel="stylesheet" type="text/css" href="css/preview-film-section.css">
Initial commit from dropbox Basic features : Can create frames Can edit frames (black and white only) Can select the frame to edit Animated preview And that's it. Really tired and code is extremely ugly, just needed to do something that _works_
2012-08-23 02:57:35 +04:00
</head>
Plug canvas background settings on UserSettings storage Canvas background class are now manager at the FrameRenderer level instead of CSS classes at the top of the DOM.
2013-06-18 01:10:35 +04:00
<body>
added empty readonly name field to index.html for consistency
2013-07-15 01:25:12 +04:00
<div class="piskel-name-container">
<input readonly id="piskel-name" type="text" value=""/>
</div>
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
<div id="main-wrapper" class="main-wrapper">
<div class="sticky-section left-sticky-section" id="tool-section">
Reintegrating css changes from master
2013-07-15 01:18:03 +04:00
<div class="sticky-section-wrap">
<div class="vertical-centerer">
<ul id="tools-container" class="tools-wrapper"></ul>
<div class="palette-wrapper">
<div class="tool-icon tool-color-picker">
<input id="color-picker" class="color {hash:true}" type="text" value="" />
<input id="secondary-color-picker" class="secondary-color-picker color {hash:true}" type="text" value="" />
</div>
<div class="tool-icon tool-palette">
<div id="palette" class="palette">
<span class="tool-icon palette-color transparent-color" data-color="TRANSPARENT" title="Transparent"></span>
</div>
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
</div>
Make tools sticky on screen's left edge So that the drawing canvas can expend full height
2013-06-13 15:57:03 +04:00
</div>
</div>
</div>
</div>
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
<div id="application-action-section" class="sticky-section right-sticky-section">
Reintegrating css changes from master
2013-07-15 01:18:03 +04:00
<div class="sticky-section-wrap">
<div class="vertical-centerer">
<div id="settings" class="tool-icon gear-icon" title="Preferences" rel="tooltip" data-placement="left"></div>
<a class="tool-icon gallery-icon" title="Visit gallery" href="http://juliandescottes.github.io/piskel-website/" rel="tooltip" data-placement="left" target="_blank"></a>
Rolled back too many changes. some piskel.something managed to creep back in
2013-07-15 01:36:31 +04:00
<div class="tool-icon save-icon" title="Save to gallery" onclick="pskl.app.storeSheet()" rel="tooltip" data-placement="left" ></div>
<div class="tool-icon upload-cloud-icon" title="Upload as an animated GIF" onclick="pskl.app.uploadAsAnimatedGIF()" rel="tooltip" data-placement="left">
Reintegrating css changes from master
2013-07-15 01:18:03 +04:00
<span class="label">GIF</span>
</div>
Rolled back too many changes. some piskel.something managed to creep back in
2013-07-15 01:36:31 +04:00
<div class="tool-icon upload-cloud-icon" title="Upload as a spritesheet PNG" onclick="pskl.app.uploadAsSpritesheetPNG()" rel="tooltip" data-placement="left">
Reintegrating css changes from master
2013-07-15 01:18:03 +04:00
<span class="label">PNG</span>
</div>
Added logic to switch behavior between appengine and static mode. Removed piskel on window in favor of pskl.app
2013-07-15 01:04:42 +04:00
</div>
Reintegrating css changes from master
2013-07-15 01:18:03 +04:00
<div class="drawer vertical-centerer">
<div class="drawer-content">
<div class="settings-section">
<div class="settings-title">
Canvas settings:
</div>
<div class="settings-item">
<label>Background:</label>
<div id="background-picker-wrapper" class="background-picker-wrapper">
<div class="background-picker light-picker-background" data-background-class="light-canvas-background"
rel="tooltip" data-placement="bottom" title="light / high contrast">
</div>
<div class="background-picker medium-picker-background" data-background-class="medium-canvas-background"
rel="tooltip" data-placement="bottom" title="medium / high contrast">
</div>
<div class="background-picker lowcont-medium-picker-background" data-background-class="lowcont-medium-canvas-background"
rel="tooltip" data-placement="bottom" title="medium / low contrast">
</div>
<div class="background-picker lowcont-dark-picker-background" data-background-class="lowcont-dark-canvas-background"
rel="tooltip" data-placement="bottom" title="dark / low contrast">
</div>
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
</div>
Adding simple backgorund picker (without persistence)
2013-06-17 13:36:56 +04:00
</div>
Reintegrating css changes from master
2013-07-15 01:18:03 +04:00
<div class="settings-item">
<label for="show-grid">Show grid:</label> <input id="show-grid" type="checkbox"/>
</div>
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
</div>
Small settings panel styles update
2013-06-17 12:37:23 +04:00
</div>
Moving settings markup to drawer
2013-06-16 12:16:26 +04:00
</div>
</div>
Adding drawer prototype
2013-06-15 21:35:55 +04:00
</div>
New layout: application actions sticking to the right edge
2013-06-15 21:04:36 +04:00
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
<div id="column-wrapper" class="column-wrapper">
<div class='column left-column'>
<!-- List of frames: -->
<div id="preview-list-wrapper" class="preview-list-wrapper">
<div id="preview-list-scroller" class="preview-list-scroller">
<ul class="preview-list" id="preview-list"></ul>
</div>
<div class="top-overflow"></div>
<div class="bottom-overflow"></div>
Adding overflow markers for preview frame scroller
2013-06-14 00:55:19 +04:00
</div>
proto init implementation + less
2013-06-12 16:53:47 +04:00
</div>
Stroke tool Add stroke tool new icons for tools started some refactoring to help having a big redraw loop
2012-09-02 02:44:55 +04:00
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
<div class='column main-column'>
<!-- Drawing area: -->
<div id="drawing-canvas-container" class="drawing-canvas-container canvas-container">
<div class="canvas-background"></div>
</div>
proto init implementation + less
2013-06-12 16:53:47 +04:00
</div>
Stroke tool Add stroke tool new icons for tools started some refactoring to help having a big redraw loop
2012-09-02 02:44:55 +04:00
Fix canvas size when grid display is active - Dynamic resizing of canvas when display_grid is activated/deactivated - Adding a main-wrapper to get a perfect alignement at the top and bottom the application screen - fix DPI update on page load (independent of grid option). - fix available width for DPI calculation (using margin-box, was using only content before)
2013-06-19 21:01:12 +04:00
<div class="column right-column">
<!-- Animation preview: -->
<div class='preview-container'>
<div id='preview-canvas-container' class="canvas-container">
<div class="canvas-background"></div>
</div>
<div>
<span id="display-fps" class="display-fps">12 FPS</span>
<input id="preview-fps" class="range-fps" type="range" min="1" max="24" value="12"/>
</div>
proto init implementation + less
2013-06-12 16:53:47 +04:00
</div>
</div>
Initial commit from dropbox Basic features : Can create frames Can edit frames (black and white only) Can select the frame to edit Animated preview And that's it. Really tired and code is extremely ugly, just needed to do something that _works_
2012-08-23 02:57:35 +04:00
</div>
</div>
Adding query 1.8.0 and pubsub bus
2012-08-30 02:48:22 +04:00
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
2013-08-04 20:27:32 +04:00
<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;
}
};
Export to GIF
2013-04-07 22:16:47 +04:00
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
2013-08-04 20:27:32 +04:00
} 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()");
}
})();
</script>
Initial commit from dropbox Basic features : Can create frames Can edit frames (black and white only) Can select the frame to edit Animated preview And that's it. Really tired and code is extremely ugly, just needed to do something that _works_
2012-08-23 02:57:35 +04:00
</body>
</html>
Reference in New Issue Copy Permalink