|
|
| (16 intermediate revisions by 5 users not shown) |
| Line 1: |
Line 1: |
| | |
| <html> | | <html> |
| <h5> <strong> Taking a look on images and files in UI and in report and word on extended documentation. Creating Overview of the model xps file report. </strong> </h5> | | <h4> |
| <p> | | Take a look at images and files in the UI and in reports and Word on extended documentation. Create an overview of the model |
| <em>To make your experience more comfortable, we set the main tags mentioned in the video to the right bar menu of this mini player. Choose the interesting subtitle on the list and immediately get to the exact theme timeplace in the video. Now you can pick any topic to be instructed without watching the whole video.</em> | | XPS file report. |
| <style type="text/css">
| | </h4> |
| p {
| | <p class="video-warn" > |
| opacity: 0.7;
| | <em>To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.</em> |
| text-align: justify;
| |
| width: 90%
| |
| }
| |
| </style>
| |
| </p> | | </p> |
| | <div class="video"> |
| | <div class="video__wrapper"> |
| | <iframe src="https://www.youtube.com/embed/yBcKVm9O1GU?rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe> |
| | </div> |
| | <div class="video__navigation"> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="22" tabindex="0"> Blob type attribute </span> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="134" tabindex="0"> Image in UI </span> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="498" tabindex="0"> Image in the report</span> |
| | <h5>Documentation:</h5> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="841" tabindex="0"> Code comment </span> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="925" tabindex="0"> Documentation Tab </span> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="1045" tabindex="0">Publish Documentation Function </span> |
| | <span class="navigation-item" data-video="yBcKVm9O1GU" data-start="1085" tabindex="0"> XPS file: overview of the model </span> |
|
| |
|
| <style> | | </div> |
| #video12 {
| | </div> |
| position: relative;
| |
| height: 500px;
| |
| width:560px;
| |
| padding-bottom: 10px;
| |
| }
| |
| #video12 iframe {
| |
| position: absolute;
| |
| min-height: auto;
| |
| min-width: auto;
| |
| }
| |
| #video12 div {
| |
| position: absolute;
| |
| top: 0;
| |
| left:760px;
| |
| width: 260px;
| |
| height: 100%;
| |
| padding-left: 10px;
| |
| overflow-y: auto;
| |
| }
| |
| span {
| |
| font-size: 18;
| |
| display:block;
| |
| padding: 2px 10px 2px 10px;
| |
| padding-bottom: 0.5;
| |
| padding-top: 0.5;
| |
| opacity: 0.7;
| |
| }
| |
| span:hover {
| |
| color: #0000FF;
| |
| cursor: pointer;
| |
| }
| |
| span:focus {
| |
| color: blue;
| |
| </style> | |
|
| |
|
| <div id="video12">
| |
| <iframe width="740" height="500" src="https://www.youtube.com/embed/lcD_oOQatpI?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>
| |
| <div>
| |
|
| |
| <span data-video="lcD_oOQatpI" data-start="17" tabindex="0"> Blob type attribute </span>
| |
| <span data-video="lcD_oOQatpI" data-start="129" tabindex="0"> Image in UI </span>
| |
| <span data-video="lcD_oOQatpI" data-start="493" tabindex="0"> Image in the report</span>
| |
| <strong>Documentation:</strong>
| |
| <span data-video="lcD_oOQatpI" data-start="836" tabindex="0"> Code comment </span>
| |
| <span data-video="lcD_oOQatpI" data-start="920" tabindex="0"> Documentation Tab </span>
| |
| <span data-video="lcD_oOQatpI" data-start="1040" tabindex="0">Publish Documentation Function </span>
| |
| <span data-video="lcD_oOQatpI" data-start="1080" tabindex="0"> xps file: overview of the model </span>
| |
|
| |
| </div>
| |
| </div>
| |
|
| |
|
| <script>
| |
| var IMG = document.querySelectorAll('#video12 span'),
| |
| IFRAME = document.querySelector('#video12 iframe');
| |
| for (var i = 0; i < IMG.length; i++) {
| |
| IMG[i].onclick = function() {
| |
| IFRAME.src = 'http://www.youtube.com/embed/' + this.dataset.video + '?rel=0&autoplay=1';
| |
| if(this.dataset.end) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&end=' + this.dataset.end);
| |
| if(this.dataset.start) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&start=' + this.dataset.start);
| |
| this.style.backgroundColor='rgba(0,0,0,.2)';
| |
| }
| |
| }
| |
| </script>
| |
| </html> | | </html> |
| | | [[Category:MDriven Designer]] |
| '''Raw subtitles text'''
| | [[Category:MDriven Designer Sessions]] |
| | | [[Category:Reports]] |
| Hi, and welcome back this will be session seven of MDriven designer overview
| | [[Category:UI]] |
| | | {{Edited|July|12|2024}} |
| so in this session we should look a bit
| |
| | |
| about on images and files and really
| |
| | |
| the BLOB type let's check this attribute that we had a long before
| |
| | |
| used by it says,it isn't used by anyone,
| |
| | |
| so you can rename that to "picture" maybe and the type we do as a
| |
| | |
| BLOB type, when we have to find
| |
| | |
| an attribute as a BLOB type, we also get the BLOB type option to choose from here
| |
| | |
| it can be an image or it can just be a BLOB to keep the binary
| |
| | |
| information of some sort
| |
| | |
| in your database or it can be a xml symbol
| |
| | |
| why do we need to state what kind of
| |
| | |
| information it contains, well we don't really
| |
| | |
| we can just leave it blank,
| |
| | |
| but if we do, our view models can
| |
| | |
| make an assumption about, how to present
| |
| | |
| the information, so that's the main and
| |
| | |
| really the only reason to express, what's in this BLOB, I'm gonna say
| |
| | |
| "image" and so the house has an image
| |
| | |
| and if I double-click on the house
| |
| | |
| I can see that it's showing these
| |
| | |
| two view models to the house view
| |
| | |
| and I'm going to open that up and for that I want to add the
| |
| | |
| image picture and as before
| |
| | |
| add it like this, and then it was then
| |
| | |
| added for me where did it go, I can drag it out again, if I don't find it,
| |
| | |
| there is, so zoom in
| |
| | |
| so that doesn't look like much, but since it we know it will be
| |
| | |
| picture we should make it a little larger
| |
| | |
| maybe we should remove the presentation,
| |
| | |
| because this label here isn't doing
| |
| | |
| anything for us, just setting zero there
| |
| | |
| and then that one render, do it like that
| |
| | |
| and let's see what happens, if we just
| |
| | |
| leave it like this, if we head back to the
| |
| | |
| prototyper, refresh, view, show all houses, just pick up one house and then
| |
| | |
| I see a picture and I see a button with
| |
| | |
| three dots on it, which leads default to
| |
| | |
| a dialogue popping up and this is
| |
| | |
| actually, where I can upload a picture to my database
| |
| | |
| so I don't have one maybe I should find one
| |
| | |
| the image of house
| |
| | |
| save as house and then I gonna open it
| |
| | |
| like that, and then I have it there
| |
| | |
| the same state has changed
| |
| | |
| because now the data that forms that image
| |
| | |
| is actually in this attribute, so let's save that and there are errors
| |
| | |
| but I want to save anyway
| |
| | |
| okay, if I had set a read-only expression to make
| |
| | |
| it read only on a picture what should that really mean
| |
| | |
| well, let's find out, then you don't have
| |
| | |
| the button to allow for edit of the picture
| |
| | |
| so what we can do is I was wondering why that one still
| |
| | |
| shows, but I'm gonna null out the presentation
| |
| | |
| I'm gonna make it bigger still
| |
| | |
| like that, and then remove that read-only,
| |
| | |
| so the exact same way as treat pictures we would
| |
| | |
| treat any other type of file, that we
| |
| | |
| need to upload, but of course the files
| |
| | |
| won't have a visual representation
| |
| | |
| like the picture does, so if we had change
| |
| | |
| this one to this one, the BLOB type from
| |
| | |
| image to just BLOB, it would have rendered
| |
| | |
| just a button to upload a file
| |
| | |
| or link to download the file as well, and for the
| |
| | |
| xml symbol, it will try to look at the
| |
| | |
| data to see, if its compliant xml and
| |
| | |
| for the wpf implementation, that we
| |
| | |
| use in the prototype and it will try to
| |
| | |
| render that. could be good to know
| |
| | |
| and let's try and have this picture
| |
| | |
| in the report, that we did in the
| |
| | |
| last session, so there it is,
| |
| | |
| but it's not in the report and we know that it should
| |
| | |
| probably be called picture, so we head back to
| |
| | |
| the report template, that we had
| |
| | |
| we want the picture to..., we want to
| |
| | |
| add it somewhere, we would just add
| |
| | |
| another picture let's see if I have something that isn't
| |
| | |
| gonna take, okay as just
| |
| | |
| an example picture to be a placeholder for the one
| |
| | |
| that we want and in this it is actually
| |
| | |
| as an alternative text, so what's the
| |
| | |
| alternative text. it's picture that the
| |
| | |
| save the report template and close it
| |
| | |
| and head back to that and refresh and
| |
| | |
| for Delsie Bad going to generate the bill
| |
| | |
| what I would have expected was this one
| |
| | |
| to be replaced I wanna see what , oh wait
| |
| | |
| a minute we are looking in the wrong
| |
| | |
| place, right even if we added a picture
| |
| | |
| attribute here, we haven't added to the
| |
| | |
| report yet, rent bill report right
| |
| | |
| clicking that to get some help, but I
| |
| | |
| can't get any help, because it's far away
| |
| | |
| still gonna call it a "picture"
| |
| | |
| get model access, gonna go to lease contract
| |
| | |
| from billable period to the house, so that's
| |
| | |
| the expression I need "picture"
| |
| | |
| I was definitely stumped by not seeing
| |
| | |
| the picture here, so I went off camera to
| |
| | |
| search for the problem and it turns
| |
| | |
| out that and I did this wrong and just
| |
| | |
| copy and paste, but it says it's a
| |
| | |
| collection of pictures billable period.allinstances.
| |
| | |
| lease contract.rented apartments.picture
| |
| | |
| that was not really the intention
| |
| | |
| the intention was self the one
| |
| | |
| that we start self.lease contract.rented apartments.picture
| |
| | |
| so having correct and refreshing
| |
| | |
| and Delsie Bad...
| |
| | |
| an then we get the picture in our report
| |
| | |
| just like we expected to sum up we can do pictures and we can do
| |
| | |
| tables and we can do simple values
| |
| | |
| in opendocument reports of this word type
| |
| | |
| that means and what's also important
| |
| | |
| that we could do a table within the
| |
| | |
| other not a table - nested tables, so that
| |
| | |
| we could do and any type of structure
| |
| | |
| with tables and that is enough to solve
| |
| | |
| well I would say all of our reporting needs
| |
| | |
| since we have some time left in this session
| |
| | |
| I think we should look a bit on documentation
| |
| | |
| everything you point at here
| |
| | |
| has a code comment that's supposed to be
| |
| | |
| a small explanation to what it is that
| |
| | |
| you have designed, if you want to be
| |
| | |
| you decide how explicit you want to be,
| |
| | |
| how detailed you want to be,
| |
| | |
| place of living, maybe
| |
| | |
| and also the attributes,
| |
| | |
| methods and association also has this code comment
| |
| | |
| "This is an image of the house at the address"
| |
| | |
| or this owned by, maybe
| |
| | |
| owned by - association end and this is an owner,
| |
| | |
| so that's one way to increase the knowledge
| |
| | |
| available in your model
| |
| | |
| another way is to point at something
| |
| | |
| and go for this documentation tab
| |
| | |
| when you click that one you see that it has an edit box
| |
| | |
| with the more rich text editing capabilities
| |
| | |
| and this one points at house
| |
| | |
| this is where tenants live
| |
| | |
| if I were to point on anything else,
| |
| | |
| I could write for that and if I point back I get that text
| |
| | |
| and this is, of course, true for all
| |
| | |
| for all diagram types, so if I point that location
| |
| | |
| this is geographical place
| |
| | |
| maybe want to underlined something
| |
| | |
| I like it big, like that, so that's the documentation tab
| |
| | |
| and once you have done that,
| |
| | |
| you may right click on a class
| |
| | |
| and go for and let's see,
| |
| | |
| if I can get that one screen functions, I don't think
| |
| | |
| I can get that one on screen
| |
| | |
| functions, publish documentation, and then
| |
| | |
| it thinks a bit and suggest to save it
| |
| | |
| what did I call this temp\demo
| |
| | |
| I get that looks like this
| |
| | |
| so it has all the diagrams and all the extra text that I wrote
| |
| | |
| and the code comments are present
| |
| | |
| in this overview of the model
| |
| | |
| so that's another way to present
| |
| | |
| your model as an architecture document
| |
| | |
| of some sort when we come back in the next session
| |
| | |
| we're going to run all this in the cloud in turnkey
| |
| | |
| but to get that to work
| |
| | |
| we need a turnkey site, that we
| |
| | |
| can log into here, so if you're following along with this
| |
| | |
| it might be a good idea
| |
| | |
| to get yourself your very own turkey site
| |
| | |
| ok see you next time, bye
| |
