baculum: Enable adding multiple file set file browser controls on the same page

diff --git a/gui/baculum/protected/Web/Portlets/DirectiveFileSet.tpl b/gui/baculum/protected/Web/Portlets/DirectiveFileSet.tpl
index da25a10b52fc4ca3fe7406f35a660abb127febb6..a5ff61010a63ccd3a30a920a825a24b312278166 100644 (file)
--- a/gui/baculum/protected/Web/Portlets/DirectiveFileSet.tpl
+++ b/gui/baculum/protected/Web/Portlets/DirectiveFileSet.tpl
@@ -5,7 +5,7 @@
                <div class="w3-card-4 w3-padding w3-margin-bottom directive incexc">
                        <h2><%#$this->SourceTemplateControl->getDirectiveName()%> #<%#$this->ItemIndex + 1%></h2>
                        <button type="button" onmousedown="openElementOnCursor(event, '<%=$this->FileSetFileOptMenu->ClientID%>_new_fileset', 0, 20);" class="w3-button w3-green w3-margin-bottom"><i class="fa fa-plus"></i> &nbsp;<%[ Add ]%></button>
-                       <com:Application.Web.Portlets.NewFileSetFileOptMenu ID="FileSetFileOptMenu" />
+                       <com:Application.Web.Portlets.NewFileSetFileOptMenu ID="FileSetFileOptMenu" FileSetBrowserId="<%=$this->SourceTemplateControl->FSBrowser->ClientID%>" />
                <com:TActiveRepeater
                        ID="RepeaterFileSetOptions"
                        ItemRenderer="Application.Web.Portlets.FileSetOptionRenderer"
@@ -56,26 +56,26 @@
                </div>
        </prop:FooterTemplate>
 </com:TActiveRepeater>
-<div class="w3-modal" id="fileset_browser" style="display: none;">
+<div class="w3-modal" id="<%=$this->FSBrowser->ClientID%>fileset_browser" style="display: none;">
        <div class="w3-modal-content w3-card-4 w3-padding-large w3-animate-zoom" style="width: 85%">
-               <span onclick="document.getElementById('fileset_browser').style.display = 'none'" class="w3-button w3-xlarge w3-hover-red w3-display-topright">×</span>
+               <span onclick="document.getElementById('<%=$this->FSBrowser->ClientID%>fileset_browser').style.display = 'none'" class="w3-button w3-xlarge w3-hover-red w3-display-topright">×</span>
                <h2><%[ Include files to FileSet]%></h2>
                <com:Application.Web.Portlets.FileSetBrowser ID="FSBrowser" />
                <com:TCallback ID="NewIncExcFile" OnCallback="newIncludeExcludeFile" />
                <div class="w3-center">
-                       <button type="button" class="w3-button w3-red" onclick="document.getElementById('fileset_browser').style.display = 'none'"><i class="fa fa-times"></i> &nbsp; <%[ Cancel ]%></button>
-                       <a class="w3-button w3-green button_fixed" onclick="set_include_exclude(); document.getElementById('fileset_browser').style.display = 'none'">
+                       <button type="button" class="w3-button w3-red" onclick="document.getElementById('<%=$this->FSBrowser->ClientID%>fileset_browser').style.display = 'none'"><i class="fa fa-times"></i> &nbsp; <%[ Cancel ]%></button>
+                       <a class="w3-button w3-green button_fixed" onclick="set_include_exclude<%=$this->FSBrowser->ClientID%>(); document.getElementById('<%=$this->FSBrowser->ClientID%>fileset_browser').style.display = 'none'">
                                <i class="fa fa-check"></i> &nbsp;<%[ Apply file selection ]%></a>
                        </a>
                </div>
        </div>
 </div>
 <script type="text/javascript">
