mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-30 02:32:42 +01:00
Add a class to the Tokenizer container while it is focused
Summary: For some evil design purpose. Test Plan: Focused, blurred tokenizers. Reviewers: chad Reviewed By: chad CC: aran Differential Revision: https://secure.phabricator.com/D5780
This commit is contained in:
parent
1e2f01efc2
commit
897274eed6
3 changed files with 85 additions and 63 deletions
|
@ -858,7 +858,7 @@ celerity_register_resource_map(array(
|
||||||
),
|
),
|
||||||
'aphront-tokenizer-control-css' =>
|
'aphront-tokenizer-control-css' =>
|
||||||
array(
|
array(
|
||||||
'uri' => '/res/207105f0/rsrc/css/aphront/tokenizer.css',
|
'uri' => '/res/6e14867e/rsrc/css/aphront/tokenizer.css',
|
||||||
'type' => 'css',
|
'type' => 'css',
|
||||||
'requires' =>
|
'requires' =>
|
||||||
array(
|
array(
|
||||||
|
@ -2525,7 +2525,7 @@ celerity_register_resource_map(array(
|
||||||
),
|
),
|
||||||
'javelin-tokenizer' =>
|
'javelin-tokenizer' =>
|
||||||
array(
|
array(
|
||||||
'uri' => '/res/731a958c/rsrc/externals/javelin/lib/control/tokenizer/Tokenizer.js',
|
'uri' => '/res/8bccdb9e/rsrc/externals/javelin/lib/control/tokenizer/Tokenizer.js',
|
||||||
'type' => 'js',
|
'type' => 'js',
|
||||||
'requires' =>
|
'requires' =>
|
||||||
array(
|
array(
|
||||||
|
@ -3961,7 +3961,7 @@ celerity_register_resource_map(array(
|
||||||
), array(
|
), array(
|
||||||
'packages' =>
|
'packages' =>
|
||||||
array(
|
array(
|
||||||
'fbb09f9f' =>
|
'dbf66141' =>
|
||||||
array(
|
array(
|
||||||
'name' => 'core.pkg.css',
|
'name' => 'core.pkg.css',
|
||||||
'symbols' =>
|
'symbols' =>
|
||||||
|
@ -4003,7 +4003,7 @@ celerity_register_resource_map(array(
|
||||||
34 => 'phabricator-object-item-list-view-css',
|
34 => 'phabricator-object-item-list-view-css',
|
||||||
35 => 'global-drag-and-drop-css',
|
35 => 'global-drag-and-drop-css',
|
||||||
),
|
),
|
||||||
'uri' => '/res/pkg/fbb09f9f/core.pkg.css',
|
'uri' => '/res/pkg/dbf66141/core.pkg.css',
|
||||||
'type' => 'css',
|
'type' => 'css',
|
||||||
),
|
),
|
||||||
'26980a1c' =>
|
'26980a1c' =>
|
||||||
|
@ -4135,7 +4135,7 @@ celerity_register_resource_map(array(
|
||||||
'uri' => '/res/pkg/f96657b8/diffusion.pkg.js',
|
'uri' => '/res/pkg/f96657b8/diffusion.pkg.js',
|
||||||
'type' => 'js',
|
'type' => 'js',
|
||||||
),
|
),
|
||||||
'41f3916d' =>
|
'c9168ae3' =>
|
||||||
array(
|
array(
|
||||||
'name' => 'javelin.pkg.js',
|
'name' => 'javelin.pkg.js',
|
||||||
'symbols' =>
|
'symbols' =>
|
||||||
|
@ -4160,7 +4160,7 @@ celerity_register_resource_map(array(
|
||||||
17 => 'javelin-typeahead-ondemand-source',
|
17 => 'javelin-typeahead-ondemand-source',
|
||||||
18 => 'javelin-tokenizer',
|
18 => 'javelin-tokenizer',
|
||||||
),
|
),
|
||||||
'uri' => '/res/pkg/41f3916d/javelin.pkg.js',
|
'uri' => '/res/pkg/c9168ae3/javelin.pkg.js',
|
||||||
'type' => 'js',
|
'type' => 'js',
|
||||||
),
|
),
|
||||||
'6b1fccc6' =>
|
'6b1fccc6' =>
|
||||||
|
@ -4194,16 +4194,16 @@ celerity_register_resource_map(array(
|
||||||
'reverse' =>
|
'reverse' =>
|
||||||
array(
|
array(
|
||||||
'aphront-attached-file-view-css' => '6b1fccc6',
|
'aphront-attached-file-view-css' => '6b1fccc6',
|
||||||
'aphront-dialog-view-css' => 'fbb09f9f',
|
'aphront-dialog-view-css' => 'dbf66141',
|
||||||
'aphront-error-view-css' => 'fbb09f9f',
|
'aphront-error-view-css' => 'dbf66141',
|
||||||
'aphront-form-view-css' => 'fbb09f9f',
|
'aphront-form-view-css' => 'dbf66141',
|
||||||
'aphront-list-filter-view-css' => 'fbb09f9f',
|
'aphront-list-filter-view-css' => 'dbf66141',
|
||||||
'aphront-pager-view-css' => 'fbb09f9f',
|
'aphront-pager-view-css' => 'dbf66141',
|
||||||
'aphront-panel-view-css' => 'fbb09f9f',
|
'aphront-panel-view-css' => 'dbf66141',
|
||||||
'aphront-table-view-css' => 'fbb09f9f',
|
'aphront-table-view-css' => 'dbf66141',
|
||||||
'aphront-tokenizer-control-css' => 'fbb09f9f',
|
'aphront-tokenizer-control-css' => 'dbf66141',
|
||||||
'aphront-tooltip-css' => 'fbb09f9f',
|
'aphront-tooltip-css' => 'dbf66141',
|
||||||
'aphront-typeahead-control-css' => 'fbb09f9f',
|
'aphront-typeahead-control-css' => 'dbf66141',
|
||||||
'differential-changeset-view-css' => '8aaacd1b',
|
'differential-changeset-view-css' => '8aaacd1b',
|
||||||
'differential-core-view-css' => '8aaacd1b',
|
'differential-core-view-css' => '8aaacd1b',
|
||||||
'differential-inline-comment-editor' => '27c55b30',
|
'differential-inline-comment-editor' => '27c55b30',
|
||||||
|
@ -4217,10 +4217,10 @@ celerity_register_resource_map(array(
|
||||||
'differential-table-of-contents-css' => '8aaacd1b',
|
'differential-table-of-contents-css' => '8aaacd1b',
|
||||||
'diffusion-commit-view-css' => 'c8ce2d88',
|
'diffusion-commit-view-css' => 'c8ce2d88',
|
||||||
'diffusion-icons-css' => 'c8ce2d88',
|
'diffusion-icons-css' => 'c8ce2d88',
|
||||||
'global-drag-and-drop-css' => 'fbb09f9f',
|
'global-drag-and-drop-css' => 'dbf66141',
|
||||||
'inline-comment-summary-css' => '8aaacd1b',
|
'inline-comment-summary-css' => '8aaacd1b',
|
||||||
'javelin-aphlict' => '26980a1c',
|
'javelin-aphlict' => '26980a1c',
|
||||||
'javelin-behavior' => '41f3916d',
|
'javelin-behavior' => 'c9168ae3',
|
||||||
'javelin-behavior-aphlict-dropdown' => '26980a1c',
|
'javelin-behavior-aphlict-dropdown' => '26980a1c',
|
||||||
'javelin-behavior-aphlict-listen' => '26980a1c',
|
'javelin-behavior-aphlict-listen' => '26980a1c',
|
||||||
'javelin-behavior-aphront-basic-tokenizer' => '26980a1c',
|
'javelin-behavior-aphront-basic-tokenizer' => '26980a1c',
|
||||||
|
@ -4271,66 +4271,66 @@ celerity_register_resource_map(array(
|
||||||
'javelin-behavior-repository-crossreference' => '27c55b30',
|
'javelin-behavior-repository-crossreference' => '27c55b30',
|
||||||
'javelin-behavior-toggle-class' => '26980a1c',
|
'javelin-behavior-toggle-class' => '26980a1c',
|
||||||
'javelin-behavior-workflow' => '26980a1c',
|
'javelin-behavior-workflow' => '26980a1c',
|
||||||
'javelin-dom' => '41f3916d',
|
'javelin-dom' => 'c9168ae3',
|
||||||
'javelin-event' => '41f3916d',
|
'javelin-event' => 'c9168ae3',
|
||||||
'javelin-install' => '41f3916d',
|
'javelin-install' => 'c9168ae3',
|
||||||
'javelin-json' => '41f3916d',
|
'javelin-json' => 'c9168ae3',
|
||||||
'javelin-mask' => '41f3916d',
|
'javelin-mask' => 'c9168ae3',
|
||||||
'javelin-request' => '41f3916d',
|
'javelin-request' => 'c9168ae3',
|
||||||
'javelin-resource' => '41f3916d',
|
'javelin-resource' => 'c9168ae3',
|
||||||
'javelin-stratcom' => '41f3916d',
|
'javelin-stratcom' => 'c9168ae3',
|
||||||
'javelin-tokenizer' => '41f3916d',
|
'javelin-tokenizer' => 'c9168ae3',
|
||||||
'javelin-typeahead' => '41f3916d',
|
'javelin-typeahead' => 'c9168ae3',
|
||||||
'javelin-typeahead-normalizer' => '41f3916d',
|
'javelin-typeahead-normalizer' => 'c9168ae3',
|
||||||
'javelin-typeahead-ondemand-source' => '41f3916d',
|
'javelin-typeahead-ondemand-source' => 'c9168ae3',
|
||||||
'javelin-typeahead-preloaded-source' => '41f3916d',
|
'javelin-typeahead-preloaded-source' => 'c9168ae3',
|
||||||
'javelin-typeahead-source' => '41f3916d',
|
'javelin-typeahead-source' => 'c9168ae3',
|
||||||
'javelin-uri' => '41f3916d',
|
'javelin-uri' => 'c9168ae3',
|
||||||
'javelin-util' => '41f3916d',
|
'javelin-util' => 'c9168ae3',
|
||||||
'javelin-vector' => '41f3916d',
|
'javelin-vector' => 'c9168ae3',
|
||||||
'javelin-workflow' => '41f3916d',
|
'javelin-workflow' => 'c9168ae3',
|
||||||
'lightbox-attachment-css' => 'fbb09f9f',
|
'lightbox-attachment-css' => 'dbf66141',
|
||||||
'maniphest-task-summary-css' => '6b1fccc6',
|
'maniphest-task-summary-css' => '6b1fccc6',
|
||||||
'maniphest-transaction-detail-css' => '6b1fccc6',
|
'maniphest-transaction-detail-css' => '6b1fccc6',
|
||||||
'phabricator-busy' => '26980a1c',
|
'phabricator-busy' => '26980a1c',
|
||||||
'phabricator-content-source-view-css' => '8aaacd1b',
|
'phabricator-content-source-view-css' => '8aaacd1b',
|
||||||
'phabricator-core-buttons-css' => 'fbb09f9f',
|
'phabricator-core-buttons-css' => 'dbf66141',
|
||||||
'phabricator-core-css' => 'fbb09f9f',
|
'phabricator-core-css' => 'dbf66141',
|
||||||
'phabricator-crumbs-view-css' => 'fbb09f9f',
|
'phabricator-crumbs-view-css' => 'dbf66141',
|
||||||
'phabricator-directory-css' => 'fbb09f9f',
|
'phabricator-directory-css' => 'dbf66141',
|
||||||
'phabricator-drag-and-drop-file-upload' => '27c55b30',
|
'phabricator-drag-and-drop-file-upload' => '27c55b30',
|
||||||
'phabricator-dropdown-menu' => '26980a1c',
|
'phabricator-dropdown-menu' => '26980a1c',
|
||||||
'phabricator-file-upload' => '26980a1c',
|
'phabricator-file-upload' => '26980a1c',
|
||||||
'phabricator-filetree-view-css' => 'fbb09f9f',
|
'phabricator-filetree-view-css' => 'dbf66141',
|
||||||
'phabricator-flag-css' => 'fbb09f9f',
|
'phabricator-flag-css' => 'dbf66141',
|
||||||
'phabricator-form-view-css' => 'fbb09f9f',
|
'phabricator-form-view-css' => 'dbf66141',
|
||||||
'phabricator-header-view-css' => 'fbb09f9f',
|
'phabricator-header-view-css' => 'dbf66141',
|
||||||
'phabricator-jump-nav' => 'fbb09f9f',
|
'phabricator-jump-nav' => 'dbf66141',
|
||||||
'phabricator-keyboard-shortcut' => '26980a1c',
|
'phabricator-keyboard-shortcut' => '26980a1c',
|
||||||
'phabricator-keyboard-shortcut-manager' => '26980a1c',
|
'phabricator-keyboard-shortcut-manager' => '26980a1c',
|
||||||
'phabricator-main-menu-view' => 'fbb09f9f',
|
'phabricator-main-menu-view' => 'dbf66141',
|
||||||
'phabricator-menu-item' => '26980a1c',
|
'phabricator-menu-item' => '26980a1c',
|
||||||
'phabricator-nav-view-css' => 'fbb09f9f',
|
'phabricator-nav-view-css' => 'dbf66141',
|
||||||
'phabricator-notification' => '26980a1c',
|
'phabricator-notification' => '26980a1c',
|
||||||
'phabricator-notification-css' => 'fbb09f9f',
|
'phabricator-notification-css' => 'dbf66141',
|
||||||
'phabricator-notification-menu-css' => 'fbb09f9f',
|
'phabricator-notification-menu-css' => 'dbf66141',
|
||||||
'phabricator-object-item-list-view-css' => 'fbb09f9f',
|
'phabricator-object-item-list-view-css' => 'dbf66141',
|
||||||
'phabricator-object-selector-css' => '8aaacd1b',
|
'phabricator-object-selector-css' => '8aaacd1b',
|
||||||
'phabricator-phtize' => '26980a1c',
|
'phabricator-phtize' => '26980a1c',
|
||||||
'phabricator-prefab' => '26980a1c',
|
'phabricator-prefab' => '26980a1c',
|
||||||
'phabricator-project-tag-css' => '6b1fccc6',
|
'phabricator-project-tag-css' => '6b1fccc6',
|
||||||
'phabricator-remarkup-css' => 'fbb09f9f',
|
'phabricator-remarkup-css' => 'dbf66141',
|
||||||
'phabricator-shaped-request' => '27c55b30',
|
'phabricator-shaped-request' => '27c55b30',
|
||||||
'phabricator-side-menu-view-css' => 'fbb09f9f',
|
'phabricator-side-menu-view-css' => 'dbf66141',
|
||||||
'phabricator-standard-page-view' => 'fbb09f9f',
|
'phabricator-standard-page-view' => 'dbf66141',
|
||||||
'phabricator-textareautils' => '26980a1c',
|
'phabricator-textareautils' => '26980a1c',
|
||||||
'phabricator-tooltip' => '26980a1c',
|
'phabricator-tooltip' => '26980a1c',
|
||||||
'phabricator-transaction-view-css' => 'fbb09f9f',
|
'phabricator-transaction-view-css' => 'dbf66141',
|
||||||
'phabricator-zindex-css' => 'fbb09f9f',
|
'phabricator-zindex-css' => 'dbf66141',
|
||||||
'sprite-apps-large-css' => 'fbb09f9f',
|
'sprite-apps-large-css' => 'dbf66141',
|
||||||
'sprite-gradient-css' => 'fbb09f9f',
|
'sprite-gradient-css' => 'dbf66141',
|
||||||
'sprite-icon-css' => 'fbb09f9f',
|
'sprite-icon-css' => 'dbf66141',
|
||||||
'sprite-menu-css' => 'fbb09f9f',
|
'sprite-menu-css' => 'dbf66141',
|
||||||
'syntax-highlighting-css' => 'fbb09f9f',
|
'syntax-highlighting-css' => 'dbf66141',
|
||||||
),
|
),
|
||||||
));
|
));
|
||||||
|
|
|
@ -20,6 +20,10 @@ div.jx-tokenizer-container {
|
||||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.jx-tokenizer-container-focused {
|
||||||
|
border-color: #0099ff;
|
||||||
|
}
|
||||||
|
|
||||||
var.jx-tokenizer-metrics {
|
var.jx-tokenizer-metrics {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 20px;
|
left: 20px;
|
||||||
|
|
|
@ -28,6 +28,9 @@
|
||||||
* If you do this correctly, the input should suggest items and enter them as
|
* If you do this correctly, the input should suggest items and enter them as
|
||||||
* tokens as the user types.
|
* tokens as the user types.
|
||||||
*
|
*
|
||||||
|
* When the tokenizer is focused, the CSS class `jx-tokenizer-container-focused`
|
||||||
|
* is added to the container node.
|
||||||
|
*
|
||||||
* @group control
|
* @group control
|
||||||
*/
|
*/
|
||||||
JX.install('Tokenizer', {
|
JX.install('Tokenizer', {
|
||||||
|
@ -205,8 +208,7 @@ JX.install('Tokenizer', {
|
||||||
} else if (e.getType() == 'keydown') {
|
} else if (e.getType() == 'keydown') {
|
||||||
this._onkeydown(e);
|
this._onkeydown(e);
|
||||||
} else if (e.getType() == 'blur') {
|
} else if (e.getType() == 'blur') {
|
||||||
this._focus.value = '';
|
this._didblur();
|
||||||
this._redraw();
|
|
||||||
|
|
||||||
// Explicitly update the placeholder since we just wiped the field
|
// Explicitly update the placeholder since we just wiped the field
|
||||||
// value.
|
// value.
|
||||||
|
@ -378,7 +380,23 @@ JX.install('Tokenizer', {
|
||||||
focus : function() {
|
focus : function() {
|
||||||
var focus = this._focus;
|
var focus = this._focus;
|
||||||
JX.DOM.show(focus);
|
JX.DOM.show(focus);
|
||||||
|
|
||||||
|
JX.DOM.alterClass(
|
||||||
|
this._containerNode,
|
||||||
|
'jx-tokenizer-container-focused',
|
||||||
|
true);
|
||||||
|
|
||||||
setTimeout(function() { JX.DOM.focus(focus); }, 0);
|
setTimeout(function() { JX.DOM.focus(focus); }, 0);
|
||||||
|
},
|
||||||
|
|
||||||
|
_didblur: function() {
|
||||||
|
JX.DOM.alterClass(
|
||||||
|
this._containerNode,
|
||||||
|
'jx-tokenizer-container-focused',
|
||||||
|
false);
|
||||||
|
this._focus.value = '';
|
||||||
|
this._redraw();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue