| Index: trunk/extensions/VisualEditor/modules/es/tools/es.AnnotationButtonTool.js |
| — | — | @@ -24,7 +24,7 @@ |
| 25 | 25 | }; |
| 26 | 26 | |
| 27 | 27 | es.AnnotationButtonTool.prototype.updateState = function( annotations, nodes ) { |
| 28 | | - if ( es.DocumentModel.getIndexOfAnnotation( annotations.full, this.annotation ) !== -1 ) { |
| | 28 | + if ( es.DocumentModel.getIndexOfAnnotation( annotations.full, this.annotation, true ) !== -1 ) { |
| 29 | 29 | this.$.addClass( 'es-toolbarButtonTool-down' ); |
| 30 | 30 | this.active = true; |
| 31 | 31 | return; |
| Index: trunk/extensions/VisualEditor/modules/es/models/es.DocumentModel.js |
| — | — | @@ -160,9 +160,10 @@ |
| 161 | 161 | * @method |
| 162 | 162 | * @param {Array} annotations Annotations to search through |
| 163 | 163 | * @param {Object} annotation Annotation to search for |
| | 164 | + * @param {Boolean} typeOnly Whether to only consider the type |
| 164 | 165 | * @returns {Integer} Index of annotation in annotations, or -1 if annotation was not found |
| 165 | 166 | */ |
| 166 | | -es.DocumentModel.getIndexOfAnnotation = function( annotations, annotation ) { |
| | 167 | +es.DocumentModel.getIndexOfAnnotation = function( annotations, annotation, typeOnly ) { |
| 167 | 168 | if ( annotation === undefined || annotation.type === undefined ) { |
| 168 | 169 | throw 'Invalid annotation error. Can not find non-annotation data in character.'; |
| 169 | 170 | } |
| — | — | @@ -173,7 +174,18 @@ |
| 174 | 175 | if ( typeof annotations[i] === 'string' ) { |
| 175 | 176 | continue; |
| 176 | 177 | } |
| 177 | | - if ( annotations[i].hash === ( annotation.hash || es.DocumentModel.getHash( annotation ) ) ) { |
| | 178 | + if ( |
| | 179 | + ( |
| | 180 | + typeOnly && |
| | 181 | + annotations[i].type === annotation.type |
| | 182 | + ) || |
| | 183 | + ( |
| | 184 | + !typeOnly && |
| | 185 | + annotations[i].hash === ( |
| | 186 | + annotation.hash || es.DocumentModel.getHash( annotation ) |
| | 187 | + ) |
| | 188 | + ) |
| | 189 | + ) { |
| 178 | 190 | return i; |
| 179 | 191 | } |
| 180 | 192 | } |
| Index: trunk/extensions/VisualEditor/modules/es/styles/es.ContextView.css |
| — | — | @@ -54,14 +54,6 @@ |
| 55 | 55 | top: 3px; |
| 56 | 56 | } |
| 57 | 57 | |
| 58 | | -.es-contextView-position-left .es-menuView { |
| 59 | | - left: -1px; |
| 60 | | -} |
| 61 | | - |
| 62 | | -.es-contextView-position-right .es-menuView { |
| 63 | | - right: -1px; |
| 64 | | -} |
| 65 | | - |
| 66 | 58 | .es-contextView-panels { |
| 67 | 59 | position: absolute; |
| 68 | 60 | border: solid 1px #cccccc; |
| — | — | @@ -85,3 +77,7 @@ |
| 86 | 78 | padding: 0.33em 0.66em; |
| 87 | 79 | white-space: nowrap; |
| 88 | 80 | } |
| | 81 | + |
| | 82 | +.es-contextView .es-toolbarGroup { |
| | 83 | + border: none; |
| | 84 | +} |
| \ No newline at end of file |
| Index: trunk/extensions/VisualEditor/modules/es/views/es.ContextView.js |
| — | — | @@ -16,26 +16,11 @@ |
| 17 | 17 | this.toolbarView = new es.ToolbarView( |
| 18 | 18 | this.$toolbar, |
| 19 | 19 | this.surfaceView, |
| 20 | | - [{ 'name': 'textStyle', 'items' : [ 'bold', 'italic', 'formatting', 'clear' ] }] |
| | 20 | + [{ 'name': 'textStyle', 'items' : [ 'bold', 'italic', 'link', 'clear' ] }] |
| 21 | 21 | ); |
| 22 | 22 | this.menuView = new es.MenuView( [ |
| 23 | 23 | // Example menu items |
| 24 | | - { 'name': 'tools', '$': this.$toolbar }, |
| 25 | | - '-', |
| 26 | | - { 'name': 'link', 'label': 'Link to...', 'callback': function( item ) { |
| 27 | | - _this.menuView.hide(); |
| 28 | | - _this.$panels |
| 29 | | - .show() |
| 30 | | - .find( '[rel="link"]' ) |
| 31 | | - .show() |
| 32 | | - .end() |
| 33 | | - .find( '[rel="link"] input:first' ) |
| 34 | | - .focus(); |
| 35 | | - } }, |
| 36 | | - '-', |
| 37 | | - { 'name': 'copy', 'label': 'Copy' }, |
| 38 | | - { 'name': 'cut', 'label': 'Cut' }, |
| 39 | | - { 'name': 'paste', 'label': 'Paste' } |
| | 24 | + { 'name': 'tools', '$': this.$toolbar } |
| 40 | 25 | ], |
| 41 | 26 | null, |
| 42 | 27 | this.$ |
| — | — | @@ -100,13 +85,27 @@ |
| 101 | 86 | } |
| 102 | 87 | } |
| 103 | 88 | if ( position ) { |
| 104 | | - if ( position.left + this.menuView.$.width() < $( 'body' ).width() ) { |
| 105 | | - this.$.addClass( 'es-contextView-position-left' ); |
| 106 | | - } else { |
| 107 | | - this.$.addClass( 'es-contextView-position-right' ); |
| | 89 | + var $menu = this.menuView.$, |
| | 90 | + menuMargin = 5, |
| | 91 | + menuWidth = $menu.width(), |
| | 92 | + menuHeight = $menu.height(), |
| | 93 | + $window = $( window ), |
| | 94 | + windowWidth = $window.width(), |
| | 95 | + windowHeight = $window.height(), |
| | 96 | + windowScrollTop = $window.scrollTop(); |
| | 97 | + // Center align menu |
| | 98 | + var menuLeft = -Math.round( menuWidth / 2 ); |
| | 99 | + // Adjust menu left or right depending on viewport |
| | 100 | + if ( ( position.left - menuMargin ) + menuLeft < 0 ) { |
| | 101 | + // Move right a bit past center |
| | 102 | + menuLeft -= position.left + menuLeft - menuMargin; |
| | 103 | + } else if ( ( menuMargin + position.left ) - menuLeft > windowWidth ) { |
| | 104 | + // Move left a bit past center |
| | 105 | + menuLeft += windowWidth - menuMargin - ( position.left - menuLeft ); |
| 108 | 106 | } |
| 109 | | - var $window = $( window ); |
| 110 | | - if ( position.top + this.menuView.$.height() < $window.height() + $window.scrollTop() ) { |
| | 107 | + $menu.css( 'left', menuLeft ); |
| | 108 | + // Position menu on top or bottom depending on viewport |
| | 109 | + if ( position.top + menuHeight < windowHeight + windowScrollTop ) { |
| 111 | 110 | this.$.addClass( 'es-contextView-position-below' ); |
| 112 | 111 | } else { |
| 113 | 112 | this.$.addClass( 'es-contextView-position-above' ); |