summaryrefslogtreecommitdiff
path: root/frontend/impattern/js/sketch.js
diff options
context:
space:
mode:
authoryo mama <pepper@scannerjammer.com>2015-09-22 00:51:40 -0700
committeryo mama <pepper@scannerjammer.com>2015-09-22 00:51:40 -0700
commitd3e7b5708deffbed864c916de22663f48333c58b (patch)
treeef76784a7827baff88c03670bf22832a3f146b17 /frontend/impattern/js/sketch.js
parent86c79f4372d7b2e7640a26473c7a4d331cdf7d16 (diff)
finishing server
Diffstat (limited to 'frontend/impattern/js/sketch.js')
-rw-r--r--frontend/impattern/js/sketch.js219
1 files changed, 0 insertions, 219 deletions
diff --git a/frontend/impattern/js/sketch.js b/frontend/impattern/js/sketch.js
deleted file mode 100644
index ec78489..0000000
--- a/frontend/impattern/js/sketch.js
+++ /dev/null
@@ -1,219 +0,0 @@
-//dragging event
-
-var COLUMNS_MAX = 20;
-var ROWS_MAX = 20;
-var isDragging = false;
-$("body").mousedown(function() {
- $(window).mousemove(function() {
- isDragging = true;
- $(window).unbind("mousemove");
- });
-}).mouseup(function() {
- var wasDragging = isDragging;
- isDragging = false;
- $(window).unbind("mousemove");
- if (!wasDragging) { //was clicking
- }
-});
-
-var c;
-
-window.active_tool = "brush";
-var brush_tools;
-
-
-
-function BrushTools(){
- var brushtools = this;
- this.brush = $("#brush");
- this.eraser = $("#eraser");
- this.brush_tools = $(".brush_tools");
- this.active_css = {
- "border" : "1px solid black",
- "background" : "gray",
- "color" : "white",
- },
- this.inactive_css = {
- "border" : "1px solid gray",
- "background" : "whitesmoke",
- "color" : "black",
- };
- this.activate = function(elem){
- $(elem).css(this.active_css);
- window.active_tool = $(elem).attr("id");
- };
- this.deactivate = function(elem){
- $(elem).css(this.inactive_css);
- };
-// this.cursors = {
-// "brush" : "img/brush.png",
-// "eraser" : "img/eraser.png",
-// };
- this.brush_tools.click(function(){
- var that = this;
- window.active_tool = $(this).attr("id");
- brushtools.activate(that);
- brushtools.brush_tools.each(function(){
- if(this != that){
- brushtools.deactivate(this);
- }
- });
-// $("#canvas_wrapper").css(
-// "cursor" , "url("+brushtools.cursors[window.active_tool]+")"
-// )
- });
-}
-
-
-
-
-function GridCanvas(){
- var gridcanvas = this;
- this.rows = 10;
- this.cols = 10;
- this.current_rows = [];
- this.container = $("#canvas_wrapper");
- this.paint = function(elem){
- $(elem).attr("painted", "1");
- $(elem).css("background", "black");
- };
- this.erase = function(elem){
- $(elem).attr("painted", "0");
- $(elem).css("background", "white");
- };
- this.initialize = function(cols, rows){
- this.container.html("");
- this.rows = (rows > 0) ? rows : 1;
- this.cols = (cols > 0) ? cols : 1;
- if (this.rows > ROWS_MAX){
- this.rows = ROWS_MAX;
- }
- if (this.cols > COLUMNS_MAX){
- this.cols = COLUMNS_MAX;
- }
- this.cols = cols;
- for (var i = 0; i< this.rows; i++){
- var row = document.createElement("div");
- $(row).attr("id", "row_"+i)
- $(row).addClass("canvas_row")
- for (var j = 0; j< this.cols; j++){
- var cell = document.createElement("span");
- $(cell).addClass("canvas_cell")
- $(cell).attr("painted", "0")
- $(cell).addClass("column_"+j)
- $(cell).html("&nbsp;")
- $(cell).click(function(){
- if (window.active_tool == 'brush'){
- gridcanvas.paint(this);
- }else if(window.active_tool == 'eraser'){
- gridcanvas.erase(this);
- }
- });
- $(cell).mouseover(function(){
- if (isDragging){
- if (window.active_tool == 'brush'){
- gridcanvas.paint(this);
- }else if(window.active_tool == 'eraser'){
- gridcanvas.erase(this);
- }
- }
- });
- $(row).append(cell)
- }
- this.container.append(row)
- }
- }
- this.toggleGrid = function(){
- if ($("#show_grid").prop("checked")){
- $(".canvas_cell").css("border","1px solid silver");
- }else{
- $(".canvas_cell").css("border","none");
- }
- }
- this.serialize = function(){
- var matrix = [];
- for (var i = 0; i < this.rows; i++){
- var row_storage = [];
- $("#row_"+i+"> span").each(function(){
- row_storage.push($(this).attr("painted"));
- });
- matrix.push(row_storage);
- }
- return {
- "matrix" : matrix,
- "width" : this.cols,
- "height" : this.rows,
- }
- }
-}
-$("#cols").change(function(){
- var cols = $(this).val()
- c.initialize(cols, c.rows);
-});
-$("#rows").change(function(){
- var rows = $(this).val()
- c.initialize(c.cols, rows);
-});
-
-$('document').ready(function(){
- $("#create_your_own").click(function(){
- event.preventDefault();
-
- $("#draw_protector").show();
- $("#overlay > .close").html("CANCEL");
- $("#overlay").show();
- $("#draw").show();
- $("#final_image").hide();
- });
- $("#overlay > .close").click(function(){
- $("#draw").hide();
- });
-
- c = new GridCanvas()
- brush_tools = new BrushTools();
- c.initialize($("#cols").val(), $("#rows").val());
- $("#show_grid").change(function(){
- c.toggleGrid();
- });
- $("#drawing_finished").click(function(){
-
- window.custom_pattern = c.serialize();
- preview_controller.from_matrix(window.custom_pattern)
- $('.patterns').attr("current_pattern", "");
- $('#drawing_finished').prop("disabled", false);
- $('#drawing_finished').html("DONE");
- $("#draw_protector").css("background", "none");
- $("#draw").hide();
- $("#overlay").hide();
- console.log(window.custom_pattern)
- });
-
-});
-window.custom_pattern = "";
-
-$('#drawing_finished').click(function(){
-// $("#draw_protector").css("background", "url(img/loading.gif)");
-// $(this).prop("disabled", true);
-// $(this).html("Workin'...");
-// $.ajax({
-// type: "POST",
-// url: NEW_PATTERN_URL,
-// data: { json : JSON.stringify(c.serialize()) },
-// }).done(function( msg ) {
-// $('#drawing_finished').prop("disabled", false);
-// $('#drawing_finished').html("DONE");
-// $("#draw_protector").css("background", "none");
-// var error = msg.match(/ERR/ig);
-// if (error){
-// alert( "There was an error processing your request ");
-// return
-// }
-// $("#draw").hide();
-// $("#overlay").hide();
-// var parts = msg.split("\n")
-// window.custom_pattern = "http://i.asdf.us/patterns/"+parts[0]
-// $('#sample').css("background", "url("+window.custom_pattern+")");
-// })
-
-});
-