css-template editor tweaks, more compat polish
This commit is contained in:
@@ -114,7 +114,10 @@ module.exports = function (grunt) {
|
||||
},
|
||||
|
||||
vs: {
|
||||
files: [{ dest: '<%= vsdir %>', src : '**', expand: true, cwd: '<%= distdir %>' }]
|
||||
files: [{ dest: '<%= vsdir %>/js', src : '**', expand: true, cwd: '<%= distdir %>/js/' }]
|
||||
},
|
||||
packages: {
|
||||
files: [{ dest: '<%= vsdir %>/../App_Plugins', src : '**', expand: true, cwd: 'src/packages/' }]
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
22
src/Umbraco.Web.UI.Client/lib/umbraco/compat.js
Normal file
22
src/Umbraco.Web.UI.Client/lib/umbraco/compat.js
Normal file
@@ -0,0 +1,22 @@
|
||||
/* contains random bits and pieces we neede to make the U6 UI behave */
|
||||
jQuery(document).ready(function () {
|
||||
scaleScrollables("body");
|
||||
|
||||
jQuery(window).bind("resize", function () {
|
||||
scaleScrollables("body");
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
function scaleScrollables(selector){
|
||||
jQuery(".umb-scrollable").each(function () {
|
||||
var el = jQuery(this);
|
||||
var totalOffset = 0;
|
||||
var offsety = el.data("offset-y");
|
||||
|
||||
if (offsety != undefined)
|
||||
totalOffset += offsety;
|
||||
|
||||
el.height($(window).height() - (el.offset().top + totalOffset));
|
||||
});
|
||||
}
|
||||
@@ -12,103 +12,113 @@ angular.module('umbraco.services')
|
||||
modalClass = options.modalClass || "umb-modalcolumn",
|
||||
templateUrl = options.template || "views/common/notfound.html";
|
||||
|
||||
var callback = options.callback;
|
||||
var $modal = $('<div class="modal umb-modal hide" data-backdrop="false" tabindex="-1"></div>');
|
||||
var id = templateUrl.replace('.html', '').replace(/[\/|\.|:]/g, "-") + '-' + scope.$id;
|
||||
|
||||
$modal
|
||||
.attr('id', id)
|
||||
.addClass(animationClass)
|
||||
.addClass(modalClass);
|
||||
var callback = options.callback;
|
||||
var $modal = $('<div class="modal umb-modal hide" data-backdrop="false" tabindex="-1"></div>');
|
||||
var id = templateUrl.replace('.html', '').replace(/[\/|\.|:]/g, "-") + '-' + scope.$id;
|
||||
|
||||
$rootScope.$on("closeDialogs", function () {
|
||||
$modal.modal("hide");
|
||||
});
|
||||
$modal
|
||||
.attr('id', id)
|
||||
.addClass(animationClass)
|
||||
.addClass(modalClass);
|
||||
|
||||
$rootScope.$on("closeDialogs", function () {
|
||||
$modal.modal("hide");
|
||||
|
||||
$modal.remove();
|
||||
$("#" + $modal.attr("id")).remove();
|
||||
});
|
||||
|
||||
|
||||
if(options.iframe) {
|
||||
var html = $("<iframe auto-scale='0' src='" + templateUrl + "' style='width: 100%; height: 100%;'></iframe>");
|
||||
$modal.html(html);
|
||||
$('body').append($modal);
|
||||
|
||||
if(width){
|
||||
$modal.css("width", width);
|
||||
}
|
||||
|
||||
if(options.iframe) {
|
||||
var html = $("<iframe src='" + templateUrl + "' style='width: 100%; height: 100%;'></iframe>");
|
||||
$modal.html(html);
|
||||
$('body').append($modal);
|
||||
|
||||
//Autoshow
|
||||
if (options.show) {
|
||||
$modal.modal('show');
|
||||
}
|
||||
|
||||
return $modal;
|
||||
} else {
|
||||
if (options.show) {
|
||||
$modal.modal('show');
|
||||
}
|
||||
|
||||
return $modal;
|
||||
} else {
|
||||
return $q.when($templateCache.get(templateUrl) || $http.get(templateUrl, { cache: true }).then(function (res) { return res.data; }))
|
||||
.then(function onSuccess(template) {
|
||||
.then(function onSuccess(template) {
|
||||
|
||||
// Build modal object
|
||||
$modal
|
||||
.html(template);
|
||||
// Build modal object
|
||||
$modal
|
||||
.html(template);
|
||||
|
||||
|
||||
$('body').append($modal);
|
||||
$('body').append($modal);
|
||||
|
||||
// Compile modal content
|
||||
$timeout(function () {
|
||||
$compile($modal)(scope);
|
||||
});
|
||||
// Compile modal content
|
||||
$timeout(function () {
|
||||
$compile($modal)(scope);
|
||||
});
|
||||
|
||||
//Scope to handle data from the modal form
|
||||
scope.dialogData = {};
|
||||
scope.dialogData.selection = [];
|
||||
//Scope to handle data from the modal form
|
||||
scope.dialogData = {};
|
||||
scope.dialogData.selection = [];
|
||||
|
||||
// Provide scope display functions
|
||||
scope.$modal = function (name) {
|
||||
$modal.modal(name);
|
||||
};
|
||||
// Provide scope display functions
|
||||
scope.$modal = function (name) {
|
||||
$modal.modal(name);
|
||||
};
|
||||
|
||||
scope.hide = function () {
|
||||
$modal.modal('hide');
|
||||
$('body').remove($modal);
|
||||
};
|
||||
scope.hide = function () {
|
||||
$modal.modal('hide');
|
||||
|
||||
$modal.remove();
|
||||
$("#" + $modal.attr("id")).remove();
|
||||
};
|
||||
|
||||
scope.show = function () {
|
||||
$modal.modal('show');
|
||||
};
|
||||
scope.show = function () {
|
||||
$modal.modal('show');
|
||||
};
|
||||
|
||||
scope.submit = function (data) {
|
||||
$modal.modal('hide');
|
||||
$('body').remove($modal);
|
||||
scope.submit = function (data) {
|
||||
if(callback){
|
||||
callback(data);
|
||||
}
|
||||
|
||||
callback(data);
|
||||
};
|
||||
$modal.modal('hide');
|
||||
|
||||
scope.select = function (item) {
|
||||
if (scope.dialogData.selection.indexOf(item) < 0) {
|
||||
scope.dialogData.selection.push(item);
|
||||
}
|
||||
};
|
||||
$modal.remove();
|
||||
$("#" + $modal.attr("id")).remove();
|
||||
};
|
||||
|
||||
scope.dismiss = scope.hide;
|
||||
scope.select = function (item) {
|
||||
if (scope.dialogData.selection.indexOf(item) < 0) {
|
||||
scope.dialogData.selection.push(item);
|
||||
}
|
||||
};
|
||||
|
||||
// Emit modal events
|
||||
angular.forEach(['show', 'shown', 'hide', 'hidden'], function (name) {
|
||||
$modal.on(name, function (ev) {
|
||||
scope.$emit('modal-' + name, ev);
|
||||
});
|
||||
});
|
||||
scope.dismiss = scope.hide;
|
||||
|
||||
// Support autofocus attribute
|
||||
$modal.on('shown', function (event) {
|
||||
$('input[autofocus]', $modal).first().trigger('focus');
|
||||
});
|
||||
// Emit modal events
|
||||
angular.forEach(['show', 'shown', 'hide', 'hidden'], function (name) {
|
||||
$modal.on(name, function (ev) {
|
||||
scope.$emit('modal-' + name, ev);
|
||||
});
|
||||
});
|
||||
|
||||
// Support autofocus attribute
|
||||
$modal.on('shown', function (event) {
|
||||
$('input[autofocus]', $modal).first().trigger('focus');
|
||||
});
|
||||
|
||||
//Autoshow
|
||||
if (options.show) {
|
||||
$modal.modal('show');
|
||||
if (options.show) {
|
||||
$modal.modal('show');
|
||||
}
|
||||
|
||||
$rootScope.$on("closeDialogs", function () {
|
||||
$modal.modal("hide");
|
||||
});
|
||||
|
||||
//Return the modal object
|
||||
return $modal;
|
||||
});
|
||||
return $modal;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -5,7 +5,6 @@
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
body {
|
||||
@@ -13,7 +12,6 @@ body {
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.padded {
|
||||
|
||||
@@ -3,6 +3,9 @@
|
||||
|
||||
/* CONTAINS ALL HACKS AND OTHER QUICK-FIXES THAT WE MUST HANDLE BEFORE A RELEASE */
|
||||
|
||||
/*ensures dialogs doesnt have side-by-side labels */
|
||||
.umbracoDialog .controls-row{margin-left: 0px !important;}
|
||||
|
||||
.controls-row img {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,29 @@
|
||||
<div class="searchPreview" ng-controller="Umbraco.Editors.SimpleEditorController">
|
||||
|
||||
|
||||
<h3><a href="#">{{content.name}}</a></h3>
|
||||
<a href="#">http://localhost/{{content.name}}</a>
|
||||
<p>{{tab.properties[1].value}}</p>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.searchPreview h3{
|
||||
font-size: 16px !Important;
|
||||
line-height: 16px !Important;
|
||||
padding: 0px; margin: 0px;
|
||||
}
|
||||
|
||||
.searchPreview h3 a{
|
||||
color: #12c; text-decoration: underline;}
|
||||
|
||||
.searchPreview a{
|
||||
color: #009933;
|
||||
font-size: 14px;
|
||||
|
||||
}
|
||||
|
||||
.searchPreview p{
|
||||
color: #444;
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,6 @@
|
||||
(function () {
|
||||
angular.module("umbraco").controller("Umbraco.Editors.SimpleEditorController",
|
||||
function ($rootScope, $scope, notificationsService, dialogService) {
|
||||
|
||||
});
|
||||
})();
|
||||
@@ -0,0 +1,14 @@
|
||||
{
|
||||
propertyEditors: [
|
||||
{
|
||||
id: "0BA0F832-D759-4526-9B3E-95BBFC98F82E",
|
||||
name: "My Simple Editor",
|
||||
editor: {
|
||||
view: "~/App_Plugins/SimpleEditor/PropertyEditors/Views/simpleeditor.html"
|
||||
}
|
||||
}
|
||||
],
|
||||
javascript: [
|
||||
'~/App_Plugins/SimpleEditor/PropertyEditors/Js/SimpleEditor.js'
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
<div ng-controller="uComponents.Editors.MNTPController">
|
||||
<ul class="nav nav-stacked">
|
||||
<li ng-repeat="node in model.value">
|
||||
<a href="#" prevent-default>
|
||||
<i class="icon umb-tree-icon sprTree {{node.icon}}"></i>
|
||||
{{node.name}}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#" ng-click="openContentPicker(model.value)" prevent-default>
|
||||
<i class="icon icon-plus"></i> Add
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<br/><br/>
|
||||
</div>
|
||||
@@ -0,0 +1,16 @@
|
||||
//this controller simply tells the dialogs service to open a mediaPicker window
|
||||
//with a specified callback, this callback will receive an object with a selection on it
|
||||
angular.module('umbraco')
|
||||
.controller("uComponents.Editors.MNTPController",
|
||||
function($scope, dialogService){
|
||||
|
||||
alert("node!");
|
||||
|
||||
$scope.openContentPicker =function(value){
|
||||
var d = dialogService.contentPicker({scope: $scope, callback: populate});
|
||||
};
|
||||
|
||||
function populate(data){
|
||||
$scope.model.value = data.selection;
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
propertyEditors: [
|
||||
{
|
||||
id: "7e062c13-7c41-4ad9-b389-41d88aeef87c",
|
||||
name: "Multinode treepicker",
|
||||
editor: {
|
||||
view: "~/App_Plugins/property editors/mntp/mntp.html"
|
||||
}
|
||||
}
|
||||
]
|
||||
,
|
||||
javascript: [
|
||||
'~/App_Plugins/property editors/mntp/mntp.js'
|
||||
]
|
||||
}
|
||||
@@ -33,10 +33,7 @@ angular.module("umbraco")
|
||||
var imagePropVal = umbImageHelper.getImagePropertyVaue({imageModel: img, scope: $scope});
|
||||
|
||||
var data = {
|
||||
src: (imagePropVal != null && imagePropVal != "")
|
||||
? imagePropVal
|
||||
: "nothing.jpg",
|
||||
style: 'width: 100px; height: 100px',
|
||||
src: (imagePropVal != null && imagePropVal != "") ? imagePropVal: "nothing.jpg",
|
||||
id: '__mcenew'
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user