Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
O
OpenBoard
Project
Project
Details
Activity
Releases
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
lifo
Nicolas Ollinger
OpenBoard
Commits
56e73ace
Commit
56e73ace
authored
Aug 15, 2012
by
unknown
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
some fixes in 'Transformation' widget
parent
4eda8fd7
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
430 additions
and
390 deletions
+430
-390
ubw-main.js
...ary/interactivities/Transformation.wgt/js/lib/ubw-main.js
+259
-222
main.js
...ces/library/interactivities/Transformation.wgt/js/main.js
+171
-168
No files found.
resources/library/interactivities/Transformation.wgt/js/lib/ubw-main.js
View file @
56e73ace
...
...
@@ -13,257 +13,294 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
function
log
(
object
)
{
console
.
log
(
object
);
console
.
log
(
object
);
}
function
initAfterI18nMessagesLoaded
(
reload
,
templates
,
callbacks
)
{
document
.
title
=
fr
.
njin
.
i18n
.
document
.
title
;
document
.
title
=
fr
.
njin
.
i18n
.
document
.
title
;
var
ubwidget
=
$
(
"#ubwidget"
);
var
ubwidget
=
$
(
"#ubwidget"
);
var
parameters
=
Object
.
create
(
Parameters
,{
container
:
{
value
:
ubwidget
},
delegate
:
{
value
:
window
.
sankore
||
Object
.
create
(
ParametersDelegate
)
}
});
var
parameters
=
Object
.
create
(
Parameters
,{
container
:
{
value
:
ubwidget
},
delegate
:
{
value
:
window
.
sankore
||
Object
.
create
(
ParametersDelegate
)
}
});
var
app
=
Object
.
create
(
App
,
{
container
:
{
value
:
ubwidget
},
parameters
:
{
value
:
parameters
},
reload
:
{
value
:
reload
}
});
var
app
=
Object
.
create
(
App
,
{
container
:
{
value
:
ubwidget
},
parameters
:
{
value
:
parameters
},
reload
:
{
value
:
reload
}
});
app
.
init
();
app
.
onEdit
=
false
;
app
.
init
();
app
.
onEdit
=
false
;
if
(
templates
.
toolbar
)
{
$
(
"#toolbar"
).
html
(
Mustache
.
render
(
templates
.
toolbar
,
window
));
}
if
(
templates
.
parameters
)
{
$
(
"#parameters"
).
html
(
Mustache
.
render
(
templates
.
parameters
,
window
));
}
if
(
templates
.
toolbar
)
{
$
(
"#toolbar"
).
html
(
Mustache
.
render
(
templates
.
toolbar
,
window
));
}
if
(
templates
.
parameters
)
{
$
(
"#parameters"
).
html
(
Mustache
.
render
(
templates
.
parameters
,
window
));
}
if
(
callbacks
.
onTemplatesLoaded
&&
typeof
callbacks
.
onTemplatesLoaded
===
'function'
)
{
callbacks
.
onTemplatesLoaded
(
app
);
}
if
(
callbacks
.
onTemplatesLoaded
&&
typeof
callbacks
.
onTemplatesLoaded
===
'function'
)
{
callbacks
.
onTemplatesLoaded
(
app
);
}
log
(
"Update setting views with stored parameters"
);
$
(
"#parameters (input|select)[role=parameter]"
).
each
(
function
(
i
,
input
)
{
(
function
(
input
){
var
key
=
input
.
name
;
var
type
=
input
.
type
;
var
isRadioOrcheckbox
=
(
type
!==
undefined
&&
(
type
===
"checkbox"
||
type
===
"radio"
));
var
stored
=
parameters
.
value
(
key
);
if
(
isRadioOrcheckbox
)
$
(
input
).
attr
(
"checked"
,
(
typeof
stored
===
"string"
?
stored
===
"true"
:
stored
));
else
$
(
input
).
val
(
stored
);
$
(
input
).
change
(
function
(){
var
val
=
(
isRadioOrcheckbox
?
$
(
this
).
is
(
":checked"
)
:
$
(
this
).
val
());
parameters
.
value
(
key
,
val
);
});
})(
input
);
});
log
(
"Update setting views with stored parameters"
);
$
(
"#parameters (input|select)[role=parameter]"
).
each
(
function
(
i
,
input
)
{
(
function
(
input
){
var
key
=
input
.
name
;
var
type
=
input
.
type
;
var
isRadioOrcheckbox
=
(
type
!==
undefined
&&
(
type
===
"checkbox"
||
type
===
"radio"
));
var
stored
=
parameters
.
value
(
key
);
if
(
isRadioOrcheckbox
)
$
(
input
).
attr
(
"checked"
,
(
typeof
stored
===
"string"
?
stored
===
"true"
:
stored
));
else
$
(
input
).
val
(
stored
);
$
(
input
).
change
(
function
(){
var
val
=
(
isRadioOrcheckbox
?
$
(
this
).
is
(
":checked"
)
:
$
(
this
).
val
());
parameters
.
value
(
key
,
val
);
});
})(
input
);
});
log
(
"Toobar Initialisation"
);
$
(
"button[role=edit]"
).
click
(
function
(){
app
.
onEdit
=
true
;
$
(
document
.
body
).
addClass
(
"onEdit"
);
if
(
callbacks
.
onEdit
&&
typeof
callbacks
.
onEdit
===
'function'
)
{
callbacks
.
onEdit
(
app
);
}
});
$
(
"button[role=view]"
).
click
(
function
(){
app
.
onEdit
=
false
;
$
(
document
.
body
).
removeClass
(
"onEdit"
);
if
(
callbacks
.
onView
&&
typeof
callbacks
.
onView
===
'function'
)
{
callbacks
.
onView
(
app
);
}
});
$
(
"button[role=reload]"
).
click
(
function
(){
app
.
reload
();
});
$
(
"button[role=help]"
).
click
(
function
(){
$
(
"body"
).
toggleClass
(
"showHelp"
);
});
log
(
"Toobar Initialisation"
);
$
(
"button[role=edit]"
).
click
(
function
(){
app
.
onEdit
=
true
;
if
(
window
.
sankore
)
window
.
sankore
.
enableDropOnWidget
(
app
.
onEdit
);
$
(
document
.
body
).
addClass
(
"onEdit"
);
if
(
callbacks
.
onEdit
&&
typeof
callbacks
.
onEdit
===
'function'
)
{
callbacks
.
onEdit
(
app
);
}
});
$
(
"button[role=view]"
).
click
(
function
(){
app
.
onEdit
=
false
;
if
(
window
.
sankore
)
window
.
sankore
.
enableDropOnWidget
(
app
.
onEdit
);
$
(
document
.
body
).
removeClass
(
"onEdit"
);
if
(
callbacks
.
onView
&&
typeof
callbacks
.
onView
===
'function'
)
{
callbacks
.
onView
(
app
);
}
});
$
(
"button[role=reload]"
).
click
(
function
(){
app
.
reload
();
});
$
(
"button[role=help]"
).
click
(
function
(){
$
(
"body"
).
toggleClass
(
"showHelp"
);
});
$
(
"select[name='themes']"
).
change
(
function
()
{
$
(
"body"
).
get
(
0
).
className
=
$
(
"body"
)[
0
].
className
.
replace
(
/
\b
theme-
[^\s]
*
\b
/gi
,
''
);
$
(
"body"
).
addClass
(
"theme-"
+
$
(
this
).
val
());
});
$
(
"body"
).
addClass
(
"theme-"
+
$
(
"select[name='themes']"
).
val
());
$
(
"select[name='themes']"
).
change
(
function
()
{
$
(
"body"
).
get
(
0
).
className
=
$
(
"body"
)[
0
].
className
.
replace
(
/
\b
theme-
[^\s]
*
\b
/gi
,
''
);
$
(
"body"
).
addClass
(
"theme-"
+
$
(
this
).
val
());
});
$
(
"body"
).
addClass
(
"theme-"
+
$
(
"select[name='themes']"
).
val
());
}
function
init
(
reload
,
templates
,
callbacks
){
var
locale
=
window
.
sankore
?
sankore
.
locale
()
:
""
;
$
.
i18n
.
properties
({
name
:
'Messages'
,
path
:
'i18n/'
,
language
:
locale
,
callback
:
function
(){
initAfterI18nMessagesLoaded
(
reload
,
templates
,
callbacks
);
}
});
var
locale
=
window
.
sankore
?
sankore
.
locale
()
:
""
;
$
.
i18n
.
properties
({
name
:
'Messages'
,
path
:
'i18n/'
,
language
:
locale
,
callback
:
function
(){
initAfterI18nMessagesLoaded
(
reload
,
templates
,
callbacks
);
}
});
}
var
Parameters
=
(
function
(){
var
self
=
Object
.
create
({},
{
container
:
{
value
:
null
},
delegate
:
{
value
:
null
},
value
:
{
value
:
function
(
key
,
value
)
{
if
(
value
===
undefined
)
{
var
val
=
this
.
delegate
.
preference
(
key
);
log
(
"Retrieve parameter value ["
+
val
+
"] as type ["
+
(
typeof
val
)
+
"] for key : ["
+
key
+
"]"
);
return
(
val
!==
undefined
&&
(
typeof
val
!==
"string"
||
val
))
?
val
:
$
(
"#ubwidget"
).
data
(
key
);
}
else
{
log
(
"Set parameter value ["
+
value
+
"] for key : ["
+
key
+
"]"
);
this
.
delegate
.
setPreference
(
key
,
value
);
this
.
container
.
trigger
(
"preferenceChange"
,
{
key
:
key
,
value
:
value
});
}
}
}
});
return
self
;
var
self
=
Object
.
create
({},
{
container
:
{
value
:
null
},
delegate
:
{
value
:
null
},
value
:
{
value
:
function
(
key
,
value
)
{
if
(
value
===
undefined
)
{
var
val
=
this
.
delegate
.
preference
(
key
);
log
(
"Retrieve parameter value ["
+
val
+
"] as type ["
+
(
typeof
val
)
+
"] for key : ["
+
key
+
"]"
);
return
(
val
!==
undefined
&&
(
typeof
val
!==
"string"
||
val
))
?
val
:
$
(
"#ubwidget"
).
data
(
key
);
}
else
{
log
(
"Set parameter value ["
+
value
+
"] for key : ["
+
key
+
"]"
);
this
.
delegate
.
setPreference
(
key
,
value
);
this
.
container
.
trigger
(
"preferenceChange"
,
{
key
:
key
,
value
:
value
});
}
}
}
});
return
self
;
})();
var
ParametersDelegate
=
(
function
(){
var
self
=
Object
.
create
({},
{
preference
:
{
value
:
function
(
key
)
{
return
this
[
key
];
}
},
setPreference
:
{
value
:
function
(
key
,
value
)
{
this
[
key
]
=
value
;
}
}
});
return
self
;
var
self
=
Object
.
create
({},
{
preference
:
{
value
:
function
(
key
)
{
return
this
[
key
];
}
},
setPreference
:
{
value
:
function
(
key
,
value
)
{
this
[
key
]
=
value
;
}
}
});
return
self
;
})();
var
App
=
(
function
()
{
var
self
=
Object
.
create
({},
{
container
:
{
value
:
null
},
parameters
:
{
value
:
null
},
container
:
{
value
:
null
},
parameters
:
{
value
:
null
},
init
:
{
value
:
function
()
{
var
that
=
this
;
this
.
container
.
bind
(
"preferenceChange"
,
function
(
evt
,
parameter
)
{
that
.
reload
(
parameter
);
});
this
.
reload
();
}
value
:
function
()
{
var
that
=
this
;
this
.
container
.
bind
(
"preferenceChange"
,
function
(
evt
,
parameter
)
{
that
.
reload
(
parameter
);
});
this
.
reload
();
}
},
reload
:
{
value
:
function
(
parameter
)
{
if
(
parameter
===
undefined
)
log
(
"Reload"
);
else
log
(
"Update"
);
}
},
reload
:
{
value
:
function
(
parameter
)
{
if
(
parameter
===
undefined
)
log
(
"Reload"
);
else
log
(
"Update"
);
}
},
utils
:
{
value
:
Object
.
create
({},
{
shuffle
:
{
value
:
function
(
array
)
{
var
unpickedSize
=
array
.
length
;
while
(
unpickedSize
>
0
)
{
var
n
=
Math
.
floor
(
Math
.
random
()
*
unpickedSize
);
var
temp
=
array
[
unpickedSize
-
1
];
array
[
unpickedSize
-
1
]
=
array
[
n
];
array
[
n
]
=
temp
;
unpickedSize
--
;
}
}
},
guid
:
{
value
:
function
()
{
var
S4
=
function
()
{
return
(((
1
+
Math
.
random
())
*
0x10000
)
|
0
).
toString
(
16
).
substring
(
1
);
};
return
(
S4
()
+
S4
()
+
"-"
+
S4
()
+
"-"
+
S4
()
+
"-"
+
S4
()
+
"-"
+
S4
()
+
S4
()
+
S4
());
}
},
droppable
:
{
value
:
function
(
$e
,
callback
)
{
$e
.
bind
(
"dragover"
,
function
(){
$
(
this
).
addClass
(
"hover"
);
return
false
;
});
$e
.
bind
(
"dragleave"
,
function
(){
$
(
this
).
removeClass
(
"hover"
);
return
false
;
});
$e
.
bind
(
"drop"
,
function
(
e
){
$
(
this
).
removeClass
(
"hover"
);
e
=
e
||
window
.
event
;
e
.
preventDefault
();
// jQuery wraps the originalEvent, so we try to detect that here...
e
=
e
.
originalEvent
||
e
;
utils
:
{
value
:
Object
.
create
({},
{
shuffle
:
{
value
:
function
(
array
)
{
var
unpickedSize
=
array
.
length
;
while
(
unpickedSize
>
0
)
{
var
n
=
Math
.
floor
(
Math
.
random
()
*
unpickedSize
);
var
temp
=
array
[
unpickedSize
-
1
];
array
[
unpickedSize
-
1
]
=
array
[
n
];
array
[
n
]
=
temp
;
unpickedSize
--
;
}
}
},
guid
:
{
value
:
function
()
{
var
S4
=
function
()
{
return
(((
1
+
Math
.
random
())
*
0x10000
)
|
0
).
toString
(
16
).
substring
(
1
);
};
return
(
S4
()
+
S4
()
+
"-"
+
S4
()
+
"-"
+
S4
()
+
"-"
+
S4
()
+
"-"
+
S4
()
+
S4
()
+
S4
());
}
},
droppable
:
{
value
:
function
(
$e
,
callback
)
{
$e
.
bind
(
"dragover"
,
function
(){
$
(
this
).
addClass
(
"hover"
);
return
false
;
});
$e
.
bind
(
"dragleave"
,
function
(){
$
(
this
).
removeClass
(
"hover"
);
return
false
;
});
$e
.
bind
(
"drop"
,
function
(
e
){
$
(
this
).
removeClass
(
"hover"
);
e
=
e
||
window
.
event
;
e
.
preventDefault
();
// jQuery wraps the originalEvent, so we try to detect that here...
e
=
e
.
originalEvent
||
e
;
if
(
window
.
sankore
)
{
function
stringToXML
(
text
){
if
(
window
.
ActiveXObject
){
var
doc
=
new
ActiveXObject
(
'Microsoft.XMLDOM'
);
doc
.
async
=
'false'
;
doc
.
loadXML
(
text
);
}
else
{
var
parser
=
new
DOMParser
();
doc
=
parser
.
parseFromString
(
text
,
'text/xml'
);
}
return
doc
;
}
var
file
=
stringToXML
(
e
.
dataTransfer
.
getData
(
"text/plain"
));
callback
({
src
:
$
(
file
).
find
(
"path:eq(0)"
).
text
()
});
return
false
;
}
if
(
window
.
sankore
)
{
function
stringToXML
(
text
){
if
(
window
.
ActiveXObject
){
var
doc
=
new
ActiveXObject
(
'Microsoft.XMLDOM'
);
doc
.
async
=
'false'
;
doc
.
loadXML
(
text
);
}
else
{
var
parser
=
new
DOMParser
();
doc
=
parser
.
parseFromString
(
text
,
'text/xml'
);
}
return
doc
;
}
var
file
=
stringToXML
(
e
.
dataTransfer
.
getData
(
"text/plain"
));
var
tmp_img
=
$
(
"<img/>"
).
attr
(
"src"
,
$
(
file
).
find
(
"path:eq(0)"
).
text
());
var
w
=
0
;
var
h
=
0
;
$
(
this
).
append
(
tmp_img
);
setTimeout
(
function
(){
if
(
tmp_img
.
height
()
>=
tmp_img
.
width
()){
if
(
tmp_img
.
height
()
>
180
){
h
=
180
;
tmp_img
.
attr
(
"height"
,
h
);
w
=
tmp_img
.
width
();
}
else
{
h
=
tmp_img
.
height
();
w
=
tmp_img
.
width
();
}
}
else
{
if
(
tmp_img
.
width
()
>
180
){
w
=
180
;
tmp_img
.
attr
(
"width"
,
w
);
h
=
tmp_img
.
height
();
}
else
{
h
=
tmp_img
.
height
();
w
=
tmp_img
.
width
();
}
}
callback
({
src
:
$
(
file
).
find
(
"path:eq(0)"
).
text
(),
width
:
w
,
height
:
h
});
tmp_img
.
remove
();
},
6
)
return
false
;
}
// Using e.files with fallback because e.dataTransfer is immutable and can't be overridden in Polyfills (http://sandbox.knarly.com/js/dropfiles/).
var
files
=
(
e
.
files
||
e
.
dataTransfer
.
files
);
for
(
var
i
=
0
;
i
<
files
.
length
;
i
++
)
{
// Loop through our files with a closure so each of our FileReader's are isolated.
(
function
(
i
)
{
if
(
typeof
FileReader
!==
"undefined"
)
{
var
reader
=
new
FileReader
();
reader
.
onload
=
function
(
event
)
{
callback
({
src
:
event
.
target
.
result
,
title
:
(
files
[
i
].
name
),
alt
:
(
files
[
i
].
name
)
});
};
reader
.
readAsDataURL
(
files
[
i
]);
}
})(
i
);
}
return
false
;
});
}
}
})
}
// Using e.files with fallback because e.dataTransfer is immutable and can't be overridden in Polyfills (http://sandbox.knarly.com/js/dropfiles/).
var
files
=
(
e
.
files
||
e
.
dataTransfer
.
files
);
for
(
var
i
=
0
;
i
<
files
.
length
;
i
++
)
{
// Loop through our files with a closure so each of our FileReader's are isolated.
(
function
(
i
)
{
if
(
typeof
FileReader
!==
"undefined"
)
{
var
reader
=
new
FileReader
();
reader
.
onload
=
function
(
event
)
{
callback
({
src
:
event
.
target
.
result
,
title
:
(
files
[
i
].
name
),
alt
:
(
files
[
i
].
name
)
});
};
reader
.
readAsDataURL
(
files
[
i
]);
}
})(
i
);
}
return
false
;
});
}
}
})
}
});
return
self
;
})();
\ No newline at end of file
resources/library/interactivities/Transformation.wgt/js/main.js
View file @
56e73ace
...
...
@@ -3,197 +3,200 @@ function onTemplateLoadedCallback() {
}
function
editRow
(
app
,
index
)
{
var
parameters
=
app
.
parameters
;
var
row
=
$
(
"<div/>"
);
row
.
append
(
"<div class='label'><div>"
+
fr
.
njin
.
i18n
.
transformation
.
row
.
label
(
index
+
1
)
+
"</div></div>"
);
var
cards
=
$
(
"<div class='cards'/>"
);
row
.
append
(
cards
);
var
parameters
=
app
.
parameters
;
var
row
=
$
(
"<div/>"
);
row
.
append
(
"<div class='label'><div>"
+
fr
.
njin
.
i18n
.
transformation
.
row
.
label
(
index
+
1
)
+
"</div></div>"
);
var
cards
=
$
(
"<div class='cards'/>"
);
row
.
append
(
cards
);
var
beforecontent
=
parameters
.
value
(
"#"
+
index
+
"before"
);
var
aftercontent
=
parameters
.
value
(
"#"
+
index
+
"after"
);
var
beforecontent
=
parameters
.
value
(
"#"
+
index
+
"before"
);
var
aftercontent
=
parameters
.
value
(
"#"
+
index
+
"after"
);
var
before
=
$
(
"<div rel='before'><div class='switch'><label>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
usePicture
+
"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"
+
(
beforecontent
!==
undefined
?
beforecontent
:
""
)
+
"</div></div><div class='picture'><div></div><div class='dropzone'><div>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
drop
+
"</div></div></div></div><div class='label'>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
before
+
"</div></div>"
);
var
after
=
$
(
"<div rel='after'><div class='switch'><label>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
usePicture
+
"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"
+
(
aftercontent
!==
undefined
?
aftercontent
:
""
)
+
"</div></div><div class='picture'><div></div><div class='dropzone'><div>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
drop
+
"</div></div></div></div><div class='label'>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
after
+
"</div></div>"
);
var
before
=
$
(
"<div rel='before'><div class='switch'><label>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
usePicture
+
"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"
+
(
beforecontent
!==
undefined
?
beforecontent
:
""
)
+
"</div></div><div class='picture'><div></div><div class='dropzone'><div>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
drop
+
"</div></div></div></div><div class='label'>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
before
+
"</div></div>"
);
var
after
=
$
(
"<div rel='after'><div class='switch'><label>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
usePicture
+
"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"
+
(
aftercontent
!==
undefined
?
aftercontent
:
""
)
+
"</div></div><div class='picture'><div></div><div class='dropzone'><div>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
drop
+
"</div></div></div></div><div class='label'>"
+
fr
.
njin
.
i18n
.
transformation
.
label
.
after
+
"</div></div>"
);
makeEditable
(
app
,
before
,
index
);
makeEditable
(
app
,
after
,
index
);
makeEditable
(
app
,
before
,
index
);
makeEditable
(
app
,
after
,
index
);
cards
.
append
(
before
);
cards
.
append
(
after
);
cards
.
append
(
before
);
cards
.
append
(
after
);
return
row
;
return
row
;
}
function
cards
(
app
,
index
)
{
var
parameters
=
app
.
parameters
;
var
beforecard
=
$
(
"<div class='part before closed'/>"
);
var
aftercard
=
$
(
"<div class='part after'/>"
);
var
beforecontent
=
parameters
.
value
(
"#"
+
index
+
"before"
);
var
aftercontent
=
parameters
.
value
(
"#"
+
index
+
"after"
);
var
before
=
$
(
"<div rel='before'><div class='card'><div class='text'><div>"
+
(
beforecontent
!==
undefined
?
beforecontent
:
""
)
+
"</div></div><div class='picture'><div></div></div></div></div>"
);
var
after
=
$
(
"<div rel='after'><div class='card'><div class='text'><div>"
+
(
aftercontent
!==
undefined
?
aftercontent
:
""
)
+
"</div></div><div class='picture'><div></div></div></div></div>"
);
var
usePicture
=
parameters
.
value
(
"#UsePicture"
+
index
+
"before"
)
===
"true"
||
parameters
.
value
(
"#UsePicture"
+
index
+
"before"
)
==
true
;
if
(
usePicture
)
{
before
.
addClass
(
"usePicture"
);
var
f
=
$
.
parseJSON
(
parameters
.
value
(
"#Picture"
+
index
+
"before"
));
if
(
f
!==
null
)
{
var
$img
=
$
(
'<img src="" class="uploadPic" title="" alt="" />'
).
attr
(
f
);
before
.
find
(
".picture>div:eq(0)"
).
append
(
$img
);
}
}
usePicture
=
parameters
.
value
(
"#UsePicture"
+
index
+
"after"
)
===
"true"
||
parameters
.
value
(
"#UsePicture"
+
index
+
"after"
)
==
true
;
if
(
usePicture
)
{
after
.
addClass
(
"usePicture"
);
var
f
=
$
.
parseJSON
(
parameters
.
value
(
"#Picture"
+
index
+
"after"
));
if
(
f
!==
null
)
{
var
$img
=
$
(
'<img src="" class="uploadPic" title="" alt="" />'
).
attr
(
f
);
after
.
find
(
".picture>div:eq(0)"
).
append
(
$img
);
}
}
beforecard
.
append
(
before
);
aftercard
.
append
(
after
);
return
[
beforecard
,
aftercard
];
var
parameters
=
app
.
parameters
;
var
beforecard
=
$
(
"<div class='part before closed'/>"
);
var
aftercard
=
$
(
"<div class='part after'/>"
);
var
beforecontent
=
parameters
.
value
(
"#"
+
index
+
"before"
);
var
aftercontent
=
parameters
.
value
(
"#"
+
index
+
"after"
);
var
before
=
$
(
"<div rel='before'><div class='card'><div class='text'><div>"
+
(
beforecontent
!==
undefined
?
beforecontent
:
""
)
+
"</div></div><div class='picture'><div></div></div></div></div>"
);
var
after
=
$
(
"<div rel='after'><div class='card'><div class='text'><div>"
+
(
aftercontent
!==
undefined
?
aftercontent
:
""
)
+
"</div></div><div class='picture'><div></div></div></div></div>"
);
var
usePicture
=
parameters
.
value
(
"#UsePicture"
+
index
+
"before"
)
===
"true"
||
parameters
.
value
(
"#UsePicture"
+
index
+
"before"
)
==
true
;
if
(
usePicture
)
{
before
.
addClass
(
"usePicture"
);
var
f
=
$
.
parseJSON
(
parameters
.
value
(
"#Picture"
+
index
+
"before"
));
if
(
f
!==
null
)
{
var
$img
=
$
(
'<img src="" class="uploadPic" title="" alt="" />'
).
attr
(
f
);
before
.
find
(
".picture>div:eq(0)"
).
append
(
$img
);
}
}
usePicture
=
parameters
.
value
(
"#UsePicture"
+
index
+
"after"
)
===
"true"
||
parameters
.
value
(
"#UsePicture"
+
index
+
"after"
)
==
true
;
if
(
usePicture
)
{
after
.
addClass
(
"usePicture"
);
var
f
=
$
.
parseJSON
(
parameters
.
value
(
"#Picture"
+
index
+
"after"
));
if
(
f
!==
null
)
{
var
$img
=
$
(
'<img src="" class="uploadPic" title="" alt="" />'
).
attr
(
f
);
after
.
find
(
".picture>div:eq(0)"
).
append
(
$img
);
}
}
beforecard
.
append
(
before
);
aftercard
.
append
(
after
);
return
[
beforecard
,
aftercard
];
}
function
makeEditable
(
app
,
row
,
index
)
{
var
parameters
=
app
.
parameters
;
var
editable
=
row
.
find
(
".text>div"
).
eq
(
0
);
var
key
=
index
+
editable
.
parent
().
parent
().
parent
().
attr
(
'rel'
);
editable
.
get
(
0
).
contentEditable
=
true
;
editable
.
bind
(
'blur keyup paste'
,
function
(){
parameters
.
value
(
"#"
+
key
,
$
(
this
).
html
());
});
var
checkbox
=
row
.
find
(
"input[name='switch']"
);
function
setSwicth
()
{
var
val
=
parameters
.
value
(
"#UsePicture"
+
key
)
===
"true"
||
parameters
.
value
(
"#UsePicture"
+
key
)
===
true
;
if
(
val
)
{
row
.
addClass
(
"usePicture"
);
}
else
{
row
.
removeClass
(
"usePicture"
);
}
checkbox
.
attr
(
"checked"
,
val
);
}
checkbox
.
change
(
function
()
{
parameters
.
value
(
"#UsePicture"
+
key
,
$
(
this
).
is
(
':checked'
));
setSwicth
();
});
setSwicth
();
var
dropzone
=
row
.
find
(
".dropzone"
);
var
pictureHolder
=
dropzone
.
parent
().
find
(
">div:eq(0)"
);
var
parameters
=
app
.
parameters
;
var
editable
=
row
.
find
(
".text>div"
).
eq
(
0
);
var
key
=
index
+
editable
.
parent
().
parent
().
parent
().
attr
(
'rel'
);
editable
.
get
(
0
).
contentEditable
=
true
;
editable
.
bind
(
'blur keyup paste'
,
function
(){
parameters
.
value
(
"#"
+
key
,
$
(
this
).
html
());
});
var
checkbox
=
row
.
find
(
"input[name='switch']"
);
function
setSwicth
()
{
var
val
=
parameters
.
value
(
"#UsePicture"
+
key
)
===
"true"
||
parameters
.
value
(
"#UsePicture"
+
key
)
===
true
;
if
(
val
)
{
row
.
addClass
(
"usePicture"
);
}
else
{
row
.
removeClass
(
"usePicture"
);
}
checkbox
.
attr
(
"checked"
,
val
);
}
checkbox
.
change
(
function
()
{
parameters
.
value
(
"#UsePicture"
+
key
,
$
(
this
).
is
(
':checked'
));
setSwicth
();
});
setSwicth
();
var
dropzone
=
row
.
find
(
".dropzone"
);
var
pictureHolder
=
dropzone
.
parent
().
find
(
">div:eq(0)"
);
function
setPicture
()
{
var
f
=
$
.
parseJSON
(
parameters
.
value
(
"#Picture"
+
key
));
if
(
f
!==
null
)
{
var
$img
=
$
(
'<img src="" class="uploadPic" title="" alt="" />'
).
attr
(
f
);
pictureHolder
.
empty
();
pictureHolder
.
append
(
$img
);
}
}
function
setPicture
()
{
var
f
=
$
.
parseJSON
(
parameters
.
value
(
"#Picture"
+
key
));
if
(
f
!==
null
)
{
var
$img
=
$
(
'<img src="" class="uploadPic" title="" alt="" />'
).
attr
(
f
);
pictureHolder
.
empty
();
pictureHolder
.
append
(
$img
);
}
}
app
.
utils
.
droppable
(
dropzone
,
function
(
f
)
{
parameters
.
value
(
"#Picture"
+
key
,
JSON
.
stringify
(
f
));
setPicture
();
});
setPicture
();
app
.
utils
.
droppable
(
dropzone
,
function
(
f
)
{
parameters
.
value
(
"#Picture"
+
key
,
JSON
.
stringify
(
f
));
setPicture
();
});
setPicture
();
}
function
reloadApp
(
app
)
{
var
number
=
app
.
parameters
.
value
(
"number"
);
var
scene
=
$
(
"#scene"
);
scene
.
empty
();
if
(
app
.
onEdit
)
{
var
editcards
=
$
(
"#edit-cards"
);
editcards
.
empty
();
for
(
var
i
=
0
;
i
<
number
;
i
++
)
{
editcards
.
append
(
editRow
(
app
,
i
));
}
return
;
}
var
table
=
$
(
"<div id='table'/>"
);
scene
.
append
(
table
);
var
before
=
$
(
"<div class='deck before'><div></div></div>"
);
var
box
=
$
(
"<div class='box'><div></div></div>"
);
var
after
=
$
(
"<div class='deck after'><div></div></div>"
);
if
(
number
===
0
)
before
.
addClass
(
"empty"
);
after
.
addClass
(
"empty"
);
table
.
append
(
before
);
table
.
append
(
box
);
table
.
append
(
after
);
box
.
find
(
">div"
).
css
(
"z-index"
,
number
+
1
);
var
beforeDeck
=
before
.
find
(
">div"
);
var
afterDeck
=
after
.
find
(
">div"
);
var
beforeLeftPosition
=
box
.
find
(
">div"
).
position
().
left
-
beforeDeck
.
position
().
left
+
10
+
40
;
//10px de padding dans la box + 40px d'ombre dans l'image
function
makeCard
(
i
,
cards
)
{
beforeDeck
.
append
(
cards
[
0
]);
afterDeck
.
append
(
cards
[
1
]);
cards
[
1
].
css
(
"left"
,
-
beforeLeftPosition
+
"px"
);
cards
[
1
].
css
(
"z-index"
,
i
);
var
number
=
app
.
parameters
.
value
(
"number"
);
var
scene
=
$
(
"#scene"
);
scene
.
empty
();
if
(
app
.
onEdit
)
{
var
editcards
=
$
(
"#edit-cards"
);
editcards
.
empty
();
for
(
var
i
=
0
;
i
<
number
;
i
++
)
{
editcards
.
append
(
editRow
(
app
,
i
));
}
return
;
}
var
table
=
$
(
"<div id='table'/>"
);
scene
.
append
(
table
);
var
before
=
$
(
"<div class='deck before'><div></div></div>"
);
var
box
=
$
(
"<div class='box'><div></div></div>"
);
var
after
=
$
(
"<div class='deck after'><div></div></div>"
);
if
(
number
===
0
)
before
.
addClass
(
"empty"
);
after
.
addClass
(
"empty"
);
table
.
append
(
before
);
table
.
append
(
box
);
table
.
append
(
after
);
box
.
find
(
">div"
).
css
(
"z-index"
,
number
+
1
);
var
beforeDeck
=
before
.
find
(
">div"
);
var
afterDeck
=
after
.
find
(
">div"
);
var
beforeLeftPosition
=
box
.
find
(
">div"
).
position
().
left
-
beforeDeck
.
position
().
left
+
10
+
40
;
//10px de padding dans la box + 40px d'ombre dans l'image
function
makeCard
(
i
,
cards
)
{
beforeDeck
.
append
(
cards
[
0
]);
afterDeck
.
append
(
cards
[
1
]);
cards
[
1
].
css
(
"left"
,
-
beforeLeftPosition
+
"px"
);
cards
[
1
].
css
(
"z-index"
,
i
);
cards
[
0
].
click
(
function
(
e
)
{
var
c
=
$
(
this
);
c
.
removeClass
(
"closed"
);
c
.
unbind
(
e
);
c
.
animate
({
left
:
beforeLeftPosition
},
1000
,
function
(){
setTimeout
(
function
(){
cards
[
1
].
animate
({
left
:
0
},
1000
,
function
(){
after
.
removeClass
(
"empty"
);
});
},
1000
);
c
.
remove
();
});
if
(
i
===
0
)
{
before
.
addClass
(
"empty"
);
}
});
}
cards
[
0
].
click
(
function
(
e
)
{
var
c
=
$
(
this
);
c
.
removeClass
(
"closed"
);
c
.
unbind
(
e
);
c
.
animate
({
left
:
beforeLeftPosition
},
1000
,
function
(){
setTimeout
(
function
(){
cards
[
1
].
animate
({
left
:
0
},
1000
,
function
(){
after
.
removeClass
(
"empty"
);
});
},
1000
);
c
.
remove
();
});
if
(
i
===
0
)
{
before
.
addClass
(
"empty"
);
}
});
}
for
(
var
i
=
number
;
i
>
0
;
i
--
)
{
makeCard
(
i
-
1
,
cards
(
app
,
i
-
1
));
}
for
(
var
i
=
number
;
i
>
0
;
i
--
)
{
makeCard
(
i
-
1
,
cards
(
app
,
i
-
1
));
}
if
(
window
.
sankore
)
window
.
sankore
.
enableDropOnWidget
(
app
.
onEdit
);
if
(
window
.
sankore
)
window
.
sankore
.
enableDropOnWidget
(
app
.
onEdit
);
}
function
reloadCallback
(
parameter
)
{
if
(
parameter
===
undefined
||
parameter
.
key
===
"number"
)
reloadApp
(
this
);
if
(
parameter
===
undefined
||
parameter
.
key
===
"number"
)
reloadApp
(
this
);
}
$
(
document
).
ready
(
function
(){
var
callbacks
=
{
onTemplatesLoaded
:
onTemplateLoadedCallback
,
onEdit
:
reloadApp
,
onView
:
reloadApp
};
init
(
reloadCallback
,
{
toolbar
:
toolbarTemplate
,
parameters
:
parametersTemplate
},
callbacks
);
var
callbacks
=
{
onTemplatesLoaded
:
onTemplateLoadedCallback
,
onEdit
:
reloadApp
,
onView
:
reloadApp
};
init
(
reloadCallback
,
{
toolbar
:
toolbarTemplate
,
parameters
:
parametersTemplate
},
callbacks
);
});
\ No newline at end of file
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