Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
R
react-ag-qeditor
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
lib
react-ag-qeditor
Commits
5101cee0
Commit
5101cee0
authored
Oct 09, 2023
by
DenSakh
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: refactoring
parent
5499f2c8
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
99 additions
and
123 deletions
+99
-123
QEditor.jsx
src/QEditor.jsx
+0
-0
Iframe.js
src/extensions/Iframe.js
+67
-85
IframeCustomModal.js
src/modals/IframeCustomModal.js
+13
-13
IframeModal.js
src/modals/IframeModal.js
+19
-16
RemoveIframeModal.js
src/modals/RemoveIframeModal.js
+0
-9
No files found.
src/QEditor.jsx
View file @
5101cee0
This diff is collapsed.
Click to expand it.
src/extensions/Iframe.js
View file @
5101cee0
import
{
Node
,
mergeAttributes
}
from
'@tiptap/core'
const
Iframe
=
Node
.
create
({
name
:
'iframe'
,
group
:
'block'
,
selectable
:
false
,
draggable
:
true
,
atom
:
true
,
name
:
'iframe'
,
group
:
'block'
,
selectable
:
false
,
draggable
:
true
,
atom
:
true
,
addAttributes
()
{
return
{
"src"
:
{
default
:
null
},
"frameborder"
:
{
default
:
0
,
},
"allowfullscreen"
:
{
default
:
true
,
parseHTML
:
()
=>
{
console
.
log
(
this
)
},
},
"setInnerModalType"
:
{
default
:
null
},
"setModalIsOpen"
:
{
default
:
null
},
"setModalTitle"
:
{
default
:
null
},
"setCurrentRemoveIframe"
:
{
default
:
null
}
addAttributes
()
{
return
{
src
:
{
default
:
null
},
frameborder
:
{
default
:
0
},
allowfullscreen
:
{
default
:
true
,
parseHTML
:
()
=>
{
console
.
log
(
this
)
}
},
}
}
},
parseHTML
()
{
return
[
{
tag
:
'iframe'
,
},
]
},
parseHTML
()
{
return
[
{
tag
:
'iframe'
}
]
},
renderHTML
({
HTMLAttributes
})
{
return
[
'iframe'
,
mergeAttributes
(
HTMLAttributes
)];
},
renderHTML
({
HTMLAttributes
})
{
return
[
'iframe'
,
mergeAttributes
(
HTMLAttributes
)]
},
addNodeView
()
{
return
({
editor
,
node
,
...
a
})
=>
{
const
container
=
document
.
createElement
(
'div'
);
addNodeView
()
{
return
({
editor
,
node
,
...
a
})
=>
{
const
container
=
document
.
createElement
(
'div'
)
const
iframe
=
document
.
createElement
(
'iframe'
);
iframe
.
src
=
node
.
attrs
.
src
;
iframe
.
allowfullscreen
=
node
.
attrs
.
allowfullscreen
;
iframe
.
classList
.
add
(
'customIframe'
);
const
iframe
=
document
.
createElement
(
'iframe'
)
iframe
.
src
=
node
.
attrs
.
src
iframe
.
allowfullscreen
=
node
.
attrs
.
allowfullscreen
iframe
.
classList
.
add
(
'customIframe'
)
const
closeBtn
=
document
.
createElement
(
'button'
);
closeBtn
.
textContent
=
'X'
;
closeBtn
.
classList
.
add
(
'closeBtn'
);
closeBtn
.
addEventListener
(
'click'
,
function
()
{
try
{
node
.
attrs
.
setModalTitle
(
'Вы уверены, что хотите удалить?'
);
node
.
attrs
.
setInnerModalType
(
'remove_iframe'
);
node
.
attrs
.
setModalIsOpen
(
true
);
node
.
attrs
.
setCurrentRemoveIframe
(
container
);
}
catch
{
container
.
remove
();
}
});
const
closeBtn
=
document
.
createElement
(
'button'
)
closeBtn
.
textContent
=
'X'
closeBtn
.
classList
.
add
(
'closeBtn'
)
closeBtn
.
addEventListener
(
'click'
,
function
()
{
container
.
remove
()
})
// if (editor.isEditable) {
// container.classList.add('pointer-events-none');
// }
// if (editor.isEditable) {
// container.classList.add('pointer-events-none');
// }
container
.
append
(
closeBtn
,
iframe
);
container
.
append
(
closeBtn
,
iframe
)
return
{
dom
:
container
,
}
}
},
addCommands
()
{
return
{
setIframe
:
(
options
)
=>
({
tr
,
dispatch
})
=>
{
const
{
selection
}
=
tr
const
node
=
this
.
type
.
create
(
options
)
return
{
dom
:
container
}
}
},
if
(
dispatch
)
{
tr
.
replaceRangeWith
(
selection
.
from
,
selection
.
to
,
node
)
}
addCommands
()
{
return
{
setIframe
:
(
options
)
=>
({
tr
,
dispatch
})
=>
{
const
{
selection
}
=
tr
const
node
=
this
.
type
.
create
(
options
)
return
true
},
if
(
dispatch
)
{
tr
.
replaceRangeWith
(
selection
.
from
,
selection
.
to
,
node
)
}
return
true
}
},
});
}
}
})
export
default
Iframe
;
export
default
Iframe
src/modals/IframeCustomModal.js
View file @
5101cee0
import
React
,
{
Fragment
}
from
"react"
;
import
React
,
{
Fragment
}
from
'react'
export
default
function
IframeCustomModal
({
embedContent
,
setEmbedContent
})
{
return
(
<
Fragment
>
<
textarea
style
=
{{
width
:
'100%'
,
height
:
'100%'
}}
rows
=
{
18
}
value
=
{
embedContent
}
placeholder
=
{
'<iframe></iframe>'
}
onInput
=
{(
e
)
=>
setEmbedContent
(
e
.
target
.
value
)}
/
>
<
/Fragment
>
)
export
default
function
IframeCustomModal
({
embedContent
,
setEmbedContent
})
{
return
(
<
Fragment
>
<
textarea
style
=
{{
width
:
'100%'
,
height
:
'100%'
}}
rows
=
{
18
}
value
=
{
embedContent
}
placeholder
=
'<iframe></iframe>'
onInput
=
{(
e
)
=>
setEmbedContent
(
e
.
target
.
value
)}
/
>
<
/Fragment
>
)
}
src/modals/IframeModal.js
View file @
5101cee0
import
React
,
{
Fragment
}
from
"react"
;
import
React
,
{
Fragment
}
from
'react'
export
default
function
IframeModal
({
embedContent
,
setEmbedContent
})
{
return
(
<
Fragment
>
<
input
type
=
"text"
value
=
{
embedContent
}
placeholder
=
{
'https://'
}
onInput
=
{(
e
)
=>
setEmbedContent
(
e
.
target
.
value
)
}
/
>
<
ul
className
=
{
'atma-editor-soc-video'
}
>
<
li
className
=
{
'youtube'
}
/
>
<
li
className
=
{
'vimeo'
}
/
>
{
/* <li className={'vk'}/> */
}
<
li
className
=
{
'ok'
}
/
>
<
li
className
=
{
'rutube'
}
/
>
<
/ul
>
<
/Fragment
>
)
export
default
function
IframeModal
({
embedContent
,
setEmbedContent
})
{
return
(
<
Fragment
>
<
input
type
=
'text'
value
=
{
embedContent
}
placeholder
=
'https://'
onInput
=
{(
e
)
=>
setEmbedContent
(
e
.
target
.
value
)}
/
>
<
ul
className
=
'atma-editor-soc-video'
>
<
li
className
=
'youtube'
/>
<
li
className
=
'vimeo'
/>
{
/* <li className={'vk'}/> */
}
<
li
className
=
'ok'
/>
<
li
className
=
'rutube'
/>
<
/ul
>
<
/Fragment
>
)
}
src/modals/RemoveIframeModal.js
deleted
100644 → 0
View file @
5499f2c8
import
React
,
{
Fragment
}
from
"react"
;
export
default
function
RemoveIframeModal
(){
return
(
<
Fragment
>
<
/Fragment
>
)
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a 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