Giter Club home page Giter Club logo

dojo-bootstrap's Introduction

Build Status Sauce Test Status

Dojo-Bootstrap

An implementation of the excellent Bootstrap framework using the Dojo Toolkit. This project replaces the Bootstrap JavaScript components with AMD-compatible Dojo modules. Tested with Dojo 1.9.3 and Bootstrap 3.1.1.

Quick Start

  • git clone git://github.com/xsokev/Dojo-Bootstrap.git
  • Add the dojo sdk to vendor/dojo by running bower install.
  • Point your browser to http://host/path/to/Dojo-bootstrap/tests/index.html

Integration

See examples in test/test_*.html

In Brief

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>Dojo-Bootstrap</title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <link rel="stylesheet" href="path/to/bootstrap/styles.css">
        </head>
    
        <body>
            <button type="button" id="loading-button" class="btn btn-primary" data-loading-text="Loading...">Load</button>
        
            <script>
                var dojoConfig = {
                    async: 1,
                    packages: [
                        { name: "bootstrap", location: "path/to/Dojo-Bootstrap" }
                    ]
                };
            </script>
        
            <script type="text/javascript" src="path/to/dojo/dojo/dojo.js"></script>
    
            <script>
                require(["bootstrap/Button", "dojo/query"], function (Button, query) {
                    query("#loading-button").on("click", function(e){
                        query(e.target).button('loading');
                        setTimeout(function(){
                            query(e.target).button('reset');
                        }, 2000);
                    });
                });
            </script>
        </body>
    </html>

Tests

See the Tests wiki page for info on running and writing Dojo Bootstrap tests.

Useful resources

License

Dojo Bootstrap is licensed under the Apache License 2.0

dojo-bootstrap's People

Contributors

cvrebert avatar diminglei avatar gavrilyak avatar hamishcampbell avatar kozikowskik avatar shurakai avatar sirprize avatar stdavis avatar superdweebie avatar tbaud0n avatar tomwayson avatar xsokev avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

dojo-bootstrap's Issues

Tooltips stop showing after first hover in IE8

When hovering over a tooltip for the first time it shows. Each consecutive time, an error message is generated which states, "lastChild" is null or not an object - dojo.js - Line: 15, Char: 93496

_Dropdown not defined

When implementing a drop down menu the following Javascript error keeps coming up.

Uncaught ReferenceError: _Dropdown is not defined

Typeahead dropdown inside a relative container

A recent change to add the typeahead dropdown after the input produces a bug if the input is inside a container that has position: relative. eg

<div style="position: relative;">
<input type="text" data-provide="typeahead">
</div>

I'm not sure the reasoning for moving the dropdown after the input (possibly semantic?), but is it possible we switch back to appending it to the end of the body? That way it isn't under the same influence of relative containers and we don't need "hacks" so that dojo compensates it's positioning.

Tag new version?

Would you mind if we tagged a new version on master? v1.0 is quite old now.

fix footer

the footer of http://dojobootstrap.com/ makes it look like the original bootstrap authors wrote this library.

even the issues link points to their repo and not this project's one.

could you update that footer to point out that dojo-bootstrap is not a twitter project and is maintained by you?

Alerts

I think the postCreate in Alert.js should read:

