@Boo wrote:
I want to hide or disable 4 inspect tabs out of 6 tabs in the group of Inspector Body.
My 6 Inspect tab of html file was mentioned in below html code:
<div class="inspectors-view"> <script id="metamorph-86-start" type="text/x-placeholder"></script> <div class="inspector-chooser"> <script id="metamorph-92-start" type="text/x-placeholder"></script><script id="metamorph-223-start" type="text/x-placeholder"></script> <rs-icon id="ember5714" class="ember-view icon clickable-icon active" title="Preview & Information" style="width: 1em; height: 1em; font-size: 24px"><icon glyph="preview" class="preview" style="font-size: 24px;"></icon></rs-icon> <script id="metamorph-223-end" type="text/x-placeholder"></script><script id="metamorph-224-start" type="text/x-placeholder"></script> <rs-icon id="ember5717" class="ember-view icon clickable-icon" style="width: 1em; height: 1em; font-size: 24px"><icon glyph="metadata_global" class="metadata_global" style="font-size: 24px;"></icon></rs-icon> <script id="metamorph-224-end" type="text/x-placeholder"></script><script id="metamorph-225-start" type="text/x-placeholder"></script> <rs-icon id="ember5720" class="ember-view icon clickable-icon" style="width: 1em; height: 1em; font-size: 24px"><icon glyph="metadata_contextual" class="metadata_contextual" style="font-size: 24px;"></icon></rs-icon> <script id="metamorph-225-end" type="text/x-placeholder"></script><script id="metamorph-226-start" type="text/x-placeholder"></script> <rs-icon id="ember5723" class="ember-view icon clickable-icon" title="Aliases" style="width: 1em; height: 1em; font-size: 24px"><icon glyph="alias" class="alias" style="font-size: 24px;"></icon></rs-icon> <script id="metamorph-226-end" type="text/x-placeholder"></script><script id="metamorph-227-start" type="text/x-placeholder"></script> <rs-icon id="ember5726" class="ember-view icon clickable-icon" title="Added to..." style="width: 1em; height: 1em; font-size: 24px"><icon glyph="references" class="references" style="font-size: 24px;"></icon></rs-icon> <script id="metamorph-227-end" type="text/x-placeholder"></script><script id="metamorph-228-start" type="text/x-placeholder"></script> <rs-icon id="ember5729" class="ember-view icon clickable-icon" title="Permissions" style="width: 1em; height: 1em; font-size: 24px"><icon glyph="permissions" class="permissions" style="font-size: 24px;"></icon></rs-icon> <script id="metamorph-228-end" type="text/x-placeholder"></script><script id="metamorph-92-end" type="text/x-placeholder"></script> </div> <script id="metamorph-86-end" type="text/x-placeholder"></script> <div class="inspector-view"> <script id="metamorph-93-start" type="text/x-placeholder"></script><script id="metamorph-93-end" type="text/x-placeholder"></script> <script id="metamorph-94-start" type="text/x-placeholder"></script> <script id="metamorph-95-start" type="text/x-placeholder"></script><div id="ember4758" class="ember-view inspector-body preview-and-information-view"><summary-info> <ui-summary-section tabindex="0"> <ui-presentation> <h2 id="ember4767" class="ember-view inspect-heading message"><script id="metamorph-96-start" type="text/x-placeholder"></script>Content Details<script id="metamorph-96-end" type="text/x-placeholder"></script></h2> </ui-presentation> <ui-content> <table id="ember4804" class="ember-view details-list"><tbody> <script id="metamorph-100-start" type="text/x-placeholder"></script><script id="metamorph-97-start" type="text/x-placeholder"></script> <tr> <script id="metamorph-102-start" type="text/x-placeholder"></script><script id="metamorph-101-start" type="text/x-placeholder"></script> <td core-role="icon"><rs-icon id="ember4864" class="ember-view icon id" title="ID" style=""><icon glyph="type_dita_topic" class="type_dita_topic" set="types"></icon></rs-icon></td> <td core-role="label" class="id" data-bindattr-4="4"><script id="metamorph-103-start" type="text/x-placeholder"></script>ID<script id="metamorph-103-end" type="text/x-placeholder"></script> </td><td core-role="value" class="id" colspan="4" data-bindattr-5="5"> <script id="metamorph-104-start" type="text/x-placeholder"></script> <script id="metamorph-105-start" type="text/x-placeholder"></script>1008 -> 1006<script id="metamorph-105-end" type="text/x-placeholder"></script> <script id="metamorph-104-end" type="text/x-placeholder"></script> </td> <script id="metamorph-101-end" type="text/x-placeholder"></script><script id="metamorph-102-end" type="text/x-placeholder"></script> </tr> <script id="metamorph-97-end" type="text/x-placeholder"></script><script id="metamorph-98-start" type="text/x-placeholder"></script> <tr> <script id="metamorph-108-start" type="text/x-placeholder"></script><script id="metamorph-106-start" type="text/x-placeholder"></script> <td core-role="icon"><rs-icon id="ember4883" class="ember-view icon dtCreated" title="Created" style=""><icon glyph="version" class="version"></icon></rs-icon></td> <td core-role="label" class="dtCreated" data-bindattr-6="6"><script id="metamorph-109-start" type="text/x-placeholder"></script>Created<script id="metamorph-109-end" type="text/x-placeholder"></script> </td><td core-role="value" class="dtCreated" data-bindattr-7="7"> <script id="metamorph-110-start" type="text/x-placeholder"></script> <script id="metamorph-111-start" type="text/x-placeholder"></script>2018-Mar-9 15:22<script id="metamorph-111-end" type="text/x-placeholder"></script> <script id="metamorph-110-end" type="text/x-placeholder"></script> </td> <script id="metamorph-106-end" type="text/x-placeholder"></script><script id="metamorph-107-start" type="text/x-placeholder"></script> <td core-role="icon"><rs-icon id="ember4889" class="ember-view icon creator" title="Created by" style=""><icon glyph="user" class="user"></icon></rs-icon></td> <td core-role="label" class="creator" data-bindattr-8="8"><script id="metamorph-112-start" type="text/x-placeholder"></script>Created by<script id="metamorph-112-end" type="text/x-placeholder"></script> </td><td core-role="value" class="creator" data-bindattr-9="9"> <script id="metamorph-113-start" type="text/x-placeholder"></script> <script id="metamorph-114-start" type="text/x-placeholder"></script>system<script id="metamorph-114-end" type="text/x-placeholder"></script> <script id="metamorph-113-end" type="text/x-placeholder"></script> </td> <script id="metamorph-107-end" type="text/x-placeholder"></script><script id="metamorph-108-end" type="text/x-placeholder"></script> </tr> <script id="metamorph-98-end" type="text/x-placeholder"></script><script id="metamorph-99-start" type="text/x-placeholder"></script> <tr> <script id="metamorph-117-start" type="text/x-placeholder"></script><script id="metamorph-115-start" type="text/x-placeholder"></script> <td core-role="icon"><rs-icon id="ember4908" class="ember-view icon dtModified" title="Modified" style=""><icon glyph="versions" class="versions"></icon></rs-icon></td> <td core-role="label" class="dtModified" data-bindattr-10="10"><script id="metamorph-118-start" type="text/x-placeholder"></script>Modified<script id="metamorph-118-end" type="text/x-placeholder"></script> </td><td core-role="value" class="dtModified" data-bindattr-11="11"> <script id="metamorph-119-start" type="text/x-placeholder"></script> <script id="metamorph-120-start" type="text/x-placeholder"></script>2018-Apr-13 18:07<script id="metamorph-120-end" type="text/x-placeholder"></script> <script id="metamorph-119-end" type="text/x-placeholder"></script> </td> <script id="metamorph-115-end" type="text/x-placeholder"></script><script id="metamorph-116-start" type="text/x-placeholder"></script> <td core-role="icon"><rs-icon id="ember4914" class="ember-view icon userId" title="Modified by" style=""><icon glyph="user" class="user"></icon></rs-icon></td> <td core-role="label" class="userId" data-bindattr-12="12"><script id="metamorph-121-start" type="text/x-placeholder"></script>Modified by<script id="metamorph-121-end" type="text/x-placeholder"></script> </td><td core-role="value" class="userId" data-bindattr-13="13"> <script id="metamorph-122-start" type="text/x-placeholder"></script> <script id="metamorph-123-start" type="text/x-placeholder"></script>admin<script id="metamorph-123-end" type="text/x-placeholder"></script> <script id="metamorph-122-end" type="text/x-placeholder"></script> </td> <script id="metamorph-116-end" type="text/x-placeholder"></script><script id="metamorph-117-end" type="text/x-placeholder"></script> </tr> <script id="metamorph-99-end" type="text/x-placeholder"></script><script id="metamorph-100-end" type="text/x-placeholder"></script> </tbody></table> </ui-content> </ui-summary-section> <script id="metamorph-124-start" type="text/x-placeholder"></script><script id="metamorph-124-end" type="text/x-placeholder"></script> <script id="metamorph-125-start" type="text/x-placeholder"></script><script id="metamorph-125-end" type="text/x-placeholder"></script> <script id="metamorph-126-start" type="text/x-placeholder"></script><script id="metamorph-126-end" type="text/x-placeholder"></script> <script id="metamorph-127-start" type="text/x-placeholder"></script> <ui-summary-section tabindex="0"> <ui-presentation> <h2 id="ember5744" class="ember-view inspect-heading message"><script id="metamorph-230-start" type="text/x-placeholder"></script>History<script id="metamorph-230-end" type="text/x-placeholder"></script></h2> </ui-presentation> <ui-content> <table id="ember5751" class="ember-view details-list"><tbody> <script id="metamorph-232-start" type="text/x-placeholder"></script><script id="metamorph-231-start" type="text/x-placeholder"></script> <tr> <script id="metamorph-234-start" type="text/x-placeholder"></script><script id="metamorph-233-start" type="text/x-placeholder"></script> <td core-role="icon"><rs-icon id="ember5775" class="ember-view icon" title="2018-Mar-9 by system 1.0" style=""></rs-icon></td> <td core-role="label" class="" data-bindattr-15="15"><script id="metamorph-235-start" type="text/x-placeholder"></script>2018-Mar-9 by system 1.0<script id="metamorph-235-end" type="text/x-placeholder"></script> </td><td core-role="value" class="" data-bindattr-16="16"> <script id="metamorph-236-start" type="text/x-placeholder"></script> <script id="metamorph-237-start" type="text/x-placeholder"></script>original<script id="metamorph-237-end" type="text/x-placeholder"></script> <script id="metamorph-236-end" type="text/x-placeholder"></script> </td> <script id="metamorph-233-end" type="text/x-placeholder"></script><script id="metamorph-234-end" type="text/x-placeholder"></script> </tr> <script id="metamorph-231-end" type="text/x-placeholder"></script><script id="metamorph-232-end" type="text/x-placeholder"></script> </tbody></table> </ui-content> </ui-summary-section> <script id="metamorph-127-end" type="text/x-placeholder"></script> </summary-info> <content-preview> <ui-presentation> <h2 id="ember4936" class="ember-view inspect-heading message"><script id="metamorph-128-start" type="text/x-placeholder"></script>Preview<script id="metamorph-128-end" type="text/x-placeholder"></script></h2> </ui-presentation> </content-preview> </div><script id="metamorph-95-end" type="text/x-placeholder"></script> <script id="metamorph-94-end" type="text/x-placeholder"></script> <script id="metamorph-129-start" type="text/x-placeholder"></script><script id="metamorph-129-end" type="text/x-placeholder"></script> </div> </div>
There is having Inspect tab names called preview, metadata_global, metadata_contextual, alias, references and permissions, which was mentioned in html.
Inspect.hbr file having the inspector-chooser class:
{{#if content}} {{dynamic-view titleView model=content classNames="inspect-title"}} <div class="inspectors-view"> {{#if showChoosers}} <div class="inspector-chooser"> {{#each inspector in permittedInspectors}} {{view Inspect.Choice inspector=inspector}} {{/each}} </div> {{/if}} <div class="inspector-view"> {{#if selectedInspector.titleView}} {{dynamic-view selectedInspector.titleView model=content inspector=selectedInspector classNames="inspector-title"}} {{/if}} {{#if selectedInspector.bodyView}} {{dynamic-view selectedInspector.bodyView model=content inspector=selectedInspector classNames="inspector-body"}} {{/if}} {{#if selectedInspector.actionsView}} {{dynamic-view selectedInspector.actionsView model=content inspector=selectedInspector classNames="inspector-actions"}} {{/if}} </div> </div> {{/if}}
In that I have found the permittedInspectors object class file in ember, it used in the file name called Inspect.js.
Ember.View.extend() .named("Inspect") .reopen({ controller: function () { return Inspect.controller; }.property(), templateName: core.url('scripts/Inspect.hbr'), classNames: 'inspect-view', classNameBindings: [ 'inspectorClassName', 'controller.selectedInspector.working' ], inspectorClassName: function () { var name = this.get('controller.selectedInspector.name'); var type = this.get('controller.titleView.type'); var classes = []; if (name) { classes.push(name.dasherize() + '-inspect'); } if (type) { classes.push(type.dasherize() + '-inspect'); } return classes.join(' '); }.property('controller.selectedInspector.name', 'controller.titleView.type') }); Inspect.reopenClass({ Inspector: Ember.Object.extend() .reopen({ name: null, icon: null, label: null, titleView: null, bodyView: null, actionsView: null, isValid: false }), Heading: core.view.Message.extend() .component('inspect-heading', ['key']) .reopen({ classNames: [ 'inspect-heading' ], tagName: 'h2' }) }); Inspect.Inspector.create().named("Inspect.transitionalInspector"); Inspect.reopenClass({ TitleView: Ember.View.extend({ title: null }).reopenClass({ type: null, isValidFor: function (model, user) { return true; } }) }); Inspect.reopenClass({ UnhandledInspector: Inspect.Inspector.create({ icon: 'act_help', title: "Unknown", bodyView: Ember.View.extend({ template: Ember.Handlebars.compile("No inspector for object {{view.model}}") }) }) }); Inspect.reopenClass({ GenericTitleView: Inspect.TitleView.extend({ template: Ember.Handlebars.compile("{{view.title}}"), title: function () { return this.get('model.displayName') || this.get('model.label') || this.get('model.name'); }.property('model', 'model.loadState') }).reopenClass({ type: "Generic" }) }); Inspect.reopenClass({ Choice: core.view.Icon.extend({ size: 24, modelBinding: 'inspector.icon', titleBinding: 'inspector.tooltip', classNameBindings: [ 'active' ], active: function () { return this.get('controller.selectedInspector') === this.get('inspector'); }.property('controller.selectedInspector', 'inspector'), click: function () { this.set('controller.selectedInspector', Inspect.transitionalInspector); Ember.run.later(this, function () { this.set('controller.selectedInspector', this.get('inspector')); }, 50); } }) }); Ember.Object.extend(Ember.Observable, Ember.ActionHandler) .named('Inspect.Controller') .reopen({ parentController: core.controller, _actions: { contentItemActionMenu: function (highlight, anchor, context) { var pct = this.get('parentController'); context.scope = context.scope || 'inspect'; return pct.send('contentItemActionMenu', highlight, anchor, context); } }, content: null, inspectors: null, titleViews: null, selectedInspector: null, setup: function () { this.set('inspectors', []); this.set('titleViews', []); this.assignModel(); this.permittedInspectorsChanged(); }.on('init'), assignModel: function () { var model = this.get('content'); var user = this.get('user'); var changeInspectors = false; this.get('inspectors').forEach(function (inspector) { if (inspector.get('model') !== model) { inspector.set('model', model); } if (inspector.get('user') !== user) { inspector.set('user', user); } }); }.observes('content', 'user', 'inspectors.@each.name'), permittedInspectors: function () { var inspectors = (this.get('inspectors') || []).filter(function (inspector) { return inspector.get('isValid'); }); if (!inspectors.length) { return [ Inspect.UnhandledInspector ]; } console.log(Inspect); return inspectors; }.property('content', 'inspectors.@each.isValid', 'inspectors.length'), showChoosers: function () { return this.get('permittedInspectors.length') > 1; }.property('permittedInspectors.length'), permittedInspectorsChanged: function () { var inspector = this.get('selectedInspector'); if (this.get('permittedInspectors').indexOf(inspector) === -1) { this.set('selectedInspector', Inspect.transitionalInspector); this.set('selectedInspector', this.get('permittedInspectors.0')); } }.observes('permittedInspectors'), selectedInspectorChanged: function () { var selected = this.get('selectedInspector'); this.get('inspectors').forEach(function (inspector) { inspector.set('selected', inspector === selected); }); selected.notifyPropertyChange('model'); selected.notifyPropertyChange('user'); // Enforce update of body view, even if two inspectors share it. this.notifyPropertyChange('selectedInspector.bodyView'); }.observes('selectedInspector'), userBinding: 'core.model.session.user', titleView: function () { var model = this.get('content'); var user = this.get('user'); return this.get('titleViews').find(function (titleView) { if (!titleView.isValidFor) { console.warn("titleView does not have `isValidFor(model, user)` implemented as a static method."); return false; } return titleView.isValidFor(model, user); }) || Inspect.GenericTitleView; }.property('titleViews', 'content'), detailsFullBinding: 'parentController.detailsFull', disclosePreviewAndInformation: true, disclosePermissions: false, discloseMetadata: false, discloseAliases: false, discloseVersionHistory: false, discloseReferences: false, discloseClones: false, discloseVariants: false, stateChanged: Ember.observer( function () { var items = Inspect.controller.stateChanged.__ember_observes__, state = {}, ctl = this; items.forEach(function (key) { state[key] = ctl.get(key); }); core.storage.set("core-controller-inspectState", state); }, 'disclosePreviewAndInformation', 'disclosePermissions', 'discloseMetadata', 'discloseAliases', 'discloseVersionHistory', 'discloseReferences', 'discloseClones', 'discloseVariants' ), actions: { } }) .create() .named('Inspect.controller') .setProperties(core.storage.get("core-controller-inspectState") || {}); Inspect.reopenClass({ registerTitleView: function (titleView) { if (!Ember.View.detect(titleView)) { if (titleView.get || titleView.extend) { throw new Error("You must pass a subclass of Ember.View or a POJsO to Inspect.registerTitleView."); } titleView = Ember.View.extend(titleView); } Inspect.controller.get('titleViews').pushObject(titleView); } }); Inspect.reopenClass({ registerInspector: function (inspector) { if (Inspect.Inspector.detect(inspector)) { inspector = inspector.create(); } if (!Inspect.Inspector.detectInstance(inspector)) { if (inspector.get || inspector.extend) { throw new Error("You must pass an instance of Inspect.Inspector or a POJsO to Inspect.registerInspector."); } inspector = Inspect.Inspector.extend(inspector).create(); } Inspect.controller.get('inspectors').pushObject(inspector); Inspect.controller.assignModel(); } }); Inspect.EditableModelFooter = Ember.ContainerView.extend({ isVisible: function () { var enabled = this.get('inspector.canModify') !== false; var addEnabled = this.get('inspector.addItem') instanceof Function; var saveEnabled = this.get('inspector.save') instanceof Function; var revertEnabled = this.get('inspector.revert') instanceof Function; return enabled && (addEnabled || saveEnabled || revertEnabled); }.property('inspector.canModify', 'inspector.addItem', 'inspector.save', 'inspector.revert'), childViews: [ core.component.UiButton.extend({ size: 20, inspectorBinding: 'parentView.inspector', label: function () { return this.get('inspector.addItemText') || core.messageTable.get('chrome/inspect/footer/add'); }.property('inspector.addItemText'), isVisible: function () { return this.get('inspector.addItem') instanceof Function; }.property('inspector.addItem'), enabledBinding: 'inspector.canAddItems', click: function () { this.get('inspector').addItem(); return false; } }), core.component.UiButton.extend({ size: 20, inspectorBinding: 'parentView.inspector', label: function () { return this.get('inspector.saveText') || core.messageTable.get('chrome/inspect/footer/save'); }.property('inspector.saveText'), isVisible: function () { return this.get('inspector.save') instanceof Function; }.property('inspector.save'), enabledBinding: 'inspector.canSave', click: function () { this.get('inspector').save(); return false; } }), core.component.UiButton.extend({ size: 20, inspectorBinding: 'parentView.inspector', label: function () { return this.get('inspector.revertText') || core.messageTable.get('chrome/inspect/footer/revert'); }.property('inspector.revertText'), isVisible: function () { return this.get('inspector.revert') instanceof Function; }.property('inspector.revert'), enabledBinding: 'inspector.canRevert', click: function () { this.get('inspector').revert(); return false; } }) ] }); Inspect.InspectIcon = core.view.Icon.extend({ model: 'inspect', size: 24 });
By using this js. I need to hide or disable only the last 4 inspect tabs (metadata_contextual, alias, references and permissions). I want to preview only the first 2 tabs. I’m new to the ember js. can anyone help me on this. It will appreciable. Thanks in advance
Posts: 1
Participants: 1