Grunt - BugFixes

This commit is contained in:
Mahdi Dibaiee 2014-02-20 01:06:39 +03:30
parent 2da11c6502
commit fcb1f095fd
248 changed files with 1582 additions and 2846 deletions

1
.gitignore vendored
View File

@ -1,3 +1,4 @@
*.swp *.swp
*.swo *.swo
*~ *~
node_modules

127
Gruntfile.js Normal file
View 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'])
}

View File

@ -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
View 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);
}
})

View File

@ -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;
}
}
}

File diff suppressed because one or more lines are too long

View File

@ -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');
})
});

View File

@ -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
========= =========

View File

Before

Width:  |  Height:  |  Size: 93 B

After

Width:  |  Height:  |  Size: 93 B

View File

Before

Width:  |  Height:  |  Size: 94 B

After

Width:  |  Height:  |  Size: 94 B

View File

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

Before

Width:  |  Height:  |  Size: 413 B

After

Width:  |  Height:  |  Size: 413 B

View File

Before

Width:  |  Height:  |  Size: 182 B

After

Width:  |  Height:  |  Size: 182 B

View File

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

Before

Width:  |  Height:  |  Size: 636 B

After

Width:  |  Height:  |  Size: 636 B

View File

Before

Width:  |  Height:  |  Size: 960 B

After

Width:  |  Height:  |  Size: 960 B

View File

Before

Width:  |  Height:  |  Size: 938 B

After

Width:  |  Height:  |  Size: 938 B

View File

Before

Width:  |  Height:  |  Size: 583 B

After

Width:  |  Height:  |  Size: 583 B

View File

Before

Width:  |  Height:  |  Size: 946 B

After

Width:  |  Height:  |  Size: 946 B

View File

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

Before

Width:  |  Height:  |  Size: 583 B

After

Width:  |  Height:  |  Size: 583 B

View File

Before

Width:  |  Height:  |  Size: 946 B

After

Width:  |  Height:  |  Size: 946 B

View File

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

Before

Width:  |  Height:  |  Size: 578 B

After

Width:  |  Height:  |  Size: 578 B

View File

Before

Width:  |  Height:  |  Size: 893 B

After

Width:  |  Height:  |  Size: 893 B

View File

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

Before

Width:  |  Height:  |  Size: 575 B

After

Width:  |  Height:  |  Size: 575 B

View File

Before

Width:  |  Height:  |  Size: 889 B

After

Width:  |  Height:  |  Size: 889 B

View File

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

Before

Width:  |  Height:  |  Size: 755 B

After

Width:  |  Height:  |  Size: 755 B

View File

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

Before

Width:  |  Height:  |  Size: 475 B

After

Width:  |  Height:  |  Size: 475 B

View File

Before

Width:  |  Height:  |  Size: 616 B

After

Width:  |  Height:  |  Size: 616 B

View File

Before

Width:  |  Height:  |  Size: 177 B

After

Width:  |  Height:  |  Size: 177 B

View File

Before

Width:  |  Height:  |  Size: 392 B

After

Width:  |  Height:  |  Size: 392 B

View File

Before

Width:  |  Height:  |  Size: 601 B

After

Width:  |  Height:  |  Size: 601 B

View File

Before

Width:  |  Height:  |  Size: 101 B

After

Width:  |  Height:  |  Size: 101 B

View File

Before

Width:  |  Height:  |  Size: 82 B

After

Width:  |  Height:  |  Size: 82 B

View File

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

Before

Width:  |  Height:  |  Size: 7.7 KiB

After

Width:  |  Height:  |  Size: 7.7 KiB

View File

Before

Width:  |  Height:  |  Size: 6.7 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

View File

Before

Width:  |  Height:  |  Size: 83 B

After

Width:  |  Height:  |  Size: 83 B

View File

Before

Width:  |  Height:  |  Size: 154 B

After

Width:  |  Height:  |  Size: 154 B

View File

Before

Width:  |  Height:  |  Size: 86 B

After

Width:  |  Height:  |  Size: 86 B

View File

Before

Width:  |  Height:  |  Size: 82 B

After

Width:  |  Height:  |  Size: 82 B

View File

Before

Width:  |  Height:  |  Size: 154 B

After

Width:  |  Height:  |  Size: 154 B

View File

Before

Width:  |  Height:  |  Size: 87 B

After

Width:  |  Height:  |  Size: 87 B

View File

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 4.3 KiB

View File

Before

Width:  |  Height:  |  Size: 8.0 KiB

After

Width:  |  Height:  |  Size: 8.0 KiB

View File

Before

Width:  |  Height:  |  Size: 8.9 KiB

After

Width:  |  Height:  |  Size: 8.9 KiB

View File

Before

Width:  |  Height:  |  Size: 738 B

After

Width:  |  Height:  |  Size: 738 B

View File

Before

Width:  |  Height:  |  Size: 7.2 KiB

After

Width:  |  Height:  |  Size: 7.2 KiB

View File

Before

Width:  |  Height:  |  Size: 6.6 KiB

After

Width:  |  Height:  |  Size: 6.6 KiB

View File

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

Before

Width:  |  Height:  |  Size: 2.7 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

View File

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

View File

Before

Width:  |  Height:  |  Size: 6.0 KiB

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

@ -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;});
})

5
Mobile/js/main.js → Shared/js/shared.js Executable file → Normal file
View 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');
@ -40,10 +38,9 @@ $(document).ready(function() {
} }
}) })
$('.color').val('#000000'); $('.color').val('#000000');
if( localStorage.getItem('sawTips') != settings.version ) { if( localStorage.getItem('sawTips') != settings.version ) {
$('.tour').removeClass('hidden'); $('.tour').removeClass('hidden');
localStorage.setItem('sawTips', settings.version); localStorage.setItem('sawTips', settings.version);
} }
}) })

View File

@ -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;
}

View File

@ -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');
}

View File

@ -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;
}
}
}

View File

@ -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;
}

View File

@ -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;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 738 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.2 KiB

View File

@ -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,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 "
height="60"
width="60" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.7 KiB

Some files were not shown because too many files have changed in this diff Show More