From fa7bd43ab9ac6e5885705aabc036660de5edbe1b Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Sat, 18 Feb 2012 14:43:35 +0200 Subject: [PATCH] How to merge instructions --- app/assets/images/Info-UI.PNG | Bin 800 -> 801 bytes app/assets/javascripts/application.js | 1 + app/assets/stylesheets/common.scss | 9 + .../merge_requests/_how_to_merge.html.haml | 25 ++ app/views/merge_requests/show.html.haml | 8 +- vendor/assets/javascripts/bootstrap-modal.js | 260 ++++++++++++++++++ .../assets/javascripts/bootstrap-popover.js | 86 ++++++ 7 files changed, 388 insertions(+), 1 deletion(-) create mode 100644 app/views/merge_requests/_how_to_merge.html.haml create mode 100644 vendor/assets/javascripts/bootstrap-modal.js create mode 100644 vendor/assets/javascripts/bootstrap-popover.js diff --git a/app/assets/images/Info-UI.PNG b/app/assets/images/Info-UI.PNG index 92795486913988cb56cc2596769ac6c397d0bd1d..7f48ed8d3f16541788d6d2c2117b6ac4afa7bb37 100644 GIT binary patch delta 696 zcmV;p0!RIz2B8L!Ukw5h3=|IO^trYG00NvJuDeUg@my4}iW3f_w-dW{ZEoN`apeEpsA|P86DTV1pES8mQ+8m3vAo} zu1jnT+-%syQ^7QVSHPUHsbRjOz+<}GDA3n1S)og2SAaI~P(*%O`Hs{`5a1Zl6J>w2 zi;BTK2TTDYneRO{5)3_eQH`s+Oh7+}GnbX1jl%@|rR_#0_1&obFSZ7>Bikoi{~_zL z{wx5k2-viJLQR#f>k|^67m@AAHsg%VNLhbYfp@^?%=Z=BL912z2rPF{Rdv9Wc%o!3 zUIOoJCW79zjYv(4%ipjKOp3_dzI}gWQnUn|%7LXd`d8%tTtueAwvEzsue>7i1-NP@ z%+8KG1pNcZd;m$31n>QyL*h6NtNc8W*gkPJi4gpDfEOY%m46L&l)-yXk|fyr9RZ#I z-)b<-Wg0&jZjyg;Rc35Ut7-3pQ6ocs7#ECv%Odh4|2C`y$~{<|X{uU{*wifX-P5fYLO@dyj}rTXvT!0E)i% z0u#WJhzxu0_kp=wPo{zUc1TfKzXJ*k0yj&*9k2sjRMoWuJ+gAmSY|~atH5Nmw0i$qL;{k2}53B;GfoH(+F3Ft*nj+$y(Q&;?z%QU>N%aG}z_$JG zy2Qr7t%glJ6-)zo4a^yv8s<9+JfXXd0(}jW6}n`06=(yGRQ0Eo??{aV0geGZQAU5e zs2I$1z!Wf&`QB3_!O(LT)wsIL1oU$_b6E-6I84A_+HPc0-;LV;VrxJBIsS)h}5*W{0-Z{q^i#C+ed#UMN7b`99UYTe?|T;RCOwB+bB)<%B!khfNNI5 z?CiKh&_9682aqI5@ZSG9B#z^-%FhFd?Gsm%2*Ga$c&VyW`PWcK8NBx-NrJ845#TBC ztp>wfrty>ECiy2 "#"} × + %h3 How To Merge + .modal-body + %pre + :erb + git fetch origin + git checkout -b <%=@merge_request.source_branch%> origin/<%=@merge_request.source_branch%> + git checkout <%=@merge_request.target_branch%> + git merge <%=@merge_request.source_branch%> + git push origin <%=@merge_request.target_branch%> + + +:javascript + $(function(){ + var modal = $('#modal_merge_info').modal({modal: true}); + $('.info_link').bind("click", function(){ + modal.show(); + }); + $('.modal-header .close').bind("click", function(){ + modal.hide(); + }) + }) + diff --git a/app/views/merge_requests/show.html.haml b/app/views/merge_requests/show.html.haml index b270175d1..dd3fc7c60 100644 --- a/app/views/merge_requests/show.html.haml +++ b/app/views/merge_requests/show.html.haml @@ -22,12 +22,18 @@ .back_link = link_to project_merge_requests_path(@project) do ← To merge requests + + %hr - if @merge_request.closed .alert-message.error Closed - else - .alert-message.success Open + .alert-message.success + = link_to "#", :class => "info_link", :title => "How To Merge" do + = image_tag "Info-UI.PNG" + Open += render "merge_requests/how_to_merge" %div.well %div diff --git a/vendor/assets/javascripts/bootstrap-modal.js b/vendor/assets/javascripts/bootstrap-modal.js new file mode 100644 index 000000000..b328217f8 --- /dev/null +++ b/vendor/assets/javascripts/bootstrap-modal.js @@ -0,0 +1,260 @@ +/* ========================================================= + * bootstrap-modal.js v1.4.0 + * http://twitter.github.com/bootstrap/javascript.html#modal + * ========================================================= + * Copyright 2011 Twitter, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ========================================================= */ + + +!function( $ ){ + + "use strict" + + /* CSS TRANSITION SUPPORT (https://gist.github.com/373874) + * ======================================================= */ + + var transitionEnd + + $(document).ready(function () { + + $.support.transition = (function () { + var thisBody = document.body || document.documentElement + , thisStyle = thisBody.style + , support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined + return support + })() + + // set CSS transition event type + if ( $.support.transition ) { + transitionEnd = "TransitionEnd" + if ( $.browser.webkit ) { + transitionEnd = "webkitTransitionEnd" + } else if ( $.browser.mozilla ) { + transitionEnd = "transitionend" + } else if ( $.browser.opera ) { + transitionEnd = "oTransitionEnd" + } + } + + }) + + + /* MODAL PUBLIC CLASS DEFINITION + * ============================= */ + + var Modal = function ( content, options ) { + this.settings = $.extend({}, $.fn.modal.defaults, options) + this.$element = $(content) + .delegate('.close', 'click.modal', $.proxy(this.hide, this)) + + if ( this.settings.show ) { + this.show() + } + + return this + } + + Modal.prototype = { + + toggle: function () { + return this[!this.isShown ? 'show' : 'hide']() + } + + , show: function () { + var that = this + this.isShown = true + this.$element.trigger('show') + + escape.call(this) + backdrop.call(this, function () { + var transition = $.support.transition && that.$element.hasClass('fade') + + that.$element + .appendTo(document.body) + .show() + + if (transition) { + that.$element[0].offsetWidth // force reflow + } + + that.$element.addClass('in') + + transition ? + that.$element.one(transitionEnd, function () { that.$element.trigger('shown') }) : + that.$element.trigger('shown') + + }) + + return this + } + + , hide: function (e) { + e && e.preventDefault() + + if ( !this.isShown ) { + return this + } + + var that = this + this.isShown = false + + escape.call(this) + + this.$element + .trigger('hide') + .removeClass('in') + + $.support.transition && this.$element.hasClass('fade') ? + hideWithTransition.call(this) : + hideModal.call(this) + + return this + } + + } + + + /* MODAL PRIVATE METHODS + * ===================== */ + + function hideWithTransition() { + // firefox drops transitionEnd events :{o + var that = this + , timeout = setTimeout(function () { + that.$element.unbind(transitionEnd) + hideModal.call(that) + }, 500) + + this.$element.one(transitionEnd, function () { + clearTimeout(timeout) + hideModal.call(that) + }) + } + + function hideModal (that) { + this.$element + .hide() + .trigger('hidden') + + backdrop.call(this) + } + + function backdrop ( callback ) { + var that = this + , animate = this.$element.hasClass('fade') ? 'fade' : '' + if ( this.isShown && this.settings.backdrop ) { + var doAnimate = $.support.transition && animate + + this.$backdrop = $('
') + .appendTo(document.body) + + if ( this.settings.backdrop != 'static' ) { + this.$backdrop.click($.proxy(this.hide, this)) + } + + if ( doAnimate ) { + this.$backdrop[0].offsetWidth // force reflow + } + + this.$backdrop.addClass('in') + + doAnimate ? + this.$backdrop.one(transitionEnd, callback) : + callback() + + } else if ( !this.isShown && this.$backdrop ) { + this.$backdrop.removeClass('in') + + $.support.transition && this.$element.hasClass('fade')? + this.$backdrop.one(transitionEnd, $.proxy(removeBackdrop, this)) : + removeBackdrop.call(this) + + } else if ( callback ) { + callback() + } + } + + function removeBackdrop() { + this.$backdrop.remove() + this.$backdrop = null + } + + function escape() { + var that = this + if ( this.isShown && this.settings.keyboard ) { + $(document).bind('keyup.modal', function ( e ) { + if ( e.which == 27 ) { + that.hide() + } + }) + } else if ( !this.isShown ) { + $(document).unbind('keyup.modal') + } + } + + + /* MODAL PLUGIN DEFINITION + * ======================= */ + + $.fn.modal = function ( options ) { + var modal = this.data('modal') + + if (!modal) { + + if (typeof options == 'string') { + options = { + show: /show|toggle/.test(options) + } + } + + return this.each(function () { + $(this).data('modal', new Modal(this, options)) + }) + } + + if ( options === true ) { + return modal + } + + if ( typeof options == 'string' ) { + modal[options]() + } else if ( modal ) { + modal.toggle() + } + + return this + } + + $.fn.modal.Modal = Modal + + $.fn.modal.defaults = { + backdrop: false + , keyboard: false + , show: false + } + + + /* MODAL DATA- IMPLEMENTATION + * ========================== */ + + $(document).ready(function () { + $('body').delegate('[data-controls-modal]', 'click', function (e) { + e.preventDefault() + var $this = $(this).data('show', true) + $('#' + $this.attr('data-controls-modal')).modal( $this.data() ) + }) + }) + +}( window.jQuery || window.ender ); diff --git a/vendor/assets/javascripts/bootstrap-popover.js b/vendor/assets/javascripts/bootstrap-popover.js new file mode 100644 index 000000000..cf6dadf0a --- /dev/null +++ b/vendor/assets/javascripts/bootstrap-popover.js @@ -0,0 +1,86 @@ +/* =========================================================== + * bootstrap-popover.js v1.4.0 + * http://twitter.github.com/bootstrap/javascript.html#popover + * =========================================================== + * Copyright 2011 Twitter, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * =========================================================== */ + + +!function( $ ) { + + "use strict" + + var Popover = function ( element, options ) { + this.$element = $(element) + this.options = options + this.enabled = true + this.fixTitle() + } + + /* NOTE: POPOVER EXTENDS BOOTSTRAP-TWIPSY.js + ========================================= */ + + Popover.prototype = $.extend({}, $.fn.twipsy.Twipsy.prototype, { + + setContent: function () { + var $tip = this.tip() + $tip.find('.title')[this.options.html ? 'html' : 'text'](this.getTitle()) + $tip.find('.content p')[this.options.html ? 'html' : 'text'](this.getContent()) + $tip[0].className = 'popover' + } + + , hasContent: function () { + return this.getTitle() || this.getContent() + } + + , getContent: function () { + var content + , $e = this.$element + , o = this.options + + if (typeof this.options.content == 'string') { + content = this.options.content + } else if (typeof this.options.content == 'function') { + content = this.options.content.call(this.$element[0]) + } + return content + } + + , tip: function() { + if (!this.$tip) { + this.$tip = $('
') + .html(this.options.template) + } + return this.$tip + } + + }) + + + /* POPOVER PLUGIN DEFINITION + * ======================= */ + + $.fn.popover = function (options) { + if (typeof options == 'object') options = $.extend({}, $.fn.popover.defaults, options) + $.fn.twipsy.initWith.call(this, options, Popover, 'popover') + return this + } + + $.fn.popover.defaults = $.extend({} , $.fn.twipsy.defaults, { + placement: 'right' + , template: '

' + }) + +}( window.jQuery || window.ender ); \ No newline at end of file