aboutsummaryrefslogtreecommitdiff
path: root/views/default
diff options
context:
space:
mode:
Diffstat (limited to 'views/default')
-rw-r--r--views/default/core/avatar/crop.php16
-rw-r--r--views/default/core/avatar/upload.php26
-rw-r--r--views/default/css/screen.php30
-rw-r--r--views/default/forms/avatar/crop.php21
-rw-r--r--views/default/forms/avatar/upload.php2
5 files changed, 82 insertions, 13 deletions
diff --git a/views/default/core/avatar/crop.php b/views/default/core/avatar/crop.php
new file mode 100644
index 000000000..499e2af4e
--- /dev/null
+++ b/views/default/core/avatar/crop.php
@@ -0,0 +1,16 @@
+<?php
+/**
+ * Avatar cropping view
+ *
+ * @uses vars['entity']
+ */
+
+?>
+<div id="avatar-croppingtool">
+ <label><?php echo elgg_echo('avatar:crop:title'); ?></label>
+ <br />
+ <p>
+ <?php echo elgg_echo("avatar:create:instructions"); ?>
+ </p>
+ <?php echo elgg_view_form('avatar/crop', array(), $vars); ?>
+</div>
diff --git a/views/default/core/avatar/upload.php b/views/default/core/avatar/upload.php
new file mode 100644
index 000000000..8d920a900
--- /dev/null
+++ b/views/default/core/avatar/upload.php
@@ -0,0 +1,26 @@
+<?php
+/**
+ * Avatar upload view
+ *
+ * @uses $vars['entity']
+ */
+
+$user_avatar = $vars['entity']->getIcon('medium');
+
+?>
+
+<p class="mtm">
+ <?php echo elgg_echo('avatar:upload:instructions'); ?>
+</p>
+
+<div id="current-user-avatar">
+ <label><?php echo elgg_echo('avatar:current'); ?></label>
+ <?php echo "<img src=\"{$user_avatar}\" alt=\"avatar\" />"; ?>
+</div>
+
+<div id="avatar-upload">
+<?php
+ $form_params = array('enctype' => 'multipart/form-data');
+ echo elgg_view_form('avatar/upload', $form_params, $vars);
+?>
+</div>
diff --git a/views/default/css/screen.php b/views/default/css/screen.php
index e75fea1ec..cbf4e2b2d 100644
--- a/views/default/css/screen.php
+++ b/views/default/css/screen.php
@@ -107,6 +107,36 @@ echo elgg_view('css/elements/skin', $vars);
}
/* ***************************************
+ AVATAR
+*************************************** */
+#avatar-upload {
+ height:145px;
+}
+#current-user-avatar {
+ float:left;
+ width:160px;
+ height:130px;
+ border-right:1px solid #cccccc;
+ margin:0 20px 0 0;
+}
+#avatar-croppingtool {
+ border-top: 1px solid #cccccc;
+ margin:20px 0 0 0;
+ padding:10px 0 0 0;
+}
+#user-avatar {
+ float: left;
+ margin-right: 20px;
+}
+#user-avatar-preview {
+ float: left;
+ position: relative;
+ overflow: hidden;
+ width: 100px;
+ height: 100px;
+}
+
+/* ***************************************
WIDGETS
*************************************** */
.widget-column {
diff --git a/views/default/forms/avatar/crop.php b/views/default/forms/avatar/crop.php
index 1082ab803..856546020 100644
--- a/views/default/forms/avatar/crop.php
+++ b/views/default/forms/avatar/crop.php
@@ -9,10 +9,7 @@ $master_image = $vars['entity']->getIcon('master');
?>
<p>
- <?php echo elgg_echo("avatar:create:instructions"); ?>
-</p>
-<p>
- <img id="user_avatar" src="<?php echo $master_image; ?>" alt="<?php echo elgg_echo('avatar'); ?>" />
+ <img id="user-avatar" src="<?php echo $master_image; ?>" alt="<?php echo elgg_echo('avatar'); ?>" />
</p>
<div class="clearfloat"></div>
@@ -28,7 +25,7 @@ echo elgg_view('input/submit', array('value' => elgg_echo('avatar:create')));
?>
<!-- grab the required js for icon cropping -->
-<script type="text/javascript" src="<?php echo elgg_get_site_url(); ?>mod/profile/views/default/js/jquery.imgareaselect-0.8.min.js"></script>
+<script type="text/javascript" src="<?php echo elgg_get_site_url(); ?>vendors/jquery/jquery.imgareaselect-0.8.min.js"></script>
<script type="text/javascript">
@@ -39,11 +36,11 @@ echo elgg_view('input/submit', array('value' => elgg_echo('avatar:create')));
return;
}
- var origWidth = $("#user_avatar").width(); //get the width of the users master photo
- var origHeight = $("#user_avatar").height(); //get the height of the users master photo
+ var origWidth = $("#user-avatar").width(); //get the width of the users master photo
+ var origHeight = $("#user-avatar").height(); //get the height of the users master photo
var scaleX = 100 / selection.width;
var scaleY = 100 / selection.height;
- $('#user_avatar_preview > img').css({
+ $('#user-avatar-preview > img').css({
width: Math.round(scaleX * origWidth) + 'px',
height: Math.round(scaleY * origHeight) + 'px',
marginLeft: '-' + Math.round(scaleX * selection.x1) + 'px',
@@ -60,12 +57,12 @@ echo elgg_view('input/submit', array('value' => elgg_echo('avatar:create')));
}
$(document).ready(function() {
- $('<div id="user_avatar_preview"><img src="<?php echo $master_image; ?>" /></div>').insertAfter($('#user_avatar'));
- $('<div id="user_avatar_preview_title"><label><?php echo elgg_echo('avatar:preview'); ?></label></div>').insertBefore($('#user_avatar_preview'));
+ $('<div id="user-avatar-preview"><img src="<?php echo $master_image; ?>" /></div>').insertAfter($('#user-avatar'));
+ $('<div id="user-avatar-preview-title"><label><?php echo elgg_echo('avatar:preview'); ?></label></div>').insertBefore($('#user-avatar-preview'));
// this produces the coordinates
- $('#user_avatar').imgAreaSelect({ selectionOpacity: 0, onSelectEnd: selectChange });
+ $('#user-avatar').imgAreaSelect({ selectionOpacity: 0, onSelectEnd: selectChange });
// show the preview
- $('#user_avatar').imgAreaSelect({ aspectRatio: '1:1', onSelectChange: preview });
+ $('#user-avatar').imgAreaSelect({ aspectRatio: '1:1', onSelectChange: preview });
});
</script>
diff --git a/views/default/forms/avatar/upload.php b/views/default/forms/avatar/upload.php
index 733e2996c..4354d691a 100644
--- a/views/default/forms/avatar/upload.php
+++ b/views/default/forms/avatar/upload.php
@@ -8,7 +8,7 @@
echo elgg_view('input/hidden', array('internalname' => 'guid', 'value' => $vars['entity']->guid));
?>
<p>
- <label><?php echo elgg_echo("profile:editicon"); ?></label><br />
+ <label><?php echo elgg_echo("avatar:upload"); ?></label><br />
<?php echo elgg_view("input/file",array('internalname' => 'avatar')); ?>
<br />
<?php echo elgg_view('input/submit', array('value' => elgg_echo('upload'))); ?>