-function set_include_exclude() {
+function set_include_exclude<%=$this->FSBrowser->ClientID%>() {
        var request = <%=$this->NewIncExcFile->ActiveControl->Javascript%>;
        var param = {
-               'Include': oFileSetBrowser.get_includes(),
-               'Exclude': oFileSetBrowser.get_excludes()
+               'Include': oFileSetBrowser<%=$this->FSBrowser->ClientID%>.get_includes(),
+               'Exclude': oFileSetBrowser<%=$this->FSBrowser->ClientID%>.get_excludes()
        };
        request.setCallbackParameter(param);
        request.dispatch();

diff --git a/gui/baculum/protected/Web/Portlets/FileSetBrowser.php b/gui/baculum/protected/Web/Portlets/FileSetBrowser.php
index 57a22d7be13f30016cc87b94096a1758769ee54f..d4704f636ee068f14453998b0d4bea42a5defb13 100644 (file)
--- a/gui/baculum/protected/Web/Portlets/FileSetBrowser.php
+++ b/gui/baculum/protected/Web/Portlets/FileSetBrowser.php
@@ -25,7 +25,7 @@ Prado::using('Application.Web.Portlets.Portlets');
 
 class FileSetBrowser extends Portlets {
 
-       const CLIENT_ID = 'ClientId';
+       const BCLIENT_ID = 'BClientId';
        const PATH = 'Path';
 
        /**
@@ -54,7 +54,7 @@ class FileSetBrowser extends Portlets {
        public function selectClient($sender, $param) {
                $client_id = $this->Client->getSelectedValue();
                if ($client_id !== 'none') {
-                       $this->setClientId($client_id);
+                       $this->setBClientId($client_id);
                        $this->goToPath();
                }
        }
@@ -68,7 +68,7 @@ class FileSetBrowser extends Portlets {
        }
 
        public function goToPath() {
-               $client_id = $this->getClientId();
+               $client_id = $this->getBClientId();
                $query = '?path=' . rawurlencode($this->getPath());
                $params = array(
                        'clients',
@@ -78,17 +78,17 @@ class FileSetBrowser extends Portlets {
                );
                $result = $this->getModule('api')->get($params);
                $this->getPage()->getCallbackClient()->callClientFunction(
-                       'FileSetBrowser_set_content',
+                       'FileSetBrowser_set_content' . $this->ClientID,
                        json_encode($result->output)
                );
        }
 
-       public function setClientId($client_id) {
-               $this->setViewState(self::CLIENT_ID, $client_id);
+       public function setBClientId($bclient_id) {
+               $this->setViewState(self::BCLIENT_ID, $bclient_id);
        }
 
-       public function getClientId() {
-               return $this->getViewState(self::CLIENT_ID);
+       public function getBClientId() {
+               return $this->getViewState(self::BCLIENT_ID);
        }
 
        public function setPath($path) {

diff --git a/gui/baculum/protected/Web/Portlets/FileSetBrowser.tpl b/gui/baculum/protected/Web/Portlets/FileSetBrowser.tpl
index 61fe5a42495c28afd4232b1038e8aac661868053..c7ee08a51eef6ba9bdfe271ad77036d6086d05d3 100644 (file)
--- a/gui/baculum/protected/Web/Portlets/FileSetBrowser.tpl
+++ b/gui/baculum/protected/Web/Portlets/FileSetBrowser.tpl
@@ -8,58 +8,58 @@
                                Width="350px"
                                CausesValidation="false"
                                OnSelectedIndexChanged="selectClient"
-                               ClientSide.OnLoading="oFileSetBrowser.show_file_loader(true)"
-                               ClientSide.OnComplete="oFileSetBrowser.show_file_loader(false)"
+                               ClientSide.OnLoading="oFileSetBrowser<%=$this->ClientID%>.show_file_loader(true)"
+                               ClientSide.OnComplete="oFileSetBrowser<%=$this->ClientID%>.show_file_loader(false)"
                                >
                        </com:TActiveDropDownList>
                </div>
        </div>
        <p><%[ To browse Windows host please type in text field below drive letter as path, for example: C:/ ]%></p>
        <div class="w3-section w3-half">
-               <input type="text" id="fileset_browser_path" class="w3-input w3-twothird w3-border" placeholder="<%[ Go to path ]%>" onkeypress="var k = event.which || event.keyCode; if (k == 13) { oFileSetBrowser.ls_items(document.getElementById('fileset_browser_path').value); }" />
-               <button type="button" class="w3-button w3-green" onclick="oFileSetBrowser.ls_items(document.getElementById('fileset_browser_path').value);"><i class="fa fa-check"></i> &nbsp;<%[ OK ]%></button>
-               <span id="fileset_browser_file_loader" style="display: none"><i class="fa fa-sync-alt w3-spin"></i></span>
+               <input type="text" id="<%=$this->ClientID%>fileset_browser_path" class="w3-input w3-twothird w3-border" placeholder="<%[ Go to path ]%>" onkeypress="var k = event.which || event.keyCode; if (k == 13) { oFileSetBrowser<%=$this->ClientID%>.ls_items(document.getElementById('<%=$this->ClientID%>fileset_browser_path').value); }" />
+               <button type="button" class="w3-button w3-green" onclick="oFileSetBrowser<%=$this->ClientID%>.ls_items(document.getElementById('<%=$this->ClientID%>fileset_browser_path').value);"><i class="fa fa-check"></i> &nbsp;<%[ OK ]%></button>
+               <span id="<%=$this->ClientID%>fileset_browser_file_loader" style="display: none"><i class="fa fa-sync-alt w3-spin"></i></span>
        </div>
        <div class="w3-section w3-half">
-               <input type="text" id="fileset_browser_add_include_path" class="w3-input w3-twothird w3-border w3-margin-left" placeholder="<%[ Add new include path ]%>" onkeypress="oFileSetBrowser.add_include_path_by_input(event);" autocomplete="off" />
-               <button type="button" class="w3-button w3-green" onclick="oFileSetBrowser.add_include_path();"><i class="fa fa-plus"></i> &nbsp;<%[ Add ]%></button>
+               <input type="text" id="<%=$this->ClientID%>fileset_browser_add_include_path" class="w3-input w3-twothird w3-border w3-margin-left" placeholder="<%[ Add new include path ]%>" onkeypress="oFileSetBrowser<%=$this->ClientID%>.add_include_path_by_input(event);" autocomplete="off" />
+               <button type="button" class="w3-button w3-green" onclick="oFileSetBrowser<%=$this->ClientID%>.add_include_path();"><i class="fa fa-plus"></i> &nbsp;<%[ Add ]%></button>
        </div>
-       <div id="fileset_browser_file_container" class="w3-container w3-half w3-border"></div>
-       <div id="fileset_browser_include_container" class="w3-container w3-half w3-border"></div>
+       <div id="<%=$this->ClientID%>fileset_browser_file_container" class="w3-container w3-half w3-border fileset_browser_file_container"></div>
+       <div id="<%=$this->ClientID%>fileset_browser_include_container" class="w3-container w3-half w3-border fileset_browser_include_container"></div>
        <div class="w3-section w3-half">
-               <input type="text" id="fileset_browser_add_exclude_path" class="w3-input w3-twothird w3-border w3-margin-left" placeholder="<%[ Add new global exclude path ]%>" onkeypress="oFileSetBrowser.add_exclude_path_by_input(event);" autocomplete="off" />
-               <button type="button" class="w3-button w3-green" onclick="oFileSetBrowser.add_exclude_path();"><i class="fa fa-plus"></i> &nbsp;<%[ Add ]%></button>
+               <input type="text" id="<%=$this->ClientID%>fileset_browser_add_exclude_path" class="w3-input w3-twothird w3-border w3-margin-left" placeholder="<%[ Add new global exclude path ]%>" onkeypress="oFileSetBrowser<%=$this->ClientID%>.add_exclude_path_by_input(event);" autocomplete="off" />
+               <button type="button" class="w3-button w3-green" onclick="oFileSetBrowser<%=$this->ClientID%>.add_exclude_path();"><i class="fa fa-plus"></i> &nbsp;<%[ Add ]%></button>
        </div>
-       <div id="fileset_browser_exclude_container" class="w3-container w3-half w3-border"></div>
+       <div id="<%=$this->ClientID%>fileset_browser_exclude_container" class="w3-container w3-half w3-border fileset_browser_exclude_container"></div>
        <com:TCallback
                ID="FileSetBrowserFiles"
                OnCallback="TemplateControl.getItems"
-               ClientSide.OnLoading="oFileSetBrowser.show_file_loader(true)"
-               ClientSide.OnComplete="oFileSetBrowser.show_file_loader(false)"
+               ClientSide.OnLoading="oFileSetBrowser<%=$this->ClientID%>.show_file_loader(true)"
+               ClientSide.OnComplete="oFileSetBrowser<%=$this->ClientID%>.show_file_loader(false)"
        />
 </div>
 <script type="text/javascript">
-var oFileSetBrowser = {
+var oFileSetBrowser<%=$this->ClientID%> = {
        file_content: null,
        include_content: null,
        path_field: null,
        path: [],
        ids: {
-               file_container: 'fileset_browser_file_container',
-               include_container: 'fileset_browser_include_container',
-               exclude_container: 'fileset_browser_exclude_container',
-               path_field: 'fileset_browser_path',
-               add_include_path_field: 'fileset_browser_add_include_path',
-               add_exclude_path_field: 'fileset_browser_add_exclude_path',
-               file_loader: 'fileset_browser_file_loader'
+               file_container: '<%=$this->ClientID%>fileset_browser_file_container',
+               include_container: '<%=$this->ClientID%>fileset_browser_include_container',
+               exclude_container: '<%=$this->ClientID%>fileset_browser_exclude_container',
+               path_field: '<%=$this->ClientID%>fileset_browser_path',
+               add_include_path_field: '<%=$this->ClientID%>fileset_browser_add_include_path',
+               add_exclude_path_field: '<%=$this->ClientID%>fileset_browser_add_exclude_path',
+               file_loader: '<%=$this->ClientID%>fileset_browser_file_loader'
        },
        css: {
                item: 'item',
-               item_included: 'item_included',
-               item_excluded: 'item_excluded',
-               item_inc_exc_btn: 'item_inc_exc_btn',
+               item_included: 'item_included w3-medium',
+               item_excluded: 'item_excluded w3-medium',
+               item_inc_exc_btn: 'item_inc_exc_btn w3-medium',
                item_selected_del_btn: 'item_selected_del_btn',
-               item_name: 'item_name',
+               item_name: 'item_name w3-medium',
                dir_img: 'dir_item_img',
                file_img: 'file_item_img',
                link_img: 'link_item_img'
@@ -228,7 +228,7 @@ var oFileSetBrowser = {
        },
        get_includes: function() {
                var container = document.getElementById(this.ids.include_container);
-               var inc_elements = container.querySelectorAll('div.' + this.css.item_included);
+               var inc_elements = container.querySelectorAll('div.' + this.css.item_included.replace(/ /g, '.'));
                var includes = [];
                for (var i = 0; i < inc_elements.length; i++) {
                        includes.push(inc_elements[i].getAttribute('rel'));
@@ -237,7 +237,7 @@ var oFileSetBrowser = {
        },
        get_excludes: function() {
                var container = document.getElementById(this.ids.exclude_container);
-               var exc_elements = container.querySelectorAll('div.' + this.css.item_excluded);
+               var exc_elements = container.querySelectorAll('div.' + this.css.item_excluded.replace(/ /g, '.'));
                var excludes = [];
                for (var i = 0; i < exc_elements.length; i++) {
                        excludes.push(exc_elements[i].getAttribute('rel'));
@@ -360,10 +360,10 @@ var oFileSetBrowser = {
        }
 };
 
-function FileSetBrowser_set_content(content) {
-       oFileSetBrowser.set_content(content);
+function FileSetBrowser_set_content<%=$this->ClientID%>(content) {
+       oFileSetBrowser<%=$this->ClientID%>.set_content(content);
 }
 $(function() {
-       oFileSetBrowser.init();
+       oFileSetBrowser<%=$this->ClientID%>.init();
 });
 </script>

diff --git a/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.php b/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.php
index cde0dc4a4f5b0475a9d1d6b772320febd81dccbb..afc1681cd55c9064f2655c420f6e7c3d60837bb3 100644 (file)
--- a/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.php
+++ b/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.php
@@ -25,6 +25,7 @@ Prado::using('Application.Web.Portlets.DirectiveListTemplate');
 class NewFileSetFileOptMenu extends DirectiveListTemplate {
 
        const ITEM_INDEX = 'ItemIndex';
+       const FS_BROWSER_ID = 'FsBrowserId';
 
        public function setItemIndex($index) {
                $this->setViewState(self::ITEM_INDEX, $index);
@@ -33,5 +34,13 @@ class NewFileSetFileOptMenu extends DirectiveListTemplate {
        public function getItemIndex() {
                return $this->getViewState(self::ITEM_INDEX);
        }
+
+       public function setFileSetBrowserId($id) {
+               $this->setViewState(self::FS_BROWSER_ID, $id);
+       }
+
+       public function getFileSetBrowserId() {
+               return $this->getViewState(self::FS_BROWSER_ID);
+       }
 }
 ?>

diff --git a/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.tpl b/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.tpl
index 038cb4567097c24a144eae7a95941d37703b67b5..6a04f18428885b01b2f915a6aceb1eca124e1f40 100644 (file)
--- a/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.tpl
+++ b/gui/baculum/protected/Web/Portlets/NewFileSetFileOptMenu.tpl
@@ -13,7 +13,7 @@
                </li>
                <li><com:TLinkButton
                        ID="IncludeFileItemByBrowser"
-                       Attributes.onclick="$(this).closest('div.config_new_fileset').hide(); oFileSetBrowser.reset(); $('#fileset_browser').show(); return false;"
+                       Attributes.onclick="$(this).closest('div.config_new_fileset').hide(); oFileSetBrowser<%=$this->FileSetBrowserId%>.reset(); $('#<%=$this->FileSetBrowserId%>fileset_browser').show(); return false;"
                        >
                        <i class='fa fa-plus'></i> &nbsp;<%[ Add files by file browser ]%>
                </com:TLinkButton>
@@ -32,7 +32,7 @@
                        ID="PluginsItem"
                        OnCommand="Parent.SourceTemplateControl.newIncludePlugin"
                        CommandParameter="save"
-                       ClientSide.OnComplete="var el1 = $('#<%=$this->PluginsItem->ClientID%>').parents('div').find('div.include_plugin')[<%=$this->Parent->ItemIndex%>]; var el2 = $(el1).find('div'); BaculaConfig.scroll_to_element(el2[el2.length-1], -80); $(el2[el2.length-1]).find('input')[0].focus();"
+                       ClientSide.OnComplete="var el1 = $('#<%=$this->PluginsItem->ClientID%>').parents('div').find('div.incexc')[<%=$this->Parent->ItemIndex%>]; var el2 = $(el1).find('div.directive_field'); BaculaConfig.scroll_to_element(el2[el2.length-1], -80); $(el2[el2.length-1]).find('input')[0].focus();"
                        Attributes.onclick="$(this).closest('div.config_new_fileset').hide();"
                        >
                        <i class='fa fa-plus'></i> &nbsp;<%[ Add plugin ]%>

diff --git a/gui/baculum/themes/Baculum-v2/css/baculum.css b/gui/baculum/themes/Baculum-v2/css/baculum.css
index 7843fcbc79975fd16e5e5daba13fc0548e652d7e..c58f9efd6cada10bf13a298147c7e487298c1eec 100644 (file)
--- a/gui/baculum/themes/Baculum-v2/css/baculum.css
+++ b/gui/baculum/themes/Baculum-v2/css/baculum.css
@@ -135,7 +135,7 @@ div.config_directives {
        text-align: justify;
 }
 
-#fileset_browser_file_container, #fileset_browser_include_container, #fileset_browser_exclude_container {
+.fileset_browser_file_container, .fileset_browser_include_container, .fileset_browser_exclude_container {
        width: 50%;
        overflow-y: auto;
        overflow-x: none;
@@ -144,11 +144,11 @@ div.config_directives {
        height: 384px;
 }
 
-#fileset_browser_include_container {
+.fileset_browser_include_container {
        height: 150px;
 }
 
-#fileset_browser_exclude_container {
+.fileset_browser_exclude_container {
        height: 162px;
 }