Grunt - BugFixes
1
.gitignore
vendored
@ -1,3 +1,4 @@
|
|||||||
*.swp
|
*.swp
|
||||||
*.swo
|
*.swo
|
||||||
*~
|
*~
|
||||||
|
node_modules
|
||||||
|
127
Gruntfile.js
Normal file
@ -0,0 +1,127 @@
|
|||||||
|
var which;
|
||||||
|
module.exports = function(grunt) {
|
||||||
|
|
||||||
|
grunt.initConfig({
|
||||||
|
pkg: grunt.file.readJSON('package.json'),
|
||||||
|
uglify: {
|
||||||
|
main: {
|
||||||
|
files: [
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Shared/js/',
|
||||||
|
src: '**',
|
||||||
|
dest: 'build/mobile/js/',
|
||||||
|
filter: 'isFile'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Shared/js',
|
||||||
|
src: '**',
|
||||||
|
dest: 'build/web/js',
|
||||||
|
filter: 'isFile'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Mobile/js/',
|
||||||
|
src: '*',
|
||||||
|
dest: 'build/mobile/js',
|
||||||
|
filter: 'isFile'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Web/js/',
|
||||||
|
src: '*',
|
||||||
|
dest: 'build/web/js',
|
||||||
|
filter: 'isFile'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
less: {
|
||||||
|
production: {
|
||||||
|
files: {
|
||||||
|
'build/mobile/css/main.css': 'Shared/css/main.less',
|
||||||
|
'build/web/css/main.css': 'Shared/css/main.less'
|
||||||
|
},
|
||||||
|
compress: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
copy: {
|
||||||
|
'main files': {
|
||||||
|
files: [
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Shared',
|
||||||
|
src: 'img',
|
||||||
|
dest: 'build/mobile'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Shared',
|
||||||
|
src: 'img',
|
||||||
|
dest: 'build/web'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Mobile',
|
||||||
|
src: ['index.html', 'manifest.webapp'],
|
||||||
|
dest: 'build/mobile'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Web',
|
||||||
|
src: ['index.html', 'manifest.webapp', 'cache.appcache'],
|
||||||
|
dest: 'build/web'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
'css assets': {
|
||||||
|
files: [
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Shared/css',
|
||||||
|
src: '*/**',
|
||||||
|
dest: 'build/mobile/css'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'Shared/css',
|
||||||
|
src: '*/**',
|
||||||
|
dest: 'build/web/css'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
watch: {
|
||||||
|
js: {
|
||||||
|
files: ['Shared/js/**', 'Mobile/js/**', 'Web/js/**'],
|
||||||
|
tasks: 'uglify',
|
||||||
|
options: {
|
||||||
|
spawn: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
less: {
|
||||||
|
files: 'Shared/css/**',
|
||||||
|
tasks: 'less',
|
||||||
|
options: {
|
||||||
|
spawn: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
copy: {
|
||||||
|
files: 'Shared/**',
|
||||||
|
tasks: 'copy',
|
||||||
|
options: {
|
||||||
|
spawn: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-uglify');
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-less');
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-copy');
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||||
|
grunt.registerTask('default', ['uglify','copy', 'less'])
|
||||||
|
|
||||||
|
}
|
@ -253,8 +253,9 @@
|
|||||||
<script src='js/libs/touch.js'></script>
|
<script src='js/libs/touch.js'></script>
|
||||||
<script src='js/libs/color-picker-touch.js'></script>
|
<script src='js/libs/color-picker-touch.js'></script>
|
||||||
<script src='js/functions.js'></script>
|
<script src='js/functions.js'></script>
|
||||||
<script src='js/main.js'></script>
|
<script src='js/shared.js'></script>
|
||||||
<script src='js/mobile.js'></script>
|
<script src='js/events.js'></script>
|
||||||
|
<script src='js/diff.js'></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
103
Mobile/js/diff.js
Normal file
@ -0,0 +1,103 @@
|
|||||||
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('*').off('click mousemove mousedown mouseup mouseleave').on('click mousemove mousedown mouseup mouseleave', function(e) {
|
||||||
|
e.preventDefault;
|
||||||
|
return false;
|
||||||
|
})
|
||||||
|
|
||||||
|
$('a[href^="http"]').tap(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var href = $(this).attr('href');
|
||||||
|
var view = new MozActivity({
|
||||||
|
name: 'view',
|
||||||
|
data: {
|
||||||
|
type: 'url',
|
||||||
|
url: href
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
$('a[href^="mailto"]').tap(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var mail = /mailto:(.*)/.exec($(this).attr('href'))[1];
|
||||||
|
var mail = new MozActivity({
|
||||||
|
name: 'new',
|
||||||
|
data: {
|
||||||
|
type: 'mail',
|
||||||
|
url: mail
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
window.save = function() {
|
||||||
|
switch(save.background) {
|
||||||
|
case 'white': {
|
||||||
|
c.fillStyle = 'white';
|
||||||
|
c.globalCompositeOperation = 'destination-over';
|
||||||
|
c.fillRect(0, 0, width(), height());
|
||||||
|
c.fillStyle = settings.color;
|
||||||
|
c.globalCompositeOperation = settings.composite;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case 'current color': {
|
||||||
|
c.fillStyle = settings.bg;
|
||||||
|
c.globalCompositeOperation = 'destination-over';
|
||||||
|
c.fillRect(0, 0, width(), height());
|
||||||
|
c.globalCompositeOperation = settings.composite;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var data = $c[0].toDataURL();
|
||||||
|
if( save.type == 'sketchy project' ) {
|
||||||
|
var list = JSON.parse(localStorage.getItem('projects'));
|
||||||
|
var index;
|
||||||
|
if( list && list.some(function(a, i) { if( a.name == save['file name'] ) {index = i; return true} return false }) ) {
|
||||||
|
if( confirm('A sketch with this name already exists. Do you want to overwrite ' + save['file name']) + '?' ) {
|
||||||
|
console.log(index);
|
||||||
|
list[index] = {
|
||||||
|
name: save['file name'],
|
||||||
|
data: data,
|
||||||
|
points: window.points,
|
||||||
|
settings: settings
|
||||||
|
}
|
||||||
|
localStorage.setItem('projects', JSON.stringify(list));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else
|
||||||
|
list ? list.push({
|
||||||
|
name: save['file name'],
|
||||||
|
data: data,
|
||||||
|
points: window.points
|
||||||
|
}) : list = [{
|
||||||
|
name: save['file name'],
|
||||||
|
data: data,
|
||||||
|
points: window.points
|
||||||
|
}];
|
||||||
|
localStorage.setItem('projects', JSON.stringify(list));
|
||||||
|
} else {
|
||||||
|
window.open(data, '_blank').focus();
|
||||||
|
}
|
||||||
|
|
||||||
|
c.putImageData(window.points.history[window.points.history.last].data, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
window.load = function() {
|
||||||
|
var file = JSON.parse(localStorage.getItem('projects')).filter(function(a) { return a.name == load.file })[0];
|
||||||
|
var img = document.createElement('img');
|
||||||
|
img.src = file.data;
|
||||||
|
img.onload = function() {
|
||||||
|
c.clearRect(0, 0, width(), height());
|
||||||
|
c.drawImage(img, 0, 0);
|
||||||
|
window.points = file.points;
|
||||||
|
window.points.history = [{ data: c.createImageData($c.width(), $c.height()), points: []}, { data: c.getImageData(0, 0, width(), height()), points: file.points}];
|
||||||
|
$c.first().css('background', file.settings.bg);
|
||||||
|
window.settings.bg = file.settings.bg;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if( localStorage.getItem('sawTips') != settings.version ) {
|
||||||
|
$('.tour').removeClass('hidden');
|
||||||
|
localStorage.setItem('sawTips', settings.version);
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
@ -1,239 +0,0 @@
|
|||||||
"use strict";
|
|
||||||
/*** ESSENTIALS ***/
|
|
||||||
|
|
||||||
function sizeAndPos() {
|
|
||||||
|
|
||||||
var data = c.getImageData(0,0, $c.width(), $c.height());
|
|
||||||
var w = $(window).width(),
|
|
||||||
h = $(window).height() - 53;
|
|
||||||
$c.attr('width', w * window.devicePixelRatio);
|
|
||||||
$c.attr('height',h * window.devicePixelRatio);
|
|
||||||
$c.css({
|
|
||||||
'width' : w,
|
|
||||||
'height' : h
|
|
||||||
});
|
|
||||||
c.clearRect(0,0, width(), height());
|
|
||||||
c.putImageData(data, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
function relative(x,y, el) {
|
|
||||||
var el = el || $c[0];
|
|
||||||
return {
|
|
||||||
x : x*window.devicePixelRatio - el.offset().left,
|
|
||||||
y : (y - 53) * window.devicePixelRatio - el.offset().top
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function threshold(x1, y1, x2, y2, threshold) {
|
|
||||||
var tr = threshold || 5;
|
|
||||||
if( x1 <= x2 + tr && x1 >= x2 - tr && y1 <= y2 + tr && y1 >= y2 - tr ) return true;
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
function draw(x1, y1, x2, y2, opts, overlay) {
|
|
||||||
opts = opts || {};
|
|
||||||
var c = window.c;
|
|
||||||
if( overlay ) var c = window.o;
|
|
||||||
c.beginPath();
|
|
||||||
if( settings.type == 'eraser' ) c.globalCompositeOperation = 'destination-out';
|
|
||||||
else c.globalCompositeOperation = opts.composite || settings.composite;
|
|
||||||
c.lineCap = opts.lineCap || settings.lineCap;
|
|
||||||
c.lineJoin = opts.lineJoin || settings.lineJoin;
|
|
||||||
c.strokeStyle = opts.color || settings.color;
|
|
||||||
c.fillStyle = opts.color || settings.color;
|
|
||||||
c.lineWidth = ( opts.lineWidth || settings.lineWidth ) / 10;
|
|
||||||
c.moveTo(x1, y1);
|
|
||||||
c.lineTo(x2, y2);
|
|
||||||
if( !opts.noStroke ) c.stroke();
|
|
||||||
if( opts.fill ) c.fill();
|
|
||||||
}
|
|
||||||
|
|
||||||
function shape(opts, overlay) {
|
|
||||||
if(overlay) var c = window.o;
|
|
||||||
else var c = window.c;
|
|
||||||
c.beginPath();
|
|
||||||
c.fillStyle = opts.color || settings.color;
|
|
||||||
switch(opts.type) {
|
|
||||||
|
|
||||||
case 'circle': {
|
|
||||||
c.arc(opts.x, opts.y, opts.radius, 0, 2*Math.PI);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'rectangle': {
|
|
||||||
c.rect(opts.x, opts.y, opts.width, opts.height);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'square': {
|
|
||||||
c.rect(opts.x, opts.y, opts.width, opts.width);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'triangle': {
|
|
||||||
c.fillStyle = opts
|
|
||||||
c.moveTo(opts.x1, opts.y1);
|
|
||||||
c.lineTo(opts.x2, opts.y2);
|
|
||||||
c.lineTo(opts.x3, opts.y3);
|
|
||||||
c.lineTo(opts.x1, opts.y1);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
c.fill();
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function undo() {
|
|
||||||
var history = window.points.history;
|
|
||||||
if( history.last > 1 ) {
|
|
||||||
var step = history[history.last-1];
|
|
||||||
c.putImageData(step.data, 0, 0);
|
|
||||||
window.points = step.points.slice(0);
|
|
||||||
window.points.history = history;
|
|
||||||
window.points.history.last = history.last-1;
|
|
||||||
} else {
|
|
||||||
c.clearRect(0,0, width(), height());
|
|
||||||
window.points = [];
|
|
||||||
window.points.history = history;
|
|
||||||
window.points.history.last = 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function redo() {
|
|
||||||
var history = window.points.history;
|
|
||||||
if( history.last < history.length-1 ) {
|
|
||||||
var step = history[history.last+1];
|
|
||||||
c.putImageData(step.data, 0, 0);
|
|
||||||
window.points = step.points.slice(0);
|
|
||||||
window.points.history = history;
|
|
||||||
window.points.history.last = history.last+1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function width() {
|
|
||||||
return +$c.attr('width');
|
|
||||||
}
|
|
||||||
|
|
||||||
function height() {
|
|
||||||
return +$c.attr('height');
|
|
||||||
}
|
|
||||||
|
|
||||||
function dataToBlob(data) {
|
|
||||||
var binary = atob(data.split(',')[1]), array = [];
|
|
||||||
var type = data.split(',')[0].split(':')[1].split(';')[0];
|
|
||||||
for(var i = 0; i < binary.length; i++) array.push(binary.charCodeAt(i));
|
|
||||||
return new Blob([new Uint8Array(array)], {type: type});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*** END ***/
|
|
||||||
|
|
||||||
function startPoint(x, y) {
|
|
||||||
|
|
||||||
// If no previous point exists, make the first one.
|
|
||||||
if( !points.length ) points.push({x: x, y: y, type: '', start: {x: x, y: y}});
|
|
||||||
|
|
||||||
var old = points[points.length-1],
|
|
||||||
start = old.start,
|
|
||||||
current = {
|
|
||||||
x : x,
|
|
||||||
y : y,
|
|
||||||
start : old.start || {x: x, y: y},
|
|
||||||
type : settings.type
|
|
||||||
}
|
|
||||||
// Line
|
|
||||||
if( old.type !== 'line' && current.type == 'line' ) {
|
|
||||||
window.o.beginPath();
|
|
||||||
window.o.fillStyle = 'red';
|
|
||||||
window.o.arc(x,y, 3, 0, 2*Math.PI);
|
|
||||||
window.o.fill();
|
|
||||||
}
|
|
||||||
|
|
||||||
if( old.type == 'line' && current.type == 'line' ) {
|
|
||||||
if( points[points.indexOf(old)-1].type !== 'line' ) {
|
|
||||||
o.clearRect(old.x-3, old.y-3, 6, 6, true);
|
|
||||||
draw(old.x, old.y, x, y);
|
|
||||||
} else
|
|
||||||
draw(old.x, old.y, x, y);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Shapes
|
|
||||||
|
|
||||||
if( old.type !== 'shape' && current.type == 'shape' ) {
|
|
||||||
settings.shape.
|
|
||||||
}
|
|
||||||
|
|
||||||
var thresholds = window.mobile ? [10, 5] : [5, 2];
|
|
||||||
if( points.length > 1 && ((start && threshold(start.x, start.y, x, y, thresholds[0])) || threshold(old.x, old.y, x, y, thresholds[1])) ) {
|
|
||||||
window.active = false;
|
|
||||||
points[points.length-1].type = '';
|
|
||||||
points[points.length-1].start = undefined;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
points.push(current);
|
|
||||||
}
|
|
||||||
|
|
||||||
function drawPoint(x,y) {
|
|
||||||
var capture = points[points.length-1];
|
|
||||||
|
|
||||||
switch(capture.type) {
|
|
||||||
case 'eraser': {
|
|
||||||
capture.type = 'pen';
|
|
||||||
}
|
|
||||||
case 'pen': {
|
|
||||||
draw(capture.x, capture.y, x, y);
|
|
||||||
|
|
||||||
var current = {
|
|
||||||
x : x,
|
|
||||||
y : y,
|
|
||||||
start : capture.start,
|
|
||||||
type : capture.type
|
|
||||||
}
|
|
||||||
|
|
||||||
points.push(current);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'sketch': {
|
|
||||||
draw(capture.x, capture.y, x, y);
|
|
||||||
var current = {
|
|
||||||
x : x,
|
|
||||||
y : y,
|
|
||||||
start : capture.start,
|
|
||||||
type : capture.type
|
|
||||||
}
|
|
||||||
points.push(current);
|
|
||||||
|
|
||||||
for( var i = 0, len = points.length-1; i < len; i++ ) {
|
|
||||||
if(threshold(points[i].x, points[i].y, current.x, current.y, settings.connectTelorance)) {
|
|
||||||
var x = points[i].x - current.x,
|
|
||||||
y = points[i].y - current.y;
|
|
||||||
var w = settings.lineWidth/20 > 0.2 ? settings.lineWidth/20 : 0.2;
|
|
||||||
|
|
||||||
draw(points[i].x - x*0.2, points[i].y - y*0.2, current.x + x*0.2, current.y + y*0.2, {strokeStyle: 'rgba(0,0,0,0.4)', lineWidth: w})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'fur': {
|
|
||||||
draw(capture.x, capture.y, x, y);
|
|
||||||
var current = {
|
|
||||||
x : x,
|
|
||||||
y : y,
|
|
||||||
start : capture.start,
|
|
||||||
type : capture.type
|
|
||||||
}
|
|
||||||
points.push(current);
|
|
||||||
|
|
||||||
for( var i = 0, len = points.length-1; i < len; i++ ) {
|
|
||||||
if(threshold(points[i].x, points[i].y, current.x, current.y, settings.connectTelorance)) {
|
|
||||||
var x = points[i].x - current.x,
|
|
||||||
y = points[i].y - current.y;
|
|
||||||
var l = settings.furLength / 100 || 0.2;
|
|
||||||
var w = settings.lineWidth/20 > 0.2 ? settings.lineWidth/20 : 0.2;
|
|
||||||
|
|
||||||
draw(points[i].x + x*l, points[i].y + y*l, current.x - x*l, current.y - y*l, {strokeStyle: 'rgba(0,0,0,0.4)', lineWidth: w})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
13
Mobile/js/less-1.5.0.min.js
vendored
@ -1,348 +0,0 @@
|
|||||||
"use strict";
|
|
||||||
|
|
||||||
$(document).ready(function() {
|
|
||||||
|
|
||||||
// Open External Links in browser
|
|
||||||
|
|
||||||
$('*').click(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
})
|
|
||||||
|
|
||||||
$('a[href^="http"]').tap(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var href = $(this).attr('href');
|
|
||||||
var view = new MozActivity({
|
|
||||||
name: 'view',
|
|
||||||
data: {
|
|
||||||
type: 'url',
|
|
||||||
url: href
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
$('a[href^="mailto"]').tap(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var mail = /mailto:(.*)/.exec($(this).attr('href'))[1];
|
|
||||||
var mail = new MozActivity({
|
|
||||||
name: 'new',
|
|
||||||
data: {
|
|
||||||
type: 'mail',
|
|
||||||
url: mail
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
window.save = function() {
|
|
||||||
switch(save.background) {
|
|
||||||
case 'white': {
|
|
||||||
c.fillStyle = 'white';
|
|
||||||
c.globalCompositeOperation = 'destination-over';
|
|
||||||
c.fillRect(0, 0, width(), height());
|
|
||||||
c.fillStyle = settings.color;
|
|
||||||
c.globalCompositeOperation = settings.composite;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'current color': {
|
|
||||||
c.fillStyle = settings.bg;
|
|
||||||
c.globalCompositeOperation = 'destination-over';
|
|
||||||
c.fillRect(0, 0, width(), height());
|
|
||||||
c.globalCompositeOperation = settings.composite;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
var data = $c[0].toDataURL();
|
|
||||||
if( save.type == 'sketchy project' ) {
|
|
||||||
var list = JSON.parse(localStorage.getItem('projects'));
|
|
||||||
var index;
|
|
||||||
if( list && list.some(function(a, i) { if( a.name == save['file name'] ) {index = i; return true} return false }) ) {
|
|
||||||
if( confirm('A sketch with this name already exists. Do you want to overwrite ' + save['file name']) + '?' ) {
|
|
||||||
console.log(index);
|
|
||||||
list[index] = {
|
|
||||||
name: save['file name'],
|
|
||||||
data: data,
|
|
||||||
points: window.points,
|
|
||||||
settings: settings
|
|
||||||
}
|
|
||||||
localStorage.setItem('projects', JSON.stringify(list));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else
|
|
||||||
list ? list.push({
|
|
||||||
name: save['file name'],
|
|
||||||
data: data,
|
|
||||||
points: window.points
|
|
||||||
}) : list = [{
|
|
||||||
name: save['file name'],
|
|
||||||
data: data,
|
|
||||||
points: window.points
|
|
||||||
}];
|
|
||||||
localStorage.setItem('projects', JSON.stringify(list));
|
|
||||||
} else {
|
|
||||||
window.open(data, '_blank').focus();
|
|
||||||
}
|
|
||||||
|
|
||||||
c.putImageData(window.points.history[window.points.history.last].data, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.load = function() {
|
|
||||||
var file = JSON.parse(localStorage.getItem('projects')).filter(function(a) { return a.name == load.file })[0];
|
|
||||||
var img = document.createElement('img');
|
|
||||||
img.src = file.data;
|
|
||||||
img.onload = function() {
|
|
||||||
c.clearRect(0, 0, width(), height());
|
|
||||||
c.drawImage(img, 0, 0);
|
|
||||||
window.points = file.points;
|
|
||||||
window.points.history = [{ data: c.createImageData($c.width(), $c.height()), points: []}, { data: c.getImageData(0, 0, width(), height()), points: file.points}];
|
|
||||||
$c.first().css('background', file.settings.bg);
|
|
||||||
window.settings.bg = file.settings.bg;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if( localStorage.getItem('sawTips') != settings.version ) {
|
|
||||||
$('.tour').removeClass('hidden');
|
|
||||||
localStorage.setItem('sawTips', settings.version);
|
|
||||||
}
|
|
||||||
|
|
||||||
$('.menu').tap(function() {
|
|
||||||
$('#menu').toggleClass('pulled');
|
|
||||||
})
|
|
||||||
$('.save').tap(function() {
|
|
||||||
$('#save').removeClass('hidden');
|
|
||||||
})
|
|
||||||
$('.load').tap(function() {
|
|
||||||
$('#load').removeClass('hidden');
|
|
||||||
$('#load li').remove();
|
|
||||||
var list = JSON.parse(localStorage.getItem('projects'));
|
|
||||||
if( !list || list.length < 1 ) {
|
|
||||||
$('#load ol').append(
|
|
||||||
$('<p>No Sketch found.</p>')
|
|
||||||
);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
for( var i = 0, len = list.length; i < len; i++ ) {
|
|
||||||
$('#load ol').append(
|
|
||||||
$('<li><label><span>' + list[i].name + '</span></label></li>')
|
|
||||||
);
|
|
||||||
}
|
|
||||||
$confirm.find('li').off('tap').tap(function(e) {
|
|
||||||
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
|
||||||
$(this).attr('aria-selected', 'true');
|
|
||||||
})
|
|
||||||
})
|
|
||||||
$('#pro').tap(function() {
|
|
||||||
$('#save ol:nth-of-type(2) li').each(function() {
|
|
||||||
if( $(this).find('span').html() !== 'Transparent' ) {
|
|
||||||
$(this).addClass('hidden');
|
|
||||||
$(this).removeAttr('aria-selected');
|
|
||||||
}
|
|
||||||
else $(this).attr('aria-selected', 'true');
|
|
||||||
})
|
|
||||||
})
|
|
||||||
$('#exp').tap(function() {
|
|
||||||
$('#save ol:nth-of-type(2) li').removeClass('hidden');
|
|
||||||
})
|
|
||||||
$c.last().on('touchstart', function(e) {
|
|
||||||
var xy = relative(e.changedTouches[0].pageX, e.changedTouches[0].pageY);
|
|
||||||
startPoint(xy.x, xy.y);
|
|
||||||
window.active = true;
|
|
||||||
}).on('touchmove', function(e) {
|
|
||||||
if (!window.active || settings.type == 'line') return;
|
|
||||||
var xy = relative(e.changedTouches[0].pageX, e.changedTouches[0].pageY);
|
|
||||||
drawPoint(xy.x, xy.y);
|
|
||||||
}).on('touchend', function(e) {
|
|
||||||
window.active = false;
|
|
||||||
if( settings.type == 'eraser' ) return;
|
|
||||||
|
|
||||||
if( settings.type == 'shape' ) {
|
|
||||||
var s = settings.comShape;
|
|
||||||
o.clear();
|
|
||||||
c.beginPath();
|
|
||||||
c.fillStyle = settings.color;
|
|
||||||
c.strokeStyle = settings.color;
|
|
||||||
c.lineWidth = settings.lineWidth / 20;
|
|
||||||
switch(s.type) {
|
|
||||||
case 'circle': {
|
|
||||||
c.arc(s.x, s.y, s.radius, 0, 2*Math.PI);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'rectangle': {
|
|
||||||
c.rect(s.x, s.y, s.w, s.h)
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'triangle': {
|
|
||||||
c.moveTo(s.start.x + s.dix, s.start.y);
|
|
||||||
c.lineTo(s.x, s.y);
|
|
||||||
c.lineTo(s.start.x, s.y);
|
|
||||||
c.lineTo(s.start.x + s.dix, s.start.y);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if( settings.fill ) c.fill();
|
|
||||||
if( settings.stroke ) c.stroke();
|
|
||||||
}
|
|
||||||
|
|
||||||
if( settings.type == 'line' ) return;
|
|
||||||
|
|
||||||
if(window.points.history.last < window.points.history.length-1) {
|
|
||||||
window.points.history.splice(window.points.history.last+1);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.points.history.push({
|
|
||||||
data: c.getImageData(0, 0, width(), height()),
|
|
||||||
points: window.points.slice(0)
|
|
||||||
})
|
|
||||||
window.points.history.last = window.points.history.length-1;
|
|
||||||
}).on('longTap', function(e) {
|
|
||||||
if( points[points.length-1].type == 'line' ) {
|
|
||||||
window.active = false;
|
|
||||||
points[points.length-1].type = '';
|
|
||||||
points[points.length-1].start = undefined;
|
|
||||||
finishLine();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
// Value Selector
|
|
||||||
|
|
||||||
var $single = $('form[data-type="value-selector"].single');
|
|
||||||
|
|
||||||
$single.find('li').tap(function(e) {
|
|
||||||
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
|
||||||
$(this).attr('aria-selected', 'true');
|
|
||||||
var key = $(this).parents('form').attr('id'),
|
|
||||||
value = $(this).find('label span').html().toLowerCase(),
|
|
||||||
target = $(this).attr('data-target');
|
|
||||||
window.settings[key] = value;
|
|
||||||
|
|
||||||
$('button[id="set' + key + '"] span').html(value[0].toUpperCase() + value.substr(1));
|
|
||||||
if( target ) {
|
|
||||||
$('#menu div.options > div').addClass('hidden');
|
|
||||||
$('#menu div.options > .general, #menu div.options > .'+target).removeClass('hidden');
|
|
||||||
}
|
|
||||||
$(this).parents('form').addClass('hidden');
|
|
||||||
})
|
|
||||||
$single.find('button').tap(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$(this).parents('form').addClass('hidden');
|
|
||||||
})
|
|
||||||
|
|
||||||
// Confirm
|
|
||||||
|
|
||||||
var $confirm = $('form[data-type="value-selector"].confirm');
|
|
||||||
|
|
||||||
$confirm.each(function() {
|
|
||||||
|
|
||||||
$(this).find('li').tap(function(e) {
|
|
||||||
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
|
||||||
$(this).attr('aria-selected', 'true');
|
|
||||||
})
|
|
||||||
$(this).find('button').last().tap(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var v = $(this).parents('form').attr('id');
|
|
||||||
$(this).parents('form').find('h1').each(function(i) {
|
|
||||||
if( i > 0 ) {
|
|
||||||
var key = $(this).html().toLowerCase();
|
|
||||||
var value = $(this).parent().find('ol:nth-of-type('+i+') li[aria-selected] span').html();
|
|
||||||
if( key !== 'file name' && key !== 'file' ) value = value.toLowerCase();
|
|
||||||
window[v][key] = value;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
$(this).parents('form').addClass('hidden');
|
|
||||||
window[v]();
|
|
||||||
})
|
|
||||||
$(this).find('button').first().tap(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$(this).parents('form').addClass('hidden');
|
|
||||||
})
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
// Value Selector Callers
|
|
||||||
|
|
||||||
var $btn = $('button[id^="set"]');
|
|
||||||
$btn.each(function() {
|
|
||||||
var target = /set(.*)/.exec($(this).attr('id'))[1];
|
|
||||||
// Exception for Color
|
|
||||||
if( target == 'color' || target == 'bg' ) {
|
|
||||||
return $(this).tap(function() {
|
|
||||||
$('.picker').removeClass('hidden');
|
|
||||||
$('.picker').attr('data-caller', target);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
$(this).tap(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$('form[id="' + target + '"]').removeClass('hidden');
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
// Seekbar
|
|
||||||
|
|
||||||
var sliderLeft;
|
|
||||||
$('div[role="slider"] button').on('touchstart', function() {
|
|
||||||
$(this).attr('data-moving','true');
|
|
||||||
if( !sliderLeft ) sliderLeft = $('div[role="slider"] button').offset().left;
|
|
||||||
}).on('touchmove', function(e) {
|
|
||||||
if( $(this).attr('data-moving') ) {
|
|
||||||
var x = parseInt(e.changedTouches[0].pageX - sliderLeft - 15);
|
|
||||||
var $c = $('.'+$(this).parents('div[role="slider"]').attr('class'));
|
|
||||||
var progress = $c.find('progress');
|
|
||||||
var max = +progress.attr('max');
|
|
||||||
var min = +progress.attr('min');
|
|
||||||
if( x <= max && x >= min ) {
|
|
||||||
$c.find('button').css('left', x+'%');
|
|
||||||
progress.attr('value', x);
|
|
||||||
var key = $c.attr('class');
|
|
||||||
settings[key] = x;
|
|
||||||
$('#'+ key +' span').html(x);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}).on('touchend', function() {
|
|
||||||
$(this).removeAttr('data-moving');
|
|
||||||
})
|
|
||||||
|
|
||||||
$('.fill, .stroke').tap(function() {
|
|
||||||
var s = $('.'+$(this).attr('class')).find('span');
|
|
||||||
if( s.html() == 'Yes' ) {
|
|
||||||
s.html('No');
|
|
||||||
settings[$(this).attr('class')] = false;
|
|
||||||
} else {
|
|
||||||
s.html('Yes');
|
|
||||||
settings[$(this).attr('class')] = true;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
$('.close, .tour button').tap(function() {
|
|
||||||
$(this).parent().addClass('hidden');
|
|
||||||
})
|
|
||||||
|
|
||||||
// Color Picker
|
|
||||||
|
|
||||||
$('.close').tap(function() {
|
|
||||||
$(this).parent().addClass('hidden');
|
|
||||||
})
|
|
||||||
|
|
||||||
// Bottom
|
|
||||||
|
|
||||||
$('#clear').tap(function() {
|
|
||||||
c.clearRect(0, 0, width(), height());
|
|
||||||
var h = window.points.history;
|
|
||||||
window.points = [];
|
|
||||||
window.points.history = h;
|
|
||||||
if(window.points.history.last < window.points.history.length-1) {
|
|
||||||
window.points.history.splice(window.points.history.last+1);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.points.history.push({
|
|
||||||
data: c.getImageData(0, 0, width(), height()),
|
|
||||||
points: []
|
|
||||||
})
|
|
||||||
window.points.history.last = window.points.history.length-1;
|
|
||||||
})
|
|
||||||
|
|
||||||
$('#undo').tap(undo);
|
|
||||||
$('#redo').tap(redo);
|
|
||||||
|
|
||||||
$('#about').tap(function() {
|
|
||||||
$('.about').removeClass('hidden');
|
|
||||||
})
|
|
||||||
|
|
||||||
});
|
|
19
README.md
@ -1,14 +1,17 @@
|
|||||||
Sketchy
|
Sketchy
|
||||||
=======
|
=======
|
||||||
|
|
||||||
Free Sketch / Paint application for Firefox OS with a lot of features.
|
Free Sketch / Paint application for Firefox with a lot of features.
|
||||||
|
|
||||||
Key features:
|
Key features:
|
||||||
* Different types of brushes
|
* Different types of brushes
|
||||||
* Customizable brushes
|
* Customizable brushes
|
||||||
* Colorpicker
|
* Colorpicker
|
||||||
* Unlimited Undo/Redo
|
* Unlimited Undo/Redo
|
||||||
* Save your sketch to sdcard
|
* Save your sketch to sdcard / PC
|
||||||
|
* Save your sketch as a "Sketchy Project" and edit it later
|
||||||
|
* Different shapes ( Circle, Rectangle, Square, Triangle )
|
||||||
|
* Fill / Stroke
|
||||||
|
|
||||||
New features are coming soon! Contact and tell us what feature you would like to see in next version ( you can make an issue ).
|
New features are coming soon! Contact and tell us what feature you would like to see in next version ( you can make an issue ).
|
||||||
|
|
||||||
@ -18,6 +21,18 @@ Web version: https://mdibaiee.github.io/Sketchy/Web/
|
|||||||
|
|
||||||
Firefox Marketplace: https://marketplace.firefox.com/app/sketchy/
|
Firefox Marketplace: https://marketplace.firefox.com/app/sketchy/
|
||||||
|
|
||||||
|
Start
|
||||||
|
=====
|
||||||
|
|
||||||
|
To start working on:
|
||||||
|
|
||||||
|
git clone https://github.com/mdibaiee/Sketchy
|
||||||
|
cd Sketchy
|
||||||
|
npm install
|
||||||
|
grunt
|
||||||
|
|
||||||
|
Sketchy will be built to "build" folder, you can run `grunt watch` to automatically re-run tasks when you modify files.
|
||||||
|
|
||||||
Changelog
|
Changelog
|
||||||
=========
|
=========
|
||||||
|
|
||||||
|
Before Width: | Height: | Size: 93 B After Width: | Height: | Size: 93 B |
Before Width: | Height: | Size: 94 B After Width: | Height: | Size: 94 B |
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 413 B After Width: | Height: | Size: 413 B |
Before Width: | Height: | Size: 182 B After Width: | Height: | Size: 182 B |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
Before Width: | Height: | Size: 636 B After Width: | Height: | Size: 636 B |
Before Width: | Height: | Size: 960 B After Width: | Height: | Size: 960 B |
Before Width: | Height: | Size: 938 B After Width: | Height: | Size: 938 B |
Before Width: | Height: | Size: 583 B After Width: | Height: | Size: 583 B |
Before Width: | Height: | Size: 946 B After Width: | Height: | Size: 946 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 583 B After Width: | Height: | Size: 583 B |
Before Width: | Height: | Size: 946 B After Width: | Height: | Size: 946 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 578 B After Width: | Height: | Size: 578 B |
Before Width: | Height: | Size: 893 B After Width: | Height: | Size: 893 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 575 B After Width: | Height: | Size: 575 B |
Before Width: | Height: | Size: 889 B After Width: | Height: | Size: 889 B |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 755 B After Width: | Height: | Size: 755 B |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 475 B After Width: | Height: | Size: 475 B |
Before Width: | Height: | Size: 616 B After Width: | Height: | Size: 616 B |
Before Width: | Height: | Size: 177 B After Width: | Height: | Size: 177 B |
Before Width: | Height: | Size: 392 B After Width: | Height: | Size: 392 B |
Before Width: | Height: | Size: 601 B After Width: | Height: | Size: 601 B |
Before Width: | Height: | Size: 101 B After Width: | Height: | Size: 101 B |
Before Width: | Height: | Size: 82 B After Width: | Height: | Size: 82 B |
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 3.4 KiB |
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 7.7 KiB |
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 83 B After Width: | Height: | Size: 83 B |
Before Width: | Height: | Size: 154 B After Width: | Height: | Size: 154 B |
Before Width: | Height: | Size: 86 B After Width: | Height: | Size: 86 B |
Before Width: | Height: | Size: 82 B After Width: | Height: | Size: 82 B |
Before Width: | Height: | Size: 154 B After Width: | Height: | Size: 154 B |
Before Width: | Height: | Size: 87 B After Width: | Height: | Size: 87 B |
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 8.0 KiB After Width: | Height: | Size: 8.0 KiB |
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 8.9 KiB |
Before Width: | Height: | Size: 738 B After Width: | Height: | Size: 738 B |
Before Width: | Height: | Size: 7.2 KiB After Width: | Height: | Size: 7.2 KiB |
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 3.7 KiB |
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 4.0 KiB |
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 6.0 KiB |
@ -1,14 +1,14 @@
|
|||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
$(window).resize(sizeAndPos);
|
$(window).resize(sizeAndPos);
|
||||||
|
$(document).ready(function() {
|
||||||
$('.menu').click(function() {
|
$('.menu').on('click tap', function() {
|
||||||
$('#menu').toggleClass('pulled');
|
$('#menu').toggleClass('pulled');
|
||||||
})
|
})
|
||||||
$('.save').click(function() {
|
$('.save').on('click tap', function() {
|
||||||
$('#save').removeClass('hidden');
|
$('#save').removeClass('hidden');
|
||||||
})
|
})
|
||||||
$('.load').click(function() {
|
$('.load').on('click tap', function() {
|
||||||
$('#load').removeClass('hidden');
|
$('#load').removeClass('hidden');
|
||||||
$('#load li').remove();
|
$('#load li').remove();
|
||||||
var list = JSON.parse(localStorage.getItem('projects'));
|
var list = JSON.parse(localStorage.getItem('projects'));
|
||||||
@ -24,11 +24,11 @@ $(window).resize(sizeAndPos);
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
$confirm.find('li').off('click').click(function(e) {
|
$confirm.find('li').off('click').on('click tap', function(e) {
|
||||||
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
||||||
$(this).attr('aria-selected', 'true');
|
$(this).attr('aria-selected', 'true');
|
||||||
})
|
})
|
||||||
$('#pro').click(function() {
|
$('#pro').on('click tap', function() {
|
||||||
$('#save ol:nth-of-type(2) li').each(function() {
|
$('#save ol:nth-of-type(2) li').each(function() {
|
||||||
if( $(this).find('span').html() !== 'Transparent' ) {
|
if( $(this).find('span').html() !== 'Transparent' ) {
|
||||||
$(this).addClass('hidden');
|
$(this).addClass('hidden');
|
||||||
@ -37,11 +37,11 @@ $(window).resize(sizeAndPos);
|
|||||||
else $(this).attr('aria-selected', 'true');
|
else $(this).attr('aria-selected', 'true');
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
$('#exp').click(function() {
|
$('#exp').on('click tap', function() {
|
||||||
$('#save ol:nth-of-type(2) li').removeClass('hidden');
|
$('#save ol:nth-of-type(2) li').removeClass('hidden');
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
$('#pro').click(function() {
|
$('#pro').on('click tap', function() {
|
||||||
$('#save ol:nth-of-type(2) li').each(function() {
|
$('#save ol:nth-of-type(2) li').each(function() {
|
||||||
if( $(this).find('span').html() !== 'Transparent' ) {
|
if( $(this).find('span').html() !== 'Transparent' ) {
|
||||||
$(this).addClass('hidden');
|
$(this).addClass('hidden');
|
||||||
@ -50,20 +50,24 @@ $(window).resize(sizeAndPos);
|
|||||||
else $(this).attr('aria-selected', 'true');
|
else $(this).attr('aria-selected', 'true');
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
$('#exp').click(function() {
|
$('#exp').on('click tap', function() {
|
||||||
$('#save ol:nth-of-type(2) li').removeClass('hidden');
|
$('#save ol:nth-of-type(2) li').removeClass('hidden');
|
||||||
})
|
})
|
||||||
$c.last().on('mousedown', function(e) {
|
$c.last().on('mousedown touchstart', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
if( e.changedTouches )
|
||||||
|
e = e.changedTouches[0];
|
||||||
var xy = relative(e.pageX, e.pageY);
|
var xy = relative(e.pageX, e.pageY);
|
||||||
startPoint(xy.x, xy.y);
|
startPoint(xy.x, xy.y);
|
||||||
window.active = true;
|
window.active = true;
|
||||||
}).on('mousemove', function(e) {
|
}).on('mousemove touchmove', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
if( e.changedTouches )
|
||||||
|
e = e.changedTouches[0];
|
||||||
if (!window.active || settings.type == 'line') return;
|
if (!window.active || settings.type == 'line') return;
|
||||||
var xy = relative(e.pageX, e.pageY);
|
var xy = relative(e.pageX, e.pageY);
|
||||||
drawPoint(xy.x, xy.y);
|
drawPoint(xy.x, xy.y);
|
||||||
}).on('mouseup', function(e) {
|
}).on('mouseup touchend', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
window.active = false;
|
window.active = false;
|
||||||
|
|
||||||
@ -116,7 +120,7 @@ $(window).resize(sizeAndPos);
|
|||||||
|
|
||||||
var $single = $('form.single');
|
var $single = $('form.single');
|
||||||
|
|
||||||
$single.find('li').click(function(e) {
|
$single.find('li').on('click tap', function(e) {
|
||||||
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
||||||
$(this).attr('aria-selected', 'true');
|
$(this).attr('aria-selected', 'true');
|
||||||
var key = $(this).parents('form').attr('id'),
|
var key = $(this).parents('form').attr('id'),
|
||||||
@ -142,11 +146,11 @@ $(window).resize(sizeAndPos);
|
|||||||
|
|
||||||
$confirm.each(function() {
|
$confirm.each(function() {
|
||||||
|
|
||||||
$(this).find('li').click(function(e) {
|
$(this).find('li').on('click tap', function(e) {
|
||||||
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
$(this).parent().find('li[aria-selected]').removeAttr('aria-selected');
|
||||||
$(this).attr('aria-selected', 'true');
|
$(this).attr('aria-selected', 'true');
|
||||||
})
|
})
|
||||||
$(this).find('button').last().click(function(e) {
|
$(this).find('button').last().on('click tap', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
var v = $(this).parents('form').attr('id');
|
var v = $(this).parents('form').attr('id');
|
||||||
$(this).parents('form').find('h1').each(function(i) {
|
$(this).parents('form').find('h1').each(function(i) {
|
||||||
@ -160,7 +164,7 @@ $(window).resize(sizeAndPos);
|
|||||||
$(this).parents('form').addClass('hidden');
|
$(this).parents('form').addClass('hidden');
|
||||||
window[v]();
|
window[v]();
|
||||||
})
|
})
|
||||||
$(this).find('button').first().click(function(e) {
|
$(this).find('button').first().on('click tap', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
$(this).parents('form').addClass('hidden');
|
$(this).parents('form').addClass('hidden');
|
||||||
})
|
})
|
||||||
@ -174,12 +178,12 @@ $(window).resize(sizeAndPos);
|
|||||||
var target = /set(.*)/.exec($(this).attr('id'))[1];
|
var target = /set(.*)/.exec($(this).attr('id'))[1];
|
||||||
// Exception for Color
|
// Exception for Color
|
||||||
if( target == 'color' || target == 'bg' ) {
|
if( target == 'color' || target == 'bg' ) {
|
||||||
return $(this).click(function() {
|
return $(this).on('click tap', function() {
|
||||||
$('.picker').removeClass('hidden');
|
$('.picker').removeClass('hidden');
|
||||||
$('.picker').attr('data-caller', target);
|
$('.picker').attr('data-caller', target);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
$(this).click(function(e) {
|
$(this).on('click tap', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
$('form[id="' + target + '"]').removeClass('hidden');
|
$('form[id="' + target + '"]').removeClass('hidden');
|
||||||
})
|
})
|
||||||
@ -188,11 +192,13 @@ $(window).resize(sizeAndPos);
|
|||||||
// Seekbar
|
// Seekbar
|
||||||
|
|
||||||
var sliderLeft;
|
var sliderLeft;
|
||||||
$('div[role="slider"] button').on('mousedown', function() {
|
$('div[role="slider"] button').on('mousedown touchstart', function() {
|
||||||
$(this).attr('data-moving','true');
|
$(this).attr('data-moving','true');
|
||||||
if( !sliderLeft ) sliderLeft = $('div[role="slider"] button').offset().left;
|
if( !sliderLeft ) sliderLeft = $('div[role="slider"] button').offset().left;
|
||||||
}).on('mousemove', function(e) {
|
}).on('mousemove touchmove', function(e) {
|
||||||
if( $(this).attr('data-moving') ) {
|
if( $(this).attr('data-moving') ) {
|
||||||
|
if( e.changedTouches )
|
||||||
|
e = e.changedTouches[0];
|
||||||
var x = parseInt(e.pageX - sliderLeft - 15);
|
var x = parseInt(e.pageX - sliderLeft - 15);
|
||||||
var $c = $('.'+$(this).parents('div[role="slider"]').attr('class'));
|
var $c = $('.'+$(this).parents('div[role="slider"]').attr('class'));
|
||||||
var progress = $c.find('progress');
|
var progress = $c.find('progress');
|
||||||
@ -206,11 +212,11 @@ $(window).resize(sizeAndPos);
|
|||||||
$('#'+ key +' span').html(x);
|
$('#'+ key +' span').html(x);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}).on('mouseup mouseleave', function() {
|
}).on('mouseup mouseleave touchend', function() {
|
||||||
$(this).removeAttr('data-moving');
|
$(this).removeAttr('data-moving');
|
||||||
})
|
})
|
||||||
|
|
||||||
$('.fill, .stroke').click(function() {
|
$('.fill, .stroke').on('click tap', function() {
|
||||||
var s = $('.'+$(this).attr('class')).find('span');
|
var s = $('.'+$(this).attr('class')).find('span');
|
||||||
if( s.html() == 'Yes' ) {
|
if( s.html() == 'Yes' ) {
|
||||||
s.html('No');
|
s.html('No');
|
||||||
@ -221,13 +227,13 @@ $(window).resize(sizeAndPos);
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
$('.close, .tour button').click(function() {
|
$('.close, .tour button').on('click tap', function() {
|
||||||
$(this).parent().addClass('hidden');
|
$(this).parent().addClass('hidden');
|
||||||
})
|
})
|
||||||
|
|
||||||
// Bottom
|
// Bottom
|
||||||
|
|
||||||
$('#clear').click(function() {
|
$('#clear').on('click tap', function() {
|
||||||
c.clear();
|
c.clear();
|
||||||
var h = window.points.history;
|
var h = window.points.history;
|
||||||
window.points = [];
|
window.points = [];
|
||||||
@ -243,11 +249,16 @@ $(window).resize(sizeAndPos);
|
|||||||
window.points.history.last = window.points.history.length-1;
|
window.points.history.last = window.points.history.length-1;
|
||||||
})
|
})
|
||||||
|
|
||||||
$('#undo').click(undo);
|
$('#undo').on('click tap', undo);
|
||||||
$('#redo').click(redo);
|
$('#redo').on('click tap', redo);
|
||||||
|
|
||||||
$('#about').click(function() {
|
$('#about').on('click tap', function() {
|
||||||
$('.about').removeClass('hidden');
|
$('.about').removeClass('hidden');
|
||||||
})
|
})
|
||||||
|
|
||||||
|
if( window.mobile ) $('*').on('click mousemove mousedown mouseup mouseleave', function() {return false;});
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
3
Mobile/js/main.js → Shared/js/shared.js
Executable file → Normal file
@ -1,5 +1,3 @@
|
|||||||
"use strict";
|
|
||||||
|
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
window.c = $('canvas')[0].getContext('2d');
|
window.c = $('canvas')[0].getContext('2d');
|
||||||
window.o = $('canvas')[1].getContext('2d');
|
window.o = $('canvas')[1].getContext('2d');
|
||||||
@ -45,5 +43,4 @@ $(document).ready(function() {
|
|||||||
$('.tour').removeClass('hidden');
|
$('.tour').removeClass('hidden');
|
||||||
localStorage.setItem('sawTips', settings.version);
|
localStorage.setItem('sawTips', settings.version);
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
@ -1,90 +0,0 @@
|
|||||||
/* Purty Picker Copyright 2013 Jayden Seric (MIT license): https://github.com/jaydenseric/Purty-Picker */
|
|
||||||
/* Core: No touchy! */
|
|
||||||
.color-picker .spectrum {
|
|
||||||
position: relative;
|
|
||||||
/* To position pin, luminosity filter */
|
|
||||||
background: linear-gradient(gray, transparent), linear-gradient(90deg, red, #ff2b00, #ff5500, #ff8000, #ffaa00, #ffd500, yellow, #d4ff00, #aaff00, #80ff00, #55ff00, #2bff00, lime, #00ff2b, #00ff55, #00ff80, #00ffaa, #00ffd5, cyan, #00d4ff, #00aaff, #007fff, #0055ff, #002bff, blue, #2a00ff, #5500ff, #7f00ff, #aa00ff, #d400ff, magenta, #ff00d4, #ff00aa, #ff0080, #ff0055, #ff002b, red);
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-ms-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
/* Prevent pin interaction causing content selection */
|
|
||||||
cursor: crosshair;
|
|
||||||
}
|
|
||||||
.color-picker .spectrum.active {
|
|
||||||
cursor: none;
|
|
||||||
}
|
|
||||||
.color-picker .spectrum.active .pin {
|
|
||||||
cursor: none;
|
|
||||||
}
|
|
||||||
.color-picker .spectrum > div {
|
|
||||||
/* Luminosity filter */
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
.color-picker .spectrum .pin {
|
|
||||||
position: absolute;
|
|
||||||
cursor: move;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Customization: Default skin */
|
|
||||||
.color-picker {
|
|
||||||
margin: 20px;
|
|
||||||
padding: 11px;
|
|
||||||
border: 1px solid #e3e3e3;
|
|
||||||
border-radius: 4px;
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
}
|
|
||||||
.color-picker .color,
|
|
||||||
.color-picker .luminosity {
|
|
||||||
-moz-box-sizing: border-box;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.color-picker .format {
|
|
||||||
display: block;
|
|
||||||
margin: 0 auto 10px auto;
|
|
||||||
}
|
|
||||||
.color-picker .color {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
border: 0;
|
|
||||||
border-radius: 2px;
|
|
||||||
padding: 10px;
|
|
||||||
text-align: center;
|
|
||||||
font-size: 11px;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
font-family: Consolas, Monaco, 'Andale Mono', monospace;
|
|
||||||
color: rgba(0, 0, 0, 0.6);
|
|
||||||
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
|
|
||||||
transition: color 0.2s;
|
|
||||||
}
|
|
||||||
.color-picker .color.dark {
|
|
||||||
color: rgba(255, 255, 255, 0.7);
|
|
||||||
}
|
|
||||||
.color-picker .spectrum {
|
|
||||||
height: 150px;
|
|
||||||
/* Arbitary but required */
|
|
||||||
overflow: hidden;
|
|
||||||
/* Prevent pin overflowing container */
|
|
||||||
border-radius: 2px;
|
|
||||||
margin: 10px 0;
|
|
||||||
}
|
|
||||||
.color-picker .spectrum > div {
|
|
||||||
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
|
|
||||||
}
|
|
||||||
.color-picker .spectrum .pin {
|
|
||||||
margin-left: -4px;
|
|
||||||
margin-top: -4px;
|
|
||||||
width: 4px;
|
|
||||||
height: 4px;
|
|
||||||
border: 2px solid white;
|
|
||||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
|
|
||||||
border-radius: 100%;
|
|
||||||
}
|
|
||||||
.color-picker .luminosity {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
@ -1,16 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: 'MozTT-Regular';
|
|
||||||
src: url('fonts/MozTT-Regular.ttf');
|
|
||||||
}
|
|
||||||
@font-face {
|
|
||||||
font-family: 'MozTT-Light';
|
|
||||||
src: url('fonts/MozTT-Light.ttf');
|
|
||||||
}
|
|
||||||
@font-face {
|
|
||||||
font-family: 'MozTT-Medium';
|
|
||||||
src: url('fonts/MozTT-Medium.ttf');
|
|
||||||
}
|
|
||||||
@font-face {
|
|
||||||
font-family: 'MozTT-Bold';
|
|
||||||
src: url('fonts/MozTT-Bold.ttf');
|
|
||||||
}
|
|
@ -1,292 +0,0 @@
|
|||||||
@import 'fonts';
|
|
||||||
@import 'color-picker';
|
|
||||||
@import 'seekbars';
|
|
||||||
@import 'value_selector';
|
|
||||||
|
|
||||||
html, body {
|
|
||||||
margin: 0;
|
|
||||||
font-size: 10px;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
*::-moz-focus-inner {
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
*:focus {
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
display: none !important;
|
|
||||||
visibility: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
div#container {
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
canvas {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.separator {
|
|
||||||
display: block;
|
|
||||||
height: 4.8rem;
|
|
||||||
width: 0.1rem;
|
|
||||||
&.long {
|
|
||||||
background: url('imgs/div_line_lg_black.png');
|
|
||||||
}
|
|
||||||
&.small {
|
|
||||||
background: url('imgs/div_line_sm_black.png');
|
|
||||||
}
|
|
||||||
&.left {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
&.right {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
&.menu {
|
|
||||||
position: relative;
|
|
||||||
left: -3rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.overlay {
|
|
||||||
z-index: 9999;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 5.3rem;;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
-moz-appearance: none;
|
|
||||||
z-index: 1;
|
|
||||||
position: relative;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close {
|
|
||||||
display: block;
|
|
||||||
width: 2rem;
|
|
||||||
height: 2rem;
|
|
||||||
padding: 0 0 0.2rem 0.2rem;
|
|
||||||
font-size: 10pt;
|
|
||||||
border: 1px solid rgb(227, 227, 227);
|
|
||||||
border-radius: 50%;
|
|
||||||
position: absolute;
|
|
||||||
text-align: center;
|
|
||||||
top: -2%;
|
|
||||||
left: 97%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.picker, .about, .tour {
|
|
||||||
font-family: 'MozTT-Light';
|
|
||||||
width: 30rem;
|
|
||||||
height: 24.6rem;
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
margin-top: -12.3rem;
|
|
||||||
margin-left: -15rem;
|
|
||||||
|
|
||||||
.color-picker {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.about, .tour {
|
|
||||||
background: #262626;
|
|
||||||
padding: 1rem 2rem;;
|
|
||||||
height: 23rem;
|
|
||||||
margin-top: -11.5rem;
|
|
||||||
margin-left: -17rem;
|
|
||||||
border-radius: 0.2rem;
|
|
||||||
color: white;
|
|
||||||
box-shadow: 0 0 0.3rem black;
|
|
||||||
|
|
||||||
a, a:link, a:visited, a:active {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close {
|
|
||||||
background: #262626;
|
|
||||||
color: white;
|
|
||||||
border: 1px solid gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 11pt;
|
|
||||||
}
|
|
||||||
span {
|
|
||||||
font-size: 8pt;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tour {
|
|
||||||
.button {
|
|
||||||
width: 30rem;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 1rem;
|
|
||||||
left: 1.8rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
header {
|
|
||||||
width: 100%;
|
|
||||||
height: 5.3rem;
|
|
||||||
background: url('imgs/header_bg_black.png');
|
|
||||||
|
|
||||||
button {
|
|
||||||
width: 5rem;
|
|
||||||
height: 5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu {
|
|
||||||
background: url('imgs/menu.png') -12px center no-repeat;
|
|
||||||
float: left;
|
|
||||||
&:active {
|
|
||||||
background: url('imgs/menu.png') -12px center no-repeat, url('imgs/bg_overlay_pressed_1.png') left no-repeat;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.save {
|
|
||||||
background: url('imgs/download.png') center center no-repeat;
|
|
||||||
float: right;
|
|
||||||
&:active {
|
|
||||||
background: url('imgs/download.png') center center no-repeat, url('imgs/bg_overlay_pressed_2.png') center center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.load {
|
|
||||||
background: url('imgs/load.png') center center no-repeat;
|
|
||||||
float: right;
|
|
||||||
&:active {
|
|
||||||
background: url('imgs/load.png') center center no-repeat, url('imgs/bg_overlay_pressed_2.png') center center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#title {
|
|
||||||
color: white;
|
|
||||||
font-size: 11pt;
|
|
||||||
font-family: 'MozTT-Regular';
|
|
||||||
float: left;
|
|
||||||
margin: 1.5rem 0;
|
|
||||||
position: relative;
|
|
||||||
left: -2rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#menu {
|
|
||||||
width: 15rem;
|
|
||||||
height: 100%;
|
|
||||||
display: block;
|
|
||||||
background: #262626;
|
|
||||||
position: absolute;
|
|
||||||
left: -15rem;
|
|
||||||
top: 5rem;
|
|
||||||
color: white;
|
|
||||||
font-family: 'MozTT-Light';
|
|
||||||
font-size: 8pt;
|
|
||||||
transition: left 0.2s ease-out;
|
|
||||||
border-collapse: collapse;
|
|
||||||
overflow-y: auto;
|
|
||||||
|
|
||||||
&.pulled {
|
|
||||||
left: 0;
|
|
||||||
transition: left 0.2s ease-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
button[id^='set'], p, .bottom button {
|
|
||||||
background: none;
|
|
||||||
display: block;
|
|
||||||
width: 75%;
|
|
||||||
color: white;
|
|
||||||
text-align: left;
|
|
||||||
margin: 1rem 2.5rem;
|
|
||||||
font-family: 'MozTT-Light';
|
|
||||||
font-size: 8pt;
|
|
||||||
padding: 0 0.6rem;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
p {
|
|
||||||
width: 65%;
|
|
||||||
}
|
|
||||||
span {
|
|
||||||
float: right;
|
|
||||||
font-size: 7pt;
|
|
||||||
}
|
|
||||||
div[role='slider'] {
|
|
||||||
width: 60%;
|
|
||||||
float: right;
|
|
||||||
margin: 0 2rem 0 0;
|
|
||||||
|
|
||||||
div {
|
|
||||||
overflow: visible;
|
|
||||||
button {
|
|
||||||
margin-top: -3.4rem;
|
|
||||||
left: 0%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
hr {
|
|
||||||
clear: both;
|
|
||||||
padding: 0.7rem 0;
|
|
||||||
margin-bottom: 0.7rem;
|
|
||||||
border: none;
|
|
||||||
border-bottom: 1px solid rgba(255,255,255,0.3);
|
|
||||||
}
|
|
||||||
*[class^='icon'] {
|
|
||||||
display: block;
|
|
||||||
margin: 1rem 0.5rem;
|
|
||||||
|
|
||||||
&:nth-of-type(2) {
|
|
||||||
padding-top: 0.5rem;
|
|
||||||
}
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
background-size: 2rem;
|
|
||||||
width: 2rem;
|
|
||||||
height: 2rem;
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
margin: -0.3rem 0.5rem 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-settings:before {
|
|
||||||
background-image: url('imgs/settings.png');
|
|
||||||
}
|
|
||||||
.icon-clear:before {
|
|
||||||
background-image: url('imgs/clear.png');
|
|
||||||
}
|
|
||||||
.icon-undo:before {
|
|
||||||
background-image: url('imgs/undo.png');
|
|
||||||
}
|
|
||||||
.icon-redo:before {
|
|
||||||
background-image: url('imgs/redo.png');
|
|
||||||
}
|
|
||||||
|
|
||||||
.options {
|
|
||||||
display: table-row;
|
|
||||||
vertical-align: top;
|
|
||||||
margin-top: 1rem;
|
|
||||||
}
|
|
||||||
.bottom {
|
|
||||||
width: 100%;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 5rem;
|
|
||||||
button[class^='icon'] {
|
|
||||||
margin-left: 3.5rem;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
margin-left: 5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
@ -1,94 +0,0 @@
|
|||||||
/* ----------------------------------
|
|
||||||
* CHECKBOXES / RADIOS
|
|
||||||
* ---------------------------------- */
|
|
||||||
|
|
||||||
label.pack-checkbox,
|
|
||||||
label.pack-radio,
|
|
||||||
label.pack-switch {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 5rem;
|
|
||||||
height: 5rem;
|
|
||||||
position: relative;
|
|
||||||
background: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-checkbox input,
|
|
||||||
label.pack-radio input,
|
|
||||||
label.pack-switch input {
|
|
||||||
margin: 0;
|
|
||||||
opacity: 0;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-checkbox input ~ span:after,
|
|
||||||
label.pack-radio input ~ span:after {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
margin: -1.1rem 0 0 -1.1rem;
|
|
||||||
width: 2.2rem;
|
|
||||||
height: 2.2rem;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-checkbox input ~ span:after {
|
|
||||||
background: url(switches/images/check/default.png) no-repeat center top / 2.2rem auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-radio input ~ span:after {
|
|
||||||
background: url(switches/images/radio/default.png) no-repeat center top / 2.2rem auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-checkbox input:checked ~ span:after,
|
|
||||||
label.pack-radio input:checked ~ span:after,
|
|
||||||
label.pack-switch input:checked ~ span:after {
|
|
||||||
background-position: center bottom;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 'Dangerous' switches */
|
|
||||||
|
|
||||||
label.pack-checkbox.danger input ~ span:after {
|
|
||||||
background-image: url(switches/images/check/danger.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-radio.danger input ~ span:after {
|
|
||||||
background-image: url(switches/images/radio/danger.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* ----------------------------------
|
|
||||||
* ON/OFF SWITCHES
|
|
||||||
* ---------------------------------- */
|
|
||||||
|
|
||||||
label.pack-switch input ~ span:after {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 50%;
|
|
||||||
width: 6rem;
|
|
||||||
margin: -1.4rem 0rem 0rem;
|
|
||||||
height: 2.7rem;
|
|
||||||
pointer-events: none;
|
|
||||||
border-radius: 1.35rem;
|
|
||||||
overflow: hidden;
|
|
||||||
background: #e6e6e6 url(switches/images/switch/background_off.png) no-repeat -3.2rem 0rem / 9.2rem 2.7rem;
|
|
||||||
transition: background 0.2s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* switch: 'ON' state */
|
|
||||||
label.pack-switch input:checked ~ span:after {
|
|
||||||
background: #e6e6e6 url(switches/images/switch/background.png) no-repeat 0rem 0rem / 9.2rem 2.7rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* switch: disabled state */
|
|
||||||
label.pack-switch input:disabled ~ span:after {
|
|
||||||
opacity: 0.4;
|
|
||||||
}
|
|
||||||
|
|
||||||
label.pack-switch input.uninit ~ span:after {
|
|
||||||
transition: none;
|
|
||||||
}
|
|
@ -1,204 +0,0 @@
|
|||||||
/* ----------------------------------
|
|
||||||
* Value selector (Single & Multiple)
|
|
||||||
* ---------------------------------- */
|
|
||||||
|
|
||||||
/* Main dialog setup */
|
|
||||||
form[role="dialog"][data-type="value-selector"] {
|
|
||||||
background: url(value_selector/images/ui/pattern.png) repeat left top, url(value_selector/images/ui/gradient.png) no-repeat left top / 100% 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
position: absolute;
|
|
||||||
z-index: 100;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
padding: 0 0 7rem;
|
|
||||||
color: #fff;
|
|
||||||
font-family: sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] > section {
|
|
||||||
padding: 0 1.5rem 0;
|
|
||||||
-moz-box-sizing: padding-box;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] h1 {
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 1.9rem;
|
|
||||||
line-height: 4.8rem;
|
|
||||||
color: #fff;
|
|
||||||
border-bottom: 0.1rem solid #616262;
|
|
||||||
background: rgba(0 ,0, 0, .2);
|
|
||||||
margin: 0 -1.5rem;
|
|
||||||
padding: 0 3rem 1rem;
|
|
||||||
height: 4.8rem;
|
|
||||||
-moz-box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Specific component code */
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] {
|
|
||||||
position: relative;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0 -1.5rem;
|
|
||||||
max-height: calc(100% - 5rem);
|
|
||||||
overflow: auto;
|
|
||||||
border-top: solid 0.1rem #222323;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] .scrollable:before {
|
|
||||||
content: "";
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
pointer-events: none;
|
|
||||||
top: 4.8rem;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 6.9rem;
|
|
||||||
background: url(value_selector/images/ui/shadow.png) repeat-x left top, url(value_selector/images/ui/shadow-invert.png) repeat-x left bottom;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0 1.5rem;
|
|
||||||
height: auto;
|
|
||||||
list-style: none;
|
|
||||||
position: relative;
|
|
||||||
font-weight: lighter;
|
|
||||||
font-size: 2.2rem;
|
|
||||||
line-height: 3.9rem;
|
|
||||||
color: #fff;
|
|
||||||
transition: background-color 0.2s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li:first-child label {
|
|
||||||
border-top-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li label {
|
|
||||||
outline: none;
|
|
||||||
display: block;
|
|
||||||
color: #fff;
|
|
||||||
border-top: 0.1rem solid #666;
|
|
||||||
border-bottom: 0.1rem solid #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li:last-child label {
|
|
||||||
border-bottom-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li label span {
|
|
||||||
display: block;
|
|
||||||
padding: 1rem 1.5rem;
|
|
||||||
line-height: 4rem;
|
|
||||||
word-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Pressed status */
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li:active {
|
|
||||||
background-color: #00ABCC;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li:active label {
|
|
||||||
border-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li:active + li label {
|
|
||||||
border-top-color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li:active label span {
|
|
||||||
color: #fff !important;
|
|
||||||
background-image: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Checked status */
|
|
||||||
form[role="dialog"][data-type="value-selector"] [role="listbox"] li[aria-selected="true"]:not([data-input]) span {
|
|
||||||
padding-right: 2.6rem;
|
|
||||||
margin-right: 1.2rem;
|
|
||||||
color: #00abcd;
|
|
||||||
background: transparent url(value_selector/images/icons/checked.png) no-repeat 100% 50%;
|
|
||||||
background-size: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Menu & buttons setup */
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu {
|
|
||||||
white-space: nowrap;
|
|
||||||
margin: 0;
|
|
||||||
padding: 1.5rem;
|
|
||||||
border-top: solid 0.1rem rgba(255, 255, 255, 0.1);
|
|
||||||
background: #2d2d2d url(value_selector/images/ui/pattern.png) repeat left top;
|
|
||||||
display: block;
|
|
||||||
overflow: hidden;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button::-moz-focus-inner {
|
|
||||||
border: none;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button, .button {
|
|
||||||
width: calc((100% - 1rem) / 2);
|
|
||||||
height: 3.8rem;
|
|
||||||
margin: 0 0 1rem;
|
|
||||||
padding: 0 1.5rem;
|
|
||||||
-moz-box-sizing: border-box;
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
background: #fafafa url(value_selector/images/ui/default.png) repeat-x left bottom/ auto 100%;
|
|
||||||
border: 0.1rem solid #a6a6a6;
|
|
||||||
border-radius: 0.3rem;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 1.6rem;
|
|
||||||
line-height: 3.8rem;
|
|
||||||
color: #333;
|
|
||||||
text-align: center;
|
|
||||||
text-shadow: 0.1rem 0.1rem 0 rgba(255,255,255,0.3);
|
|
||||||
text-decoration: none;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Press (default & affirmative) */
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button:active,
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button.affirmative:active, .button:active {
|
|
||||||
border-color: #008aaa;
|
|
||||||
background: #008aaa;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* affirmative */
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button.affirmative, .button.affirmative {
|
|
||||||
background-image: url(value_selector/images/ui/affirmative.png);
|
|
||||||
background-color: #00caf2;
|
|
||||||
border-color: #008eab;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button:last-child {
|
|
||||||
margin-left: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button,
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button:first-child {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
form[role="dialog"][data-type="value-selector"] menu button.full, .button.full {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Right to left tweaks */
|
|
||||||
html[dir="rtl"] #value-selector li input:checked + span,
|
|
||||||
html[dir="rtl"] #value-selector li[aria-selected="true"] span {
|
|
||||||
padding-left: 2.6rem;
|
|
||||||
margin-left: 1.2rem;
|
|
||||||
}
|
|
Before Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 8.0 KiB |
Before Width: | Height: | Size: 8.9 KiB |
Before Width: | Height: | Size: 738 B |
Before Width: | Height: | Size: 7.2 KiB |
@ -1,102 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
||||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
|
||||||
|
|
||||||
<svg
|
|
||||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
|
||||||
xmlns:cc="http://creativecommons.org/ns#"
|
|
||||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
|
||||||
xmlns:svg="http://www.w3.org/2000/svg"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
|
||||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
|
||||||
width="60"
|
|
||||||
height="60"
|
|
||||||
id="svg3029"
|
|
||||||
version="1.1"
|
|
||||||
inkscape:version="0.48.4 r9939"
|
|
||||||
sodipodi:docname="icon2.svg"
|
|
||||||
inkscape:export-filename="/home/mahdi/Documents/Workshop/Mobile Editor/img/icons/icon128.png"
|
|
||||||
inkscape:export-xdpi="192"
|
|
||||||
inkscape:export-ydpi="192">
|
|
||||||
<defs
|
|
||||||
id="defs3031" />
|
|
||||||
<sodipodi:namedview
|
|
||||||
id="base"
|
|
||||||
pagecolor="#ffffff"
|
|
||||||
bordercolor="#666666"
|
|
||||||
borderopacity="1.0"
|
|
||||||
inkscape:pageopacity="0.0"
|
|
||||||
inkscape:pageshadow="2"
|
|
||||||
inkscape:zoom="1"
|
|
||||||
inkscape:cx="-103.49318"
|
|
||||||
inkscape:cy="83.371075"
|
|
||||||
inkscape:current-layer="layer1"
|
|
||||||
showgrid="true"
|
|
||||||
inkscape:grid-bbox="true"
|
|
||||||
inkscape:document-units="px"
|
|
||||||
inkscape:window-width="1600"
|
|
||||||
inkscape:window-height="876"
|
|
||||||
inkscape:window-x="0"
|
|
||||||
inkscape:window-y="24"
|
|
||||||
inkscape:window-maximized="1" />
|
|
||||||
<metadata
|
|
||||||
id="metadata3034">
|
|
||||||
<rdf:RDF>
|
|
||||||
<cc:Work
|
|
||||||
rdf:about="">
|
|
||||||
<dc:format>image/svg+xml</dc:format>
|
|
||||||
<dc:type
|
|
||||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
|
||||||
<dc:title />
|
|
||||||
</cc:Work>
|
|
||||||
</rdf:RDF>
|
|
||||||
</metadata>
|
|
||||||
<g
|
|
||||||
id="layer1"
|
|
||||||
inkscape:label="Layer 1"
|
|
||||||
inkscape:groupmode="layer"
|
|
||||||
transform="translate(0,12)">
|
|
||||||
<path
|
|
||||||
sodipodi:type="arc"
|
|
||||||
style="fill:#636363;fill-opacity:1;stroke:none"
|
|
||||||
id="path3037"
|
|
||||||
sodipodi:cx="31.428572"
|
|
||||||
sodipodi:cy="29.285715"
|
|
||||||
sodipodi:rx="26.428572"
|
|
||||||
sodipodi:ry="26.428572"
|
|
||||||
d="m 57.857143,29.285715 c 0,14.596097 -11.832474,26.428572 -26.428571,26.428572 C 16.832475,55.714287 5,43.881812 5,29.285715 5,14.689618 16.832475,2.8571434 31.428572,2.8571434 c 14.596097,0 26.428571,11.8324746 26.428571,26.4285716 z"
|
|
||||||
transform="matrix(1.0972973,0,0,1.0972973,-4.4864869,-14.135136)" />
|
|
||||||
<path
|
|
||||||
style="fill:#dedede;fill-opacity:1;stroke:#383838;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
|
||||||
d="m 40.415998,-0.2045792 c 0,0 -22.715805,23.0693572 -23.422911,25.0139012 -0.707107,1.944544 -2.740039,7.601398 -2.032932,8.485281 0.707106,0.883883 7.689786,-1.502602 9.015611,-2.828427 C 25.301591,29.140351 47.60072,6.06032 47.840618,4.833556 48.06427,3.68987 41.877086,-1.6684275 40.415998,-0.2045792 z"
|
|
||||||
id="path3054"
|
|
||||||
inkscape:connector-curvature="0"
|
|
||||||
sodipodi:nodetypes="cssssc" />
|
|
||||||
<path
|
|
||||||
style="fill:#9e9e9e;fill-opacity:1;stroke:none"
|
|
||||||
d="m 44.875383,3.203193 c 0,0 -23.929105,24.058149 -24.015804,24.932991 -0.0867,0.874841 1.387194,2.71201 1.820692,2.187104 C 23.11377,29.798383 46.435977,5.9152018 46.522677,5.0403605 46.609378,4.1655182 45.222182,3.2906768 44.875383,3.203193 z"
|
|
||||||
id="path3841"
|
|
||||||
inkscape:connector-curvature="0" />
|
|
||||||
<path
|
|
||||||
style="fill:#c0c0c0;fill-opacity:1;stroke:none"
|
|
||||||
d="m 42.401427,1.6217284 c 0,0 -23.399153,24.3933116 -23.394823,24.6432736 0.0043,0.249963 1.094444,1.292086 1.650364,0.907398 0.55592,-0.384687 23.207727,-24.0757977 23.264805,-24.3893335 0.05708,-0.3135357 -1.2693,-1.1031781 -1.520346,-1.1613381 z"
|
|
||||||
id="path3861"
|
|
||||||
inkscape:connector-curvature="0"
|
|
||||||
sodipodi:nodetypes="ccssc" />
|
|
||||||
<path
|
|
||||||
style="fill:#494949;fill-opacity:1;stroke:none"
|
|
||||||
d="m 15.695313,42.429687 c 0,0 -0.515625,1.960938 -0.359375,2.539063 0.0078,0 0.141085,0.342965 2.430147,-0.344535 -0.01563,0.0078 -0.647057,-2.041553 -2.070772,-2.194528 z"
|
|
||||||
id="path3865"
|
|
||||||
inkscape:connector-curvature="0"
|
|
||||||
transform="translate(0,-12)"
|
|
||||||
sodipodi:nodetypes="cccc" />
|
|
||||||
<image
|
|
||||||
y="-11.715099"
|
|
||||||
x="0.21543235"
|
|
||||||
id="image3962"
|
|
||||||
xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAABHNCSVQICAgIfAhkiAAABwNJREFU aIHlm01MG+kZx3/vjIevNTEfNhvA3RqWbmirqKcGlMKlbZRL0kMPrSqUgIxCyIVISc45IUWRckmv vVXNIWqVNjRqN60qVZuqXdE0yiZebdRslV3YJSZmiw3YgzHD9PB6YuPYMLbHHqT+pUfGlud9n5+f 93nejxmEaZr8P0lx24F6y1ODNkWJz/cbSpVeV5acAhZ5ZuZZOSr8vtWeUkWbb0hUmcOWQwLYccqp In3kg1v9VNZYFcBq1okdwKi0kXr3WQmwADTkr7yN8xG1078n+5opt/9ygVUk7HbW3JQnaxnKiHY5 wB4kbBo5pA6CFKARCW0rAHbn4YasHSRYkL6kyfm3r+wAW43pHCxYSzu3bt3afPbsWfPc3Fzzfl/e b0hrQDOwwQGBFUJYRUvLvqqAEggExNmzZ72apsWuXbuWLHX9XhFWgbeAFAcAVgjRIIRoBToAH9CC HHkqIGKxGHNzc7qmaW/Pzs6WHN6lgAXQCmziYjUWUi1CiE4kZBO5hc4b9vz58535+fktRVF6rl69 WnSpWgq4Jfu66SiBTVmgQCfgJRtFO3b//v2tly9fehobG/3F2i4GbA3ldadB7EgI0YAEbaUM0Hy7 c+dOUlGUrps3b74xtIsB+5AVuV7LReB1VH3IHLVWUhXZ0tKSGYlENtPpdG9hP4XAVlUuWeVqISGE B/AjU6li0Hy7e/eurqpq2/Xr15vy+yoE9iFh61aVhRCNQAD5YzsCC4hkMkkkEkl5vd5dUVYK/vZS x9zNFiY/uV2Qo3bv3j0d8M/Pz6tWn/nAXmRVrkvu5lXhktNMtbaysmJGo9HMw4cPA1a/+cDWcK65 hBDNyMg6HtVCe/z4sa4oymGrbwtYIAtGzYGz004XNYxsvj148CCtqmr77du3FcidabUgt1g1LVZC CAV4G5mzdVEikWB1ddU0DKMd+MqK8FvUZ1UVQO5faz6U8y0ajW4h53fqBiyE8CLrRF1hAWVxcTGj adqhfOBmYKuGsAKZt67o1atXr4GtHG6khsDI6cfWiUQttLi4aGRH2C7gmmwDs4XKmm9d0fLysqko ShPkgDVqV6E7s+27plQqZS1hXwNb2zBHz5izuRvAxegCaJomFEXxQA7YJHfG66R8uJi7ltra2jxm 9vDOAt6hNsAduBxdgI6ODs0wjF3AGWTh0p3qJFusfMhUcVWHDx9uUFV1E3LAm8jFR9zBfqwjGtcV DAZbDMNYgxzwBjIaXzrYj48DAhwKhXymaX4OufyKI6cPJ9VKHXZDdqynp6dN1/Uo5CL8X6At+96p BYiXA1CwfD6f6vf7W6PR6Bewu0onkFu3qoe1EELD5cWGpRMnTnSaprk8MzOTgd3PeHwJfB1n8ti6 Q+C6jh071qPr+iPrfb5Ti0AvcnqqVg24sA0stK6ursa+vj5/Op1+Ugx4C1gC3nMAuKqDdKdsbGys d3t7+9Pz58+nigEDfAx8m+rzz/Xoer1ez9DQUH88Hv8g37HC57TiwDLwTeAJ1cnVHD537lzIMIyF 6enpL/I/L+bUQ+AouTuIlcjExaEcCoWaRkdH+3Rdv1voWDHgdeATYKQK4AwuDudLly4dTaVSH05O TsbsAAN8hFwaDlYInHYLNhwOv9Pb2+tJJpN/LOZYKWAD+BNwHHmHoFzpbsAODw+3nT59ejAej/9i amqq6FZ3r8KSAD4ATiGXibZlmqaB3IHVLW8HBgaar1y5ciyRSPw6HA6/LOXbfpX0U+AR8GPkUW45 WqsXbDAYbJqdnf1eKpV6f3x8/B97OWVn6ngC/Bv4KXDIPi+r9YAdHBxsuXHjxohpmn8/c+bM+/s5 Zfd56Q+RK7GfAb8FXtm4JkaN5+Ljx4/7Ll++PKTr+h/GxsZ+b+each4Qf4Q8KPgJ8ABZyUvKNM24 EGKT8lPBli5cuBA6derUe7FY7Ffj4+N/s3tdJY8PdwA/Qha1vyBztXjjQnwH+Ea5HeylI0eOtMzM zBwNBoPEYrGfT05OLpZzfaUPiKvAEPBdYB65OntjGhBCtAM/rKSDQvl8PnV6evrdkZGRd9fX1/+8 vr7+m1JTz16q9l8A2oDvA18D/pW1XSefQogfUMXxUXd3d8PExET/8PBwv2EYz1ZXV38ZDoeXKm2v WmBLXciIHwE+B54CL4C0EKKXMpepnZ2dnpMnT3aNjo6+EwqFOjc2Nj7a2Nj43cTExH+qddQpYEvN wLeQS9JeYAVYuHjx4sDTp0+VhYUFPRqNbiWTSUPTNNHR0aG1t7d7uru7m0KhkLevr+9Qf3+/PxAI eHVd/2xtbe2fuq7/dWpqKuGUg04D50sFgkAwEokMvHjx4qimaa2qqrYoitIAsLOzs2UYRiqTySQz mcxKOp1e0HX9k+3t7SeV5Kcd1RL4QOp/GtofUQrANYgAAAAASUVORK5CYII= "
|
|
||||||
height="60"
|
|
||||||
width="60" />
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
Before Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 3.7 KiB |