Browse Source

Fixed dialogs styling, reversed buttons

Default dialog button is now on the right, other one on the left.
tags/v8.0.0alpha1
Vincent Petry 10 years ago
parent
commit
71fe5d672e
3 changed files with 38 additions and 22 deletions
  1. 11
    0
      core/css/jquery.ocdialog.css
  2. 7
    0
      core/js/jquery.ocdialog.js
  3. 20
    22
      core/js/oc-dialogs.js

+ 11
- 0
core/css/jquery.ocdialog.css View File

@@ -31,6 +31,17 @@
margin-top: 10px;
width: 100%;
}
/* align primary button to right, other buttons to left */
.oc-dialog-buttonrow.twobuttons button:nth-child(1) {
float: left;
}
.oc-dialog-buttonrow.twobuttons button:nth-child(2) {
float: right;
}

.oc-dialog-buttonrow.onebutton button {
float: right;
}

.oc-dialog-close {
position:absolute;

+ 7
- 0
core/js/jquery.ocdialog.js View File

@@ -111,6 +111,13 @@
var $buttonrow = $('<div class="oc-dialog-buttonrow" />');
this.$buttonrow = $buttonrow.appendTo(this.$dialog);
}
if (value.length === 1) {
this.$buttonrow.addClass('onebutton');
} else if (value.length === 2) {
this.$buttonrow.addClass('twobuttons');
} else if (value.length === 3) {
this.$buttonrow.addClass('threebuttons');
}
$.each(value, function(idx, val) {
var $button = $('<button>').text(val.text);
if (val.classes) {

+ 20
- 22
core/js/oc-dialogs.js View File

@@ -19,7 +19,7 @@
*
*/

/* global OC, t, alert, $ */
/* global alert */

/**
* this class to ease the usage of jquery dialogs
@@ -66,7 +66,7 @@ var OCdialogs = {
* @param modal make the dialog modal
*/
confirm:function(text, title, callback, modal) {
this.message(
return this.message(
text,
title,
'notice',
@@ -86,7 +86,7 @@ var OCdialogs = {
* @param password whether the input should be a password input
*/
prompt: function (text, title, callback, modal, name, password) {
$.when(this._getMessageTemplate()).then(function ($tmpl) {
return $.when(this._getMessageTemplate()).then(function ($tmpl) {
var dialogName = 'oc-dialog-' + OCdialogs.dialogsCounter + '-content';
var dialogId = '#' + dialogName;
var $dlg = $tmpl.octemplate({
@@ -104,8 +104,15 @@ var OCdialogs = {
modal = false;
}
$('body').append($dlg);
var buttonlist = [
{
var buttonlist = [{
text : t('core', 'No'),
click: function () {
if (callback !== undefined) {
callback(false, input.val());
}
$(dialogId).ocdialog('close');
}
}, {
text : t('core', 'Yes'),
click : function () {
if (callback !== undefined) {
@@ -114,15 +121,6 @@ var OCdialogs = {
$(dialogId).ocdialog('close');
},
defaultButton: true
},
{
text : t('core', 'No'),
click: function () {
if (callback !== undefined) {
callback(false, input.val());
}
$(dialogId).ocdialog('close');
}
}
];

@@ -237,7 +235,7 @@ var OCdialogs = {
* You better use a wrapper instead ...
*/
message:function(content, title, dialogType, buttons, callback, modal) {
$.when(this._getMessageTemplate()).then(function($tmpl) {
return $.when(this._getMessageTemplate()).then(function($tmpl) {
var dialogName = 'oc-dialog-' + OCdialogs.dialogsCounter + '-content';
var dialogId = '#' + dialogName;
var $dlg = $tmpl.octemplate({
@@ -254,23 +252,23 @@ var OCdialogs = {
switch (buttons) {
case OCdialogs.YES_NO_BUTTONS:
buttonlist = [{
text: t('core', 'Yes'),
text: t('core', 'No'),
click: function(){
if (callback !== undefined) {
callback(true);
callback(false);
}
$(dialogId).ocdialog('close');
},
defaultButton: true
}
},
{
text: t('core', 'No'),
text: t('core', 'Yes'),
click: function(){
if (callback !== undefined) {
callback(false);
callback(true);
}
$(dialogId).ocdialog('close');
}
},
defaultButton: true
}];
break;
case OCdialogs.OK_BUTTON:

Loading…
Cancel
Save