Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: invoking "file selection box"

  1. #1
    Join Date
    Aug 2006
    Posts
    239
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default invoking "file selection box"

    Hi again,

    I now have this dilemma: I want to implement user-selectable background on my site, however I'm not willing to have the background files being uploaded, rather I want local filenames to be used (like file:///c:/blah/mynicepic.jpg), plain easy to implement "site-wise" (cookie magic), but there's a catch:
    I'd like to use UAs "file selection box" (like with uploading) to appear. Do you know any way to invoke that?

  2. #2
    Join Date
    Aug 2006
    Posts
    239
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    well, the temporary- and probably permanent solution is checking if the <input type="file"> element has value, and grab it.

  3. #3
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    That's really not going to work. Most browsers won't allow you to do this for security reasons.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  4. #4
    Join Date
    Aug 2006
    Posts
    239
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Yup, just tested, grabbing values works, but FF disallows using anything with file://

    Anyway:
    here's a test of the "control panel", http://rambo.id.uw.edu.pl/test.html
    I have now a different task bothering me, populating the selection box with names and values of options taken from the array on top:
    Code:
    backgrounds = new Array();
    backgrounds['Solid'] = new Array("solid", bgvalue);
    backgrounds['Scatter'] = new Array("image", "/pictures/back.png");
    [...]
    The name is backgrounds[x], values are just position in main backgrounds[] array;
    The question is the code which would fill in the options in selection box. Of course I can do it manually, but that would be pain if I would want to add or remove stuff...
    Last edited by ItsMeOnly; 09-16-2006 at 01:35 PM.

  5. #5
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    You haven't declared "backgrounds." Also, the ["solid", bgvalue] syntax is marginally better than new Array() for some obscure reason I can't currently remember.
    Code:
    window.onload = function() {
      var select = document.getElementById("backgroundSelect");
      for(var i in backgrounds)
        select.options.add(new Option(backgrounds[i][0], backgrounds[i][1]), select.options.length);
    };
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  6. #6
    Join Date
    Aug 2006
    Posts
    239
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Implemented, now the another thing: need to split "HTML color" into rgb:

    I know that I can do parseInt(value, 16), but haven't done any splitting yet, so is
    Code:
    function fromHEXtoRGB(value) {
      r = parseInt(value.substr(1, 3), 16);
      g = parseInt(value.substr(3, 5), 16);
      b = parseInt(value.substr(5), 16);
      return r, g, b;
    }
    is ok?

    How with oposite, ho to convert decimal to hex?

  7. #7
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
      return r, g, b;
    You can only return one value. Use an object. In fact, the whole thing can be made into an object:
    Code:
    String.prototype.splitEvery = function(n) {
      var s = this,
        p = [];
    
      while(s.length < 0) {
        p.push(s.substr(0, n));
        s = s.substr(n);
      }
    
      return p;
    };
    
    String.prototype.padFront = function(n, c) {
      var d = c || "0",
        s = this;
    
      while(s.length < n)
        s = d + s;
    
      return s;
    };
    
    function Colour(r, g, b) {
      this.red = r;
      this.green = g;
      this.blue = b;
    }
    
    Colour.fromThreeDigitHex = function(str) {
      var rgb = str.substr(1).splitEvery(1);
    
      for(var i = 0; i < rgb.length; ++i)
        rgb[i] = parseInt(rgb[i] + rgb[i], 16);
    
      return new Colour(rgb[0], rgb[1], rgb[2]);
    };
    
    Colour.prototype.toThreeDigitHex = function() {
      return "#" + this.red.toString(16).padFront(2).charAt(0)
        + this.green.toString(16).padFront(2).charAt(0)
        + this.blue.toString(16).padFront(2).charAt(0);
    };
    
    Colour.fromSixDigitHex = function(str) {
      var rgb = str.substr(1).splitEvery(2);
    
      for(var i = 0; i < rgb.length; ++i)
        rgb[i] = parseInt(rgb[i], 16);
    
      return new Colour(rgb[0], rgb[1], rgb[2]);
    };
    
    Colour.prototype.toSixDigitHex = function() {
      return "#" + this.red.toString(16).padFront(2)
        + this.green.toString(16).padFront(2)
        + this.blue.toString(16).padFront(2);
    };
    
    Colour.fromCSSRGB = function(str) {
      var rgb = str.substr(4).substr(0, rgb.length - 1).replace(/ /g, "").split(",");
    
      for(var i = 0; i < rgb.length; ++i)
        rgb[i] = parseInt(rgb[i], 10);
    
      return new Colour(rgb[0], rgb[1], rgb[2]);
    };
    
    Colour.prototype.toCSSRGB = function() {
      return "rgb(" + [this.red, this.green, this.blue].join(", ") + ")";
    };
    
    Colour.fromString = function(str) {
      if(str.charAt(0) === "#" && str.length === 4)
        return Colour.fromThreeDigitHex(str);
      else if(str.charAt(0) === "#" && str.length === 7)
        return Colour.fromSixDigitHex(str);
      else if(str.indexOf("rgb(") === 0)
        return Colour.fromCSSRGB(str);
      else throw new Error("Bad colour passed to Colour.fromString()");
    };
    Last edited by Twey; 11-22-2007 at 05:16 AM. Reason: Minor code cleanup.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  8. #8
    Join Date
    Aug 2006
    Posts
    239
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    *plunk* that was my jaw dropping...

    while I'll deliberate more if I need to implement that (well, maybe later, when I implement color schemes), here's another obstacle I encountered:
    document.body.style.backgroundColor is... null?

    Found it: document.body.bgColor ... pheeeewww....
    Last edited by ItsMeOnly; 09-16-2006 at 04:18 PM.

  9. #9
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    It's empty, not null. It probably hasn't been set.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  10. #10
    Join Date
    Aug 2006
    Posts
    239
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    anyway, check out the result
    now just client- and server-side cookie handling, and I'm set

Bookmarks

Posting Permissions

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