dialogs filepicker first draft
This commit is contained in:
Bartek Przybylski
parent
ff4b0c4d7f
commit
f21d6d4f9f
|
|
@ -131,3 +131,9 @@ li.error { width:640px; margin:4em auto; padding:1em 1em 1em 4em; background:#ff
|
|||
.separator { display: inline; border-left: 1px solid #d3d3d3; border-right: 1px solid #fff; height: 10px; width:0px; margin: 4px; }
|
||||
|
||||
a.bookmarklet { background-color: #ddd; border:1px solid #ccc; padding: 5px;padding-top: 0px;padding-bottom: 2px; text-decoration: none; margin-top: 5px }
|
||||
|
||||
/* ---- DIALOGS ---- */
|
||||
|
||||
#dirtree {width: 100%;}
|
||||
#filelist {height: 270px; overflow:scroll; background-color: white;}
|
||||
.filepicker_element_selected { background-color: lightblue;}
|
||||
|
|
|
|||
|
|
@ -126,7 +126,13 @@ OC={
|
|||
});
|
||||
}
|
||||
},
|
||||
dialogs:OCdialogs
|
||||
dialogs:OCdialogs,
|
||||
mtime2date:function(mtime) {
|
||||
mtime = parseInt(mtime);
|
||||
var date = new Date(1000*mtime);
|
||||
var ret = date.getDate()+'.'+(date.getMonth()+1)+'.'+date.getFullYear()+', '+date.getHours()+':'+date.getMinutes();
|
||||
return ret;
|
||||
}
|
||||
};
|
||||
OC.search.customResults={};
|
||||
OC.search.currentResult=-1;
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@
|
|||
* You should have received a copy of the GNU Affero General Public
|
||||
* License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
* todo(bartek): add select option in form
|
||||
*/
|
||||
|
||||
/**
|
||||
|
|
@ -30,9 +29,9 @@ OCdialogs = {
|
|||
* @param title dialog title
|
||||
* @param callback which will be triggered when user press OK
|
||||
*/
|
||||
alert:function(text, title, callback) {
|
||||
alert:function(text, title, callback, modal) {
|
||||
var content = '<p><span class="ui-icon ui-icon-alert"></span>'+text+'</p>';
|
||||
OCdialogs.message(content, title, OCdialogs.ALERT_DIALOG, OCdialogs.OK_BUTTON, callback);
|
||||
OCdialogs.message(content, title, OCdialogs.ALERT_DIALOG, OCdialogs.OK_BUTTON, callback, modal);
|
||||
},
|
||||
/**
|
||||
* displays info dialog
|
||||
|
|
@ -40,9 +39,9 @@ OCdialogs = {
|
|||
* @param title dialog title
|
||||
* @param callback which will be triggered when user press OK
|
||||
*/
|
||||
info:function(text, title, callback) {
|
||||
info:function(text, title, callback, modal) {
|
||||
var content = '<p><span class="ui-icon ui-icon-info"></span>'+text+'</p>';
|
||||
OCdialogs.message(content, title, OCdialogs.ALERT_DIALOG, OCdialogs.OK_BUTTON, callback);
|
||||
OCdialogs.message(content, title, OCdialogs.ALERT_DIALOG, OCdialogs.OK_BUTTON, callback, modal);
|
||||
},
|
||||
/**
|
||||
* displays confirmation dialog
|
||||
|
|
@ -50,9 +49,9 @@ OCdialogs = {
|
|||
* @param title dialog title
|
||||
* @param callback which will be triggered when user press YES or NO (true or false would be passed to callback respectively)
|
||||
*/
|
||||
confirm:function(text, title, callback) {
|
||||
confirm:function(text, title, callback, modal) {
|
||||
var content = '<p><span class="ui-icon ui-icon-notice"></span>'+text+'</p>';
|
||||
OCdialogs.message(content, title, OCdialogs.ALERT_DIALOG, OCdialogs.YES_NO_BUTTONS, callback);
|
||||
OCdialogs.message(content, title, OCdialogs.ALERT_DIALOG, OCdialogs.YES_NO_BUTTONS, callback, modal);
|
||||
},
|
||||
/**
|
||||
* prompt for user input
|
||||
|
|
@ -60,9 +59,9 @@ OCdialogs = {
|
|||
* @param title dialog title
|
||||
* @param callback which will be triggered when user press OK (input text will be passed to callback)
|
||||
*/
|
||||
prompt:function(text, title, default_value, callback) {
|
||||
prompt:function(text, title, default_value, callback, modal) {
|
||||
var content = '<p><span class="ui-icon ui-icon-pencil"></span>'+text+':<br/><input type="text" id="oc-dialog-prompt-input" value="'+default_value+'" style="width:90%"></p>';
|
||||
OCdialogs.message(content, title, OCdialogs.PROMPT_DIALOG, OCdialogs.OK_CANCEL_BUTTONS, callback);
|
||||
OCdialogs.message(content, title, OCdialogs.PROMPT_DIALOG, OCdialogs.OK_CANCEL_BUTTONS, callback, modal);
|
||||
},
|
||||
/**
|
||||
* prompt user for input with custom form
|
||||
|
|
@ -71,7 +70,7 @@ OCdialogs = {
|
|||
* @param title dialog title
|
||||
* @param callback which will be triggered when user press OK (user answers will be passed to callback in following format: [{name:'return name', value: 'user value'},...])
|
||||
*/
|
||||
form:function(fields, title, callback) {
|
||||
form:function(fields, title, callback, modal) {
|
||||
var content = '<table>';
|
||||
for (var a in fields) {
|
||||
content += '<tr><td>'+fields[a].text+'</td><td>';
|
||||
|
|
@ -96,12 +95,41 @@ OCdialogs = {
|
|||
content += '</td></tr>';
|
||||
}
|
||||
content += '</table>';
|
||||
OCdialogs.message(content, title, OCdialogs.FORM_DIALOG, OCdialogs.OK_CANCEL_BUTTONS, callback);
|
||||
OCdialogs.message(content, title, OCdialogs.FORM_DIALOG, OCdialogs.OK_CANCEL_BUTTONS, callback, modal);
|
||||
},
|
||||
message:function(content, title, dialog_type, buttons, callback) {
|
||||
filepicker:function(title, name_filter, mimetype_filter, callback, modal) {
|
||||
var c_name = 'oc-dialog-'+OCdialogs.dialogs_counter+'-content';
|
||||
var c_id = '#'+c_name;
|
||||
var d = '<div id="'+c_name+'" title="'+title+'"><select id="dirtree"><option value="0">'+OC.currentUser+'</option></select><div id="filelist"></div></div>';
|
||||
if (modal == undefined) modal = false;
|
||||
$('body').append(d);
|
||||
$(c_id + ' #dirtree').focus(function() { var t = $(this); t.data('oldval', t.val())})
|
||||
.change({dcid: c_id}, OC.dialogs.handleTreeListSelect);
|
||||
$(c_id).ready(function(){
|
||||
$.getJSON(OC.webroot+'/files/ajax/rawlist.php', function(r){OC.dialogs.fillFilePicker(r, c_id, callback)});
|
||||
});
|
||||
// build buttons
|
||||
var b = [
|
||||
{text: t('dialogs', 'Choose'), click: function(){
|
||||
if (callback != undefined) {
|
||||
var p = $(c_id).attr('data');
|
||||
if (p == undefined) p = '';
|
||||
callback(p+'/'+$(c_id+' .filepicker_element_selected #filename').text());
|
||||
$(c_id).dialog('close');
|
||||
}
|
||||
}
|
||||
},
|
||||
{text: t('dialogs', 'Cancel'), click: function(){$(c_id).dialog('close'); }}
|
||||
];
|
||||
$(c_id).dialog({width: 4*$(document).width()/9, height: 400, modal: modal, buttons: b});
|
||||
OCdialogs.dialogs_counter++;
|
||||
},
|
||||
// guts, dont use, dont touch
|
||||
message:function(content, title, dialog_type, buttons, callback, modal) {
|
||||
var c_name = 'oc-dialog-'+OCdialogs.dialogs_counter+'-content';
|
||||
var c_id = '#'+c_name;
|
||||
var d = '<div id="'+c_name+'" title="'+title+'">'+content+'</div>';
|
||||
if (modal == undefined) modal = false;
|
||||
$('body').append(d);
|
||||
var b = [];
|
||||
switch (buttons) {
|
||||
|
|
@ -128,7 +156,7 @@ OCdialogs = {
|
|||
break;
|
||||
}
|
||||
var possible_height = ($('tr', d).size()+1)*30;
|
||||
$(c_id).dialog({width: 4*$(document).width()/9, height: possible_height + 120, modal: false, buttons: b});
|
||||
$(c_id).dialog({width: 4*$(document).width()/9, height: possible_height + 120, modal: modal, buttons: b});
|
||||
OCdialogs.dialogs_counter++;
|
||||
},
|
||||
// dialogs buttons types
|
||||
|
|
@ -161,5 +189,42 @@ OCdialogs = {
|
|||
} else {
|
||||
$(c_id).dialog('close');
|
||||
}
|
||||
},
|
||||
fillFilePicker:function(r, dialog_content_id) {
|
||||
var entry_template = '<div onclick="javascript:OC.dialogs.handlePickerClick(this, \'*ENTRYNAME*\',\''+dialog_content_id+'\')" data="*ENTRYTYPE*"><img src="*MIMETYPEICON*" style="margin-right:1em;"><span id="filename">*NAME*</span><div style="float:right;margin-right:1em;">*LASTMODDATE*</div></div>';
|
||||
var names = '';
|
||||
for (var a in r.data) {
|
||||
names += entry_template.replace('*LASTMODDATE*', OC.mtime2date(r.data[a].mtime)).replace('*NAME*', r.data[a].name).replace('*MIMETYPEICON*', OC.webroot+'/core/img/filetypes/'+(r.data[a].type=='dir'?'folder':r.data[a].mimetype.replace('/','-'))+'.png').replace('*ENTRYNAME*', r.data[a].name).replace('*ENTRYTYPE*', r.data[a].type);
|
||||
}
|
||||
$(dialog_content_id + ' #filelist').html(names);
|
||||
},
|
||||
handleTreeListSelect:function(event) {
|
||||
var newval = parseInt($(this).val());
|
||||
var oldval = parseInt($(this).data('oldval'));
|
||||
while (newval != oldval && oldval > 0) {
|
||||
$('option:last', this).remove();
|
||||
$('option:last', this).attr('selected','selected');
|
||||
oldval--;
|
||||
}
|
||||
var skip_first = true;
|
||||
var path = '';
|
||||
$(this).children().each(function(i, element) { if (skip_first) {skip_first = false; return; }path += '/'+$(element).text(); });
|
||||
$(event.data.dcid).attr('data', path);
|
||||
$.getJSON(OC.webroot+'/files/ajax/rawlist.php', {dir: path}, function(r){OC.dialogs.fillFilePicker(r, event.data.dcid)});
|
||||
},
|
||||
// this function is in early development state, please dont use it unlsess you know what you are doing
|
||||
handlePickerClick:function(element, name, dcid) {
|
||||
var p = $(dcid).attr('data');
|
||||
if (p == undefined) p = '';
|
||||
p = p+'/'+name;
|
||||
if ($(element).attr('data') == 'file'){
|
||||
$(element).toggleClass('filepicker_element_selected');
|
||||
return;
|
||||
}
|
||||
$(dcid).attr('data', p);
|
||||
$(dcid + ' #dirtree option:last').removeAttr('selected');
|
||||
var newval = parseInt($(dcid + ' #dirtree option:last').val())+1;
|
||||
$(dcid + ' #dirtree').append('<option selected="selected" value="'+newval+'">'+name+'</option>');
|
||||
$.getJSON(OC.webroot+'/files/ajax/rawlist.php', {dir: p}, function(r){OC.dialogs.fillFilePicker(r, dcid)});
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
<?php
|
||||
|
||||
// only need filesystem apps
|
||||
$RUNTIME_APPTYPES=array('filesystem');
|
||||
|
||||
// Init owncloud
|
||||
require_once('../../lib/base.php');
|
||||
|
||||
OC_JSON::checkLoggedIn();
|
||||
|
||||
// Load the files
|
||||
$dir = isset( $_GET['dir'] ) ? $_GET['dir'] : '';
|
||||
|
||||
// make filelist
|
||||
$files = array();
|
||||
foreach( OC_Files::getdirectorycontent( $dir ) as $i ){
|
||||
$i["date"] = OC_Util::formatDate($i["mtime"] );
|
||||
$files[] = $i;
|
||||
}
|
||||
|
||||
OC_JSON::success(array('data' => $files));
|
||||
|
||||
?>
|
||||
Loading…
Reference in New Issue