1. #1
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,220
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      2  

    Default Base64 Encoder

    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 @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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
    770
    Vote Rating
    28
    Steffen Hiller will become famous soon enough Steffen Hiller will become famous soon enough

      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 - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,220
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    I'm a GUI fan

    Need to learn to use compass more tho, get that under my belt.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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
    770
    Vote Rating
    28
    Steffen Hiller will become famous soon enough Steffen Hiller will become famous soon enough

      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 - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,220
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      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 @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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
    770
    Vote Rating
    28
    Steffen Hiller will become famous soon enough Steffen Hiller will become famous soon enough

      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 - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,220
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    That would be pretty trivial to do. ExtJS 3 or 4?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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
    770
    Vote Rating
    28
    Steffen Hiller will become famous soon enough Steffen Hiller will become famous soon enough

      0  

    Default


    4

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

  9. #9
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,220
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      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 @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,361
    Vote Rating
    81
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    link is bad 404 land

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

Thread Participants: 4