How to make Navbar in Bootstrap 3?

Question

Bootstrap

Help me please.
Need Navbar, in which:
1. Brand - picture (disappears on mobile phones).
2. Next to Brand - dropmenu (never collapsed - visible at all resolutions).
3. MainMenu - the main menu of 5 items + icons for each item. It is necessary that with Small - only icons remain, and with XS - the icons are folded into a dropmenu.
4. On the right, too, Dropmenu - always visible.
jsfiddle.net/52VtD/4310
Really xs, how to do it ..
Is it possible to do this not with Navbar, but with ordinary blocks?

<div class="row">
    <div class="hidden-xs col-sm-2 col-md-2">
        <a href="#" id="Logo"><img src="/img/120x120.jpg" class="img-responsive"/></a>
    </div>
    <div class="col-xs-6 col-sm-4 col-md-3">
      <ul id="left-drop-menu">...</ul>
    </div>
    <div class="col-xs-4 col-sm-4 col-md-6">
        <button type="button" class="btn btn-success navbar-toggle glyphicon glyphicon-collapse-down" data-toggle="collapse" data-target=".navbar-collapse">

        </button>
        <div class="collapse navbar-collapse">
            <ul id="mainNav">...</ul>
        </div>
    </div>
    <div class="col-xs-2 col-sm-2 col-md-1">
        <ul id="right-drop-menu">...</ul>
    </div>
</div>