if(!support.falsey(this.timeout) && typeof parseInt(this.timeout, 10) === "number"){

I think it's missing a !, since it will close if timeout is false.

"live" events for Datepicker

Hi,

im using dynamic adding for inputs, so will be nice can using "live" events for Datepicker - because now works only with first rendered dom content..

you now what i mean ?

example in pseudocode
not
on('element', 'click', function(){});
but
on(document, 'element:click', function(){});

Use "this", not event.target in event listerners with delegation

dojo/on supplies element that matched selector as "this". e.target remains the original target. So e.target will not with inner elements of matched selector.

Twitter bootstrap uses $(this) correctly in such cases.

Fiddle to demonstrate possible issue:

http://jsfiddle.net/tVxeN/

When clicking on "inner" e.target will be "inner" and not "outer" as wanted by selector.
"this" will work correctly in both cases.

Dojo build elimates important line in Collapse.js

Line 88 in reset of Collapse:

this.domNode.offsetWidth;

is removed with the closure compiler during a dojo build. Assigning it to something would fix that like
this._uselessvalue = this.domNode.offsetWidth;

Without the line the collapse will flickr on chrome and only work once on firefox or IE

Shouldn't include dojo submodules

In my fork I've removed the dojo vendor submodules, because it makes it really difficult to incorporate Dojo-Bootstrap into an existing dojo project.

Usually you'd have a project structure like:

  • js
    • dojo
    • dojox
    • util
    • dojo-bootstrap

I know it might make the quick-start a little less convenient, but for actual project work the dojo submodules get in the way. Many dojo-bootstrap users are likely to already have a dojo checkout and can symlink it to an appropriate location, or better yet, use a CDN distribution for test & quick-start instead of a submodule.

Let me know if this is acceptable, and I'll create a pull request.

Dropdown stays after click/enter

Dropdowns don't dismiss properly when a choice is selected.

I noticed a comment in the code acknowledging this, but I thought an issue might help it from falling through the cracks.

See: https://github.com/xsokev/Dojo-Bootstrap/blob/master/Dropdown.js#L128

Great library, by the way. I started a similar project a while ago and did only enough for the site I was working on. I switched my config to use this one without having to change a single line of client code! I think that is a great endorsement of AMD generally and this library specifically.

Replacement of jquery for bootstrap?

I'd like to use dojobootstrap instead of jquery for handling bootstrap UI, but I can't get it working. Having in haml :

.nav-collapse.collapse # - tag with menu

and

%a.dropdown-toggle{"data-toggle" => "dropdown", :href => "#"}

Then on the bottom :

   :javascript
    var dojoConfig = {
      async: true,
      packages: [
          { name: "bootstrap", location: "/javascripts/vendor/dojo-bootstrap-1.2" }
      ]
    }

  = javascript_include_tag "//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojo/dojo.js"
  = javascript_include_tag "site"

Then in site.coffee file
require ["dojo", "bootstrap/Collapse", "dojo/parser", "dojo/domReady!"],
(dojo, Collapse) ->
console.log Collapse # getiing correct class here, but UI doesn't work

PopOver trigger non responsize when used in Modal widget.

When a PopOver is used in a Modal widget with a 'click' trigger, it doesn't display on first click again after the Modal dialog is closed and opened again without first closing the PopOver.

See tests/test_Modal.html.

May be a problem with the implementation since the remote is loaded on each button click and the PopOver is set only once.

Navbar support?

Is there support for the Navbar? Usually it's just CSS but the menu icon that appears when you reduce the width of the screen doesn't pull down the menu items.

Unknown runtime error in Datepicker.js in IE8

When viewing a page with the Datepicker module in IE, an exception is thrown upon load.
"Unknown runtime error" line 291, Char 13
The following line of code doesn't appear to work well in IE:
query('.datepicker-days tbody', this.picker)[0].innerHTML = html.join('');

widgets ignore parseOnLoad directive completly

Instead of using parser to attach themselves to dom node, it appears that widget modules initialize onDomReady instead trying to sniff out where they should place themselves.

This is not the dojo way of doing things and it prevents doing something like.

Carousel(config, 'foo_node') to create carousel dynamicly.

Everything appears to extend NodeList and mimics jquery behavior instead.

While this project is great and i started using it in errormator.com - long term this approach will get everyone into trouble i fear.

Remove src directory

Would it be possible to remove the src directory so all the relevant scripts are in the root? Then place any build scripts, etc in a build directory that is ignored in the build profile. It would make it nice and easy to clone dojo-bootstrap directly into my dojo src directory, rather than having to clone, then copy or symlink the src. Keeps it all in once nice structure for easy module loading.

Tab and Modal not working

Hello,
I downloaded 1.2 version from the site. It does not work. No clue.
The latest code cloned from Git also does not work, with Dojo 1.9.
The examples on the site work. I made a copy of Tab.js and Modal.js from your examples site. Then, my code works perfectly. I believe there is some mismatch with the working copy you have in the site and what is hosted in Git and the tar-ball you have for download.
Can you look into this. I was going to use this seriously, and may have to drop the idea and stick to pure Dojo. I hate to loose the simplicity of bootstrap.

Alerts do not close in IE8

When trying to close an alert in IE, an error message is generated which states,

    "'support.trans.end' is null or not an object"
    Alert.js
    Line: 65, Char: 13

bootstrap widgets are not dojo dijits

Hi,

It appears that no dojo infrastructure for widget control is used in this project at all.
There is no programmatic way of declaring things present.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.