Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Nov 2006
    Posts
    48
    Thanks
    3
    Thanked 1 Time in 1 Post

    Instead of printpage is there a printtomemory or copypage

    I have a javascript paint page (borrowed from here http://chat.ma.la/draw.html(for a self learning exercise)).

    I need something similar to the printpage function that will save the page to a dir on my server.

    The ultimate goal is to be able to "paint" something then save it to a dir on my server.

    I know there are several apps out there that do this already but I'm trying to learn how to do it for myself.

  • #2
    New Coder
    Join Date
    Nov 2006
    Posts
    48
    Thanks
    3
    Thanked 1 Time in 1 Post
    Is there a way to redirect the printpage function like "print to file" in windows. If I can get ahold of the page "image" I can manipulate however I need in php, it's the capturing of the image I'm having trouble with.

  • #3
    New Coder
    Join Date
    Nov 2006
    Posts
    48
    Thanks
    3
    Thanked 1 Time in 1 Post
    C'mon now, somebody here knows how to do this.

  • #4
    New Coder
    Join Date
    Nov 2006
    Posts
    48
    Thanks
    3
    Thanked 1 Time in 1 Post
    All I need to do is save the drawn upon image. The funny thing is if I right click on the image and choose "save as" it saves the image unedited. If I do a "function printpage()" it prints the edited version of the image. Is there some kind of printscreen function in js?

  • #5
    Senior Coder
    Join Date
    Sep 2005
    Posts
    1,791
    Thanks
    5
    Thanked 36 Times in 35 Posts
    you'll need to serialise the image in some way so that you can unserialise it, and so recreate the image, elsewhere. SVG is probably a better approach to take, but IE support isn't great. It might be possible to serialise Canvas, but I'm not aware of any method. You could probably do quite a lot yourself just by storing the lines the users draw (their start and end co-ordinates) and send that back to your PHP script.
    My thoughts on some things: http://codemeetsmusic.com
    And my scrapbook of cool things: http://gjones.tumblr.com

  • #6
    New Coder
    Join Date
    Nov 2006
    Posts
    48
    Thanks
    3
    Thanked 1 Time in 1 Post
    I found this script at webmasterworld. It was originally intended to take screen shots of errors. Can this be modded to take a screen shot when a user clicks a button? That level of coding is beyond me.

    Code:
    <!-- 
    window.onerror=handleJsError;  //set callback function, called by javascript when an error occurs 
    var jsErrArray=new Array();   //stores javascript error information, can hold multiple errors 
    var jsFunStack=new Array();   //stores names of functions in play when an error occurs 
    var relpath='';        //relative location from site root, is further initialized by hosting page 
    /* 
      handleJsError: 
      This function is established (above) as the function to be called by javascript whenever 
      a javascript error occurs. The function puts the error information into the jsErrArray, 
      it puts the current function stack into the jsFunStack array, and then it asks the 
      user if they want to send an error report. If they elect to do so, then it calls the 
      sendError function to handle those details. 
    */ 
    function handleJsError(msg, url, lno) 
    { 
      //store the error message, url, and line-number 
      jsErrArray[jsErrArray.length]='Error Desc: '+msg+'\nLine Nr: '+lno+'\nFile: '+url; 
      //capture and store the current function stack 
      jsFunStack[jsFunStack.length]=stacktrace(); 
      //Enable this line for debugging purposes 
      //alert('javascript ERROR DETAILS\nLINE: '+lno+'\nFILE: '+url+'\nMESSAGE: '+msg); 
      //ask the user if they want to send an error report 
      if(confirm('A javascript error has occurred: '+msg+'\n\nClick the \'OK\' button to send an error report to system support.')) 
       sendError(relpath); 
      return true; 
    } 
    /* 
      sendError: 
      This function grabs the html residing between the body and /body tags. Since it gets it 
      from the DOM model, it represents the current state of the page. i.e. It will capture 
      any text that has been typed into text or textarea fields, any selections in list boxes, 
      checkbox state, etc. 
      It then submits the html along with other page particulars to the website. 
    */ 
    function sendError(pathOffset) 
    { 
      var oFrm;  //the form we will create and then use to submit the error information. 
      //get a copy of the current HTML, before we disable the links (limitation: this only gets 
      //what is between the body and /body tags). This copy of the HTML is for the support 
      //person to look at. 
      var bodyTextOriginal=document.body.innerHTML; 
      //disable all links in the HTML. This needs to be done to avoid all kinds of odd-ball 
      //errors that could occur when we later try to display this HTML in our error report page. 
      disableLinks(); 
      //get a copy of the HTML with the links disabled. This copy of the HTML is used to render 
      //a screen shot of the errant page. 
      var bodyTextA=document.body.innerHTML; 
      //Adjust paths on src attributes so that images will display okay in the error report page 
      if(pathOffset!='') 
       var re=new RegExp("src=\""+pathOffset,"gi") 
      else 
       var re=new RegExp("src=\"","gi"); 
      var bodyText=bodyTextA.replace(re,'src="../'); 
      //attempt to get a reference to the frmSendError form. This would normally return null, but 
      //it is possible that it already exists if this is our second pass through this function. 
      oFrm=document.getElementById('frmSendError'); 
      //if we didn't find and instance of the frmSendError form, then create it 
      if(!oFrm) 
       { 
       oFrm = document.createElement('<form name="frmSendError" method="post" action="'+pathOffset+'Help/ErrorReport.asp">'); 
       document.appendChild(oFrm); 
       } 
      //---begin populating the form fields 
      //capture page href 
      var oField = document.createElement("<textarea name='pagehref'>"); 
      oField.value = document.location.href; 
      oFrm.appendChild(oField); 
      //capture page title 
      var oField = document.createElement("<textarea name='pagetitle'>"); 
      oField.value = document.title; 
      oFrm.appendChild(oField); 
      //capture page html (with links deactivated) 
      var oField = document.createElement("<textarea name='pagebodyA'>"); 
      oField.value=bodyText; 
      oFrm.appendChild(oField); 
      //capture page original html 
      var oField = document.createElement("<textarea name='pagebodyB'>"); 
      oField.value=bodyTextOriginal; 
      oFrm.appendChild(oField); 
      //capture javascript errors from the jsErrArray 
      var oField = document.createElement("<textarea name='javascripterrors'>"); 
      if(jsErrArray.length>0) 
       oField.value=jsErrArray.join('\n\n') 
      else 
       oField.value=''; 
      oFrm.appendChild(oField); 
      //capture javascript error function stack(s) from the jsFunStack array 
      var oField = document.createElement("<textarea name='javascriptfunstack'>"); 
      if(jsFunStack.length>0) 
       oField.value=jsFunStack.join('\n\n') 
      else 
       oField.value=''; 
      oFrm.appendChild(oField); 
      //---end populating the form fields 
      //send the form 
      oFrm.submit(); 
      return true; 
    } 
    /* 
      disableLinks: 
      This function will disable all links in the document. 
    */ 
    function disableLinks() 
    { 
      var oLink; 
      if(document.links.length>0) 
      { 
       for(var i=0;i<document.links.length;i++) 
       { 
         document.links[i].href='#'; 
         document.links[i].onclick='alert(\'Links, buttons, and menus are disabled in the screenshot.\');return false;'; 
         document.links[i].target=''; 
       } 
      } 
    } 
    /* 
      funcname: 
      This function returns the name of a given function. It does this by 
      converting the function to a string, then using a regular expression 
      to extract the function name from the resulting code. 
    */ 
    function funcname(f) { 
      var s = f.toString().match(/function (\w*)/)[1]; 
      if(s == 'anonymous') 
      { 
       var l=f.toString().substr(23,60).split(' '); 
       if(l.length>0) 
         return l[1]; 
      } 
      if ((s == null) ¦¦ (s.length == 0)) return "anonymous"; 
      return s; 
    } 
    /* 
      stacktrace: 
      This function returns a string that contains a "stack trace." 
    */ 
    function stacktrace() { 
      var s = "";   // This is the string we'll return. 
      var fName = "";  // The name of a function 
      // Loop through the stack of functions, using the caller property of 
      // one argument's object to refer to the next argument's object on the 
      // stack. 
      for(var a = arguments.caller; a!= null; a = a.caller) { 
        // Add the name of the current function to the return value. (But 
        // don't add the error handler function) 
        fName = funcname(a.callee); 
        if(fName!='handleJsError') 
         s+=fName+"\n"; 
        // Because of a bug in Navigator 4.0, we need this line to break. 
        // a.caller will equal a rather than null when we reach the end  
        // of the stack. The following line works around this. 
        if (a.caller == a) break; 
      } 
      return s; 
    } 
    //-->


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •