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

Thread: Base64 Encoder

  1. #1
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,412
    Vote Rating
    1288
      2  

    Default Base64 Encoder

    I have been using a website to encode my images via Base64 but it was slow and I wanted to create my own, lightweight app to do this.

    http://www.simoens.org/Base64/

    This site uses HTML5 and ExtJS. All you have to do is drag an image into the box and it will add the encoded image under it. You can even drag multiple images and it will just keep adding them. I have found this to be extremely fast.

    Demo video:
    http://www.simoens.org/Base64/demo.mp4

    Also put the source up on GitHub as I like to contribute back to the community. It does have the MIT license.
    https://github.com/mitchellsimoens/Base64-Encoder

    Enjoy
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  2. #2
    Ext JS Premium Member Steffen Hiller's Avatar
    Join Date
    Mar 2008
    Posts
    786
    Vote Rating
    36
      0  

    Default

    Handy, non of the tools i've tried, website or command line tools, have worked great.

    Though, compass has a method as well, that does that automatically.

    Still, your tool is absolutely handy for the non-compass times!

    Nice work!

  3. #3
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,412
    Vote Rating
    1288
      0  

    Default

    I'm a GUI fan

    Need to learn to use compass more tho, get that under my belt.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #4
    Ext JS Premium Member Steffen Hiller's Avatar
    Join Date
    Mar 2008
    Posts
    786
    Vote Rating
    36
      0  

    Default

    Will check your drag & drop code though, working on a ext js 4 project where this would come in handy, i think.

  5. #5
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,412
    Vote Rating
    1288
      0  

    Default

    Quote Originally Posted by Steffen Hiller View Post
    Will check your drag & drop code though, working on a ext js 4 project where this would come in handy, i think.
    Super simple:

    Code:
        afterRender    : function() {
            var me      = this,
                dropbox = me.getEl();
            Base64.App.superclass.afterRender.call(me);
            dropbox.on("dragover", me.dragover, me);
            dropbox.on("drop", me.drop, me);
        },
        dragover       : function(e) {
            e.stopPropagation();
            e.preventDefault();
        },
        drop           : function(e) {
            e.stopEvent();
            var browserEvent = e.browserEvent,
                dataTransfer = browserEvent.dataTransfer,
                files        = dataTransfer.files,
                numFiles     = files.length,
                i            = 0,
                file;
            for (; i < numFiles; i++) {
                file = files[i];
                this.handleFile(file);
            }
        },
    That's all!
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  6. #6
    Ext JS Premium Member Steffen Hiller's Avatar
    Join Date
    Mar 2008
    Posts
    786
    Vote Rating
    36
      0  

    Default

    Ah, thanks!

    Idea if I can fill out a file input field only, without actually uploading yet?

    Was thinking of that you can drop a file anywhere in the app and this opens the uploader ext.window of that app and prefills the input file field.
    It shouldn't upload just yet since the user needs to select some options first. Upload happens after user clicks on upload.
    You know what i mean?

  7. #7
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,412
    Vote Rating
    1288
      0  

    Default

    That would be pretty trivial to do. ExtJS 3 or 4?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  8. #8
    Ext JS Premium Member Steffen Hiller's Avatar
    Join Date
    Mar 2008
    Posts
    786
    Vote Rating
    36
      0  

    Default

    4

    Quote Originally Posted by mitchellsimoens View Post
    That would be pretty trivial to do. ExtJS 3 or 4?

  9. #9
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,412
    Vote Rating
    1288
      0  

    Default

    May be some help:

    http://www.sencha.com/forum/showthre...extjs.FIleDrop

    Thought I'd create a quick plugin. It fires event dragover (probably won't be used much) and drop. Both pass the owner component and event.

    File list in:

    e.browserEvent.dataTransfer.files
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  10. #10
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364
    Vote Rating
    87
      0  

    Default

    link is bad 404 land

Page 1 of 2 12 LastLast

Similar Threads

  1. Ext.util.base64 (encode/decode)
    By wm003 in forum Ext 2.x: User Extensions and Plugins
    Replies: 13
    Last Post: 28 Dec 2012, 5:48 AM
  2. File to Base64 Encoder tool (windows)
    By craigbett in forum Sencha Touch 1.x: Examples and Showcases
    Replies: 2
    Last Post: 3 Feb 2012, 5:10 AM
  3. Image to Base64 Encoder
    By craigbett in forum Sencha Touch 1.x: Discussion
    Replies: 11
    Last Post: 2 Mar 2011, 8:38 AM
  4. How to create base64 string for icon?
    By jeroenvduffelen in forum Sencha Touch 1.x: Discussion
    Replies: 2
    Last Post: 5 Aug 2010, 11:25 AM

Posting Permissions

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