File Browser

New: File Browser to navigate to folders when choosing paths
2026-04-18 21:34:28 -04:00 · 2014-12-15 23:28:55 -08:00
parent a55a77cb5b
commit 85a9b74008
51 changed files with 955 additions and 228 deletions
@@ -0,0 +1,63 @@
+'use strict';
+define(
+    [
+        'jquery',
+        'backbone',
+        'marionette',
+        'bootstrap'
+    ], function ($, Backbone, Marionette) {
+        var region = Marionette.Region.extend({
+            el: '#file-browser-modal-region',
+
+            constructor: function () {
+                Backbone.Marionette.Region.prototype.constructor.apply(this, arguments);
+                this.on('show', this.showModal, this);
+            },
+
+            getEl: function (selector) {
+                var $el = $(selector);
+                $el.on('hidden', this.close);
+                return $el;
+            },
+
+            showModal: function () {
+                this.$el.addClass('modal fade');
+
+                //need tab index so close on escape works
+                //https://github.com/twitter/bootstrap/issues/4663
+                this.$el.attr('tabindex', '-1');
+                this.$el.css('z-index', '1060');
+
+                this.$el.modal({
+                    show     : true,
+                    keyboard : true,
+                    backdrop : true
+                });
+
+                this.$el.on('hide.bs.modal', $.proxy(this._closing, this));
+
+                this.$el.on('shown.bs.modal', function () {
+                    $('.modal-backdrop:last').css('z-index', 1059);
+                });
+
+                this.currentView.$el.addClass('modal-dialog');
+            },
+
+            closeModal: function () {
+                $(this.el).modal('hide');
+                this.reset();
+            },
+
+            _closing: function () {
+
+                if (this.$el) {
+                    this.$el.off('hide.bs.modal');
+                    this.$el.off('shown.bs.modal');
+                }
+
+                this.reset();
+            }
+        });
+
+        return region;
+    });