Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
typo3
qfq
Commits
caa6e309
Commit
caa6e309
authored
Sep 28, 2016
by
Rafael Ostertag
Browse files
Integrated tinyMCE.
parent
de03fff7
Changes
7
Hide whitespace changes
Inline
Side-by-side
Gruntfile.js
View file @
caa6e309
...
...
@@ -8,7 +8,6 @@ module.exports = function (grunt) {
var
js_sources
=
[
'
javascript/src/Helper/*.js
'
,
'
javascript/src/Element/*.js
'
,
'
javascript/src/Widgets/*.js
'
,
'
javascript/src/*.js
'
];
...
...
@@ -236,83 +235,69 @@ module.exports = function (grunt) {
}
]
},
bootstrap_wysiwyg
:
{
tinymce
:
{
files
:
[
{
cwd
:
'
bower_components/
bootstrap-wysiwyg
/
'
,
cwd
:
'
bower_components/
tinymce
/
'
,
src
:
[
'
bootstrap-wysiwyg
.js
'
'
tinymce.min
.js
'
],
expand
:
true
,
dest
:
typo3_js
,
flatten
:
true
},
{
cwd
:
'
bower_components/
bootstrap-wysiwyg/external/google-code-prettify
'
,
cwd
:
'
bower_components/
tinymce/
'
,
src
:
[
'
prettify
.js
'
'
themes/*/theme.min
.js
'
],
expand
:
true
,
dest
:
typo3_js
,
flatten
:
true
},
{
cwd
:
'
bower_components/bootstrap-wysiwyg/external/
'
,
src
:
[
'
jquery.hotkeys.js
'
],
expand
:
true
,
dest
:
typo3_js
,
flatten
:
tru
e
// Tiny MCE expects the theme js files in ./themes.
flatten
:
fals
e
},
{
cwd
:
'
bower_components/
bootstrap-wysiwyg/external/google-code-prettify
'
,
cwd
:
'
bower_components/
tinymce/
'
,
src
:
[
'
prettify.css
'
'
skins/**
'
],
dest
:
typo3_js
,
expand
:
true
,
dest
:
typo3_css
,
flatten
:
tru
e
// Tiny MCE expects the theme js files in ./themes.
flatten
:
fals
e
}
]
},
bootstrap_wysiwyg
_devel
:
{
tinymce
_devel
:
{
files
:
[
{
cwd
:
'
bower_components/
bootstrap-wysiwyg
/
'
,
cwd
:
'
bower_components/
tinymce
/
'
,
src
:
[
'
bootstrap-wysiwyg
.js
'
'
tinymce.min
.js
'
],
expand
:
true
,
dest
:
'
js/
'
,
flatten
:
true
},
{
cwd
:
'
bower_components/
bootstrap-wysiwyg/external/google-code-prettify
'
,
cwd
:
'
bower_components/
tinymce/
'
,
src
:
[
'
prettify
.js
'
'
themes/*/theme.min
.js
'
],
expand
:
true
,
dest
:
'
js/
'
,
flatten
:
true
},
{
cwd
:
'
bower_components/bootstrap-wysiwyg/external/
'
,
src
:
[
'
jquery.hotkeys.js
'
],
expand
:
true
,
dest
:
'
js/
'
,
flatten
:
tru
e
// Tiny MCE expects the theme js files in ./themes.
flatten
:
fals
e
},
{
cwd
:
'
bower_components/
bootstrap-wysiwyg/external/google-code-prettify
'
,
cwd
:
'
bower_components/
tinymce/
'
,
src
:
[
'
prettify.css
'
'
skins/**
'
],
dest
:
'
js/
'
,
expand
:
true
,
dest
:
'
css/
'
,
flatten
:
tru
e
// Tiny MCE expects the theme js files in ./themes.
flatten
:
fals
e
}
]
},
...
...
bower.json
View file @
caa6e309
...
...
@@ -23,6 +23,6 @@
"eventEmitter"
:
"^4.3.0"
,
"bootstrap-validator"
:
"^0.10.2"
,
"Chart.js"
:
"^2.1.2"
,
"
bootstrap-wysiwyg"
:
"*
"
"
tinymce"
:
"tinymce-dist#^4.4.3
"
}
}
javascript/src/Form.js
View file @
caa6e309
...
...
@@ -71,6 +71,7 @@ var QfqNS = QfqNS || {};
};
n
.
Form
.
prototype
.
submitTo
=
function
(
to
)
{
this
.
eventEmitter
.
emitEvent
(
'
form.submit.before
'
,
n
.
EventEmitter
.
makePayload
(
this
,
null
));
$
.
post
(
to
,
this
.
$form
.
serialize
())
.
done
(
this
.
ajaxSuccessHandler
.
bind
(
this
))
.
fail
(
this
.
submitFailureHandler
.
bind
(
this
));
...
...
javascript/src/Helper/tinyMCE.js
0 → 100644
View file @
caa6e309
/**
* @author Rafael Ostertag <rafael.ostertag@math.uzh.ch>
*/
/* global console */
/* global tinymce */
/* global $ */
/**
* Qfq Namespace
*
* @namespace QfqNS
*/
var
QfqNS
=
QfqNS
||
{};
/**
* Qfq Helper Namespace
*
* @namespace QfqNS.Helper
*/
QfqNS
.
Helper
=
QfqNS
.
Helper
||
{};
(
function
(
n
)
{
'
use strict
'
;
/**
* @function
* @name QfqNS.Helper.jqxEditor
*/
var
tinyMce
=
function
()
{
if
(
!
tinymce
)
{
return
;
}
tinymce
.
init
({
selector
:
"
.qfq-tinymce
"
,
setup
:
function
(
editor
)
{
editor
.
on
(
'
Change
'
,
function
(
e
)
{
console
.
log
(
'
Editor was changed
'
);
var
eventTarget
=
e
.
target
;
var
$parentForm
=
$
(
eventTarget
.
formElement
);
$parentForm
.
trigger
(
"
change
"
);
});
}
});
};
tinyMce
.
prepareSave
=
function
()
{
if
(
!
tinymce
)
{
return
;
}
tinymce
.
triggerSave
();
};
n
.
tinyMce
=
tinyMce
;
})(
QfqNS
.
Helper
);
\ No newline at end of file
javascript/src/QfqForm.js
View file @
caa6e309
...
...
@@ -86,7 +86,10 @@ var QfqNS = QfqNS || {};
n
.
Helper
.
jqxDateTimeInput
();
// Initialize jqxComboBox elements.
n
.
Helper
.
jqxComboBox
();
n
.
Helper
.
jqxEditor
();
// Deprecated
//n.Helper.jqxEditor();
n
.
Helper
.
tinyMce
();
this
.
form
.
on
(
'
form.submit.before
'
,
n
.
Helper
.
tinyMce
.
prepareSave
);
};
n
.
QfqForm
.
prototype
.
on
=
n
.
EventEmitter
.
onMixin
;
...
...
@@ -464,7 +467,7 @@ var QfqNS = QfqNS || {};
if
(
data
.
redirect
===
"
url
"
||
data
[
'
redirect-url
'
])
{
window
.
location
=
data
[
'
redirect-url
'
];
return
;
}
};
...
...
javascript/src/Widgets/RichTextEditor.js
deleted
100644 → 0
View file @
de03fff7
/**
* @author Rafael Ostertag <rafael.ostertag@math.uzh.ch>
*/
/* global $ */
/**
* Qfq Namespace
*
* @namespace QfqNS
*/
var
QfqNS
=
QfqNS
||
{};
/**
* Qfq Widgets Namespace
*
* @namespace QfqNS.Widgets
*/
QfqNS
.
Widgets
=
QfqNS
.
Widgets
||
{};
(
function
(
n
)
{
'
use strict
'
;
/**
* Initialize all rich text editor widgets on a page.
*
* @param richTextEditorClassName the class name used to denote rich text editor @code <div>s
* @constructor
*/
var
RichTextEditor
=
function
(
richTextEditorClassName
)
{
this
.
richtTextEditorJquerySelector
=
RichTextEditor
.
makeJquerySelectorFromClassName
(
richTextEditorClassName
||
"
qfq-richt-text-editor
"
);
this
.
initialize
();
};
/**
* Given a class name, it returns a JQuery selector for the class.
*
* @param className the class name
* @returns {*}
*/
RichTextEditor
.
makeJquerySelectorFromClassName
=
function
(
className
)
{
if
(
!
className
)
{
return
null
;
}
if
(
!
className
.
startsWith
(
"
.
"
))
{
return
"
.
"
+
className
;
}
return
className
;
};
/**
* @private
*/
RichTextEditor
.
prototype
.
initialize
=
function
()
{
this
.
initializeExternalRichTextEditorWidget
();
};
/**
* @private
*/
RichTextEditor
.
prototype
.
initializeExternalRichTextEditorWidget
=
function
()
{
$
(
this
.
richtTextEditorJquerySelector
).
wysiwyg
();
};
RichTextEditor
.
prototype
.
hasEditorContainerId
=
function
(
$richTextContainer
)
{
if
(
$richTextContainer
.
attr
(
"
id
"
))
{
return
true
;
}
else
{
return
false
;
}
};
//n.RichTextEditor = ;
})(
QfqNS
.
Widgets
);
mockup/richtexteditor.html
View file @
caa6e309
...
...
@@ -7,7 +7,6 @@
<link
rel=
"stylesheet"
href=
"../css/bootstrap.min.css"
>
<link
rel=
"stylesheet"
href=
"../css/bootstrap-theme.min.css"
>
<link
rel=
"stylesheet"
href=
"../css/prettify.css"
>
<link
rel=
"stylesheet"
href=
"../css/qfq-bs.css"
>
<title>
Rich Text Editor Mock
</title>
...
...
@@ -15,6 +14,27 @@
</head>
<body>
<div
class=
"container-fluid"
>
<div
class=
"row"
>
<div
class=
"col-md-2 "
>
<div
class=
"btn-toolbar pull-right"
role=
"toolbar"
>
<div
class=
"btn-group"
role=
"group"
>
<button
id=
"save-button"
type=
"button"
class=
"btn btn-default navbar-btn"
><span
class=
"glyphicon glyphicon-ok"
></span></button>
<button
id=
"close-button"
type=
"button"
class=
"btn btn-default navbar-btn"
><span
class=
"glyphicon glyphicon-remove"
></span></button>
</div>
<div
class=
"btn-group"
role=
"group"
>
<button
id=
"delete-button"
type=
"button"
class=
"btn btn-default navbar-btn"
><span
class=
"glyphicon glyphicon-trash"
></span></button>
</div>
<div
class=
"btn-group"
role=
"group"
>
<a
id=
"form-new-button"
href=
"personmock.html?s=badcaffe1"
class=
"btn btn-default navbar-btn"
><span
class=
"glyphicon glyphicon-plus"
></span></a>
</div>
</div>
</div>
</div>
<div
class=
"row hidden-xs"
>
<div
class=
"col-md-12"
>
<h1>
Title with a long text
</h1>
...
...
@@ -22,7 +42,18 @@
</div>
<form
id=
"myForm"
class=
"form-horizontal"
>
<form
id=
"myForm"
class=
"form-horizontal"
action=
"richtexteditor.html"
method=
"post"
>
<div
class=
"form-group"
>
<div
class=
"col-md-2"
>
<label
for=
"name"
class=
"control-label"
>
Name
</label>
</div>
<div
class=
"col-md-6"
>
<input
id=
"name"
name=
"name"
type=
"text"
class=
"form-control"
>
</div>
</div>
<div
class=
"form-group"
>
<div
class=
"col-md-2"
>
...
...
@@ -30,27 +61,32 @@
</div>
<div
class=
"col-md-6"
>
<div
id=
"text"
class=
"qfq-rich-text-editor"
style=
"overflow: scroll; max-height:300px; width: 300px; height: 300px;"
>
Input
</div>
<textarea
id=
"text"
class=
"qfq-tinymce"
name=
"rte"
>
Input
</textarea>
</div>
</div>
<button
type=
"submit"
>
Do
</button>
</form>
</div>
<script
src=
"../js/jquery.min.js"
></script>
<script
src=
"../js/bootstrap.min.js"
></script>
<script
src=
"../js/EventEmitter.min.js"
></script>
<script
src=
"../js/prettify.js"
></script>
<!-- Required by wysiwyg editor -->
<script
src=
"../js/jquery.hotkeys.js"
></script>
<script
src=
"../js/bootstrap-wysiwyg.js"
></script>
<script
src=
"../js/qfq.debug.js"
></script>
<script
src=
"../js/tinymce.min.js"
></script>
<script
type=
"text/javascript"
>
$
(
function
()
{
$
(
"
.qfq-rich-text-editor
"
).
wysiwyg
();
var
qfqPage
=
new
QfqNS
.
QfqPage
({
tabsId
:
'
myTabs
'
,
formId
:
'
myForm
'
,
submitTo
:
'
richtexteditor.html
'
,
deleteUrl
:
'
api/
'
+
$
(
"
#deleteUrl
"
).
val
(),
fileUploadTo
:
'
api/
'
+
$
(
"
#uploadTo
"
).
val
(),
fileDeleteUrl
:
'
api/
'
+
$
(
"
#fileDeleteUrl
"
).
val
(),
});
});
</script>
</body>
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment